@tenerife.music/ui 2.0.0 → 2.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +37 -1
- package/dist/{colors-BrFmCQv-.d.cts → colors-DTYb0mPM.d.cts} +4 -0
- package/dist/{colors-BrFmCQv-.d.ts → colors-DTYb0mPM.d.ts} +4 -0
- package/dist/extensions/next/index.cjs +4 -3
- package/dist/extensions/next/index.mjs +4 -3
- package/dist/{index-DGtRM9Db.d.cts → index-CfbBwBhc.d.cts} +8 -4
- package/dist/{index-DGtRM9Db.d.ts → index-CfbBwBhc.d.ts} +8 -4
- package/dist/index.cjs +5016 -1948
- package/dist/index.d.cts +608 -10
- package/dist/index.d.ts +608 -10
- package/dist/index.mjs +6312 -3257
- package/dist/preset.cjs +5 -0
- package/dist/preset.mjs +5 -0
- package/dist/styles.css +550 -0
- package/dist/theme/index.cjs +34 -2
- package/dist/theme/index.d.cts +2 -2
- package/dist/theme/index.d.ts +2 -2
- package/dist/theme/index.mjs +34 -2
- package/dist/tokens/index.cjs +16 -12
- package/dist/tokens/index.d.cts +2 -2
- package/dist/tokens/index.d.ts +2 -2
- package/dist/tokens/index.mjs +16 -12
- package/package.json +62 -58
package/dist/index.d.cts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { cM as ResponsiveSideOffset, cw as ResponsiveAlignOffset, cF as ResponsiveModalSize, cG as ResponsiveModalWidth, cE as ResponsiveModalHeight, cN as ResponsiveSpace, cv as RadiusToken, c_ as SurfaceToken, cn as ModalFooterAlignToken, cI as ResponsiveRadius$1, cW as ShadowToken, cz as ResponsiveColor$1, d3 as Responsive, cA as ResponsiveContainerMaxWidth, cD as ResponsiveFlexBasis, cC as ResponsiveDelay, d4 as ResponsiveContextMenuSize, d5 as ResponsiveContextMenuWidth, d6 as ContextMenuItemToneToken, d7 as ResponsiveTabsSize, d8 as TabsVariantToken, d9 as TabsToneToken, z as IconColor, G as IconStroke, E as EmptyStateIconSize } from './index-
|
|
2
|
-
export { A as ALERT_TOKENS, B as BUTTON_TOKENS, bp as BorderRadius, da as Breakpoint, k as ButtonFontSize, l as ButtonHeight, m as ButtonPaddingHorizontal, n as ButtonPaddingVertical, o as ButtonShadow, C as CARD_TOKENS, a as CHECKBOX_TOKENS, bW as CanonicalFontSize, bX as CanonicalFontWeight, bY as CanonicalLetterSpacing, bZ as CanonicalLineHeight, b_ as CanonicalTextColor, p as CardPadding, q as CardRadius, r as CardShadow, s as CardSize, t as CardSpacingVertical, u as CheckboxSize, v as CheckboxState, w as CheckboxVariant, bv as ColoredShadow, ba as ComponentMotionDuration, bb as ComponentMotionEasing, bd as ComponentMotionTransition, bq as ComponentRadius, bJ as ComponentSpacing, bK as ContainerSpacing, D as DATA_TOKENS, x as DataListLabelWidth, y as DataListRowPadding, bw as ElevationShadow, bx as FocusRing, b$ as FontFamily, c0 as FontSize, c1 as FontWeight, by as GlowEffect, bL as GridSpacing, I as ICON_TOKENS, c as INPUT_TOKENS, F as IconSize, H as InputFontSize, J as InputHeight, K as InputPaddingHorizontal, L as InputPaddingVertical, Q as InputRadius, U as InputSize, c2 as LetterSpacing, c3 as LineHeight, M as MENU_TOKENS, d as MOTION_TOKENS, V as MenuContentMinWidth, W as MenuContentPadding, X as MenuContentRadius, Y as MenuContentShadow, Z as MenuIndicatorOffset, _ as MenuIndicatorSize, $ as MenuItemGap, a0 as MenuItemHeight, a1 as MenuItemPadding, a2 as MenuItemRadius, a3 as MenuLabelPadding, a4 as MenuSeparatorMargin, a5 as MotionAnimation, b9 as MotionCombinedType, ba as MotionDuration, bb as MotionEasing, bc as MotionSlideDirection, bd as MotionTransition, a9 as MotionTransitionPreset, N as NAVIGATION_TOKENS, e as NOTIFICATION_TOKENS, aa as NavigationItemPadding, ab as NavigationListGap, ac as NavigationRadius, ad as NavigationShadow, ae as NavigationSize, af as NavigationState, ag as NotificationPanelWidth, ah as NotificationTokenVariant, O as OVERLAY_TOKENS, ai as OverlayBackdropVariant, aj as OverlayModalSize, P as POPOVER_TOKENS, ak as PopoverArrowOffset, al as PopoverArrowSize, am as PopoverContentPadding, an as PopoverContentRadius, ao as PopoverContentShadow, ap as PopoverContentWidth, R as RADIO_TOKENS, aq as RadioSize, ar as RadioState, as as RadioVariant, S as SECTION_TOKENS, g as SURFACE_TOKENS, h as SWITCH_TOKENS, at as SectionGap, au as SectionPadding, bM as SectionSpacing, bN as SemanticSpacing, aL as SkeletonAnimation, aM as SkeletonBackground, bO as Spacing, bP as StackSpacing, aO as SurfacePadding, aP as SurfaceRadius, aQ as SurfaceShadow, aR as SurfaceVariant, aS as SwitchSize, aT as SwitchState, aU as SwitchVariant, T as TEXT_TOKENS, i as TOAST_TOKENS, j as TOOLTIP_TOKENS, aV as TableCellPadding, aW as TableGap, aX as TableHeaderPadding, aY as TableRowHeight, aZ as TableShadow, a_ as TextFontSize, a$ as TextFontWeight, b0 as TextLetterSpacing, b1 as TextLineHeight, c4 as TextStyle, b2 as ToastVariant, b3 as TooltipContentRadius, b4 as TooltipContentShadow, bV as UI_COLORS, bz as accentColoredShadows, b5 as allCSSVariables, b6 as allCSSVariablesCSS, br as borderRadius, bs as componentRadius, bA as componentShadowMapping, bB as elevationShadows, bC as focusRings, c5 as fontFamily, c6 as fontSize, c7 as fontSizeWithMd, c8 as fontWeight, b7 as generateCSSVariablesCSS, bD as glowEffects, bQ as layoutSpacing, c9 as letterSpacing, ca as lineHeight, be as motionCSSVariables, bf as motionCombined, bg as motionDurations, bh as motionEasings, bi as motionFade, bj as motionReducedMotion, bk as motionScale, bl as motionSlide, bm as motionTailwindConfig, bn as motionTransitionProperty, bo as motionTransitions, bE as primaryColoredShadows, bt as radiusCSSVariables, bR as semanticSpacing, bF as shadowBase, bG as shadowCSSVariables, bH as shadowOpacity, bS as spacing, bT as spacingCSSVariables, bu as tailwindRadiusConfig, bI as tailwindShadowConfig, bU as tailwindSpacingConfig, cb as tailwindTypographyConfig, cc as textStyles, b8 as tokenSystemSummary, cd as typographyCSSVariables } from './index-
|
|
3
|
-
export { B as BaseColorTokens, C as ChartColors, a as ColorScale, b as ColorTokens, M as Mode, S as SemanticColors, c as SurfaceColors, T as TextColors, d as accentColors, e as baseColors, f as chartColors, g as colorCSSVariables, h as cssVariableColorTokens, p as primaryColors, s as secondaryColors, i as semanticColors, j as surfaceColors, t as tailwindThemeColors, k as textColors } from './colors-
|
|
1
|
+
import { cM as ResponsiveSideOffset, cw as ResponsiveAlignOffset, cF as ResponsiveModalSize, cG as ResponsiveModalWidth, cE as ResponsiveModalHeight, cN as ResponsiveSpace, cv as RadiusToken, c_ as SurfaceToken, cn as ModalFooterAlignToken, cI as ResponsiveRadius$1, cW as ShadowToken, cz as ResponsiveColor$1, d3 as Responsive, cA as ResponsiveContainerMaxWidth, cD as ResponsiveFlexBasis, cC as ResponsiveDelay, d4 as ResponsiveContextMenuSize, d5 as ResponsiveContextMenuWidth, d6 as ContextMenuItemToneToken, d7 as ResponsiveTabsSize, d8 as TabsVariantToken, d9 as TabsToneToken, z as IconColor, G as IconStroke, E as EmptyStateIconSize } from './index-CfbBwBhc.cjs';
|
|
2
|
+
export { A as ALERT_TOKENS, B as BUTTON_TOKENS, bp as BorderRadius, da as Breakpoint, k as ButtonFontSize, l as ButtonHeight, m as ButtonPaddingHorizontal, n as ButtonPaddingVertical, o as ButtonShadow, C as CARD_TOKENS, a as CHECKBOX_TOKENS, bW as CanonicalFontSize, bX as CanonicalFontWeight, bY as CanonicalLetterSpacing, bZ as CanonicalLineHeight, b_ as CanonicalTextColor, p as CardPadding, q as CardRadius, r as CardShadow, s as CardSize, t as CardSpacingVertical, u as CheckboxSize, v as CheckboxState, w as CheckboxVariant, bv as ColoredShadow, ba as ComponentMotionDuration, bb as ComponentMotionEasing, bd as ComponentMotionTransition, bq as ComponentRadius, bJ as ComponentSpacing, bK as ContainerSpacing, D as DATA_TOKENS, x as DataListLabelWidth, y as DataListRowPadding, bw as ElevationShadow, bx as FocusRing, b$ as FontFamily, c0 as FontSize, c1 as FontWeight, by as GlowEffect, bL as GridSpacing, I as ICON_TOKENS, c as INPUT_TOKENS, F as IconSize, H as InputFontSize, J as InputHeight, K as InputPaddingHorizontal, L as InputPaddingVertical, Q as InputRadius, U as InputSize, c2 as LetterSpacing, c3 as LineHeight, M as MENU_TOKENS, d as MOTION_TOKENS, V as MenuContentMinWidth, W as MenuContentPadding, X as MenuContentRadius, Y as MenuContentShadow, Z as MenuIndicatorOffset, _ as MenuIndicatorSize, $ as MenuItemGap, a0 as MenuItemHeight, a1 as MenuItemPadding, a2 as MenuItemRadius, a3 as MenuLabelPadding, a4 as MenuSeparatorMargin, a5 as MotionAnimation, b9 as MotionCombinedType, ba as MotionDuration, bb as MotionEasing, bc as MotionSlideDirection, bd as MotionTransition, a9 as MotionTransitionPreset, N as NAVIGATION_TOKENS, e as NOTIFICATION_TOKENS, aa as NavigationItemPadding, ab as NavigationListGap, ac as NavigationRadius, ad as NavigationShadow, ae as NavigationSize, af as NavigationState, ag as NotificationPanelWidth, ah as NotificationTokenVariant, O as OVERLAY_TOKENS, ai as OverlayBackdropVariant, aj as OverlayModalSize, P as POPOVER_TOKENS, ak as PopoverArrowOffset, al as PopoverArrowSize, am as PopoverContentPadding, an as PopoverContentRadius, ao as PopoverContentShadow, ap as PopoverContentWidth, R as RADIO_TOKENS, aq as RadioSize, ar as RadioState, as as RadioVariant, S as SECTION_TOKENS, g as SURFACE_TOKENS, h as SWITCH_TOKENS, at as SectionGap, au as SectionPadding, bM as SectionSpacing, bN as SemanticSpacing, aL as SkeletonAnimation, aM as SkeletonBackground, bO as Spacing, bP as StackSpacing, aO as SurfacePadding, aP as SurfaceRadius, aQ as SurfaceShadow, aR as SurfaceVariant, aS as SwitchSize, aT as SwitchState, aU as SwitchVariant, T as TEXT_TOKENS, i as TOAST_TOKENS, j as TOOLTIP_TOKENS, aV as TableCellPadding, aW as TableGap, aX as TableHeaderPadding, aY as TableRowHeight, aZ as TableShadow, a_ as TextFontSize, a$ as TextFontWeight, b0 as TextLetterSpacing, b1 as TextLineHeight, c4 as TextStyle, b2 as ToastVariant, b3 as TooltipContentRadius, b4 as TooltipContentShadow, bV as UI_COLORS, bz as accentColoredShadows, b5 as allCSSVariables, b6 as allCSSVariablesCSS, br as borderRadius, bs as componentRadius, bA as componentShadowMapping, bB as elevationShadows, bC as focusRings, c5 as fontFamily, c6 as fontSize, c7 as fontSizeWithMd, c8 as fontWeight, b7 as generateCSSVariablesCSS, bD as glowEffects, bQ as layoutSpacing, c9 as letterSpacing, ca as lineHeight, be as motionCSSVariables, bf as motionCombined, bg as motionDurations, bh as motionEasings, bi as motionFade, bj as motionReducedMotion, bk as motionScale, bl as motionSlide, bm as motionTailwindConfig, bn as motionTransitionProperty, bo as motionTransitions, bE as primaryColoredShadows, bt as radiusCSSVariables, bR as semanticSpacing, bF as shadowBase, bG as shadowCSSVariables, bH as shadowOpacity, bS as spacing, bT as spacingCSSVariables, bu as tailwindRadiusConfig, bI as tailwindShadowConfig, bU as tailwindSpacingConfig, cb as tailwindTypographyConfig, cc as textStyles, b8 as tokenSystemSummary, cd as typographyCSSVariables } from './index-CfbBwBhc.cjs';
|
|
3
|
+
export { B as BaseColorTokens, C as ChartColors, a as ColorScale, b as ColorTokens, M as Mode, S as SemanticColors, c as SurfaceColors, T as TextColors, d as accentColors, e as baseColors, f as chartColors, g as colorCSSVariables, h as cssVariableColorTokens, p as primaryColors, s as secondaryColors, i as semanticColors, j as surfaceColors, t as tailwindThemeColors, k as textColors } from './colors-DTYb0mPM.cjs';
|
|
4
4
|
import * as React$1 from 'react';
|
|
5
5
|
import React__default, { ReactNode } from 'react';
|
|
6
6
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
@@ -16,6 +16,7 @@ import * as SeparatorPrimitive from '@radix-ui/react-separator';
|
|
|
16
16
|
import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
|
|
17
17
|
import * as ToastPrimitives from '@radix-ui/react-toast';
|
|
18
18
|
import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
|
|
19
|
+
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
19
20
|
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
20
21
|
import * as TabsPrimitive from '@radix-ui/react-tabs';
|
|
21
22
|
|
|
@@ -240,6 +241,99 @@ interface BadgeProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
|
240
241
|
}
|
|
241
242
|
declare function Badge({ className, variant, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
|
|
242
243
|
|
|
244
|
+
/**
|
|
245
|
+
* Chip variant values
|
|
246
|
+
* @public
|
|
247
|
+
*/
|
|
248
|
+
declare const CHIP_VARIANTS: readonly ["primary", "secondary", "accent", "outline", "ghost", "destructive"];
|
|
249
|
+
/**
|
|
250
|
+
* Chip variant type
|
|
251
|
+
* @public
|
|
252
|
+
*/
|
|
253
|
+
type ChipVariant = (typeof CHIP_VARIANTS)[number];
|
|
254
|
+
/**
|
|
255
|
+
* Chip radius values
|
|
256
|
+
* @public
|
|
257
|
+
*/
|
|
258
|
+
declare const CHIP_RADIUS_VALUES: readonly ["sm", "md", "lg", "pill"];
|
|
259
|
+
/**
|
|
260
|
+
* Chip radius type
|
|
261
|
+
* @public
|
|
262
|
+
*/
|
|
263
|
+
type ChipRadius = (typeof CHIP_RADIUS_VALUES)[number];
|
|
264
|
+
/**
|
|
265
|
+
* Chip variants using tokenCVA
|
|
266
|
+
*/
|
|
267
|
+
declare const chipVariants: (props?: ({
|
|
268
|
+
variant?: "primary" | "secondary" | "accent" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
269
|
+
radius?: "sm" | "md" | "lg" | "pill" | null | undefined;
|
|
270
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
271
|
+
/**
|
|
272
|
+
* Chip props interface
|
|
273
|
+
* @public
|
|
274
|
+
*/
|
|
275
|
+
interface ChipProps extends Omit<React$1.HTMLAttributes<HTMLElement>, "onClick"> {
|
|
276
|
+
/**
|
|
277
|
+
* Chip variant style
|
|
278
|
+
* @default "primary"
|
|
279
|
+
*/
|
|
280
|
+
variant?: ChipVariant;
|
|
281
|
+
/**
|
|
282
|
+
* Border radius style
|
|
283
|
+
* @default "md"
|
|
284
|
+
*/
|
|
285
|
+
radius?: ChipRadius;
|
|
286
|
+
/**
|
|
287
|
+
* Whether the chip can be removed (shows X button)
|
|
288
|
+
* @default false
|
|
289
|
+
*/
|
|
290
|
+
removable?: boolean;
|
|
291
|
+
/**
|
|
292
|
+
* Whether the chip is selected (for selectable chips)
|
|
293
|
+
* @default false
|
|
294
|
+
*/
|
|
295
|
+
selected?: boolean;
|
|
296
|
+
/**
|
|
297
|
+
* Whether the chip is disabled
|
|
298
|
+
* @default false
|
|
299
|
+
*/
|
|
300
|
+
disabled?: boolean;
|
|
301
|
+
/**
|
|
302
|
+
* Click handler for the chip (makes it interactive)
|
|
303
|
+
*/
|
|
304
|
+
onClick?: (event: React$1.MouseEvent<HTMLElement>) => void;
|
|
305
|
+
/**
|
|
306
|
+
* Remove handler for removable chips
|
|
307
|
+
* Only called when removable={true} and remove button is clicked
|
|
308
|
+
*/
|
|
309
|
+
onRemove?: (event: React$1.MouseEvent<HTMLButtonElement>) => void;
|
|
310
|
+
/**
|
|
311
|
+
* Accessible label for the chip
|
|
312
|
+
* Required for icon-only chips or when children is not descriptive
|
|
313
|
+
*/
|
|
314
|
+
"aria-label"?: string;
|
|
315
|
+
/**
|
|
316
|
+
* ARIA pressed state for selectable chips
|
|
317
|
+
*/
|
|
318
|
+
"aria-pressed"?: boolean | "true" | "false" | "mixed";
|
|
319
|
+
/**
|
|
320
|
+
* Child content of the chip
|
|
321
|
+
*/
|
|
322
|
+
children: React$1.ReactNode;
|
|
323
|
+
}
|
|
324
|
+
/**
|
|
325
|
+
* Chip component
|
|
326
|
+
*
|
|
327
|
+
* COMPLIANCE NOTES:
|
|
328
|
+
* - ✅ Uses token system exclusively (CHIP_TOKENS)
|
|
329
|
+
* - ✅ No raw values (all styling via tokens)
|
|
330
|
+
* - ✅ Motion compliance (MOTION_TOKENS.transitionPreset.colors)
|
|
331
|
+
* - ✅ Accessibility (ARIA attributes, keyboard navigation)
|
|
332
|
+
* - ✅ Focus management (focus-visible, keyboard-only)
|
|
333
|
+
* - ✅ Interaction Authority (disabled: prefix for disabled states)
|
|
334
|
+
*/
|
|
335
|
+
declare const Chip: React$1.ForwardRefExoticComponent<ChipProps & React$1.RefAttributes<HTMLElement>>;
|
|
336
|
+
|
|
243
337
|
declare const headingVariants: (props?: ({
|
|
244
338
|
level?: 1 | 2 | 4 | 6 | 3 | 5 | null | undefined;
|
|
245
339
|
weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
|
|
@@ -318,6 +412,88 @@ declare const Select: {
|
|
|
318
412
|
Label: React$1.ForwardRefExoticComponent<SelectLabelProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
319
413
|
};
|
|
320
414
|
|
|
415
|
+
/**
|
|
416
|
+
* Option type for MultiSelect
|
|
417
|
+
* @public
|
|
418
|
+
*/
|
|
419
|
+
interface MultiSelectOption {
|
|
420
|
+
value: string;
|
|
421
|
+
label: string;
|
|
422
|
+
disabled?: boolean;
|
|
423
|
+
}
|
|
424
|
+
/**
|
|
425
|
+
* Size union type (explicit, not CVA-derived)
|
|
426
|
+
* @public
|
|
427
|
+
*/
|
|
428
|
+
type MultiSelectSize = "sm" | "md" | "lg";
|
|
429
|
+
/**
|
|
430
|
+
* MultiSelect props interface
|
|
431
|
+
* @public
|
|
432
|
+
*/
|
|
433
|
+
interface MultiSelectProps {
|
|
434
|
+
/**
|
|
435
|
+
* Selected values (controlled)
|
|
436
|
+
*/
|
|
437
|
+
value?: string[];
|
|
438
|
+
/**
|
|
439
|
+
* Default selected values (uncontrolled)
|
|
440
|
+
*/
|
|
441
|
+
defaultValue?: string[];
|
|
442
|
+
/**
|
|
443
|
+
* Callback when selection changes
|
|
444
|
+
*/
|
|
445
|
+
onValueChange?: (value: string[]) => void;
|
|
446
|
+
/**
|
|
447
|
+
* Options to display
|
|
448
|
+
*/
|
|
449
|
+
options: MultiSelectOption[];
|
|
450
|
+
/**
|
|
451
|
+
* Placeholder text when no items selected
|
|
452
|
+
*/
|
|
453
|
+
placeholder?: string;
|
|
454
|
+
/**
|
|
455
|
+
* Maximum number of tags to show in trigger
|
|
456
|
+
* @default undefined (show all tags)
|
|
457
|
+
*/
|
|
458
|
+
maxTags?: number;
|
|
459
|
+
/**
|
|
460
|
+
* Size of the component
|
|
461
|
+
* @default "md"
|
|
462
|
+
*/
|
|
463
|
+
size?: MultiSelectSize;
|
|
464
|
+
/**
|
|
465
|
+
* Whether the component is disabled
|
|
466
|
+
* @default false
|
|
467
|
+
*/
|
|
468
|
+
disabled?: boolean;
|
|
469
|
+
/**
|
|
470
|
+
* Accessible label for the component
|
|
471
|
+
* Required if no visible label
|
|
472
|
+
*/
|
|
473
|
+
"aria-label"?: string;
|
|
474
|
+
/**
|
|
475
|
+
* ID of the element that labels this component
|
|
476
|
+
*/
|
|
477
|
+
"aria-labelledby"?: string;
|
|
478
|
+
/**
|
|
479
|
+
* Custom render function for tags
|
|
480
|
+
* @param option - The option being rendered as a tag
|
|
481
|
+
* @param onRemove - Function to call to remove this tag
|
|
482
|
+
*/
|
|
483
|
+
renderTag?: (option: MultiSelectOption, onRemove: () => void) => React$1.ReactNode;
|
|
484
|
+
}
|
|
485
|
+
/**
|
|
486
|
+
* MultiSelect component
|
|
487
|
+
*
|
|
488
|
+
* COMPLIANCE NOTES:
|
|
489
|
+
* - ✅ Uses token system exclusively (INPUT_TOKENS, SELECT_TOKENS, CHECKBOX_TOKENS, CHIP_TOKENS)
|
|
490
|
+
* - ✅ Composes Foundation components (Select, Checkbox)
|
|
491
|
+
* - ✅ Motion compliance (MOTION_TOKENS.transitionPreset.colors)
|
|
492
|
+
* - ✅ A11Y compliance (aria-multiselectable, aria-checked, keyboard navigation)
|
|
493
|
+
* - ✅ Focus management (focus restore, keyboard-only indication)
|
|
494
|
+
*/
|
|
495
|
+
declare const MultiSelect: React$1.ForwardRefExoticComponent<MultiSelectProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
496
|
+
|
|
321
497
|
/**
|
|
322
498
|
* Avatar Component Variants
|
|
323
499
|
*
|
|
@@ -509,7 +685,7 @@ declare const AvatarGroup: React$1.ForwardRefExoticComponent<AvatarGroupProps &
|
|
|
509
685
|
*
|
|
510
686
|
* **REFERENCE:**
|
|
511
687
|
* - docs/architecture/FOUNDATION_LOCK.md (Legacy Foundation Components section)
|
|
512
|
-
* - docs/workflows/foundation/
|
|
688
|
+
* - docs/workflows/foundation/COMPONENT_REFACTORING_PIPELINE.md
|
|
513
689
|
*
|
|
514
690
|
* ============================================================================
|
|
515
691
|
*
|
|
@@ -740,6 +916,131 @@ declare const Modal: {
|
|
|
740
916
|
Close: React$1.ForwardRefExoticComponent<ModalCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
741
917
|
};
|
|
742
918
|
|
|
919
|
+
/**
|
|
920
|
+
* FileUpload Types
|
|
921
|
+
*
|
|
922
|
+
* Type definitions for FileUpload component.
|
|
923
|
+
* All types follow TYPING_STANDARD (explicit union types, no CVA-derived types in public API).
|
|
924
|
+
*/
|
|
925
|
+
/**
|
|
926
|
+
* FileUpload Size Type
|
|
927
|
+
* Explicit union type for size variants
|
|
928
|
+
*/
|
|
929
|
+
type FileUploadSize = "sm" | "md" | "lg";
|
|
930
|
+
/**
|
|
931
|
+
* FileUpload Variant Type
|
|
932
|
+
* Explicit union type for visual variants
|
|
933
|
+
*/
|
|
934
|
+
type FileUploadVariant = "outline" | "filled";
|
|
935
|
+
/**
|
|
936
|
+
* FileUpload Error Type
|
|
937
|
+
* Error types for validation failures
|
|
938
|
+
*/
|
|
939
|
+
interface FileUploadError {
|
|
940
|
+
type: "file-too-large" | "file-type-not-supported" | "too-many-files" | "unknown";
|
|
941
|
+
message: string;
|
|
942
|
+
file?: File;
|
|
943
|
+
}
|
|
944
|
+
/**
|
|
945
|
+
* FileUpload Props
|
|
946
|
+
* Main component props interface
|
|
947
|
+
*
|
|
948
|
+
* Extension component: className/style allowed but excluded from type definition
|
|
949
|
+
* for consistency with FormData components pattern
|
|
950
|
+
*/
|
|
951
|
+
interface FileUploadProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue" | "onError"> {
|
|
952
|
+
/** Allow multiple file selection */
|
|
953
|
+
multiple?: boolean;
|
|
954
|
+
/** Accepted file types (e.g., "image/*", ".pdf,.doc") */
|
|
955
|
+
accept?: string;
|
|
956
|
+
/** Maximum file size in bytes */
|
|
957
|
+
maxSize?: number;
|
|
958
|
+
/** Maximum number of files (for multiple mode) */
|
|
959
|
+
maxFiles?: number;
|
|
960
|
+
/** Disabled state */
|
|
961
|
+
disabled?: boolean;
|
|
962
|
+
/** Loading state (upload in progress) */
|
|
963
|
+
loading?: boolean;
|
|
964
|
+
/** Controlled value (array of File objects) */
|
|
965
|
+
value?: File[];
|
|
966
|
+
/** Default value (uncontrolled mode) */
|
|
967
|
+
defaultValue?: File[];
|
|
968
|
+
/** Called when files are selected */
|
|
969
|
+
onFileSelect?: (files: File[]) => void;
|
|
970
|
+
/** Called when a file is removed */
|
|
971
|
+
onFileRemove?: (file: File) => void;
|
|
972
|
+
/** Called when validation error occurs */
|
|
973
|
+
onError?: (error: FileUploadError) => void;
|
|
974
|
+
/** Size variant */
|
|
975
|
+
size?: FileUploadSize;
|
|
976
|
+
/** Visual variant */
|
|
977
|
+
variant?: FileUploadVariant;
|
|
978
|
+
/** Accessible label for dropzone */
|
|
979
|
+
"aria-label"?: string;
|
|
980
|
+
/** ID of element describing the component */
|
|
981
|
+
"aria-describedby"?: string;
|
|
982
|
+
}
|
|
983
|
+
|
|
984
|
+
/**
|
|
985
|
+
* FileUpload Component
|
|
986
|
+
*
|
|
987
|
+
* Extension composite component for file upload with drag-and-drop,
|
|
988
|
+
* file preview, validation, and progress tracking.
|
|
989
|
+
*
|
|
990
|
+
* Features:
|
|
991
|
+
* - Drag-and-drop file selection
|
|
992
|
+
* - File preview with thumbnails (for images)
|
|
993
|
+
* - File validation (size, type, count)
|
|
994
|
+
* - Controlled and uncontrolled modes
|
|
995
|
+
* - Size variants (sm, md, lg)
|
|
996
|
+
* - Visual variants (outline, filled)
|
|
997
|
+
* - Error handling
|
|
998
|
+
* - ARIA compliance
|
|
999
|
+
* - Keyboard navigation
|
|
1000
|
+
*
|
|
1001
|
+
* @example Basic usage
|
|
1002
|
+
* ```tsx
|
|
1003
|
+
* <FileUpload onFileSelect={(files) => console.log(files)} />
|
|
1004
|
+
* ```
|
|
1005
|
+
*
|
|
1006
|
+
* @example Multiple files with validation
|
|
1007
|
+
* ```tsx
|
|
1008
|
+
* <FileUpload
|
|
1009
|
+
* multiple
|
|
1010
|
+
* maxSize={5 * 1024 * 1024} // 5MB
|
|
1011
|
+
* accept="image/*"
|
|
1012
|
+
* maxFiles={5}
|
|
1013
|
+
* onFileSelect={handleUpload}
|
|
1014
|
+
* onError={(error) => console.error(error)}
|
|
1015
|
+
* />
|
|
1016
|
+
* ```
|
|
1017
|
+
*
|
|
1018
|
+
* @example Controlled mode with loading state
|
|
1019
|
+
* ```tsx
|
|
1020
|
+
* <FileUpload
|
|
1021
|
+
* value={files}
|
|
1022
|
+
* loading={isUploading}
|
|
1023
|
+
* onFileSelect={setFiles}
|
|
1024
|
+
* onFileRemove={handleRemove}
|
|
1025
|
+
* />
|
|
1026
|
+
* ```
|
|
1027
|
+
*/
|
|
1028
|
+
|
|
1029
|
+
/**
|
|
1030
|
+
* FileUpload component
|
|
1031
|
+
*
|
|
1032
|
+
* COMPLIANCE NOTES:
|
|
1033
|
+
* - ✅ Uses token system exclusively (no raw values)
|
|
1034
|
+
* - ✅ Composes Foundation components (Button, Text)
|
|
1035
|
+
* - ✅ Follows Extension Authority Contract
|
|
1036
|
+
* - ✅ Uses descriptive, intent-based naming
|
|
1037
|
+
* - ✅ Does NOT duplicate Foundation functionality
|
|
1038
|
+
* - ✅ Motion compliance: uses .tm-motion-fade-in for file appearance
|
|
1039
|
+
* - ✅ A11Y compliance: aria-label, aria-describedby, aria-busy, aria-invalid
|
|
1040
|
+
* - ✅ Focus compliance: keyboard navigation, focus-visible styles
|
|
1041
|
+
*/
|
|
1042
|
+
declare const FileUpload: React$1.ForwardRefExoticComponent<FileUploadProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1043
|
+
|
|
743
1044
|
type RangeSliderSize = "sm" | "md" | "lg";
|
|
744
1045
|
type RangeSliderVariant = "primary" | "secondary" | "outline";
|
|
745
1046
|
type RangeSliderOrientation = "horizontal" | "vertical";
|
|
@@ -938,7 +1239,7 @@ declare const Slider: React$1.ForwardRefExoticComponent<SliderProps & React$1.Re
|
|
|
938
1239
|
*/
|
|
939
1240
|
type CheckboxVariant = "primary" | "secondary" | "outline" | "ghost" | "destructive";
|
|
940
1241
|
type CheckboxSize = "sm" | "md" | "lg";
|
|
941
|
-
type CheckboxState = "default" | "checked" | "indeterminate" | "error" | "disabled";
|
|
1242
|
+
type CheckboxState = "default" | "checked" | "indeterminate" | "error" | "disabled" | "disabledChecked";
|
|
942
1243
|
/**
|
|
943
1244
|
* Checkbox Variants
|
|
944
1245
|
*
|
|
@@ -953,7 +1254,7 @@ type CheckboxState = "default" | "checked" | "indeterminate" | "error" | "disabl
|
|
|
953
1254
|
declare const checkboxVariants: (props?: ({
|
|
954
1255
|
variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
955
1256
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
956
|
-
state?: "default" | "disabled" | "error" | "checked" | "indeterminate" | null | undefined;
|
|
1257
|
+
state?: "default" | "disabled" | "error" | "checked" | "indeterminate" | "disabledChecked" | null | undefined;
|
|
957
1258
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
958
1259
|
|
|
959
1260
|
/**
|
|
@@ -2569,7 +2870,7 @@ declare function Toaster(): react_jsx_runtime.JSX.Element;
|
|
|
2569
2870
|
*
|
|
2570
2871
|
* **REFERENCE:**
|
|
2571
2872
|
* - docs/architecture/FOUNDATION_LOCK.md (Legacy Foundation Components section)
|
|
2572
|
-
* - docs/workflows/foundation/
|
|
2873
|
+
* - docs/workflows/foundation/COMPONENT_REFACTORING_PIPELINE.md
|
|
2573
2874
|
*
|
|
2574
2875
|
* ============================================================================
|
|
2575
2876
|
*
|
|
@@ -2813,6 +3114,303 @@ declare const ContextMenu: {
|
|
|
2813
3114
|
SubContent: React$1.ForwardRefExoticComponent<ContextMenuSubContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2814
3115
|
};
|
|
2815
3116
|
|
|
3117
|
+
/**
|
|
3118
|
+
* Spinner Component
|
|
3119
|
+
*
|
|
3120
|
+
* Animated loading indicator for visual feedback during async operations.
|
|
3121
|
+
* Provides multiple visual variants (circle/dots/bounce/linear/bars/pulse/wave/orbit/bars-horizontal/ripple), size variants (xs/sm/md/lg/xl/2xl/3xl),
|
|
3122
|
+
* tone variants (primary/muted/subtle), and optional text label with configurable positioning.
|
|
3123
|
+
*
|
|
3124
|
+
* @semantic_role EXTENSION_VISUAL_FEEDBACK
|
|
3125
|
+
*
|
|
3126
|
+
* @semantic_definition
|
|
3127
|
+
* Spinner is a visual feedback component that displays animated loading indicators in various styles.
|
|
3128
|
+
* It provides visual feedback during async operations (data loading, form submission, etc.).
|
|
3129
|
+
* Spinner supports multiple visual variants (circle, dots, bounce, linear, bars, pulse, wave, orbit, bars-horizontal, ripple), full size scale (xs-3xl),
|
|
3130
|
+
* and tone variants for different visual contexts. Optional text label can be displayed alongside spinner
|
|
3131
|
+
* with configurable positioning.
|
|
3132
|
+
*
|
|
3133
|
+
* **What Spinner IS:**
|
|
3134
|
+
* - Visual feedback component for loading states
|
|
3135
|
+
* - Multiple visual style variants (circle, dots, bounce, linear, bars, pulse, wave, orbit, bars-horizontal, ripple)
|
|
3136
|
+
* - Non-interactive display component
|
|
3137
|
+
* - Supports inline, page, data, and overlay loading scenarios
|
|
3138
|
+
*
|
|
3139
|
+
* **What Spinner IS NOT:**
|
|
3140
|
+
* - NOT an interactive component (no hover/active/focus states)
|
|
3141
|
+
* - NOT a progress indicator (use Progress component for progress bars)
|
|
3142
|
+
* - NOT a skeleton loader (use Skeleton component for content placeholders)
|
|
3143
|
+
* - NOT a Foundation component (Extension layer component)
|
|
3144
|
+
*
|
|
3145
|
+
* @example
|
|
3146
|
+
* ```tsx
|
|
3147
|
+
* // Basic spinner (circle variant, default)
|
|
3148
|
+
* <Spinner />
|
|
3149
|
+
*
|
|
3150
|
+
* // Dots variant
|
|
3151
|
+
* <Spinner variant="dots" size="md" tone="muted" />
|
|
3152
|
+
*
|
|
3153
|
+
* // Bounce variant
|
|
3154
|
+
* <Spinner variant="bounce" size="md" />
|
|
3155
|
+
*
|
|
3156
|
+
* // Linear variant
|
|
3157
|
+
* <Spinner variant="linear" size="sm" />
|
|
3158
|
+
*
|
|
3159
|
+
* // Spinner with label
|
|
3160
|
+
* <Spinner label="Loading..." labelPosition="right" />
|
|
3161
|
+
*
|
|
3162
|
+
* // Spinner with accessibility label
|
|
3163
|
+
* <Spinner aria-label="Loading data" />
|
|
3164
|
+
* ```
|
|
3165
|
+
*/
|
|
3166
|
+
|
|
3167
|
+
/**
|
|
3168
|
+
* Spinner size type
|
|
3169
|
+
* Full GlobalSize scale: xs, sm, md, lg, xl, 2xl, 3xl
|
|
3170
|
+
*/
|
|
3171
|
+
type SpinnerSize = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
|
|
3172
|
+
/**
|
|
3173
|
+
* Spinner tone type
|
|
3174
|
+
* Color tone variants: primary, muted, subtle
|
|
3175
|
+
*/
|
|
3176
|
+
type SpinnerTone = "primary" | "muted" | "subtle";
|
|
3177
|
+
/**
|
|
3178
|
+
* Spinner variant type
|
|
3179
|
+
* Visual style variants: circle, dots, bounce, linear, bars, pulse, wave, orbit, bars-horizontal, ripple
|
|
3180
|
+
*/
|
|
3181
|
+
type SpinnerVariant = "circle" | "dots" | "bounce" | "linear" | "bars" | "pulse" | "wave" | "orbit" | "bars-horizontal" | "ripple";
|
|
3182
|
+
/**
|
|
3183
|
+
* Spinner label position type
|
|
3184
|
+
* Label position relative to spinner: top, right, bottom, left
|
|
3185
|
+
*/
|
|
3186
|
+
type SpinnerLabelPosition = "top" | "right" | "bottom" | "left";
|
|
3187
|
+
/**
|
|
3188
|
+
* Spinner easing type
|
|
3189
|
+
* Animation timing function: linear, ease-in, ease-out, ease-in-out
|
|
3190
|
+
*/
|
|
3191
|
+
type SpinnerEasing = "linear" | "ease-in" | "ease-out" | "ease-in-out";
|
|
3192
|
+
/**
|
|
3193
|
+
* Spinner component props
|
|
3194
|
+
*/
|
|
3195
|
+
interface SpinnerProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "className" | "style"> {
|
|
3196
|
+
/**
|
|
3197
|
+
* Visual style variant (circle/dots/bounce/linear/bars/pulse/wave/orbit/bars-horizontal/ripple)
|
|
3198
|
+
* @default "circle"
|
|
3199
|
+
*/
|
|
3200
|
+
variant?: SpinnerVariant;
|
|
3201
|
+
/**
|
|
3202
|
+
* Size of spinner (xs/sm/md/lg/xl/2xl/3xl)
|
|
3203
|
+
* @default "md"
|
|
3204
|
+
*/
|
|
3205
|
+
size?: SpinnerSize;
|
|
3206
|
+
/**
|
|
3207
|
+
* Color tone (primary/muted/subtle)
|
|
3208
|
+
* @default "primary"
|
|
3209
|
+
*/
|
|
3210
|
+
tone?: SpinnerTone;
|
|
3211
|
+
/**
|
|
3212
|
+
* Animation easing (linear/ease-in/ease-out/ease-in-out)
|
|
3213
|
+
* Controls how animation speed changes over time
|
|
3214
|
+
* @default "linear"
|
|
3215
|
+
*/
|
|
3216
|
+
easing?: SpinnerEasing;
|
|
3217
|
+
/**
|
|
3218
|
+
* Optional text label displayed alongside spinner
|
|
3219
|
+
*/
|
|
3220
|
+
label?: string;
|
|
3221
|
+
/**
|
|
3222
|
+
* Label position relative to spinner
|
|
3223
|
+
* @default "bottom"
|
|
3224
|
+
*/
|
|
3225
|
+
labelPosition?: SpinnerLabelPosition;
|
|
3226
|
+
/**
|
|
3227
|
+
* Accessibility label (required if no visual label)
|
|
3228
|
+
* Provides accessible name for screen readers
|
|
3229
|
+
*/
|
|
3230
|
+
"aria-label"?: string;
|
|
3231
|
+
}
|
|
3232
|
+
/**
|
|
3233
|
+
* Spinner Component
|
|
3234
|
+
*
|
|
3235
|
+
* Animated loading indicator for visual feedback during async operations.
|
|
3236
|
+
* Supports multiple visual variants (circle/dots/bounce/linear/bars/pulse/wave/orbit/bars-horizontal/ripple), full size scale (xs-3xl),
|
|
3237
|
+
* tone variants (primary/muted/subtle), and optional text label.
|
|
3238
|
+
*
|
|
3239
|
+
* @example
|
|
3240
|
+
* ```tsx
|
|
3241
|
+
* // Basic spinner (circle variant, default)
|
|
3242
|
+
* <Spinner />
|
|
3243
|
+
*
|
|
3244
|
+
* // Dots variant with size and tone
|
|
3245
|
+
* <Spinner variant="dots" size="lg" tone="muted" />
|
|
3246
|
+
*
|
|
3247
|
+
* // Dots variant
|
|
3248
|
+
* <Spinner variant="dots" size="md" />
|
|
3249
|
+
*
|
|
3250
|
+
* // Spinner with label on the right
|
|
3251
|
+
* <Spinner label="Loading..." labelPosition="right" />
|
|
3252
|
+
*
|
|
3253
|
+
* // Spinner with accessibility label
|
|
3254
|
+
* <Spinner aria-label="Loading data" />
|
|
3255
|
+
* ```
|
|
3256
|
+
*/
|
|
3257
|
+
declare const Spinner: React$1.ForwardRefExoticComponent<SpinnerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3258
|
+
|
|
3259
|
+
/**
|
|
3260
|
+
* Accordion Component
|
|
3261
|
+
*
|
|
3262
|
+
* Vertically stacked set of interactive headings that reveal/hide associated content panels.
|
|
3263
|
+
* Provides accessible disclosure pattern with keyboard navigation and ARIA support.
|
|
3264
|
+
*
|
|
3265
|
+
* @semantic_role EXTENSION_COMPOSITE_DISCLOSURE
|
|
3266
|
+
*
|
|
3267
|
+
* @semantic_definition
|
|
3268
|
+
* Accordion is a composite disclosure component that allows users to toggle the visibility
|
|
3269
|
+
* of content sections. It supports single (only one item open) and multiple (multiple items
|
|
3270
|
+
* can be open) modes, semantic variants (primary/secondary/accent/neutral), and size variants
|
|
3271
|
+
* (sm/md/lg). All behavior (keyboard navigation, focus management, ARIA attributes) is delegated
|
|
3272
|
+
* to Radix Accordion primitives.
|
|
3273
|
+
*
|
|
3274
|
+
* **What Accordion IS:**
|
|
3275
|
+
* - Disclosure component for collapsible content sections
|
|
3276
|
+
* - Supports single and multiple open modes
|
|
3277
|
+
* - Provides keyboard navigation (Arrow Up/Down, Enter/Space)
|
|
3278
|
+
* - Accessible via ARIA attributes (role="region", aria-expanded, aria-labelledby)
|
|
3279
|
+
*
|
|
3280
|
+
* **What Accordion IS NOT:**
|
|
3281
|
+
* - NOT a Foundation component (Extension layer component)
|
|
3282
|
+
* - NOT a navigation component (use Tabs for navigation)
|
|
3283
|
+
* - NOT a menu component (use ContextMenu or DropdownMenu for menus)
|
|
3284
|
+
*
|
|
3285
|
+
* @example
|
|
3286
|
+
* ```tsx
|
|
3287
|
+
* // Single mode (default)
|
|
3288
|
+
* <Accordion.Root type="single" collapsible>
|
|
3289
|
+
* <Accordion.Item value="item-1">
|
|
3290
|
+
* <Accordion.Trigger variant="primary" size="md">
|
|
3291
|
+
* Section 1
|
|
3292
|
+
* </Accordion.Trigger>
|
|
3293
|
+
* <Accordion.Content>
|
|
3294
|
+
* Content for section 1
|
|
3295
|
+
* </Accordion.Content>
|
|
3296
|
+
* </Accordion.Item>
|
|
3297
|
+
* </Accordion.Root>
|
|
3298
|
+
*
|
|
3299
|
+
* // Multiple mode
|
|
3300
|
+
* <Accordion.Root type="multiple" defaultValue={["item-1", "item-2"]}>
|
|
3301
|
+
* <Accordion.Item value="item-1">
|
|
3302
|
+
* <Accordion.Trigger variant="secondary" size="lg">
|
|
3303
|
+
* Section 1
|
|
3304
|
+
* </Accordion.Trigger>
|
|
3305
|
+
* <Accordion.Content>
|
|
3306
|
+
* Content for section 1
|
|
3307
|
+
* </Accordion.Content>
|
|
3308
|
+
* </Accordion.Item>
|
|
3309
|
+
* </Accordion.Root>
|
|
3310
|
+
* ```
|
|
3311
|
+
*/
|
|
3312
|
+
|
|
3313
|
+
/**
|
|
3314
|
+
* Accordion variant type
|
|
3315
|
+
* Semantic variants: primary, secondary, accent, neutral
|
|
3316
|
+
*/
|
|
3317
|
+
type AccordionVariant = "primary" | "secondary" | "accent" | "neutral";
|
|
3318
|
+
/**
|
|
3319
|
+
* Accordion size type
|
|
3320
|
+
* Standard interactive component sizes: sm, md, lg
|
|
3321
|
+
*/
|
|
3322
|
+
type AccordionSize = "sm" | "md" | "lg";
|
|
3323
|
+
type AccordionRootProps = React$1.ComponentPropsWithoutRef<typeof AccordionPrimitive.Accordion>;
|
|
3324
|
+
interface AccordionItemProps extends React$1.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item> {
|
|
3325
|
+
/**
|
|
3326
|
+
* Unique value identifier for this item
|
|
3327
|
+
*/
|
|
3328
|
+
value: string;
|
|
3329
|
+
}
|
|
3330
|
+
interface AccordionTriggerProps extends Omit<React$1.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>, "size" | "variant"> {
|
|
3331
|
+
/**
|
|
3332
|
+
* Semantic variant (primary/secondary/accent/neutral)
|
|
3333
|
+
* @default "primary"
|
|
3334
|
+
*/
|
|
3335
|
+
variant?: AccordionVariant;
|
|
3336
|
+
/**
|
|
3337
|
+
* Size (sm/md/lg)
|
|
3338
|
+
* @default "md"
|
|
3339
|
+
*/
|
|
3340
|
+
size?: AccordionSize;
|
|
3341
|
+
}
|
|
3342
|
+
interface AccordionContentProps extends Omit<React$1.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>, "size" | "variant"> {
|
|
3343
|
+
/**
|
|
3344
|
+
* Size (sm/md/lg) - for padding and typography
|
|
3345
|
+
* @default "md"
|
|
3346
|
+
*/
|
|
3347
|
+
size?: AccordionSize;
|
|
3348
|
+
/**
|
|
3349
|
+
* Semantic variant (primary/secondary/accent/neutral) - for background and text colors
|
|
3350
|
+
* @default "primary"
|
|
3351
|
+
*/
|
|
3352
|
+
variant?: AccordionVariant;
|
|
3353
|
+
}
|
|
3354
|
+
declare const Accordion: {
|
|
3355
|
+
Root: React$1.FC<AccordionRootProps>;
|
|
3356
|
+
Item: React$1.ForwardRefExoticComponent<AccordionItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3357
|
+
Trigger: React$1.ForwardRefExoticComponent<AccordionTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
3358
|
+
Content: React$1.ForwardRefExoticComponent<AccordionContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
3359
|
+
};
|
|
3360
|
+
|
|
3361
|
+
/**
|
|
3362
|
+
* Combobox size type - Explicit union (TYPING_STANDARD compliant)
|
|
3363
|
+
* Interactive Size Scale: sm | md | lg
|
|
3364
|
+
*/
|
|
3365
|
+
type ComboboxSize = "sm" | "md" | "lg";
|
|
3366
|
+
/**
|
|
3367
|
+
* Option type
|
|
3368
|
+
*/
|
|
3369
|
+
interface ComboboxOption {
|
|
3370
|
+
value: string;
|
|
3371
|
+
label?: string;
|
|
3372
|
+
disabled?: boolean;
|
|
3373
|
+
}
|
|
3374
|
+
interface ComboboxRootProps {
|
|
3375
|
+
value?: string | string[];
|
|
3376
|
+
defaultValue?: string | string[];
|
|
3377
|
+
onValueChange?: (value: string | string[]) => void;
|
|
3378
|
+
multiple?: boolean;
|
|
3379
|
+
open?: boolean;
|
|
3380
|
+
onOpenChange?: (open: boolean) => void;
|
|
3381
|
+
size?: ComboboxSize;
|
|
3382
|
+
children: React$1.ReactNode;
|
|
3383
|
+
}
|
|
3384
|
+
/**
|
|
3385
|
+
* ComboboxRoot - Context provider for Combobox state
|
|
3386
|
+
*/
|
|
3387
|
+
declare function ComboboxRoot({ value: controlledValue, defaultValue, onValueChange, multiple, open: controlledOpen, onOpenChange, size, children, }: ComboboxRootProps): react_jsx_runtime.JSX.Element;
|
|
3388
|
+
interface ComboboxInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "onChange"> {
|
|
3389
|
+
placeholder?: string;
|
|
3390
|
+
disabled?: boolean;
|
|
3391
|
+
"aria-invalid"?: boolean;
|
|
3392
|
+
"aria-label"?: string;
|
|
3393
|
+
}
|
|
3394
|
+
/**
|
|
3395
|
+
* ComboboxInput - Input field for typing/filtering
|
|
3396
|
+
*/
|
|
3397
|
+
declare const ComboboxInput: React$1.ForwardRefExoticComponent<ComboboxInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
3398
|
+
interface ComboboxListProps {
|
|
3399
|
+
options: ComboboxOption[];
|
|
3400
|
+
filterable?: boolean;
|
|
3401
|
+
onSearch?: (query: string) => void;
|
|
3402
|
+
loading?: boolean;
|
|
3403
|
+
emptyMessage?: string;
|
|
3404
|
+
}
|
|
3405
|
+
/**
|
|
3406
|
+
* ComboboxList - Dropdown list of options
|
|
3407
|
+
*/
|
|
3408
|
+
declare function ComboboxList({ options, filterable, onSearch, loading, emptyMessage, }: ComboboxListProps): react_jsx_runtime.JSX.Element;
|
|
3409
|
+
declare const Combobox: typeof ComboboxRoot & {
|
|
3410
|
+
Input: React$1.ForwardRefExoticComponent<ComboboxInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
3411
|
+
List: typeof ComboboxList;
|
|
3412
|
+
};
|
|
3413
|
+
|
|
2816
3414
|
/**
|
|
2817
3415
|
* NotificationCenter.DismissAll Component
|
|
2818
3416
|
*
|
|
@@ -3042,7 +3640,7 @@ interface NotificationCenterPanelProps {
|
|
|
3042
3640
|
/**
|
|
3043
3641
|
* Element to return focus to when panel closes
|
|
3044
3642
|
*/
|
|
3045
|
-
returnFocusRef?: React$1.RefObject<HTMLElement>;
|
|
3643
|
+
returnFocusRef?: React$1.RefObject<HTMLElement | null>;
|
|
3046
3644
|
}
|
|
3047
3645
|
/**
|
|
3048
3646
|
* NotificationCenter.Panel component - side drawer notification panel
|
|
@@ -3257,7 +3855,7 @@ declare const HoverCardTrigger: React$1.ForwardRefExoticComponent<HoverCardTrigg
|
|
|
3257
3855
|
*
|
|
3258
3856
|
* **REFERENCE:**
|
|
3259
3857
|
* - docs/architecture/FOUNDATION_LOCK.md
|
|
3260
|
-
* - docs/workflows/foundation/
|
|
3858
|
+
* - docs/workflows/foundation/COMPONENT_REFACTORING_PIPELINE.md
|
|
3261
3859
|
* - docs/reports/audit/TABS_BASELINE_REPORT.md
|
|
3262
3860
|
*
|
|
3263
3861
|
* ============================================================================
|
|
@@ -4561,4 +5159,4 @@ interface TableColumn<T> {
|
|
|
4561
5159
|
render?: (value: T[keyof T], item: T) => React__default.ReactNode;
|
|
4562
5160
|
}
|
|
4563
5161
|
|
|
4564
|
-
export { ALERT_VARIANTS, ASPECT_RATIO_PRESETS, Alert, type AlertProps, type AlertVariant, AspectRatio, type AspectRatioPreset, type AspectRatioProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarGroupSpacing, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, BADGE_VARIANTS, Backdrop, type BackdropProps, Badge, type BadgeProps, type BadgeVariant, Box, type BoxProps, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsRootProps, type BreadcrumbsSeparatorProps, Button, type ButtonProps, Card, CardBody, type CardBodyProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, Checkbox, type CheckboxProps, Column, type StackProps as ColumnProps, Container, type ContainerProps, Surface as ContainerSurface, type SurfaceProps as ContainerSurfaceProps, ContextMenu, ContextMenuCheckboxItem, type ContextMenuCheckboxItemProps, ContextMenuContent, type ContextMenuContentProps, ContextMenuItem, type ContextMenuItemProps, ContextMenuLabel, type ContextMenuLabelProps, ContextMenuRadioGroup, type ContextMenuRadioGroupProps, ContextMenuRadioItem, type ContextMenuRadioItemProps, ContextMenuRoot, type ContextMenuRootProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuSub, ContextMenuSubContent, type ContextMenuSubContentProps, type ContextMenuSubProps, ContextMenuSubTrigger, type ContextMenuSubTriggerProps, ContextMenuTrigger, type ContextMenuTriggerProps, DataListRoot as DataList, DataListItem, type DataListItemProps, DataListLabel, type DataListLabelProps, DataListRoot, type DataListRootProps, DataListValue, type DataListValueProps, Dialog, DialogBody, type DialogBodyProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, type DialogProps, DialogRoot, DialogTitle, type DialogTitleProps, EmptyState, EmptyStateAction, type EmptyStateActionProps, EmptyStateDescription, type EmptyStateDescriptionProps, EmptyStateIcon, type EmptyStateIconProps, EmptyStateIconSize, type EmptyStateProps, EmptyStateTitle, type EmptyStateTitleProps, FieldRoot as Field, type FieldControlProps, type FieldDescriptionProps, type FieldErrorProps, type FieldLabelProps, type FieldProps, Flex, type FlexProps, Grid, type GridProps, type GroupByFunction, Heading, type HeadingProps, HoverCardContent, type HoverCardContentProps, HoverCardRoot, type HoverCardRootProps, HoverCardTrigger, type HoverCardTriggerProps, ICONS_MAP, Icon, IconArrowRight, IconCalendar, IconCheck, IconChevronDown, IconChevronRight, IconClose, IconColor, type IconProps$1 as IconComponentProps, IconError, IconInfo, IconLocation, IconMenu, type IconName, type IconProps, IconSearch, IconStroke, IconSuccess, IconWarning, Input, type InputProps, Label, type LabelProps, LinkProps, Modal, ModalClose, type ModalCloseProps, ModalContent, type ModalContentProps, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalOverlay, type ModalOverlayProps, ModalRoot, type ModalRootProps, type ModalSize, ModalTitle, type ModalTitleProps, ModalTrigger, type ModalTriggerProps, NavItem, type NavItemProps, NavLink, type NavLinkProps, NavList, type NavListProps, NavRoot, type NavRootProps, NavSeparator, type NavSeparatorProps, NavText, type NavTextProps, NotificationCenter, NotificationCenterDismissAll, type NotificationCenterDismissAllProps, NotificationCenterGroupHeader, type NotificationCenterGroupHeaderProps, NotificationCenterItem, type NotificationCenterItemProps, NotificationCenterList, type NotificationCenterListProps, NotificationCenterPanel, type NotificationCenterPanelProps, NotificationCenterProvider, type NotificationCenterProviderProps, NotificationCenterTrigger, type NotificationCenterTriggerProps, type NotificationChannel, type NotificationContextType, type NotificationData, type NotificationOptions, type NotificationVariant, Pagination, type PaginationEllipsisProps, type PaginationItemProps, type PaginationNextProps, type PaginationPrevProps, type PaginationRootProps, Portal, type PortalProps, Progress, type ProgressProps, type ProgressSize, Radio, RadioGroup, type RadioGroupProps, type RadioProps, RangeSlider, type RangeSliderProps, type RangeSliderSize, type RangeSliderVariant, Responsive, Row, type RowProps, Section, type SectionProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlOrientation, type SegmentedControlRootProps, type SegmentedControlSize, Select, SelectContent, type SelectContentProps, SelectGroup, type SelectGroupProps, SelectIcon, type SelectIconProps, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectLabel, type SelectLabelProps, SelectRoot, type SelectRootProps, SelectSeparator, type SelectSeparatorProps, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, SelectViewport, type SelectViewportProps, Separator, type SeparatorProps, Skeleton, type SkeletonProps, type SkeletonVariant, Slider, type SliderProps, type SliderSize, type SliderVariant, type SortDirection, type SortState, Stack, type StackProps, Stepper, type StepperContentProps, type StepperIndicatorProps, type StepperItemProps, type StepperLabelProps, type StepperRootProps, type StepperStep, Surface, type SurfaceProps, TableRoot as Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, type TableColumn, type TableContextValue, TableEmpty, type TableEmptyProps, TableExpandableContent, type TableExpandableContentProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, TableLoadingState, type TableLoadingStateProps, TableRoot, type TableRootProps, TableRow, type TableRowProps, TableSortIcon, type TableSortIconProps, Tabs, type TabsContentProps, type TabsListProps, type TabsRootProps, type TabsTriggerProps, Text, type TextProps, type TextSize, type TextWeight, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastData, type ToastOptions, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, ToastViewport, type ToastViewportProps, Toaster, alertVariants, badgeVariants, checkboxVariants, surfaceVariants as containerSurfaceVariants, headingVariants, iconVariants, inputVariants, radioVariants, segmentedControlItemVariants, segmentedControlRootVariants, separatorVariants, skeletonVariants, surfaceVariants, textVariants, textareaVariants, useNotificationCenter, useNotificationCenterContext, useTableContext, useLocalToast as useToast };
|
|
5162
|
+
export { ALERT_VARIANTS, ASPECT_RATIO_PRESETS, Accordion, type AccordionContentProps, type AccordionItemProps, type AccordionRootProps, type AccordionSize, type AccordionTriggerProps, type AccordionVariant, Alert, type AlertProps, type AlertVariant, AspectRatio, type AspectRatioPreset, type AspectRatioProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarGroupSpacing, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, BADGE_VARIANTS, Backdrop, type BackdropProps, Badge, type BadgeProps, type BadgeVariant, Box, type BoxProps, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsRootProps, type BreadcrumbsSeparatorProps, Button, type ButtonProps, CHIP_RADIUS_VALUES, CHIP_VARIANTS, Card, CardBody, type CardBodyProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipProps, type ChipRadius, type ChipVariant, Column, type StackProps as ColumnProps, Combobox, ComboboxInput, type ComboboxInputProps, ComboboxList, type ComboboxListProps, type ComboboxOption, ComboboxRoot, type ComboboxRootProps, type ComboboxSize, Container, type ContainerProps, Surface as ContainerSurface, type SurfaceProps as ContainerSurfaceProps, ContextMenu, ContextMenuCheckboxItem, type ContextMenuCheckboxItemProps, ContextMenuContent, type ContextMenuContentProps, ContextMenuItem, type ContextMenuItemProps, ContextMenuLabel, type ContextMenuLabelProps, ContextMenuRadioGroup, type ContextMenuRadioGroupProps, ContextMenuRadioItem, type ContextMenuRadioItemProps, ContextMenuRoot, type ContextMenuRootProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuSub, ContextMenuSubContent, type ContextMenuSubContentProps, type ContextMenuSubProps, ContextMenuSubTrigger, type ContextMenuSubTriggerProps, ContextMenuTrigger, type ContextMenuTriggerProps, DataListRoot as DataList, DataListItem, type DataListItemProps, DataListLabel, type DataListLabelProps, DataListRoot, type DataListRootProps, DataListValue, type DataListValueProps, Dialog, DialogBody, type DialogBodyProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, type DialogProps, DialogRoot, DialogTitle, type DialogTitleProps, EmptyState, EmptyStateAction, type EmptyStateActionProps, EmptyStateDescription, type EmptyStateDescriptionProps, EmptyStateIcon, type EmptyStateIconProps, EmptyStateIconSize, type EmptyStateProps, EmptyStateTitle, type EmptyStateTitleProps, FieldRoot as Field, type FieldControlProps, type FieldDescriptionProps, type FieldErrorProps, type FieldLabelProps, type FieldProps, FileUpload, type FileUploadError, type FileUploadProps, type FileUploadSize, type FileUploadVariant, Flex, type FlexProps, Grid, type GridProps, type GroupByFunction, Heading, type HeadingProps, HoverCardContent, type HoverCardContentProps, HoverCardRoot, type HoverCardRootProps, HoverCardTrigger, type HoverCardTriggerProps, ICONS_MAP, Icon, IconArrowRight, IconCalendar, IconCheck, IconChevronDown, IconChevronRight, IconClose, IconColor, type IconProps$1 as IconComponentProps, IconError, IconInfo, IconLocation, IconMenu, type IconName, type IconProps, IconSearch, IconStroke, IconSuccess, IconWarning, Input, type InputProps, Label, type LabelProps, LinkProps, Modal, ModalClose, type ModalCloseProps, ModalContent, type ModalContentProps, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalOverlay, type ModalOverlayProps, ModalRoot, type ModalRootProps, type ModalSize, ModalTitle, type ModalTitleProps, ModalTrigger, type ModalTriggerProps, MultiSelect, type MultiSelectOption, type MultiSelectProps, type MultiSelectSize, NavItem, type NavItemProps, NavLink, type NavLinkProps, NavList, type NavListProps, NavRoot, type NavRootProps, NavSeparator, type NavSeparatorProps, NavText, type NavTextProps, NotificationCenter, NotificationCenterDismissAll, type NotificationCenterDismissAllProps, NotificationCenterGroupHeader, type NotificationCenterGroupHeaderProps, NotificationCenterItem, type NotificationCenterItemProps, NotificationCenterList, type NotificationCenterListProps, NotificationCenterPanel, type NotificationCenterPanelProps, NotificationCenterProvider, type NotificationCenterProviderProps, NotificationCenterTrigger, type NotificationCenterTriggerProps, type NotificationChannel, type NotificationContextType, type NotificationData, type NotificationOptions, type NotificationVariant, Pagination, type PaginationEllipsisProps, type PaginationItemProps, type PaginationNextProps, type PaginationPrevProps, type PaginationRootProps, Portal, type PortalProps, Progress, type ProgressProps, type ProgressSize, Radio, RadioGroup, type RadioGroupProps, type RadioProps, RangeSlider, type RangeSliderProps, type RangeSliderSize, type RangeSliderVariant, Responsive, Row, type RowProps, Section, type SectionProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlOrientation, type SegmentedControlRootProps, type SegmentedControlSize, Select, SelectContent, type SelectContentProps, SelectGroup, type SelectGroupProps, SelectIcon, type SelectIconProps, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectLabel, type SelectLabelProps, SelectRoot, type SelectRootProps, SelectSeparator, type SelectSeparatorProps, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, SelectViewport, type SelectViewportProps, Separator, type SeparatorProps, Skeleton, type SkeletonProps, type SkeletonVariant, Slider, type SliderProps, type SliderSize, type SliderVariant, type SortDirection, type SortState, Spinner, type SpinnerEasing, type SpinnerLabelPosition, type SpinnerProps, type SpinnerSize, type SpinnerTone, type SpinnerVariant, Stack, type StackProps, Stepper, type StepperContentProps, type StepperIndicatorProps, type StepperItemProps, type StepperLabelProps, type StepperRootProps, type StepperStep, Surface, type SurfaceProps, TableRoot as Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, type TableColumn, type TableContextValue, TableEmpty, type TableEmptyProps, TableExpandableContent, type TableExpandableContentProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, TableLoadingState, type TableLoadingStateProps, TableRoot, type TableRootProps, TableRow, type TableRowProps, TableSortIcon, type TableSortIconProps, Tabs, type TabsContentProps, type TabsListProps, type TabsRootProps, type TabsTriggerProps, Text, type TextProps, type TextSize, type TextWeight, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastData, type ToastOptions, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, ToastViewport, type ToastViewportProps, Toaster, alertVariants, badgeVariants, checkboxVariants, chipVariants, surfaceVariants as containerSurfaceVariants, headingVariants, iconVariants, inputVariants, radioVariants, segmentedControlItemVariants, segmentedControlRootVariants, separatorVariants, skeletonVariants, surfaceVariants, textVariants, textareaVariants, useNotificationCenter, useNotificationCenterContext, useTableContext, useLocalToast as useToast };
|