@jfrader/ui 0.6.0 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (96) hide show
  1. package/README.md +11 -6
  2. package/dist/avatar-BuM1zB_f.js +164 -0
  3. package/dist/{avatar-group-DvP8mAE-.js → avatar-group-D1UEihvh.js} +1 -1
  4. package/dist/avatar-group.js +1 -1
  5. package/dist/avatar.js +1 -1
  6. package/dist/card-frame-CcLa6NQ4.js +13 -0
  7. package/dist/{chat-thread-DVa17BRC.js → chat-thread-CMhwxhoA.js} +1 -1
  8. package/dist/chat-thread.js +1 -1
  9. package/dist/{comment-thread-BnUHxviq.js → comment-thread-DbOzYr0q.js} +1 -1
  10. package/dist/comment-thread.js +1 -1
  11. package/dist/emblem-DnXmpZCh.js +166 -0
  12. package/dist/emblem.js +2 -0
  13. package/dist/flip-game-card-xmcR_QSq.js +100 -0
  14. package/dist/flip-game-card.js +2 -0
  15. package/dist/game-card-Bnhpz78f.js +187 -0
  16. package/dist/game-card.js +2 -0
  17. package/dist/{hover-card-DN1EAlQA.js → hover-card--ijYr1cd.js} +1 -1
  18. package/dist/hover-card.js +1 -1
  19. package/dist/in-view-title-BUZCMqge.js +225 -0
  20. package/dist/in-view-title.js +2 -0
  21. package/dist/index.js +70 -65
  22. package/dist/initials-DEdwNe9_.js +18 -0
  23. package/dist/locale-switcher-DTkySKsM.js +375 -0
  24. package/dist/locale-switcher.js +1 -1
  25. package/dist/{thread-parts-DfZNz70v.js → thread-parts-DbKhuwVU.js} +1 -1
  26. package/dist/{timeline-DaldDMX7.js → timeline-BPKY94mT.js} +1 -1
  27. package/dist/timeline.js +1 -1
  28. package/dist/types/components/activity-rings/activity-rings.d.ts +7 -9
  29. package/dist/types/components/avatar/avatar.d.ts +3 -1
  30. package/dist/types/components/avatar-group/avatar-group.d.ts +3 -3
  31. package/dist/types/components/button/button.d.ts +7 -7
  32. package/dist/types/components/card/card.d.ts +4 -1
  33. package/dist/types/components/chip-group/chip-group.d.ts +2 -2
  34. package/dist/types/components/combobox/combobox.d.ts +2 -2
  35. package/dist/types/components/command-palette/command-palette.d.ts +1 -1
  36. package/dist/types/components/comment-thread/comment-thread.d.ts +4 -4
  37. package/dist/types/components/copy-button/copy-button.d.ts +6 -6
  38. package/dist/types/components/countdown/countdown.d.ts +2 -2
  39. package/dist/types/components/dialog/dialog.d.ts +18 -20
  40. package/dist/types/components/drawer/drawer.d.ts +2 -2
  41. package/dist/types/components/emblem/emblem.d.ts +59 -0
  42. package/dist/types/components/emblem/index.d.ts +2 -0
  43. package/dist/types/components/empty-state/empty-state.d.ts +2 -2
  44. package/dist/types/components/file-dropzone/file-dropzone.d.ts +3 -4
  45. package/dist/types/components/filter-toolbar/filter-toolbar.d.ts +2 -2
  46. package/dist/types/components/flip-game-card/flip-game-card.d.ts +22 -0
  47. package/dist/types/components/flip-game-card/index.d.ts +2 -0
  48. package/dist/types/components/game-card/card-frame.d.ts +16 -0
  49. package/dist/types/components/game-card/decks.d.ts +27 -0
  50. package/dist/types/components/game-card/game-card.d.ts +37 -0
  51. package/dist/types/components/game-card/index.d.ts +4 -0
  52. package/dist/types/components/hold-to-confirm/hold-to-confirm.d.ts +1 -1
  53. package/dist/types/components/hover-card/hover-card.d.ts +5 -5
  54. package/dist/types/components/in-view-title/in-view-title.d.ts +23 -0
  55. package/dist/types/components/in-view-title/index.d.ts +1 -0
  56. package/dist/types/components/inline-edit/inline-edit.d.ts +6 -6
  57. package/dist/types/components/json-viewer/json-viewer.d.ts +7 -9
  58. package/dist/types/components/keycap-keyboard/keycap-keyboard.d.ts +1 -1
  59. package/dist/types/components/link-unfurl/link-unfurl.d.ts +17 -7
  60. package/dist/types/components/locale-switcher/locale-switcher.d.ts +17 -11
  61. package/dist/types/components/mention-input/mention-input.d.ts +7 -7
  62. package/dist/types/components/metric-card/metric-card.d.ts +2 -2
  63. package/dist/types/components/navigation/navigation.d.ts +1 -1
  64. package/dist/types/components/next/emotion-registry.d.ts +3 -5
  65. package/dist/types/components/now-playing/now-playing.d.ts +2 -2
  66. package/dist/types/components/password-field/password-field.d.ts +1 -1
  67. package/dist/types/components/progress/progress.d.ts +1 -1
  68. package/dist/types/components/select/select.d.ts +1 -1
  69. package/dist/types/components/sheet-stack/sheet-stack.d.ts +19 -16
  70. package/dist/types/components/signature-pad/signature-pad.d.ts +2 -2
  71. package/dist/types/components/split-button/split-button.d.ts +3 -4
  72. package/dist/types/components/swipe-actions/swipe-actions.d.ts +1 -2
  73. package/dist/types/components/tag-input/tag-input.d.ts +2 -3
  74. package/dist/types/components/theme-root/theme-root.d.ts +5 -6
  75. package/dist/types/components/theme-switch/theme-switch.d.ts +3 -3
  76. package/dist/types/components/time-picker/time-picker.d.ts +2 -2
  77. package/dist/types/components/timeline/timeline.d.ts +4 -4
  78. package/dist/types/components/toast/toast.d.ts +3 -3
  79. package/dist/types/components/tree-view/tree-view.d.ts +4 -3
  80. package/dist/types/components/typewriter-terminal/index.d.ts +2 -0
  81. package/dist/types/components/typewriter-terminal/typewriter-terminal.d.ts +87 -0
  82. package/dist/types/components/usage-meter/usage-meter.d.ts +4 -4
  83. package/dist/types/components/usage-meter/usage-model.d.ts +1 -1
  84. package/dist/types/components/user-menu/user-menu.d.ts +3 -4
  85. package/dist/types/index.d.ts +5 -0
  86. package/dist/types/styling/motion-timings.d.ts +5 -0
  87. package/dist/types/styling/sx.d.ts +1 -1
  88. package/dist/types/styling/theme.d.ts +13 -0
  89. package/dist/types/utils/initials.d.ts +2 -0
  90. package/dist/typewriter-terminal-BUEsMzo3.js +588 -0
  91. package/dist/typewriter-terminal.js +2 -0
  92. package/dist/{user-menu-DzELTg1x.js → user-menu-Czrrk93A.js} +1 -1
  93. package/dist/user-menu.js +1 -1
  94. package/package.json +22 -2
  95. package/dist/avatar-B6idYC59.js +0 -146
  96. package/dist/locale-switcher-CZF7XNYG.js +0 -295
@@ -13,17 +13,16 @@ export interface DialogPartRenderProps extends ButtonHTMLAttributes<HTMLButtonEl
13
13
  }
14
14
  export interface DialogTriggerProps extends ComponentPropsWithRef<'button'>, SxProps {
15
15
  /**
16
- * Replaces the default button. Spread ALL supplied props onto the operative element and attach
17
- * the supplied ref, including when composing through Button. The forwarded and callback refs
18
- * refer to the rendered element, which need not be a button; their public types remain
19
- * HTMLButtonElement for compatibility.
20
- * Overridden handlers, className and style win; compose behavior manually to retain both:
16
+ * Replace the button. Spread all supplied props onto the element and attach the supplied ref,
17
+ * including through Button. Refs point to that element, even when it is not a button;
18
+ * the public ref type remains HTMLButtonElement for compatibility.
19
+ * Handler, className and style overrides replace the supplied values. Compose handlers to keep both:
21
20
  * `onClick={(e) => { p.onClick?.(e); mine(e); }}`.
22
- * Only the render path joins data-ui markers into a token list; library selectors should use
23
- * `[data-ui~="dialog-trigger"]`. The default button always has data-ui="dialog-trigger".
24
- * For disabled anchors, compose through Button's render path: aria-disabled keeps them
25
- * focusable and its supplied handler blocks primary click/Enter activation, but does NOT
26
- * cover auxiliary/middle-click navigation. This part alone supplies native button semantics.
21
+ * The render path joins data-ui markers into a token list; use `[data-ui~="dialog-trigger"]`.
22
+ * The default button has data-ui="dialog-trigger".
23
+ * For disabled anchors, compose through Button's render path. aria-disabled keeps them focusable;
24
+ * its handler blocks primary click/Enter, but not auxiliary/middle-click navigation.
25
+ * This part supplies native button semantics only.
27
26
  */
28
27
  render?: (props: DialogPartRenderProps) => ReactNode;
29
28
  }
@@ -37,17 +36,16 @@ export interface DialogDescriptionProps extends ComponentPropsWithRef<'p'>, SxPr
37
36
  }
38
37
  export interface DialogCloseProps extends ComponentPropsWithRef<'button'>, SxProps {
39
38
  /**
40
- * Replaces the default button. Spread ALL supplied props onto the operative element and attach
41
- * the supplied ref, including when composing through Button. The forwarded and callback refs
42
- * refer to the rendered element, which need not be a button; their public types remain
43
- * HTMLButtonElement for compatibility.
44
- * Overridden handlers, className and style win; compose behavior manually to retain both:
39
+ * Replace the button. Spread all supplied props onto the element and attach the supplied ref,
40
+ * including through Button. Refs point to that element, even when it is not a button;
41
+ * the public ref type remains HTMLButtonElement for compatibility.
42
+ * Handler, className and style overrides replace the supplied values. Compose handlers to keep both:
45
43
  * `onClick={(e) => { p.onClick?.(e); mine(e); }}`.
46
- * Only the render path joins data-ui markers into a token list; library selectors should use
47
- * `[data-ui~="dialog-close"]`. The default button always has data-ui="dialog-close".
48
- * For disabled anchors, compose through Button's render path: aria-disabled keeps them
49
- * focusable and its supplied handler blocks primary click/Enter activation, but does NOT
50
- * cover auxiliary/middle-click navigation. This part alone supplies native button semantics.
44
+ * The render path joins data-ui markers into a token list; use `[data-ui~="dialog-close"]`.
45
+ * The default button has data-ui="dialog-close".
46
+ * For disabled anchors, compose through Button's render path. aria-disabled keeps them focusable;
47
+ * its handler blocks primary click/Enter, but not auxiliary/middle-click navigation.
48
+ * This part supplies native button semantics only.
51
49
  */
52
50
  render?: (props: DialogPartRenderProps) => ReactNode;
53
51
  }
@@ -23,8 +23,8 @@ export interface DrawerContentProps extends Omit<ComponentPropsWithRef<'dialog'>
23
23
  }
24
24
  export interface DrawerPanelProps extends ComponentPropsWithRef<'div'>, SxProps {
25
25
  /**
26
- * `contrast` (default) wears the dark theme plus the elevated-charcoal overrides on any page theme;
27
- * `default` keeps whatever theme is in scope.
26
+ * `contrast` (default) uses the dark palette with a charcoal surface on any page theme.
27
+ * `default` keeps the enclosing theme.
28
28
  */
29
29
  appearance?: SurfaceAppearance;
30
30
  }
@@ -0,0 +1,59 @@
1
+ import { type ComponentPropsWithRef, type CSSProperties, type HTMLAttributes, type ReactNode, type RefCallback } from 'react';
2
+ import { type Interpolation, type Theme } from '../../styling/css';
3
+ import { type SxProps } from '../../styling/sx';
4
+ export type EmblemShape = 'shield' | 'circle' | 'squircle' | 'hexagon';
5
+ export type EmblemSize = 'sm' | 'md' | 'lg' | 'xl';
6
+ export type EmblemPattern = 'none' | 'stripes' | 'hoops' | 'sash';
7
+ export interface EmblemPartProps {
8
+ className?: string;
9
+ css?: Interpolation<Theme>;
10
+ }
11
+ /** Props the `render` callback spreads onto the element it returns. */
12
+ export interface EmblemRenderProps extends Omit<HTMLAttributes<HTMLElement>, 'color'> {
13
+ ref: RefCallback<HTMLElement> | null;
14
+ css: Interpolation<Theme>;
15
+ 'data-ui': string;
16
+ 'data-shape': EmblemShape;
17
+ 'data-pattern': EmblemPattern;
18
+ style: CSSProperties;
19
+ children: ReactNode;
20
+ }
21
+ export interface EmblemProps extends Omit<ComponentPropsWithRef<'span'>, 'children' | 'role' | 'aria-label' | 'color'>, SxProps {
22
+ /** Accessible name, and the words the monogram is built from. */
23
+ name: string;
24
+ /** Replaces the initials derived from `name`. Three characters fill a plate. */
25
+ initials?: string;
26
+ /** Crest image, drawn to the plate's shape. The monogram stands in while it is missing or broken. */
27
+ src?: string;
28
+ /** Fill color. The highlight, the pattern and the default ink derive from it. */
29
+ color?: string;
30
+ /**
31
+ * Pattern color. Defaults to a lighter tint of `color`; keep it near the fill's lightness, or the
32
+ * monogram loses its contrast over the bands.
33
+ */
34
+ secondaryColor?: string;
35
+ /** Ink color over the fill. Defaults to the fill's own contrast color. */
36
+ inkColor?: string;
37
+ /** Plate outline. `shield` keeps the crest geometry this component came from. */
38
+ shape?: EmblemShape;
39
+ /** Plate side: `sm` 24px, `md` 32px, `lg` 40px, `xl` 56px. */
40
+ size?: EmblemSize;
41
+ /** Pattern over the fill. `none` leaves the plain gradient. */
42
+ pattern?: EmblemPattern;
43
+ slotProps?: {
44
+ image?: EmblemPartProps;
45
+ monogram?: EmblemPartProps;
46
+ };
47
+ /**
48
+ * Replaces the root `<span>` with the returned element, for a linked emblem. Spread every
49
+ * supplied prop onto it and attach the supplied ref. The accessible name is `name`, followed by
50
+ * the monogram while it stands in for an image, because a link's visible text belongs in its
51
+ * name (WCAG 2.5.3). Pass your own `aria-label` after the spread to describe the destination,
52
+ * and keep the monogram in it.
53
+ */
54
+ render?: (props: EmblemRenderProps) => ReactNode;
55
+ }
56
+ export declare function Emblem({ ref, name, initials, src, color, secondaryColor, inkColor, shape, size, pattern, slotProps, className, style, sx, render, ...rest }: EmblemProps): import("@emotion/react/jsx-runtime").JSX.Element;
57
+ export declare namespace Emblem {
58
+ var displayName: string;
59
+ }
@@ -0,0 +1,2 @@
1
+ export { Emblem } from './emblem';
2
+ export type { EmblemPartProps, EmblemPattern, EmblemProps, EmblemRenderProps, EmblemShape, EmblemSize, } from './emblem';
@@ -27,8 +27,8 @@ export interface EmptyStateProps extends Omit<ComponentPropsWithRef<'section'>,
27
27
  slotProps?: EmptyStateSlotProps;
28
28
  }
29
29
  /**
30
- * Empty view with a literal next action. Use Skeleton while content is pending and Alert for an
31
- * error next to existing content. The caller owns copy, translations and result announcements.
30
+ * Show a message and action when content is empty. Use Skeleton while loading and Alert for an
31
+ * error alongside existing content. Supply copy, translations and result announcements.
32
32
  */
33
33
  export declare function EmptyState({ ref, title, description, icon, action, headingLevel, variant, slotProps, className, sx, 'aria-labelledby': labelledBy, 'aria-describedby': describedBy, ...rest }: EmptyStateProps): import("@emotion/react/jsx-runtime").JSX.Element;
34
34
  export declare namespace EmptyState {
@@ -82,10 +82,9 @@ export interface FileDropzoneProps extends Omit<ComponentPropsWithRef<'div'>, 'd
82
82
  inputRef?: Ref<HTMLInputElement>;
83
83
  slotProps?: FileDropzoneSlotProps;
84
84
  }
85
- /** The visible surface is the native label of an operable file input; no custom dropzone role.
86
- * Submit canonical value items, not input.files: drops and accumulated batches are not
87
- * reflected in native FormData/required. Client validation is a convenience; validate uploads
88
- * independently on the server. */
85
+ /** Choose or drop files through a labelled native file input; there is no custom dropzone role.
86
+ * Submit value items, not input.files. Drops and accumulated batches are absent from native
87
+ * FormData and native required validation. Validate uploads on the server too. */
89
88
  export declare function FileDropzone({ ref, value, defaultValue, onValueChange, onReject, accept, multiple, maxFiles, maxSize, validate, onUpload, listPlacement, compactAt, label, description, note, dropLabel, error, messages, locale, disabled, readOnly, required, size, paste, renderFileIcon, name, inputRef, slotProps, className, sx, onDragEnter, onDragOver, onDragLeave, onDrop, onPaste, ...rest }: FileDropzoneProps): import("@emotion/react/jsx-runtime").JSX.Element;
90
89
  export declare namespace FileDropzone {
91
90
  var displayName: string;
@@ -54,8 +54,8 @@ export interface FilterToolbarResultCountProps extends Omit<ComponentPropsWithRe
54
54
  loadingLabel?: string;
55
55
  unknownLabel?: string;
56
56
  }
57
- /** A named group with native Tab order. Enter/Space activate remove and clear buttons;
58
- * the shell does not intercept editing keys or promise roving toolbar navigation. */
57
+ /** Group filters with a name and native Tab order. Enter/Space activate remove and clear buttons.
58
+ * Editing keys pass through. Roving toolbar navigation is not supported. */
59
59
  declare function FilterToolbarRoot({ ref, value: valueProp, defaultValue, onValueChange, disabled, label, messages: messagesProp, className, sx, children, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, tabIndex, ...rest }: FilterToolbarProps): import("@emotion/react/jsx-runtime").JSX.Element;
60
60
  declare function Controls({ children, className, sx, ...rest }: FilterToolbarControlsProps): import("@emotion/react/jsx-runtime").JSX.Element;
61
61
  declare function ActiveFilters({ empty, slotProps, className, sx, ...rest }: FilterToolbarActiveFiltersProps): import("@emotion/react/jsx-runtime").JSX.Element;
@@ -0,0 +1,22 @@
1
+ import { type ComponentPropsWithRef, type ReactNode } from 'react';
2
+ import { type SxProps } from '../../styling/sx';
3
+ import type { GameCardPartProps, GameCardSize } from '../game-card';
4
+ export interface FlipGameCardProps extends Omit<ComponentPropsWithRef<'div'>, 'children'>, SxProps {
5
+ /** Shows `back` when true and `front` when false. No interaction changes this prop. */
6
+ flipped: boolean;
7
+ /** Content shown when `flipped` is false. */
8
+ front: ReactNode;
9
+ /** Content shown when `flipped` is true. Both faces stay mounted. */
10
+ back: ReactNode;
11
+ /** Card width, using the GameCard scale. Defaults to `md`. */
12
+ size?: GameCardSize;
13
+ slotProps?: {
14
+ rotator?: GameCardPartProps;
15
+ front?: GameCardPartProps;
16
+ back?: GameCardPartProps;
17
+ };
18
+ }
19
+ export declare function FlipGameCard({ ref, flipped, front, back, size, slotProps, className, sx, ...rest }: FlipGameCardProps): import("@emotion/react/jsx-runtime").JSX.Element;
20
+ export declare namespace FlipGameCard {
21
+ var displayName: string;
22
+ }
@@ -0,0 +1,2 @@
1
+ export { FlipGameCard } from './flip-game-card';
2
+ export type { FlipGameCardProps } from './flip-game-card';
@@ -0,0 +1,16 @@
1
+ export declare const CARD_FRAME: {
2
+ /** height = width × ratio */
3
+ readonly ratio: 1.48;
4
+ /** border-radius = width / cornerDivisor */
5
+ readonly cornerDivisor: 13;
6
+ };
7
+ export declare const CARD_FACE: {
8
+ /** The centre mark is this share of the card's width, in container query units. */
9
+ readonly markWidthRatio: 0.35;
10
+ /** The suit watermarks sit this far from the top and bottom edges. */
11
+ readonly watermarkInsetPercent: 3;
12
+ /** Watermarks are a texture, not a second reading of the suit. */
13
+ readonly watermarkOpacity: 0.15;
14
+ /** Horizontal breathing room around the centre mark. */
15
+ readonly contentPaddingPercent: 4;
16
+ };
@@ -0,0 +1,27 @@
1
+ export type SpanishSuit = 'oros' | 'copas' | 'espadas' | 'bastos';
2
+ export type FrenchSuit = 'hearts' | 'diamonds' | 'clubs' | 'spades';
3
+ export type GameCardSuit = SpanishSuit | FrenchSuit;
4
+ /** Spanish cards print 1–7 and then 10, 11 and 12 for sota, caballo and rey. */
5
+ export type SpanishRank = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 10 | 11 | 12;
6
+ export type FrenchRank = 'A' | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 'J' | 'Q' | 'K';
7
+ export type GameCardRank = SpanishRank | FrenchRank;
8
+ export type GameCardValue = {
9
+ deck: 'spanish';
10
+ suit: SpanishSuit;
11
+ rank: SpanishRank;
12
+ } | {
13
+ deck: 'french';
14
+ suit: FrenchSuit;
15
+ rank: FrenchRank;
16
+ };
17
+ /**
18
+ * Suit glyphs, keyed by suit (the two decks never share a suit name). The Spanish set is the one in
19
+ * use today — oros 💰, copas 🍷, espadas 🗡️, bastos 🌵. The French set asks for text presentation
20
+ * (U+FE0E) so the ink stays ours and the deck keeps its two-colour convention, which an
21
+ * emoji-presentation glyph would take over.
22
+ */
23
+ export declare const SUIT_GLYPHS: Record<GameCardSuit, string>;
24
+ /** The French deck's red/black split. Spanish glyphs carry their own colour. */
25
+ export declare const SUIT_INK: Partial<Record<GameCardSuit, 'red' | 'ink'>>;
26
+ /** Visible rank marks, shared by number. `rankLabel` on the card replaces the mark. */
27
+ export declare const RANK_MARKS: Record<GameCardRank, string>;
@@ -0,0 +1,37 @@
1
+ import type { ComponentPropsWithRef, ReactNode } from 'react';
2
+ import { type Interpolation, type Theme } from '../../styling/css';
3
+ import { type SxProps } from '../../styling/sx';
4
+ import { type GameCardValue } from './decks';
5
+ export type GameCardSize = 'sm' | 'md' | 'lg';
6
+ export type GameCardFace = 'emoji' | 'back';
7
+ export interface GameCardPartProps {
8
+ className?: string;
9
+ css?: Interpolation<Theme>;
10
+ }
11
+ export interface GameCardProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'color'>, SxProps {
12
+ /**
13
+ * Accessible name, in the page's language and the consumer's grammar: "as de oros", "king of
14
+ * hearts". A face-down card names the back, never the value.
15
+ */
16
+ label: string;
17
+ /** What the card is. Omit it, or set `face="back"`, for a card that stays hidden. */
18
+ value?: GameCardValue;
19
+ /** Defaults to `emoji` with a value and `back` without one. */
20
+ face?: GameCardFace;
21
+ /** Card width: `sm` 32px, `md` 72px, `lg` 112px. */
22
+ size?: GameCardSize;
23
+ /** Replaces the printed rank mark; the suit glyph stays. */
24
+ rankLabel?: string;
25
+ /** Draws the card as worn: out of play, or waiting. */
26
+ dimmed?: boolean;
27
+ /** Your own art for the face — an image, an SVG, anything. Replaces the emoji print. */
28
+ children?: ReactNode;
29
+ slotProps?: {
30
+ face?: GameCardPartProps;
31
+ back?: GameCardPartProps;
32
+ };
33
+ }
34
+ export declare function GameCard({ ref, label, value, face, size, rankLabel, dimmed, children, slotProps, className, sx, ...rest }: GameCardProps): import("@emotion/react/jsx-runtime").JSX.Element;
35
+ export declare namespace GameCard {
36
+ var displayName: string;
37
+ }
@@ -0,0 +1,4 @@
1
+ export { GameCard } from './game-card';
2
+ export type { GameCardFace, GameCardPartProps, GameCardProps, GameCardSize } from './game-card';
3
+ export { RANK_MARKS, SUIT_GLYPHS, SUIT_INK } from './decks';
4
+ export type { FrenchRank, FrenchSuit, GameCardRank, GameCardSuit, GameCardValue, SpanishRank, SpanishSuit, } from './decks';
@@ -25,7 +25,7 @@ export interface HoldToConfirmProps extends Omit<ComponentPropsWithRef<'button'>
25
25
  confirmedIcon?: ReactNode;
26
26
  slotProps?: Partial<Record<'face' | 'icon' | 'label' | 'fill' | 'hint' | 'status', HoldToConfirmPartProps>>;
27
27
  }
28
- /** Native button with timed Space/Enter activation. Provide an untimed Dialog alternative in the application. */
28
+ /** Hold Space or Enter to confirm. Provide an untimed confirmation in a Dialog too. */
29
29
  export declare function HoldToConfirm({ ref, label, confirmedLabel, confirmationAnnouncement, getHoldDescription, locale, duration, value, defaultValue, onValueChange, onConfirm, onHoldChange, tone, size, icon, confirmedIcon, disabled, slotProps, className, sx, onPointerDown, onPointerMove, onPointerUp, onPointerCancel, onLostPointerCapture, onKeyDown, onKeyUp, onBlur, onClick, onContextMenu, 'aria-describedby': describedBy, ...rest }: HoldToConfirmProps): import("@emotion/react/jsx-runtime").JSX.Element;
30
30
  export declare namespace HoldToConfirm {
31
31
  var displayName: string;
@@ -36,11 +36,11 @@ export interface HoverCardTriggerRenderProps extends HTMLAttributes<HTMLElement>
36
36
  }
37
37
  export interface HoverCardTriggerProps extends ComponentPropsWithRef<'button'>, SxProps {
38
38
  /**
39
- * Replaces the default button, e.g. with a profile link. Spread ALL supplied props onto the
40
- * operative element and attach the supplied ref. The ref refers to the rendered element, which
41
- * need not be a button; its public type remains HTMLButtonElement for compatibility.
42
- * Native activation is never prevented: a rendered link still navigates on click, Enter or tap.
43
- * Compact inline links rely on the WCAG 2.5.8 inline exception for target size.
39
+ * Replace the button, e.g. with a profile link. Spread all supplied props onto the element
40
+ * and attach the supplied ref. The ref points to that element, even when it is not a button;
41
+ * its public type remains HTMLButtonElement for compatibility.
42
+ * Links still navigate on click, Enter or tap; native activation is not prevented.
43
+ * Inline links rely on the WCAG 2.5.8 inline exception for target size.
44
44
  */
45
45
  render?: (props: HoverCardTriggerRenderProps) => ReactNode;
46
46
  }
@@ -0,0 +1,23 @@
1
+ import { type ComponentPropsWithRef } from 'react';
2
+ import { type Interpolation, type Theme } from '../../styling/css';
3
+ import { type SxProps } from '../../styling/sx';
4
+ export type InViewTitleVariant = 'word' | 'line' | 'blur' | 'tracking' | 'wipe';
5
+ export interface InViewTitlePartProps {
6
+ className?: string;
7
+ css?: Interpolation<Theme>;
8
+ }
9
+ export interface InViewTitleProps extends Omit<ComponentPropsWithRef<'h2'>, 'children'>, SxProps {
10
+ text: string;
11
+ level?: 1 | 2 | 3 | 4 | 5 | 6;
12
+ variant?: InViewTitleVariant;
13
+ once?: boolean;
14
+ locale?: Intl.LocalesArgument;
15
+ slotProps?: {
16
+ visual?: InViewTitlePartProps;
17
+ segment?: InViewTitlePartProps;
18
+ };
19
+ }
20
+ export declare function InViewTitle({ text, level, variant, once, locale, slotProps, ref, className, sx, ...rest }: InViewTitleProps): import("@emotion/react/jsx-runtime").JSX.Element;
21
+ export declare namespace InViewTitle {
22
+ var displayName: string;
23
+ }
@@ -0,0 +1 @@
1
+ export { InViewTitle, type InViewTitleProps, type InViewTitleVariant, type InViewTitlePartProps } from './in-view-title';
@@ -7,7 +7,7 @@ export type InlineEditPhase = 'idle' | 'saving' | 'saved' | 'failed';
7
7
  type ControlElement = HTMLInputElement | HTMLTextAreaElement;
8
8
  export interface InlineEditMessages {
9
9
  /**
10
- * Accessible name of the resting trigger; `value` is the persisted value. While it is empty,
10
+ * Accessible name of the value button; `value` is the saved value. When empty,
11
11
  * the visible placeholder follows this text in the name.
12
12
  */
13
13
  edit: (context: {
@@ -41,11 +41,11 @@ export interface InlineEditSlotProps {
41
41
  error?: InlineEditPartProps;
42
42
  status?: InlineEditPartProps;
43
43
  }
44
- /** Native attributes and handlers for the editor; value, editability and placeholder stay owned. */
44
+ /** Native editor attributes and handlers. The component sets value, editability and placeholder. */
45
45
  export interface InlineEditControlProps extends Omit<TextareaHTMLAttributes<ControlElement>, 'value' | 'defaultValue' | 'children' | 'disabled' | 'readOnly' | 'placeholder' | 'cols' | 'dangerouslySetInnerHTML'> {
46
46
  }
47
47
  export interface InlineEditProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'defaultValue' | 'onChange'>, SxProps {
48
- /** Persisted value shown by the trigger; never the draft. */
48
+ /** Saved value shown by the trigger, not the draft. */
49
49
  value?: string;
50
50
  defaultValue?: string;
51
51
  /** Requested once per resolved save, before the close request. */
@@ -54,7 +54,7 @@ export interface InlineEditProps extends Omit<ComponentPropsWithRef<'div'>, 'chi
54
54
  open?: boolean;
55
55
  defaultOpen?: boolean;
56
56
  onOpenChange?: (open: boolean) => void;
57
- /** Persists a changed value; a throw or rejection is a failed save. */
57
+ /** Saves a changed value. Throw or reject to report a failed save. */
58
58
  onSave: (next: string) => void | Promise<unknown>;
59
59
  /** Accessible name of the editor and part of the trigger's name. */
60
60
  label: string;
@@ -70,7 +70,7 @@ export interface InlineEditProps extends Omit<ComponentPropsWithRef<'div'>, 'chi
70
70
  readOnly?: boolean;
71
71
  /** Saves when focus leaves the whole widget. */
72
72
  saveOnBlur?: boolean;
73
- /** Resting content while the persisted value is empty. */
73
+ /** Content shown while the saved value is empty. */
74
74
  placeholder?: ReactNode;
75
75
  /** Native placeholder of the editor. */
76
76
  inputPlaceholder?: string;
@@ -78,7 +78,7 @@ export interface InlineEditProps extends Omit<ComponentPropsWithRef<'div'>, 'chi
78
78
  /** External error; while present it marks the editor invalid and blocks saving. */
79
79
  error?: ReactNode;
80
80
  controlProps?: InlineEditControlProps;
81
- /** The mounted editor element, or null while resting. */
81
+ /** The editor element, or null when not editing. */
82
82
  controlRef?: Ref<ControlElement>;
83
83
  messages?: Partial<InlineEditMessages>;
84
84
  editIcon?: ReactNode;
@@ -66,15 +66,13 @@ export interface JsonViewerProps extends Omit<ComponentPropsWithRef<'div'>, 'onS
66
66
  }) => void;
67
67
  slotProps?: JsonViewerSlotProps;
68
68
  }
69
- /** Read-only JSON tree. Search overlays expansion/pages; clearing restores base state.
70
- * Each expanded treeitem OWNS its child role=group via aria-owns; the group is a DOM sibling
71
- * (flattened out of the treeitem) so the author name stays scoped to the label — nesting it in
72
- * the DOM would fold the whole subtree into the treeitem's visible text and break the
73
- * label-content-name-mismatch axe gate. Roving DOM focus follows the TreeView
74
- * navigation contract. Right opens, Left closes/moves to parent even in RTL. Up/Down clamp;
75
- * Home/End move; Enter/Space activate; 500ms typeahead; / searches; Ctrl/Cmd+C copies JSON
76
- * (+Shift copies path).
77
- * Strict JSON only, no getters/cycles/nonfinite numbers. Paged, not virtualized.
69
+ /** Browse JSON without editing it.
70
+ * Search adds expansion and pages; clearing restores the base state.
71
+ * Expanded treeitems reference sibling child groups with aria-owns to keep names scoped to labels.
72
+ * TreeView navigation: Right opens/enters; Left closes/moves to the parent, including in RTL.
73
+ * Up/Down stop at the ends; Home/End move; Enter/Space activate. Typeahead resets after 500ms.
74
+ * / searches; Ctrl/Cmd+C copies JSON; add Shift to copy the path.
75
+ * Accepts strict JSON only, without getters, cycles or nonfinite numbers. Paged, not virtualized.
78
76
  */
79
77
  export declare function JsonViewer({ data, rootName, expandedValue, defaultExpandedValue, onExpandedValueChange, defaultExpandDepth, query: queryProp, defaultQuery, onQueryChange, value: valueProp, defaultValue, onValueChange, onNodeActivate, searchable, copyable, showPath, pageSize: pageSizeProp, maxMatches: maxMatchesProp, maxHeight, size, locale, labels: labelProps, onCopy, onCopyError, slotProps, ref, className, sx, style, onKeyDown, onClick, 'aria-label': ariaLabel, 'aria-labelledby': labelledBy, 'aria-describedby': describedBy, ...rest }: JsonViewerProps): import("@emotion/react/jsx-runtime").JSX.Element;
80
78
  export declare namespace JsonViewer {
@@ -25,7 +25,7 @@ export interface KeycapKeyboardProps extends Omit<ComponentPropsWithRef<'div'>,
25
25
  legend?: KeycapKeyboardSlotProps;
26
26
  };
27
27
  }
28
- /** Decorative physical keyboard; text, focus and shortcut descriptions belong to the consumer. */
28
+ /** Show a keyboard illustration. Supply text input, focus and shortcut descriptions separately. */
29
29
  export declare function KeycapKeyboard({ ref, layout, rows, value, defaultValue, onValueChange, eventTarget, tone, paused, slotProps, className, sx, style, ...rest }: KeycapKeyboardProps): import("@emotion/react/jsx-runtime").JSX.Element;
30
30
  export declare namespace KeycapKeyboard {
31
31
  var displayName: string;
@@ -3,16 +3,16 @@ import { type Interpolation, type Theme } from '../../styling/css';
3
3
  import { type SxProps } from '../../styling/sx';
4
4
  export type LinkUnfurlPreviewStatus = 'pending' | 'ready' | 'none' | 'error';
5
5
  export interface LinkUnfurlPreview {
6
- /** The detected link this record belongs to (from `onPreviewRequest`'s context). */
6
+ /** Identifies the link from the `onPreviewRequest` context. */
7
7
  linkId: string;
8
- /** The request this record answers; records for any other request id are ignored. */
8
+ /** Identifies the request being answered. Other request ids are ignored. */
9
9
  requestId: string;
10
10
  url: string;
11
11
  status: LinkUnfurlPreviewStatus;
12
12
  site?: string;
13
13
  title?: string;
14
14
  description?: ReactNode;
15
- /** Informative image; `alt` describes it, or pass `''` when the image adds nothing. */
15
+ /** Shows a preview image. Describe it with `alt`, or use `''` if it adds no information. */
16
16
  image?: {
17
17
  src: string;
18
18
  alt: string;
@@ -56,7 +56,7 @@ type PartProps<E extends 'div' | 'a' | 'img' | 'p' | 'button'> = Omit<ComponentP
56
56
  export interface LinkUnfurlSlotProps {
57
57
  field?: Omit<ComponentPropsWithRef<'textarea'>, 'children' | 'id' | 'value' | 'defaultValue' | 'readOnly' | 'className' | 'dangerouslySetInnerHTML'> & SlotStyle;
58
58
  lane?: PartProps<'div'>;
59
- /** Handlers that the item's layout animation owns are not accepted. */
59
+ /** Styles the preview item. Animation and drag handlers are reserved for its layout animation. */
60
60
  chip?: Omit<PartProps<'div'>, 'onAnimationStart' | 'onDrag' | 'onDragStart' | 'onDragEnd'>;
61
61
  card?: Omit<PartProps<'div'>, 'hidden' | 'inert'>;
62
62
  title?: Omit<PartProps<'a'>, 'href'>;
@@ -67,23 +67,33 @@ export interface LinkUnfurlSlotProps {
67
67
  error?: Omit<PartProps<'p'>, 'role'>;
68
68
  }
69
69
  export interface LinkUnfurlProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'defaultValue' | 'onChange'>, SxProps {
70
- /** Visible label of the message field. */
70
+ /** Labels the message field. */
71
71
  label: string;
72
+ /** Controls the draft text. */
72
73
  value?: string;
74
+ /** Sets the initial uncontrolled text. Defaults to `''`. */
73
75
  defaultValue?: string;
76
+ /** Requests new draft text. Controlled text changes only when `value` updates. */
74
77
  onValueChange?: (text: string) => void;
78
+ /** Supplies preview records matching the current link and request ids. Defaults to `[]`. */
75
79
  previews?: LinkUnfurlPreview[];
80
+ /** Requests metadata after user actions. Fetch in your app and use the supplied abort signal. */
76
81
  onPreviewRequest?: (url: string, context: LinkUnfurlPreviewRequestContext) => void;
82
+ /** Controls which link ids have open previews, independently of `value`. */
77
83
  expanded?: string[];
84
+ /** Sets the initially open link ids. Defaults to `[]`. */
78
85
  defaultExpanded?: string[];
86
+ /** Requests open link ids. Controlled previews change only when `expanded` updates. */
79
87
  onExpandedChange?: (ids: string[]) => void;
88
+ /** Adds buttons that insert URLs at the selection. Defaults to `[]`. */
80
89
  suggestions?: LinkUnfurlSuggestion[];
81
- /** Enables sending; a returned promise keeps the composer pending until it settles. */
90
+ /** Enables sending. A returned promise keeps the composer pending until it settles. */
82
91
  onSend?: (message: LinkUnfurlMessage) => void | Promise<unknown>;
92
+ /** Replaces the default English labels and keyboard hint. */
83
93
  labels?: Partial<LinkUnfurlLabels>;
84
94
  /** Locale for the joined status announcements. */
85
95
  locale?: Intl.LocalesArgument;
86
- /** `'none'` commits every change without animation, on top of the user's reduced-motion setting. */
96
+ /** Sets animation behavior. Defaults to `'auto'`, respecting reduced motion. `'none'` disables animation. */
87
97
  motion?: 'auto' | 'none';
88
98
  slotProps?: LinkUnfurlSlotProps;
89
99
  }
@@ -2,9 +2,9 @@ import { type ComponentPropsWithoutRef, type ComponentPropsWithRef, type ReactNo
2
2
  import { type Placement } from '@floating-ui/react';
3
3
  import { type Interpolation, type Theme } from '../../styling/css';
4
4
  import { type SxProps } from '../../styling/sx';
5
- export type LocaleSwitcherVariant = 'menu' | 'swap' | 'inline';
5
+ export type LocaleSwitcherVariant = 'menu' | 'swap' | 'inline' | 'segmented';
6
6
  export type LocaleSwitcherSize = 'sm' | 'md' | 'lg';
7
- /** Props an option's `render` callback spreads onto the link it returns. */
7
+ /** Spread these props onto the link returned by an option's `render` callback. */
8
8
  export interface LocaleSwitcherLinkProps extends Omit<ComponentPropsWithRef<'a'>, 'href' | 'children'> {
9
9
  href: string;
10
10
  children: ReactNode;
@@ -12,12 +12,14 @@ export interface LocaleSwitcherLinkProps extends Omit<ComponentPropsWithRef<'a'>
12
12
  }
13
13
  export interface LocaleSwitcherOption {
14
14
  value: string;
15
- /** The language's native name ("Español", "English"). */
15
+ /** Labels the language with its native name, such as "Español" or "English". */
16
16
  label: ReactNode;
17
- /** BCP 47 tag of the label and of the linked page; rendered as `lang` and `hreflang`. */
17
+ /** Names the option for assistive technology when `label` is a short code, such as "ES". */
18
+ ariaLabel?: string;
19
+ /** Sets the label and linked page's BCP 47 language tag through `lang` and `hreflang`. */
18
20
  lang?: string;
19
21
  href: string;
20
- /** Replaces the native <a> (e.g. with a router link). Spread ALL supplied props onto it. */
22
+ /** Replaces the native `<a>` with a router link. Spread every supplied prop onto it. */
21
23
  render?: (props: LocaleSwitcherLinkProps) => ReactNode;
22
24
  }
23
25
  type SlotStyle = {
@@ -29,24 +31,28 @@ export interface LocaleSwitcherSlotProps {
29
31
  trigger?: Omit<ComponentPropsWithoutRef<'button'>, 'children' | 'className' | 'aria-labelledby'> & SlotStyle;
30
32
  /** Menu variant's popup. */
31
33
  content?: Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'className'> & SlotStyle;
32
- /** Every option element (menu items, the swap link, inline links and the current label). */
34
+ /** Styles every option: menu items, the swap link, inline links, and the current label. */
33
35
  option?: SlotStyle;
34
36
  }
35
37
  export interface LocaleSwitcherProps extends Omit<ComponentPropsWithRef<'nav'>, 'children'>, SxProps {
36
38
  options: readonly LocaleSwitcherOption[];
37
- /** The current option's value. */
39
+ /** Identifies the current language option. */
38
40
  value: string;
41
+ /** Sets the link layout. Defaults to `'menu'`. */
39
42
  variant?: LocaleSwitcherVariant;
43
+ /** Sets the text and menu trigger size. Defaults to `'md'`. */
40
44
  size?: LocaleSwitcherSize;
41
- /** Menu: names the trigger's action ("Change language"); read before the current label. */
45
+ /** Names the menu trigger's action, such as "Change language". Read before the current label. */
42
46
  triggerLabel?: string;
43
- /** Inline: accessible name of the navigation landmark. */
47
+ /** Names the navigation landmark in the inline and segmented variants. */
44
48
  label?: string;
45
- /** Menu: decorative icon before the current label; `null` removes it. */
49
+ /** Shows a decorative icon before the menu's current label. Defaults to a globe. `null` removes it. */
46
50
  icon?: ReactNode;
47
- /** Menu open state. */
51
+ /** Controls whether the menu is open. */
48
52
  open?: boolean;
53
+ /** Sets the menu's initial uncontrolled open state. */
49
54
  defaultOpen?: boolean;
55
+ /** Requests a menu open-state change. */
50
56
  onOpenChange?: (open: boolean) => void;
51
57
  placement?: Placement;
52
58
  slotProps?: LocaleSwitcherSlotProps;
@@ -9,7 +9,7 @@ export interface Mention {
9
9
  readonly start: number;
10
10
  readonly end: number;
11
11
  }
12
- /** Ranges are immutable UTF-16 half-open offsets, matching native textarea selection. */
12
+ /** Immutable UTF-16 `[start,end)` offsets, matching textarea selection. */
13
13
  export interface MentionValue {
14
14
  readonly text: string;
15
15
  readonly mentions: readonly Mention[];
@@ -73,13 +73,13 @@ export interface MentionInputProps extends Omit<ComponentPropsWithRef<'textarea'
73
73
  slotProps?: Partial<Record<Part, FieldPartProps>>;
74
74
  }
75
75
  export declare function mentionText(kind: MentionKind, label: string): string;
76
- /** Invalid metadata is omitted; plain text is always preserved. The caller owns storage escaping. */
76
+ /** Omits invalid metadata and keeps plain text. The caller handles storage escaping. */
77
77
  export declare function serializeMentions(value: MentionValue, format?: (mention: Mention) => string): string;
78
- /** Native multiline textbox in a combobox semantic wrapper with virtual focus.
79
- * Enter/Tab commit; Space edits;
80
- * Shift+Tab leaves, Home/End edit, Escape dismisses. Pair input/mirror metric overrides.
81
- * Native text undo is best-effort across engines; stale metadata is deliberately dropped.
82
- * Intended for message-sized documents, not rich-text editing. */
78
+ /** Write a message and mention people with @ or channels with #.
79
+ * The textarea keeps multiline semantics and DOM focus inside a combobox wrapper.
80
+ * Enter/Tab insert a result; Space edits; Shift+Tab leaves; Home/End move the caret; Escape dismisses.
81
+ * Pair input/mirror metric overrides. Native text undo depends on the browser; stale metadata is dropped.
82
+ * Use for message-sized documents, not rich-text editing. */
83
83
  export declare function MentionInput({ ref, actionsRef, value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, people, channels, onMentionAdd, onSubmit, submitOnEnter, label, description, error, size, minRows, maxRows, maxSuggestions, placement, locale, messages, renderSuggestion, slotProps, className, sx, id, dir, required, disabled, readOnly, onChange, onInput, onKeyDown, onSelect, onFocus, onBlur, onScroll, onCompositionStart, onCompositionEnd, 'aria-labelledby': labelledBy, 'aria-describedby': describedBy, 'aria-invalid': invalid, ...rest }: MentionInputProps): import("@emotion/react/jsx-runtime").JSX.Element;
84
84
  export declare namespace MentionInput {
85
85
  var displayName: string;