plainframe-ui 0.1.9 → 0.1.11

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 (3) hide show
  1. package/dist/index.d.ts +201 -241
  2. package/dist/index.js +20 -54
  3. package/package.json +6 -5
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React, { ReactNode } from 'react';
1
+ import React, { ReactNode, JSX } from 'react';
2
2
  import { Interpolation, Theme, CSSObject } from '@emotion/react';
3
3
  import { Placement } from '@floating-ui/react';
4
4
  import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
@@ -6,98 +6,81 @@ import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
6
6
  /** @jsxImportSource @emotion/react */
7
7
 
8
8
  type AccordionVariant = "subtle" | "outlined" | "ghost";
9
- type WithCss$9 = {
10
- css?: Interpolation<Theme>;
11
- };
12
- type AccordionProps = WithCss$9 & {
13
- expanded?: boolean;
14
- defaultExpanded?: boolean;
15
- onChange?: (expanded: boolean) => void;
16
- className?: string;
9
+ type AccordionProps = {
10
+ open?: boolean;
11
+ defaultOpen?: boolean;
12
+ onChange?: (open: boolean) => void;
17
13
  variant?: AccordionVariant;
18
14
  disabled?: boolean;
19
15
  width?: number | string;
16
+ fullWidth?: boolean;
17
+ className?: string;
20
18
  children: React.ReactNode;
21
- };
22
- declare const Accordion: React.FC<AccordionProps>;
23
-
24
- /** @jsxImportSource @emotion/react */
25
-
26
- type WithCss$8 = {
27
19
  css?: Interpolation<Theme>;
28
20
  };
29
- type AccordionSummaryProps = WithCss$8 & {
21
+ type AccordionSummaryProps = {
30
22
  children?: React.ReactNode;
31
23
  expandIcon?: React.ReactNode;
32
- onClick?: (e: React.MouseEvent) => void;
33
- expanded?: boolean;
34
- disabled?: boolean;
35
- className?: string;
36
- noExpandIcon?: boolean;
37
24
  expandIconPosition?: "left" | "right";
38
- };
39
- declare const AccordionSummary: React.ForwardRefExoticComponent<AccordionSummaryProps & React.RefAttributes<HTMLDivElement>>;
40
-
41
- /** @jsxImportSource @emotion/react */
42
-
43
- type WithCss$7 = {
25
+ hideExpandIcon?: boolean;
26
+ className?: string;
44
27
  css?: Interpolation<Theme>;
28
+ expandIconCss?: Interpolation<Theme>;
45
29
  };
46
30
  type AccordionDetailsProps = {
47
31
  children?: React.ReactNode;
48
32
  className?: string;
49
- } & WithCss$7;
33
+ css?: Interpolation<Theme>;
34
+ };
35
+ declare const AccordionSummary: React.ForwardRefExoticComponent<AccordionSummaryProps & React.RefAttributes<HTMLDivElement>>;
50
36
  declare const AccordionDetails: React.FC<AccordionDetailsProps>;
37
+ declare const Accordion: React.FC<AccordionProps>;
51
38
 
52
39
  /** @jsxImportSource @emotion/react */
53
40
 
54
- type Variant$b = "subtle" | "outlined" | "ghost";
55
- type WithCssProp$6 = {
56
- css?: Interpolation<Theme>;
57
- };
58
- type AccordionGroupProps = WithCssProp$6 & {
41
+ type Variant$a = "subtle" | "outlined" | "ghost";
42
+ type AccordionGroupProps = {
59
43
  children: React.ReactNode;
60
44
  attached?: boolean;
61
- variant?: Variant$b;
45
+ variant?: Variant$a;
62
46
  exclusive?: boolean;
63
- expandedIndex?: number | null;
64
- defaultExpandedIndex?: number | null;
65
- onExpandedIndexChange?: (index: number | null) => void;
47
+ openIndex?: number | null;
48
+ defaultOpenIndex?: number | null;
49
+ onOpenIndexChange?: (index: number | null) => void;
66
50
  disabled?: boolean;
67
51
  width?: number | string;
52
+ fullWidth?: boolean;
68
53
  className?: string;
69
54
  role?: React.AriaRole;
55
+ css?: Interpolation<Theme>;
70
56
  };
71
57
  declare const AccordionGroup: React.FC<AccordionGroupProps>;
72
58
 
73
59
  /** @jsxImportSource @emotion/react */
74
60
 
75
- type WithCss$6 = {
76
- css?: Interpolation<Theme>;
61
+ type AnchorOrigin$1 = {
62
+ horizontal?: "left" | "center" | "right";
63
+ vertical?: "top" | "center" | "bottom";
77
64
  };
78
- type SpaceToken$1 = "xs" | "sm" | "md" | "lg" | "xl";
79
- type RadiusToken$3 = "xs" | "sm" | "md" | "lg" | "xl" | "full";
80
- type ActionBarAnchorOrigin = {
81
- vertical?: "top" | "bottom" | "center";
82
- horizontal?: "left" | "right" | "center";
83
- };
84
- type ActionBarProps = WithCss$6 & {
65
+ type ActionBarProps = {
85
66
  children: React.ReactNode;
86
- anchorOrigin?: ActionBarAnchorOrigin;
87
- padding?: number | string | SpaceToken$1;
88
- radius?: number | string | RadiusToken$3;
89
- gap?: number | string;
67
+ open?: boolean;
68
+ anchorOrigin?: AnchorOrigin$1;
69
+ direction?: "horizontal" | "vertical";
70
+ padding?: string | number;
71
+ gap?: string | number;
72
+ radius?: string | number;
90
73
  offset?: number | string;
91
74
  offsetX?: number | string;
92
75
  offsetY?: number | string;
93
- shadow?: boolean;
94
- width?: number | string;
95
- height?: number | string;
96
- open?: boolean;
76
+ elevated?: boolean;
97
77
  unstyled?: boolean;
98
- containerCss?: Interpolation<Theme>;
99
- containerClassName?: string;
100
- className?: string;
78
+ fullWidth?: boolean;
79
+ width?: string | number;
80
+ height?: string | number;
81
+ role?: string;
82
+ "aria-label"?: string;
83
+ onClose?: () => void;
101
84
  };
102
85
  declare const ActionBar: React.FC<ActionBarProps>;
103
86
 
@@ -105,25 +88,25 @@ declare const ActionBar: React.FC<ActionBarProps>;
105
88
 
106
89
  type AlertVariant = "filled" | "outlined" | "soft" | "ghost";
107
90
  type AlertIntent = "danger" | "warning" | "info" | "success" | "neutral";
108
- type AlertProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
91
+ declare const Alert: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "style" | "className"> & {
109
92
  intent?: AlertIntent;
110
93
  variant?: AlertVariant;
111
- icon?: React.ReactNode;
112
- actionButton?: React.ReactNode;
94
+ intentIcon?: React.ReactNode;
95
+ closeIcon?: React.ReactNode;
113
96
  onClose?: () => void;
114
97
  width?: string | number;
115
98
  size?: "sm" | "md" | "lg";
99
+ loading?: boolean;
116
100
  css?: Interpolation<Theme>;
117
- className?: string;
118
- };
119
- type SubProps = Omit<React.HTMLAttributes<HTMLElement>, "style"> & {
101
+ } & React.RefAttributes<HTMLDivElement>>;
102
+ declare const AlertTitle: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLElement>, "style" | "className"> & {
120
103
  css?: Interpolation<Theme>;
121
- className?: string;
122
104
  children?: React.ReactNode;
123
- };
124
- declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
125
- declare const AlertTitle: React.ForwardRefExoticComponent<SubProps & React.RefAttributes<HTMLSpanElement>>;
126
- declare const AlertDescription: React.ForwardRefExoticComponent<SubProps & React.RefAttributes<HTMLSpanElement>>;
105
+ } & React.RefAttributes<HTMLSpanElement>>;
106
+ declare const AlertDescription: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLElement>, "style" | "className"> & {
107
+ css?: Interpolation<Theme>;
108
+ children?: React.ReactNode;
109
+ } & React.RefAttributes<HTMLSpanElement>>;
127
110
 
128
111
  /** @jsxImportSource @emotion/react */
129
112
 
@@ -147,10 +130,9 @@ type AutocompleteProps = WithCss$5 & {
147
130
  width?: number | string;
148
131
  fullWidth?: boolean;
149
132
  placeholder?: string;
150
- renderItem?: (item: AutocompleteItem, selected?: boolean, hovered?: boolean) => React.ReactNode;
133
+ renderItem?: (item: AutocompleteItem, selected?: boolean) => React.ReactNode;
151
134
  inputCss?: Interpolation<Theme>;
152
135
  containerCss?: Interpolation<Theme>;
153
- className?: string;
154
136
  label?: string;
155
137
  helperText?: string;
156
138
  variant?: "subtle" | "outlined" | "ghost";
@@ -158,12 +140,22 @@ type AutocompleteProps = WithCss$5 & {
158
140
  endIcon?: React.ReactNode;
159
141
  size?: "sm" | "md" | "lg";
160
142
  focusRingMode?: "always" | "none";
161
- itemsOpen?: boolean;
162
- onItemsOpenChange?: (open: boolean) => void;
143
+ expandIcon?: React.ReactNode;
144
+ showExpandIcon?: boolean;
145
+ expandIconCss?: Interpolation<Theme>;
146
+ disabled?: boolean;
147
+ error?: boolean;
148
+ showClear?: boolean;
149
+ open?: boolean;
150
+ onOpenChange?: (open: boolean) => void;
163
151
  openOnFocus?: boolean;
164
152
  openOnType?: boolean;
165
153
  openOnClick?: boolean;
166
- freeItem?: boolean | {
154
+ closeOnSelect?: boolean;
155
+ closeOnBlur?: boolean;
156
+ blurOnSelect?: boolean;
157
+ freeSolo?: boolean;
158
+ customValueLabel?: boolean | {
167
159
  prefix?: string;
168
160
  suffix?: string;
169
161
  };
@@ -173,6 +165,8 @@ type AutocompleteProps = WithCss$5 & {
173
165
  highlightTypedValue?: boolean;
174
166
  typedValueHighlightCss?: Interpolation<Theme>;
175
167
  showNoResults?: boolean;
168
+ noResultsLabelCss?: Interpolation<Theme>;
169
+ loadingLabelCss?: Interpolation<Theme>;
176
170
  loadItems?: (query: string) => Promise<AutocompleteItem[]>;
177
171
  loading?: boolean;
178
172
  loadingText?: string;
@@ -181,6 +175,14 @@ type AutocompleteProps = WithCss$5 & {
181
175
  selectedValues?: string[];
182
176
  defaultSelectedValues?: string[];
183
177
  onChangeSelected?: (items: AutocompleteItem[]) => void;
178
+ textFieldWrapperCss?: Interpolation<Theme>;
179
+ textFieldInputCss?: Interpolation<Theme>;
180
+ textFieldLabelCss?: Interpolation<Theme>;
181
+ textFieldHelperRowCss?: Interpolation<Theme>;
182
+ textFieldHelperTextCss?: Interpolation<Theme>;
183
+ textFieldStartIconCss?: Interpolation<Theme>;
184
+ textFieldEndIconCss?: Interpolation<Theme>;
185
+ menuContentCss?: Interpolation<Theme>;
184
186
  };
185
187
  declare const Autocomplete: React.FC<AutocompleteProps>;
186
188
 
@@ -239,8 +241,8 @@ type BadgeProps = {
239
241
  outlineColor?: string;
240
242
  className?: string;
241
243
  badgeClassName?: string;
242
- css?: Interpolation<any>;
243
- badgeCss?: Interpolation<any>;
244
+ css?: Interpolation<Theme>;
245
+ badgeCss?: Interpolation<Theme>;
244
246
  offsetX?: number | string;
245
247
  offsetY?: number | string;
246
248
  };
@@ -303,6 +305,22 @@ type LoadingPosition = "start" | "end" | "center";
303
305
  type WithCssProp$5 = {
304
306
  css?: Interpolation<Theme>;
305
307
  };
308
+ type ButtonBase = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color" | "style"> & WithCssProp$5 & {
309
+ size?: ButtonSize;
310
+ startIcon?: ReactNode;
311
+ endIcon?: ReactNode;
312
+ rounded?: boolean;
313
+ fullWidth?: boolean;
314
+ loading?: boolean;
315
+ loadingIndicator?: ReactNode;
316
+ loadingPosition?: LoadingPosition;
317
+ className?: string;
318
+ hoverEffect?: boolean;
319
+ children?: ReactNode;
320
+ };
321
+ type ButtonProps = ButtonBase & {
322
+ variant?: ButtonVariant;
323
+ };
306
324
  declare const Button: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "style" | "color"> & WithCssProp$5 & {
307
325
  size?: ButtonSize;
308
326
  startIcon?: ReactNode;
@@ -326,7 +344,11 @@ type Size$2 = "sm" | "md" | "lg";
326
344
  type WithCssProp$4 = {
327
345
  css?: Interpolation<Theme>;
328
346
  };
329
- type ButtonGroupProps = WithCssProp$4 & Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
347
+ type PrivateEdgeFlags = {
348
+ __clipLeft?: boolean;
349
+ __clipRight?: boolean;
350
+ };
351
+ declare const ButtonGroup: React.MemoExoticComponent<React.ForwardRefExoticComponent<WithCssProp$4 & Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
330
352
  children: React.ReactNode;
331
353
  attached?: boolean;
332
354
  direction?: Direction$5;
@@ -338,12 +360,7 @@ type ButtonGroupProps = WithCssProp$4 & Omit<React.HTMLAttributes<HTMLDivElement
338
360
  width?: string | number;
339
361
  className?: string;
340
362
  role?: React.AriaRole;
341
- };
342
- type PrivateEdgeFlags = {
343
- __clipLeft?: boolean;
344
- __clipRight?: boolean;
345
- };
346
- declare const ButtonGroup: React.MemoExoticComponent<React.ForwardRefExoticComponent<(ButtonGroupProps & PrivateEdgeFlags & React.RefAttributes<HTMLDivElement>)>>;
363
+ } & PrivateEdgeFlags & React.RefAttributes<HTMLDivElement>>>;
347
364
 
348
365
  /** @jsxImportSource @emotion/react */
349
366
 
@@ -373,12 +390,6 @@ type WithCssProp$3 = {
373
390
  css?: Interpolation<Theme>;
374
391
  };
375
392
  type CardDirection = "horizontal" | "vertical";
376
- type Align$3 = "start" | "center" | "end";
377
- type SectionPadding = {
378
- padding?: ContainerProps["padding"];
379
- paddingX?: ContainerProps["padding"];
380
- paddingY?: ContainerProps["padding"];
381
- };
382
393
  type CardProps = WithCssProp$3 & Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "className"> & {
383
394
  variant?: ContainerProps["variant"];
384
395
  padding?: ContainerProps["padding"];
@@ -394,33 +405,18 @@ type CardProps = WithCssProp$3 & Omit<React.HTMLAttributes<HTMLDivElement>, "onC
394
405
  direction?: CardDirection;
395
406
  className?: string;
396
407
  };
397
- type CardSectionBaseProps = WithCssProp$3 & SectionPadding & Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
398
- className?: string;
399
- align?: Align$3;
400
- };
401
- type CardSideProps = CardSectionBaseProps;
402
408
  declare const Card: React.ForwardRefExoticComponent<React.PropsWithoutRef<CardProps> & React.RefAttributes<HTMLDivElement>>;
403
- declare const CardContent: React.FC<CardSectionBaseProps>;
404
- declare const CardStart: React.FC<CardSideProps>;
405
- declare const CardEnd: React.FC<CardSideProps>;
406
- type TextTune = {
407
- weight?: number | string;
408
- size?: number | string;
409
- color?: string | "primary" | "secondary";
410
- };
411
- declare const CardTitle: React.FC<CardSectionBaseProps & TextTune>;
412
- declare const CardDescription: React.FC<CardSectionBaseProps & TextTune>;
413
409
 
414
410
  /** @jsxImportSource @emotion/react */
415
411
 
416
- type Variant$a = "subtle" | "outlined" | "ghost";
412
+ type Variant$9 = "subtle" | "outlined" | "ghost";
417
413
  type CardGroupProps = {
418
414
  children: React.ReactNode;
419
415
  attached?: boolean;
420
416
  gap?: string | number;
421
417
  width?: string | number;
422
418
  direction?: "vertical" | "horizontal";
423
- variant?: Variant$a;
419
+ variant?: Variant$9;
424
420
  className?: string;
425
421
  role?: React.AriaRole;
426
422
  css?: Interpolation<Theme>;
@@ -433,7 +429,7 @@ type WithCssProp$2 = {
433
429
  css?: Interpolation<Theme>;
434
430
  };
435
431
  type CheckboxSize = "sm" | "md" | "lg";
436
- declare const Checkbox: React.ForwardRefExoticComponent<WithCssProp$2 & {
432
+ declare const Checkbox: React.MemoExoticComponent<React.ForwardRefExoticComponent<WithCssProp$2 & {
437
433
  checked?: boolean;
438
434
  defaultChecked?: boolean;
439
435
  onChange?: (checked: boolean) => void;
@@ -449,7 +445,7 @@ declare const Checkbox: React.ForwardRefExoticComponent<WithCssProp$2 & {
449
445
  labelCss?: Interpolation<Theme>;
450
446
  descriptionCss?: Interpolation<Theme>;
451
447
  className?: string;
452
- } & React.RefAttributes<HTMLLabelElement>>;
448
+ } & React.RefAttributes<HTMLLabelElement>>>;
453
449
 
454
450
  /** @jsxImportSource @emotion/react */
455
451
 
@@ -479,7 +475,7 @@ declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttribu
479
475
  /** @jsxImportSource @emotion/react */
480
476
 
481
477
  type SizeKey$2 = "sm" | "md" | "lg";
482
- type Variant$9 = "outlined" | "subtle" | "ghost";
478
+ type Variant$8 = "outlined" | "subtle" | "ghost";
483
479
  type WithCss$3 = {
484
480
  css?: Interpolation<Theme>;
485
481
  };
@@ -495,7 +491,7 @@ type CodeFieldProps = WithCss$3 & {
495
491
  disabled?: boolean;
496
492
  gap?: number | string;
497
493
  size?: SizeKey$2;
498
- variant?: Variant$9;
494
+ variant?: Variant$8;
499
495
  length?: number;
500
496
  focusRingMode?: "always" | "none";
501
497
  wrapperCss?: Interpolation<Theme>;
@@ -508,30 +504,6 @@ declare const CodeField: React.FC<CodeFieldProps>;
508
504
 
509
505
  /** @jsxImportSource @emotion/react */
510
506
 
511
- type ColorPatchItem = {
512
- color: string;
513
- label?: string;
514
- title?: string;
515
- disabled?: boolean;
516
- onClick?: () => void;
517
- css?: Interpolation<Theme>;
518
- };
519
- type ColorPatchesProps = {
520
- items: ColorPatchItem[];
521
- size?: number | string;
522
- gap?: number | string;
523
- rounded?: boolean;
524
- radius?: number | string;
525
- wrap?: boolean;
526
- width?: number | string;
527
- focusOutline?: boolean;
528
- wrapperCss?: Interpolation<Theme>;
529
- patchCss?: Interpolation<Theme>;
530
- };
531
- declare const ColorPatches: React.FC<ColorPatchesProps>;
532
-
533
- /** @jsxImportSource @emotion/react */
534
-
535
507
  type TriggerMode$1 = "contextmenu" | "dblclick" | "click" | "hover";
536
508
  type ContextZoneProps = {
537
509
  children: React.ReactNode;
@@ -574,34 +546,15 @@ declare const Divider: React.ForwardRefExoticComponent<DividerProps & React.RefA
574
546
 
575
547
  /** @jsxImportSource @emotion/react */
576
548
 
577
- type DrawerSide = "left" | "right" | "top" | "bottom";
578
- type DrawerVariant = "inset" | "full";
579
- type DomDragKeys = "onDrag" | "onDragStart" | "onDragEnd" | "onDragOver" | "onDragEnter" | "onDragLeave" | "onDrop";
580
- type DomAnimKeys = "onAnimationStart" | "onAnimationEnd";
581
- type DrawerProps = Omit<React.HTMLAttributes<HTMLDivElement>, DomDragKeys | DomAnimKeys | "style"> & {
582
- on?: boolean;
583
- defaultOn?: boolean;
584
- onOpenChange?: (open: boolean) => void;
585
- onClose?: () => void;
549
+ type DrawerRootProps = {
586
550
  children: React.ReactNode;
587
- width?: number | string;
588
- height?: number | string;
589
- position?: DrawerSide;
590
- variant?: DrawerVariant;
591
- margin?: number | string;
592
- radius?: number | string;
593
- backdropBlur?: boolean;
594
- backdropBlurDepth?: number | string;
595
- closeOnClickAway?: boolean;
551
+ open?: boolean;
552
+ defaultOpen?: boolean;
553
+ onOpenChange?: (open: boolean) => void;
596
554
  lockScroll?: boolean;
597
- transitionMs?: number;
598
- snapClosePct?: number;
599
- velocityClosePxS?: number;
600
- dragElasticOut?: number;
601
- css?: Interpolation<Theme>;
602
- className?: string;
555
+ closeOnEscape?: boolean;
603
556
  };
604
- declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLDivElement>>;
557
+ declare const Drawer: React.FC<DrawerRootProps>;
605
558
 
606
559
  /** @jsxImportSource @emotion/react */
607
560
 
@@ -650,6 +603,9 @@ type DropdownMenuContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, "styl
650
603
  animateOnBusClose?: boolean;
651
604
  gap?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | string | number;
652
605
  css?: Interpolation<Theme>;
606
+ ignoreOutsidePressRefs?: React.RefObject<HTMLElement | null>[];
607
+ disableOutsidePressDismiss?: boolean;
608
+ returnFocus?: boolean;
653
609
  };
654
610
  declare const useDropdownMenuActiveIndex: () => number | null;
655
611
  declare const DropdownMenu: React.FC<DropdownMenuRootProps>;
@@ -663,7 +619,14 @@ declare const DropdownMenuSub: React.FC<{
663
619
  dense?: boolean;
664
620
  children: React.ReactNode;
665
621
  }>;
666
- declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<React.PropsWithoutRef<DropdownMenuTriggerProps> & React.RefAttributes<HTMLElement>>;
622
+ declare global {
623
+ interface HTMLElement {
624
+ __pfuiCloseSubmenu?: () => void;
625
+ }
626
+ }
627
+ declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<React.PropsWithoutRef<DropdownMenuTriggerProps & {
628
+ __index?: number;
629
+ }> & React.RefAttributes<HTMLElement>>;
667
630
  declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<React.PropsWithoutRef<Omit<DropdownMenuContentProps, "anchor">> & React.RefAttributes<HTMLDivElement>>;
668
631
 
669
632
  /** @jsxImportSource @emotion/react */
@@ -693,7 +656,7 @@ type FlexProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
693
656
  width?: string | number;
694
657
  height?: string | number;
695
658
  };
696
- declare const Flex: React.ForwardRefExoticComponent<FlexProps & React.RefAttributes<HTMLDivElement>>;
659
+ declare const Flex: React.FC<FlexProps>;
697
660
 
698
661
  /** @jsxImportSource @emotion/react */
699
662
 
@@ -732,13 +695,13 @@ declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttri
732
695
 
733
696
  /** @jsxImportSource @emotion/react */
734
697
 
735
- type Variant$8 = "fan" | "slide" | "domino" | "ladder";
698
+ type Variant$7 = "fan" | "slide" | "domino" | "ladder";
736
699
  type HoverEffect = "reveal" | "expand" | "none";
737
700
  type Size$1 = "sm" | "md" | "lg" | "xl";
738
701
  type RadiusToken = "xs" | "sm" | "md" | "lg" | "xl" | "full";
739
702
  type ImageStackProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
740
703
  children: React.ReactNode;
741
- variant?: Variant$8;
704
+ variant?: Variant$7;
742
705
  width?: number | string;
743
706
  aspectRatio?: number | string;
744
707
  size?: Size$1;
@@ -783,25 +746,10 @@ type MenuProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
783
746
  maxHeight?: number | string;
784
747
  unstyled?: boolean;
785
748
  css?: Interpolation<Theme>;
786
- gap?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | string | number;
787
749
  label?: string;
750
+ allItemsTabbable?: boolean;
788
751
  };
789
752
  declare const Menu: React.ForwardRefExoticComponent<React.PropsWithoutRef<MenuProps> & React.RefAttributes<HTMLDivElement>>;
790
- declare const SubMenu: React.FC<{
791
- open?: boolean;
792
- defaultOpen?: boolean;
793
- onOpenChange?: (v: boolean) => void;
794
- children: ReactNode;
795
- }>;
796
- declare const SubMenuTrigger: React.FC<{
797
- children: React.ReactElement;
798
- chevron?: ReactNode;
799
- asChild?: boolean;
800
- }>;
801
- declare const SubMenuContent: React.FC<{
802
- children: React.ReactNode;
803
- css?: Interpolation<Theme>;
804
- }>;
805
753
 
806
754
  /** @jsxImportSource @emotion/react */
807
755
 
@@ -815,9 +763,10 @@ type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
815
763
  startIcon?: React.ReactNode;
816
764
  endIcon?: React.ReactNode;
817
765
  selected?: boolean;
766
+ active?: boolean;
818
767
  meta?: React.ReactNode;
819
768
  };
820
- type MenuCheckboxItemProps = Omit<MenuItemProps, "onSelect" | "startIcon" | "endIcon"> & {
769
+ type MenuCheckboxItemProps = Omit<MenuItemProps, "onSelect" | "selected"> & {
821
770
  checked?: boolean;
822
771
  defaultChecked?: boolean;
823
772
  onCheckedChange?: (next: boolean) => void;
@@ -829,7 +778,7 @@ type MenuRadioGroupProps = {
829
778
  onValueChange?: (val: string | number) => void;
830
779
  children?: React.ReactNode;
831
780
  };
832
- type MenuRadioItemProps = Omit<MenuItemProps, "onSelect" | "startIcon" | "endIcon"> & {
781
+ type MenuRadioItemProps = Omit<MenuItemProps, "onSelect" | "startIcon" | "endIcon" | "selected"> & {
833
782
  value: string | number;
834
783
  };
835
784
  type MenuLabelProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
@@ -838,6 +787,7 @@ type MenuLabelProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
838
787
  startIcon?: React.ReactNode;
839
788
  endIcon?: React.ReactNode;
840
789
  wrap?: boolean;
790
+ color?: "primary" | "secondary" | "danger" | "warning" | "success" | "info";
841
791
  };
842
792
  type MenuSeparatorProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
843
793
  css?: Interpolation<Theme>;
@@ -845,6 +795,7 @@ type MenuSeparatorProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> &
845
795
  };
846
796
  type ItemPrivate = {
847
797
  __index?: number;
798
+ __skipListReg?: boolean;
848
799
  };
849
800
  declare const MenuItem: React.ForwardRefExoticComponent<React.PropsWithoutRef<MenuItemProps & ItemPrivate> & React.RefAttributes<HTMLDivElement>>;
850
801
  declare const MenuCheckboxGroup: React.FC<{
@@ -854,7 +805,7 @@ declare const MenuCheckboxGroup: React.FC<{
854
805
  children: React.ReactNode;
855
806
  }>;
856
807
  declare const MenuCheckboxItem: React.ForwardRefExoticComponent<React.PropsWithoutRef<MenuCheckboxItemProps & ItemPrivate> & React.RefAttributes<HTMLDivElement>>;
857
- type MenuSwitchItemProps = Omit<MenuItemProps, "onSelect" | "startIcon" | "endIcon"> & {
808
+ type MenuSwitchItemProps = Omit<MenuItemProps, "onSelect" | "startIcon" | "endIcon" | "selected"> & {
858
809
  checked?: boolean;
859
810
  defaultChecked?: boolean;
860
811
  onCheckedChange?: (next: boolean) => void;
@@ -876,7 +827,7 @@ type ModalProps = {
876
827
  defaultOpen?: boolean;
877
828
  onOpenChange?: (open: boolean) => void;
878
829
  lockScroll?: boolean;
879
- closeOnEsc?: boolean;
830
+ closeOnEscape?: boolean;
880
831
  };
881
832
  declare const Modal: React.FC<ModalProps>;
882
833
  type ModalTriggerProps = Omit<React.HTMLAttributes<HTMLElement>, "style"> & {
@@ -893,7 +844,7 @@ type ModalContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, "style"> & {
893
844
  backdrop?: boolean;
894
845
  backdropBlur?: boolean;
895
846
  backdropBlurDepth?: number;
896
- closeOnBackdropClick?: boolean;
847
+ closeOnClickAway?: boolean;
897
848
  transitionVariant?: "fade" | "slide" | "grow" | "none";
898
849
  direction?: "up" | "down" | "left" | "right";
899
850
  transitionDuration?: number;
@@ -906,7 +857,7 @@ declare const ModalContent: React.ForwardRefExoticComponent<ModalContentProps &
906
857
  /** @jsxImportSource @emotion/react */
907
858
 
908
859
  type Size = "xs" | "sm" | "md";
909
- type Variant$7 = "subtle" | "outlined" | "ghost";
860
+ type Variant$6 = "subtle" | "outlined" | "ghost";
910
861
  type PaginationProps = {
911
862
  count: number;
912
863
  page?: number;
@@ -918,7 +869,7 @@ type PaginationProps = {
918
869
  showFirstLast?: boolean;
919
870
  loop?: boolean;
920
871
  size?: Size;
921
- variant?: Variant$7;
872
+ variant?: Variant$6;
922
873
  gap?: number;
923
874
  className?: string;
924
875
  css?: Interpolation<Theme>;
@@ -941,6 +892,7 @@ type PopoverRootProps = {
941
892
  onOpenChange?: (open: boolean) => void;
942
893
  triggerOn?: "click" | "hover";
943
894
  lockScroll?: boolean;
895
+ trapFocus?: boolean;
944
896
  children: React.ReactNode;
945
897
  };
946
898
  type PopoverTriggerProps = WithCss$2 & {
@@ -1005,14 +957,13 @@ type QuoteProps = {
1005
957
  variant?: QuoteVariant;
1006
958
  className?: string;
1007
959
  css?: Interpolation<Theme>;
1008
- as?: keyof JSX.IntrinsicElements;
1009
960
  };
1010
961
  declare const Quote: React.FC<QuoteProps>;
1011
962
 
1012
963
  /** @jsxImportSource @emotion/react */
1013
964
 
1014
965
  type Direction$3 = "horizontal" | "vertical";
1015
- type Variant$6 = "filled" | "outlined" | "soft";
966
+ type Variant$5 = "filled" | "outlined" | "soft";
1016
967
  type HV = "left" | "center" | "right" | "top" | "bottom";
1017
968
  type RadioGroupProps = {
1018
969
  value?: string | number;
@@ -1021,7 +972,7 @@ type RadioGroupProps = {
1021
972
  disabled?: boolean;
1022
973
  size?: "sm" | "md" | "lg";
1023
974
  direction?: Direction$3;
1024
- variant?: Variant$6;
975
+ variant?: Variant$5;
1025
976
  className?: string;
1026
977
  children: React.ReactNode;
1027
978
  anchorOrigin?: {
@@ -1058,7 +1009,7 @@ declare const Rotate: React.FC<RotateProps>;
1058
1009
  /** @jsxImportSource @emotion/react */
1059
1010
 
1060
1011
  type Align$1 = "left" | "center" | "right";
1061
- type Variant$5 = "subtle" | "outlined" | "ghost";
1012
+ type Variant$4 = "subtle" | "outlined" | "ghost";
1062
1013
  type SelectProps<T = unknown> = {
1063
1014
  value?: T | T[];
1064
1015
  defaultValue?: T | T[];
@@ -1067,9 +1018,10 @@ type SelectProps<T = unknown> = {
1067
1018
  placeholder?: string | React.ReactNode;
1068
1019
  startIcon?: React.ReactNode;
1069
1020
  endIcon?: React.ReactNode;
1021
+ multiple?: boolean;
1070
1022
  disabled?: boolean;
1071
- size?: "sm" | "md";
1072
- variant?: Variant$5;
1023
+ size?: "sm" | "md" | "lg";
1024
+ variant?: Variant$4;
1073
1025
  fullWidth?: boolean;
1074
1026
  width?: number | string;
1075
1027
  menuAlign?: Align$1;
@@ -1079,12 +1031,13 @@ type SelectProps<T = unknown> = {
1079
1031
  labelCss?: Interpolation<Theme>;
1080
1032
  triggerCss?: Interpolation<Theme>;
1081
1033
  menuCss?: Interpolation<Theme>;
1034
+ optionCss?: Interpolation<Theme>;
1082
1035
  children: React.ReactNode;
1083
1036
  className?: string;
1084
1037
  menuSize?: "sm" | "md";
1085
- triggerRender?: (selected: string | string[] | undefined) => React.ReactNode;
1038
+ triggerRender?: (selected: React.ReactNode | React.ReactNode[] | undefined) => React.ReactNode;
1086
1039
  };
1087
- declare function Select<T = unknown>({ value, defaultValue, onChange, label, placeholder, startIcon, endIcon, disabled, size, variant, fullWidth, width, menuAlign, menuWidth, menuMaxHeight, wrapperCss, labelCss, triggerCss, menuCss, children, className, menuSize, triggerRender, }: SelectProps<T>): JSX.Element;
1040
+ declare function Select<T = unknown>({ value, defaultValue, onChange, label, placeholder, startIcon, endIcon, disabled, size, variant, fullWidth, width, menuAlign, menuWidth, menuMaxHeight, wrapperCss, labelCss, triggerCss, menuCss, optionCss, children, className, menuSize, triggerRender, }: SelectProps<T>): JSX.Element;
1088
1041
 
1089
1042
  /** @jsxImportSource @emotion/react */
1090
1043
 
@@ -1092,7 +1045,6 @@ type SkeletonProps = {
1092
1045
  isLoading?: boolean;
1093
1046
  radius?: number | string;
1094
1047
  animation?: "wave" | "pulse" | "none";
1095
- as?: keyof JSX.IntrinsicElements;
1096
1048
  children?: React.ReactNode;
1097
1049
  width?: string | number;
1098
1050
  height?: string | number;
@@ -1179,31 +1131,6 @@ declare const Stepper: React.FC<StepperProps>;
1179
1131
 
1180
1132
  /** @jsxImportSource @emotion/react */
1181
1133
 
1182
- type Variant$4 = "toggle" | "flash";
1183
- type Effect = "rotate" | "scale" | "scale-rotate";
1184
- interface SwapProps {
1185
- variant?: Variant$4;
1186
- animationEffect?: Effect;
1187
- flashDuration?: number;
1188
- value?: string;
1189
- defaultValue?: string;
1190
- onChange?: (value: string) => void;
1191
- disabled?: boolean;
1192
- children: React.ReactNode;
1193
- className?: string;
1194
- css?: Interpolation<Theme>;
1195
- }
1196
- interface SwapItemProps {
1197
- value: string;
1198
- children: React.ReactNode;
1199
- className?: string;
1200
- css?: Interpolation<Theme>;
1201
- }
1202
- declare const SwapItem: React.ForwardRefExoticComponent<SwapItemProps & React.RefAttributes<HTMLDivElement>>;
1203
- declare const Swap: React.ForwardRefExoticComponent<SwapProps & React.RefAttributes<HTMLDivElement>>;
1204
-
1205
- /** @jsxImportSource @emotion/react */
1206
-
1207
1134
  type WithCssProp = {
1208
1135
  css?: Interpolation<Theme>;
1209
1136
  };
@@ -1357,6 +1284,8 @@ type TextFieldProps = WithCss & {
1357
1284
  readOnly?: boolean;
1358
1285
  required?: boolean;
1359
1286
  maxLength?: number;
1287
+ /** Called when the surface (wrapper) is clicked, excluding buttons/icons with role="button" */
1288
+ onSurfaceClick?: (e: React.MouseEvent) => void;
1360
1289
  };
1361
1290
  declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement>>;
1362
1291
 
@@ -1402,8 +1331,7 @@ type Styles = {
1402
1331
  surface?: CSSObject | ((t: ToastItem) => CSSObject);
1403
1332
  close?: CSSObject;
1404
1333
  };
1405
- declare const toast: {
1406
- (contentOrOptions: React.ReactNode | Options, opts?: Options): string;
1334
+ declare const toast: ((contentOrOptions: React.ReactNode | Options, opts?: Options) => string) & {
1407
1335
  success: (msg: React.ReactNode, o?: Options) => string;
1408
1336
  error: (msg: React.ReactNode, o?: Options) => string;
1409
1337
  warning: (msg: React.ReactNode, o?: Options) => string;
@@ -1419,7 +1347,7 @@ declare const toast: {
1419
1347
  promise: <T>(p: Promise<T>, msgs: {
1420
1348
  loading: React.ReactNode;
1421
1349
  success: (val: T) => React.ReactNode;
1422
- error: (err: any) => React.ReactNode;
1350
+ error: (err: unknown) => React.ReactNode;
1423
1351
  }, o?: Options) => Promise<T>;
1424
1352
  config: (opts: Partial<{
1425
1353
  max: number;
@@ -1433,7 +1361,6 @@ declare const toast: {
1433
1361
  bareRenderer: boolean;
1434
1362
  }>) => void;
1435
1363
  };
1436
- declare function ToastViewport(): JSX.Element | null;
1437
1364
 
1438
1365
  /** @jsxImportSource @emotion/react */
1439
1366
 
@@ -1469,7 +1396,7 @@ declare const TooltipContent: React.FC<TooltipContentProps>;
1469
1396
  declare const MAP: {
1470
1397
  readonly h1: {
1471
1398
  readonly size: "2.25rem";
1472
- readonly weight: 700;
1399
+ readonly weight: 800;
1473
1400
  readonly lh: 1.1;
1474
1401
  readonly ls: "-0.02em";
1475
1402
  };
@@ -1487,20 +1414,32 @@ declare const MAP: {
1487
1414
  };
1488
1415
  readonly h4: {
1489
1416
  readonly size: "1.25rem";
1490
- readonly weight: 600;
1417
+ readonly weight: 500;
1491
1418
  readonly lh: 1.2;
1492
1419
  readonly ls: "0";
1493
1420
  };
1494
- readonly body: {
1495
- readonly size: "0.95rem";
1421
+ readonly h5: {
1422
+ readonly size: "1.125rem";
1496
1423
  readonly weight: 500;
1497
- readonly lh: 1.2;
1424
+ readonly lh: 1.3;
1498
1425
  readonly ls: "0";
1499
1426
  };
1500
- readonly caption: {
1501
- readonly size: "0.8rem";
1427
+ readonly h6: {
1428
+ readonly size: "1rem";
1502
1429
  readonly weight: 500;
1503
- readonly lh: 1.2;
1430
+ readonly lh: 1.3;
1431
+ readonly ls: "0";
1432
+ };
1433
+ readonly body: {
1434
+ readonly size: "sm";
1435
+ readonly weight: 400;
1436
+ readonly lh: 1.4;
1437
+ readonly ls: "0";
1438
+ };
1439
+ readonly caption: {
1440
+ readonly size: "xs";
1441
+ readonly weight: 400;
1442
+ readonly lh: 1.4;
1504
1443
  readonly ls: "0.01em";
1505
1444
  };
1506
1445
  };
@@ -1526,7 +1465,7 @@ type TypographyProps = {
1526
1465
  italic?: boolean;
1527
1466
  className?: string;
1528
1467
  style?: React.CSSProperties;
1529
- as?: keyof JSX.IntrinsicElements;
1468
+ as?: React.ElementType;
1530
1469
  };
1531
1470
  declare const Typography: React.FC<TypographyProps>;
1532
1471
 
@@ -1547,11 +1486,13 @@ type Scale = {
1547
1486
  type PlainframeUITheme = {
1548
1487
  spacing: Record<"xxs" | "xs" | "sm" | "md" | "lg" | "xl", string | number> & Record<string, string | number>;
1549
1488
  radius: Record<"xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "full", string | number> & Record<string, string | number>;
1550
- fontSizes: Record<"xs" | "sm" | "md" | "lg" | "xl" | "xxl", string | number> & Record<string, string | number>;
1551
1489
  componentHeights: Record<"sm" | "md" | "lg" | "border", string | number> & Record<string, string | number>;
1552
- fonts: {
1553
- sans: string;
1554
- mono: string;
1490
+ typography: {
1491
+ fonts: {
1492
+ sans: string;
1493
+ mono: string;
1494
+ };
1495
+ sizes: Record<"xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl", string | number> & Record<string, string | number>;
1555
1496
  };
1556
1497
  palette: Record<string, Scale>;
1557
1498
  neutral: Scale;
@@ -1572,9 +1513,27 @@ type PlainframeUITheme = {
1572
1513
  };
1573
1514
  };
1574
1515
  type Mode = "light" | "dark";
1575
- declare const surfaceFromNeutral: (mode: Mode, n: Scale) => PlainframeUITheme["surface"];
1576
- declare const textLight: (n: Scale) => PlainframeUITheme["text"];
1577
- declare const textDark: (n: Scale) => PlainframeUITheme["text"];
1516
+ declare const surfaceFromNeutral: (mode: Mode, n: Scale) => {
1517
+ appBg: string;
1518
+ panelBg: string;
1519
+ subtleBg: string;
1520
+ panelHover: string;
1521
+ subtleHover: string;
1522
+ overlayBg: string;
1523
+ border: string;
1524
+ };
1525
+ declare const textLight: (n: Scale) => {
1526
+ primary: string;
1527
+ secondary: string;
1528
+ muted: string;
1529
+ onColors: Record<string, string>;
1530
+ };
1531
+ declare const textDark: (n: Scale) => {
1532
+ primary: string;
1533
+ secondary: string;
1534
+ muted: string;
1535
+ onColors: Record<string, string>;
1536
+ };
1578
1537
  declare const defaultLightTheme: PlainframeUITheme;
1579
1538
  declare const defaultDarkTheme: PlainframeUITheme;
1580
1539
  declare module "@emotion/react" {
@@ -1603,16 +1562,17 @@ type ThemeProviderProps = {
1603
1562
  declare function usePlainframeUITheme(): PlainframeUITheme;
1604
1563
  declare function useColorModeValue(): Mode;
1605
1564
  declare function useColorMode(): {
1565
+ mode: Mode;
1606
1566
  setMode: (m: Mode) => void;
1607
1567
  toggleMode: () => void;
1608
1568
  };
1609
1569
  declare function usePrimary(): {
1610
1570
  primary: string;
1611
- setPrimary: (k: string) => void;
1571
+ setPrimary: (p: string) => void;
1612
1572
  };
1613
1573
  declare function usePrimitives<T = PlainframeUITheme>(selector?: (t: PlainframeUITheme) => T): T;
1614
1574
  declare const ThemeProvider: React.FC<ThemeProviderProps>;
1615
1575
 
1616
1576
  declare function CssBaseline(): _emotion_react_jsx_runtime.JSX.Element;
1617
1577
 
1618
- export { Accordion, AccordionDetails, AccordionGroup, AccordionSummary, ActionBar, Alert, AlertDescription, AlertTitle, Autocomplete, Avatar, AvatarGroup, Backdrop, Badge, BreadCrumbItem, BreadCrumbs, Button, ButtonGroup, Card, CardContent, CardDescription, CardEnd, CardGroup, CardStart, CardTitle, Checkbox, Chip, CodeField, ColorPatches, Container, ContextZone, CssBaseline, Divider, Drawer, DropdownMenu, DropdownMenuContent, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Fade, Flex, Grow, Image, ImageStack, Kbd, Menu, MenuCheckboxGroup, MenuCheckboxItem, MenuItem, MenuLabel, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSwitchItem, MenuVariantCtx, Modal, ModalContent, ModalTrigger, type Mode, Pagination, type PlainframeUITheme, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, Quote, RadioGroup, RadioItem, Rotate, type Scale, Select, Skeleton, Slide, Slider, Step, Stepper, SubMenu, SubMenuContent, SubMenuTrigger, Swap, SwapItem, Switch, Tab, TabContent, Tabs, TextArea, TextField, type ThemeProp, ThemeProvider, type ThemeProviderProps, ToastViewport, Tooltip, TooltipContent, TooltipTrigger, Typography, defaultDarkTheme, defaultLightTheme, surfaceFromNeutral, textDark, textLight, toast, useColorMode, useColorModeValue, useDropdownMenuActiveIndex, usePlainframeUITheme, usePopoverContext, usePrimary, usePrimitives };
1578
+ export { Accordion, AccordionDetails, AccordionGroup, AccordionSummary, ActionBar, Alert, AlertDescription, AlertTitle, Autocomplete, Avatar, AvatarGroup, Backdrop, Badge, BreadCrumbItem, BreadCrumbs, Button, ButtonGroup, type ButtonProps, Card, CardGroup, Checkbox, Chip, CodeField, Container, ContextZone, CssBaseline, Divider, Drawer, DropdownMenu, DropdownMenuContent, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Fade, Flex, Grow, Image, type ImageProps, ImageStack, Kbd, Menu, MenuCheckboxGroup, MenuCheckboxItem, MenuItem, MenuLabel, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSwitchItem, MenuVariantCtx, Modal, ModalContent, type ModalProps, ModalTrigger, type Mode, Pagination, type PlainframeUITheme, Popover, PopoverAnchor, type PopoverAnchorProps, PopoverContent, type PopoverContentProps, type PopoverRootProps, PopoverTrigger, type PopoverTriggerProps, Progress, Quote, RadioGroup, type RadioGroupProps, RadioItem, type RadioItemProps, Rotate, type Scale, Select, Skeleton, Slide, Slider, Step, Stepper, Switch, Tab, TabContent, Tabs, TextArea, TextField, type TextFieldProps, type ThemeProp, ThemeProvider, type ThemeProviderProps, Tooltip, TooltipContent, TooltipTrigger, Typography, defaultDarkTheme, defaultLightTheme, surfaceFromNeutral, textDark, textLight, toast, useColorMode, useColorModeValue, useDropdownMenuActiveIndex, usePlainframeUITheme, usePopoverContext, usePrimary, usePrimitives };