@windmorph/react 0.1.2 → 0.2.1

package/dist/composites/button-group/button-group-styles.js

@@ -26,7 +26,7 @@ const buttonGroupStyles = tv({
 	variants: {
 		variant: {
 			standard: "inline-flex",
-			connected: "grid w-full grid-flow-col auto-cols-[1fr] gap-[2px] data-pinned:flex"
+			connected: "grid grid-flow-col auto-cols-[1fr] gap-[2px] data-pinned:flex"
 		},
 		size: {
 			xs: "",
@@ -35,12 +35,27 @@ const buttonGroupStyles = tv({
 			lg: "",
 			xl: ""
 		},
+		fullWidth: {
+			true: "",
+			false: ""
+		},
 		overflow: {
 			true: "w-full min-w-0 *:data-overflow-hidden:hidden data-measuring:flex data-measuring:w-max data-measuring:*:grow-0",
 			false: ""
 		}
 	},
 	compoundVariants: [
+		{
+			variant: "connected",
+			fullWidth: true,
+			class: "w-full"
+		},
+		{
+			variant: "connected",
+			fullWidth: false,
+			overflow: false,
+			class: "inline-grid w-fit"
+		},
 		{
 			variant: "standard",
 			overflow: true,

package/dist/composites/button-group/button-group-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group-styles.js","names":[],"sources":["../../../src/composites/button-group/button-group-styles.ts"],"sourcesContent":["import { tv } from '../../utils/tv';\n\n/**\n * Variant definitions for `ButtonGroup`, from the M3 Expressive button group specs\n * (2026-10-13). Standard groups space their buttons 18 / 12 / 8 / 8 / 8px apart (XS–XL), so\n * the XS and S buttons' 48px targets don't overlap. Connected groups are 2px apart at every\n * size, and span their container with the buttons sharing the extra width (\"The connected\n * button group should span the width of the page or surface it's placed on\"); a consumer\n * `w-fit` (or a `max-w-*`) narrows it. Connected buttons are equally wide (2026-10-13, as\n * Compose's connected sample gives each `weight(1f)`): the group is a grid of `1fr` columns\n * (2026-10-15), so a definite width is shared equally, and a group sized by its content gives\n * every button the widest one's natural width, never squeezing a longer label into its\n * padding. The columns are `minmax(auto, 1fr)`, so with too little room a button shrinks no\n * further than its own minimum width, as in a flex row. `auto-cols-auto` on the group sizes\n * them by their content instead. While the press\n * bump pins the buttons' widths (`data-pinned`), the group lays them out as a flex row of the\n * same widths, so the bump can animate their `flex-basis`.\n *\n * With `overflow`, a standard group fills its container's width too, so it can measure the\n * room it has; its buttons stay at the start. Buttons folded into the overflow menu carry\n * `data-overflow-hidden`; while measuring, the group is a flex row of its content's width\n * and no button grows.\n */\nexport const buttonGroupStyles = tv({\n  base: 'items-center',\n  variants: {\n    variant: {\n      standard: 'inline-flex',\n      connected: 'grid w-full grid-flow-col auto-cols-[1fr] gap-[2px] data-pinned:flex',\n    },\n    size: { xs: '', sm: '', md: '', lg: '', xl: '' },\n    overflow: {\n      true: 'w-full min-w-0 *:data-overflow-hidden:hidden data-measuring:flex data-measuring:w-max data-measuring:*:grow-0',\n      false: '',\n    },\n  },\n  compoundVariants: [\n    { variant: 'standard', overflow: true, class: 'flex' },\n    // XS and S: the spec's 18 / 12px, growing as density shrinks the icon buttons (their\n    // default widths: XS max(24px, 32px + 4px a step), S 40px + 4px a step), so neighbouring\n    // centres stay 48px apart and their 48px touch targets never overlap (2026-10-15). A\n    // group holding a narrow icon button spaces by the narrow width instead (XS max(24px,\n    // 28px + 4px a step), S max(28px, 32px + 4px a step), M 48px + 4px a step), so the gap is\n    // max(spec, 48px − narrow width) (2026-10-17). The gap is a variable, so a consumer `gap-*`\n    // still replaces it.\n    {\n      variant: 'standard',\n      size: 'xs',\n      class: [\n        'gap-(--m3-button-group-gap)',\n        '[--m3-button-group-gap:max(18px,calc(48px-max(24px,calc(32px+var(--md-sys-density,0)*4px))))]',\n        'has-[[data-tokens~=md-comp-icon-button][data-width=narrow]]:[--m3-button-group-gap:max(18px,calc(48px-max(24px,calc(28px+var(--md-sys-density,0)*4px))))]',\n      ],\n    },\n    {\n      variant: 'standard',\n      size: 'sm',\n      class: [\n        'gap-(--m3-button-group-gap)',\n        '[--m3-button-group-gap:max(12px,calc(8px-var(--md-sys-density,0)*4px))]',\n        'has-[[data-tokens~=md-comp-icon-button][data-width=narrow]]:[--m3-button-group-gap:max(12px,calc(48px-max(28px,calc(32px+var(--md-sys-density,0)*4px))))]',\n      ],\n    },\n    {\n      variant: 'standard',\n      size: 'md',\n      class: [\n        'gap-(--m3-button-group-gap) [--m3-button-group-gap:8px]',\n        'has-[[data-tokens~=md-comp-icon-button][data-width=narrow]]:[--m3-button-group-gap:max(8px,calc(var(--md-sys-density,0)*-4px))]',\n      ],\n    },\n    { variant: 'standard', size: ['lg', 'xl'], class: 'gap-[8px]' },\n  ],\n  defaultVariants: { variant: 'standard', size: 'sm', overflow: false },\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuBA,MAAa,oBAAoB,GAAG;CAClC,MAAM;CACN,UAAU;EACR,SAAS;GACP,UAAU;GACV,WAAW;EACb;EACA,MAAM;GAAE,IAAI;GAAI,IAAI;GAAI,IAAI;GAAI,IAAI;GAAI,IAAI;EAAG;EAC/C,UAAU;GACR,MAAM;GACN,OAAO;EACT;CACF;CACA,kBAAkB;EAChB;GAAE,SAAS;GAAY,UAAU;GAAM,OAAO;EAAO;EAQrD;GACE,SAAS;GACT,MAAM;GACN,OAAO;IACL;IACA;IACA;GACF;EACF;EACA;GACE,SAAS;GACT,MAAM;GACN,OAAO;IACL;IACA;IACA;GACF;EACF;EACA;GACE,SAAS;GACT,MAAM;GACN,OAAO,CACL,2DACA,iIACF;EACF;EACA;GAAE,SAAS;GAAY,MAAM,CAAC,MAAM,IAAI;GAAG,OAAO;EAAY;CAChE;CACA,iBAAiB;EAAE,SAAS;EAAY,MAAM;EAAM,UAAU;CAAM;AACtE,CAAC"}
+{"version":3,"file":"button-group-styles.js","names":[],"sources":["../../../src/composites/button-group/button-group-styles.ts"],"sourcesContent":["import { tv } from '../../utils/tv';\n\n/**\n * Variant definitions for `ButtonGroup`, from the M3 Expressive button group specs\n * (2026-10-13). Standard groups space their buttons 18 / 12 / 8 / 8 / 8px apart (XS–XL), so\n * the XS and S buttons' 48px targets don't overlap. Connected groups are 2px apart at every\n * size, and span their container with the buttons sharing the extra width (\"The connected\n * button group should span the width of the page or surface it's placed on\"); a consumer\n * `w-fit` (or a `max-w-*`) narrows it. Connected buttons are equally wide (2026-10-13, as\n * Compose's connected sample gives each `weight(1f)`): the group is a grid of `1fr` columns\n * (2026-10-15), so a definite width is shared equally, and a group sized by its content gives\n * every button the widest one's natural width, never squeezing a longer label into its\n * padding. The columns are `minmax(auto, 1fr)`, so with too little room a button shrinks no\n * further than its own minimum width, as in a flex row. `auto-cols-auto` on the group sizes\n * them by their content instead. While the press\n * bump pins the buttons' widths (`data-pinned`), the group lays them out as a flex row of the\n * same widths, so the bump can animate their `flex-basis`.\n *\n * With `overflow`, a standard group fills its container's width too, so it can measure the\n * room it has; its buttons stay at the start. Buttons folded into the overflow menu carry\n * `data-overflow-hidden`; while measuring, the group is a flex row of its content's width\n * and no button grows.\n */\nexport const buttonGroupStyles = tv({\n  base: 'items-center',\n  variants: {\n    variant: {\n      standard: 'inline-flex',\n      connected: 'grid grid-flow-col auto-cols-[1fr] gap-[2px] data-pinned:flex',\n    },\n    size: { xs: '', sm: '', md: '', lg: '', xl: '' },\n    fullWidth: { true: '', false: '' },\n    overflow: {\n      true: 'w-full min-w-0 *:data-overflow-hidden:hidden data-measuring:flex data-measuring:w-max data-measuring:*:grow-0',\n      false: '',\n    },\n  },\n  compoundVariants: [\n    { variant: 'connected', fullWidth: true, class: 'w-full' },\n    { variant: 'connected', fullWidth: false, overflow: false, class: 'inline-grid w-fit' },\n    { variant: 'standard', overflow: true, class: 'flex' },\n    // XS and S: the spec's 18 / 12px, growing as density shrinks the icon buttons (their\n    // default widths: XS max(24px, 32px + 4px a step), S 40px + 4px a step), so neighbouring\n    // centres stay 48px apart and their 48px touch targets never overlap (2026-10-15). A\n    // group holding a narrow icon button spaces by the narrow width instead (XS max(24px,\n    // 28px + 4px a step), S max(28px, 32px + 4px a step), M 48px + 4px a step), so the gap is\n    // max(spec, 48px − narrow width) (2026-10-17). The gap is a variable, so a consumer `gap-*`\n    // still replaces it.\n    {\n      variant: 'standard',\n      size: 'xs',\n      class: [\n        'gap-(--m3-button-group-gap)',\n        '[--m3-button-group-gap:max(18px,calc(48px-max(24px,calc(32px+var(--md-sys-density,0)*4px))))]',\n        'has-[[data-tokens~=md-comp-icon-button][data-width=narrow]]:[--m3-button-group-gap:max(18px,calc(48px-max(24px,calc(28px+var(--md-sys-density,0)*4px))))]',\n      ],\n    },\n    {\n      variant: 'standard',\n      size: 'sm',\n      class: [\n        'gap-(--m3-button-group-gap)',\n        '[--m3-button-group-gap:max(12px,calc(8px-var(--md-sys-density,0)*4px))]',\n        'has-[[data-tokens~=md-comp-icon-button][data-width=narrow]]:[--m3-button-group-gap:max(12px,calc(48px-max(28px,calc(32px+var(--md-sys-density,0)*4px))))]',\n      ],\n    },\n    {\n      variant: 'standard',\n      size: 'md',\n      class: [\n        'gap-(--m3-button-group-gap) [--m3-button-group-gap:8px]',\n        'has-[[data-tokens~=md-comp-icon-button][data-width=narrow]]:[--m3-button-group-gap:max(8px,calc(var(--md-sys-density,0)*-4px))]',\n      ],\n    },\n    { variant: 'standard', size: ['lg', 'xl'], class: 'gap-[8px]' },\n  ],\n  defaultVariants: { variant: 'standard', size: 'sm', overflow: false },\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuBA,MAAa,oBAAoB,GAAG;CAClC,MAAM;CACN,UAAU;EACR,SAAS;GACP,UAAU;GACV,WAAW;EACb;EACA,MAAM;GAAE,IAAI;GAAI,IAAI;GAAI,IAAI;GAAI,IAAI;GAAI,IAAI;EAAG;EAC/C,WAAW;GAAE,MAAM;GAAI,OAAO;EAAG;EACjC,UAAU;GACR,MAAM;GACN,OAAO;EACT;CACF;CACA,kBAAkB;EAChB;GAAE,SAAS;GAAa,WAAW;GAAM,OAAO;EAAS;EACzD;GAAE,SAAS;GAAa,WAAW;GAAO,UAAU;GAAO,OAAO;EAAoB;EACtF;GAAE,SAAS;GAAY,UAAU;GAAM,OAAO;EAAO;EAQrD;GACE,SAAS;GACT,MAAM;GACN,OAAO;IACL;IACA;IACA;GACF;EACF;EACA;GACE,SAAS;GACT,MAAM;GACN,OAAO;IACL;IACA;IACA;GACF;EACF;EACA;GACE,SAAS;GACT,MAAM;GACN,OAAO,CACL,2DACA,iIACF;EACF;EACA;GAAE,SAAS;GAAY,MAAM,CAAC,MAAM,IAAI;GAAG,OAAO;EAAY;CAChE;CACA,iBAAiB;EAAE,SAAS;EAAY,MAAM;EAAM,UAAU;CAAM;AACtE,CAAC"}

package/dist/index.d.ts

@@ -48,7 +48,7 @@ import { snackbarTokenSet } from "./components/snackbar/snackbar-tokens.js";
 import { Badge, BadgeClassNames, BadgeLabels, BadgeProps, BadgedBox, BadgedBoxClassNames, BadgedBoxProps } from "./components/badge/Badge.js";
 import { NavItemLayout, navItemStyles } from "./components/navigation/nav-item-styles.js";
 import { NavItemClassNames } from "./components/navigation/NavItem.js";
-import { NavigationRail, NavigationRailClassNames, NavigationRailItem, NavigationRailItemProps, NavigationRailProps } from "./components/navigation/NavigationRail.js";
+import { NavigationRail, NavigationRailClassNames, NavigationRailItem, NavigationRailItemProps, NavigationRailProps, NavigationRailState, useNavigationRail } from "./components/navigation/NavigationRail.js";
 import { NavigationBarArrangement, NavigationBarStyleProps, navigationBarStyles, navigationRailStyles } from "./components/navigation/navigation-styles.js";
 import { NavigationBar, NavigationBarClassNames, NavigationBarItem, NavigationBarItemProps, NavigationBarProps } from "./components/navigation/NavigationBar.js";
 import { navBarTokenSet, navRailTokenSet } from "./components/navigation/navigation-tokens.js";
@@ -137,6 +137,8 @@ import { DateField, DateFieldClassNames, DateFieldLabels, DateFieldProps } from
 import { PickerDialog, PickerDialogClassNames, PickerDialogLabels, PickerDialogProps } from "./components/date-picker/PickerDialog.js";
 import { pickerDialogStyles } from "./components/date-picker/picker-dialog-styles.js";
 import { TimePicker, TimePickerClassNames, TimePickerLabels, TimePickerMode, TimePickerModeToggle, TimePickerModeToggleProps, TimePickerProps, useTimePickerRoom } from "./components/time-picker/TimePicker.js";
+import { TimeField, TimeFieldClassNames, TimeFieldLabels, TimeFieldProps } from "./components/time-picker/TimeField.js";
 import { TimePickerStyleProps, timePickerStyles } from "./components/time-picker/time-picker-styles.js";
 import { timePickerTokenSet } from "./components/time-picker/time-picker-tokens.js";
-export { AssistChip, type AssistChipProps, Autocomplete, type AutocompleteClassNames, AutocompleteItem, type AutocompleteKey, type AutocompleteLabels, type AutocompleteProps, AutocompleteSection, BREAKPOINTS, BREAKPOINT_NAMES, BUILT_IN_THEMES, BUILT_IN_THEME_NAMES, Badge, type BadgeClassNames, type BadgeLabels, type BadgeProps, type BadgeStyleProps, BadgedBox, type BadgedBoxClassNames, type BadgedBoxProps, BottomSheet, type BottomSheetClassNames, type BottomSheetDetent, type BottomSheetLabels, type BottomSheetProps, type BottomSheetStyleProps, BreakpointName, BuiltInThemeName, Button, type ButtonActionProps, type ButtonClassNames, ButtonContext, type ButtonContextValue, ButtonGroup, type ButtonGroupClassNames, type ButtonGroupLabels, type ButtonGroupProps, type ButtonGroupSelectionMode, type ButtonGroupVariant, type ButtonLabels, type ButtonLinkProps, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonStyleProps, type ButtonToggleProps, type ButtonVariant, COLOR_MODES, COLOR_ROLES, CONTRAST_LEVELS, CONTRAST_LEVEL_NAMES, CORNERS, CORNER_NAMES, CUSTOM_COLORS, CUSTOM_COLOR_ROLES, Card, type CardActionProps, type CardLinkProps, type CardProps, type CardStaticProps, type CardStyleProps, type CardVariant, Carousel, type CarouselClassNames, type CarouselProps, type CarouselStyleProps, Checkbox, type CheckboxClassNames, type CheckboxProps, type CheckboxStyleProps, type ChipClassNames, type ChipLabels, type ChipOutline, ChipSet, type ChipSetClassNames, type ChipSetLayout, type ChipSetProps, type ChipStyleProps, CircularProgressIndicator, type CircularProgressIndicatorClassNames, type CircularProgressIndicatorProps, type CircularProgressStyleProps, type ClosedBy, ColorMode, ColorRole, type ComponentToken, type ComponentTokenScope, type ComponentTokenSet, ContextMenuTrigger, type ContextMenuTriggerProps, ContrastLevel, CornerName, type CreateThemeOptions, CustomColorName, DEFAULT_CUSTOM_COLORS, DEFAULT_DENSITY, DEFAULT_MOTION_SCHEME, DEFAULT_STORAGE_KEY, DEFAULT_THEME, DEFAULT_THEME_STATE, DENSITIES, DateField, type DateFieldClassNames, type DateFieldLabels, type DateFieldProps, type DateInputLabels, DatePicker, type DatePickerClassNames, type DatePickerLabels, type DatePickerProps, type DatePickerStyleProps, type DateRange, DateRangePicker, type DateRangePickerClassNames, type DateRangePickerProps, Density, Dialog, DialogActions, type DialogActionsProps, type DialogClassNames, DialogContent, type DialogContentProps, type DialogFullScreen, DialogHeader, type DialogHeaderClassNames, type DialogHeaderLabels, type DialogHeaderProps, type DialogOrigin, type DialogPlacement, type DialogProps, type DialogRenderProps, type DialogStyleProps, DialogTitle, type DialogTitleProps, type DialogTransition, DialogTrigger, type DialogTriggerProps, Divider, type DividerInset, type DividerOrientation, type DividerProps, type DividerStyleProps, DockedToolbar, type DockedToolbarArrangement, type DockedToolbarClassNames, type DockedToolbarColor, type DockedToolbarProps, type DockedToolbarStyleProps, ELEVATION_LEVELS, ELEVATION_LEVEL_NAMES, ElevationLevel, ExtendedFab, type ExtendedFabClassNames, type ExtendedFabProps, type ExtendedFabSize, type ExtendedFabStyleProps, FOCUS_INDICATOR, Fab, type FabClassNames, type FabColor, type FabElevation, FabMenu, type FabMenuClassNames, type FabMenuColor, FabMenuItem, type FabMenuItemClassNames, type FabMenuItemProps, type FabMenuPresentation, type FabMenuProps, type FabMenuSize, type FabMenuStyleProps, type FabProps, type FabSize, type FabStyleProps, FilterChip, type FilterChipClassNames, type FilterChipProps, FloatingToolbar, type FloatingToolbarClassNames, type FloatingToolbarColor, type FloatingToolbarProps, type FloatingToolbarStyleProps, IconButton, type IconButtonActionProps, type IconButtonClassNames, type IconButtonLinkProps, type IconButtonProps, type IconButtonStyleProps, type IconButtonToggleProps, type IconButtonVariant, type IconButtonWidth, type IconTransition, InputChip, type InputChipClassNames, type InputChipProps, LEGACY_DURATIONS, LEGACY_EASINGS, LabeledDivider, type LabeledDividerClassNames, type LabeledDividerProps, type LineLimit, LinearProgressIndicator, type LinearProgressIndicatorClassNames, type LinearProgressIndicatorProps, type LinearProgressStyleProps, List, type ListClassNames, type ListDividers, ListItem, ListItemAvatar, type ListItemAvatarProps, ListItemImage, type ListItemImageProps, type ListItemProps, ListItemVideo, type ListItemVideoProps, type ListProps, ListSection, type ListSectionProps, type ListStyleProps, type ListVariant, LoadingIndicator, type LoadingIndicatorClassNames, type LoadingIndicatorProps, type LoadingIndicatorStyleProps, type LoadingIndicatorVariant, MOTION_SCHEMES, Menu, type MenuClassNames, MenuGroup, type MenuGroupProps, MenuItem, type MenuItemProps, type Key as MenuKey, type MenuLabels, type MenuLayout, type MenuPlacement, type MenuPresentation, type MenuProps, type MenuStyleProps, MenuTrigger, type MenuTriggerProps, type MenuVariant, MotionScheme, MotionSpring, type NavItemClassNames, type NavItemLayout, NavigationBar, type NavigationBarArrangement, type NavigationBarClassNames, NavigationBarItem, type NavigationBarItemProps, type NavigationBarProps, type NavigationBarStyleProps, NavigationRail, type NavigationRailClassNames, NavigationRailItem, type NavigationRailItemProps, type NavigationRailProps, type OptionItemProps, OptionPopover, type OptionSectionProps, PALETTE_NAMES, PaletteName, PaletteSource, PickerDialog, type PickerDialogClassNames, type PickerDialogLabels, type PickerDialogProps, type PublicComponentToken, PullToRefresh, type PullToRefreshClassNames, type PullToRefreshLabels, type PullToRefreshProps, Radio, type RadioClassNames, RadioGroup, type RadioGroupClassNames, type RadioGroupProps, type RadioGroupStyleProps, type RadioProps, type RadioStyleProps, RangeSlider, type RangeSliderLabels, type RangeSliderProps, ResolvedColorMode, RichTooltip, type RichTooltipClassNames, type RichTooltipProps, type RichTooltipStyleProps, RichTooltipTrigger, type RichTooltipTriggerProps, SCHEME_VARIANTS, SHADOW_AMBIENT_OPACITY, SHADOW_KEY_OPACITY, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, STATE_OPACITIES, SchemeVariant, SearchAppBar, type SearchAppBarClassNames, type SearchAppBarProps, type SearchAppBarStyleProps, SearchBar, type SearchBarClassNames, type SearchBarIconState, type SearchBarInputProps, type SearchBarProps, type SearchBarStyleProps, type SearchBarView, Select, type SelectClassNames, SelectItem, type SelectKey, type SelectLabels, type SelectPresentation, type SelectProps, SelectSection, type SelectedOption, SheetTrigger, type SheetTriggerProps, type ShowSnackbarOptions, SideSheet, type SideSheetClassNames, type SideSheetLabels, type SideSheetProps, type SideSheetStyleProps, Slider, type SliderClassNames, type SliderOrientation, type SliderProps, type SliderSize, type SliderStyleProps, Snackbar, type SnackbarClassNames, type SnackbarData, type SnackbarDuration, SnackbarHost, type SnackbarHostProps, SnackbarHostState, type SnackbarLabels, type SnackbarProps, type SnackbarResult, type SnackbarStyleProps, type SnackbarVisuals, SplitButton, type SplitButtonClassNames, type SplitButtonLabels, type SplitButtonProps, type SplitButtonSize, type SplitButtonStyleProps, type SplitButtonVariant, SpringFamily, SpringSpeed, SpringToken, StateName, SubmenuTrigger, type SubmenuTriggerProps, SuggestionChip, type SuggestionChipProps, Switch, type SwitchClassNames, type SwitchProps, type SwitchStyleProps, TYPEFACES, TYPE_ROLES, TYPE_SCALE, Tab, type TabProps, Tabs, type TabsClassNames, type TabsProps, type TabsStyleProps, type TabsVariant, TextField, type TextFieldClassNames, type TextFieldLabels, type TextFieldProps, type TextFieldStyleProps, type TextFieldVariant, type ThemeContextValue, type ThemeDefinition, ThemePalettes, ThemeProvider, type ThemeProviderProps, ThemeScope, type ThemeScopeProps, ThemeScript, type ThemeScriptProps, ThemeSeed, type ThemeState, type ThemeStorage, TimePicker, type TimePickerClassNames, type TimePickerLabels, type TimePickerMode, TimePickerModeToggle, type TimePickerModeToggleProps, type TimePickerProps, type TimePickerStyleProps, ToggleGroupStateContext, type TokenPaints, type TokenValue, type ToolbarExitEdge, ToolbarFab, type ToolbarFabClassNames, type ToolbarFabProps, type ToolbarOrientation, type ToolbarScrollExitOptions, type ToolbarScrollExpansionOptions, Tooltip, type TooltipClassNames, type TooltipPlacement, TooltipPlacementContext, type TooltipProps, TooltipTrigger, type TooltipTriggerProps, TopAppBar, type TopAppBarClassNames, type TopAppBarProps, type TopAppBarScrollBehavior, type TopAppBarScrolledColor, type TopAppBarStyleProps, type TopAppBarTitleAlign, type TopAppBarVariant, TypeRole, TypeStyle, Typeface, type VariantProps, ZIndexName, Z_INDEX, appBarTokenSet, assistChipTokenSet, badgeStyles, badgeTokenSet, badgedBoxStyles, bottomSheetStyles, bottomSheetTokenSet, buttonGroupStyles, buttonStyles, buttonTokenSet, buttonVariantClasses, cardStyles, cardTokenSet, carouselStyles, carouselTokenSet, checkboxStyles, checkboxTokenSet, chipSetStyles, chipStyles, circularProgressStyles, cn, color, colorAt, componentTokenList, componentTokensCss, corner, createTheme, datePickerStyles, datePickerTokenSet, defineComponentTokens, densityAttribute, dialogStyles, dialogTokenSet, dividerStyles, dividerTokenSet, dockedDatePickerStyles, dockedToolbarStyles, dockedToolbarTokenSet, elevation, extendedFabStyles, extendedFabTokenSet, fabMenuStyles, fabMenuTokenSet, fabStyles, fabTokenSet, filterChipTokenSet, floatingToolbarStyles, floatingToolbarTokenSet, getM3Spring, getThemeScriptSource, iconButtonStyles, iconButtonTokenSet, inputChipTokenSet, isComponentTokenSet, isDensity, labeledDividerStyles, linearProgressStyles, listMediaStyles, listStyles, listTokenSet, loadingIndicatorStyles, loadingIndicatorTokenSet, matchesSearch, menuStyles, menuTokenSet, navBarTokenSet, navItemStyles, navRailTokenSet, navigationBarStyles, navigationRailStyles, normalizeSearch, parseThemeState, pickerDialogStyles, plainTooltipTokenSet, progressIndicatorTokenSet, pullToRefreshStyles, px, radioGroupStyles, radioStyles, radioTokenSet, richTooltipStyles, richTooltipTokenSet, searchAppBarStyles, searchBarStyles, searchBarTokenSet, searchViewTokenSet, serializeThemeState, sideSheetStyles, sideSheetTokenSet, sliderStyles, sliderTokenSet, snackbarHostStyles, snackbarStyles, snackbarTokenSet, splitButtonStyles, splitButtonTokenSet, spring, springPosition, springSettleDuration, springToLinearEasing, suggestionChipTokenSet, switchStyles, switchTokenSet, tabsStyles, tabsTokenSet, textFieldStyles, textFieldTokenSet, themeAttributes, timePickerStyles, timePickerTokenSet, toMotionSpring, toolbarFabStyles, toolbarFabTokenSet, tooltipStyles, topAppBarStyles, tv, twMergeConfig, typeTokens, typescale, useM3Spring, useSnackbarHostState, useTheme, useThemeScope, useTimePickerRoom, useToolbarScrollExit, useToolbarScrollExpansion };
+import { Time, parseTime } from "@internationalized/date";
+export { AssistChip, type AssistChipProps, Autocomplete, type AutocompleteClassNames, AutocompleteItem, type AutocompleteKey, type AutocompleteLabels, type AutocompleteProps, AutocompleteSection, BREAKPOINTS, BREAKPOINT_NAMES, BUILT_IN_THEMES, BUILT_IN_THEME_NAMES, Badge, type BadgeClassNames, type BadgeLabels, type BadgeProps, type BadgeStyleProps, BadgedBox, type BadgedBoxClassNames, type BadgedBoxProps, BottomSheet, type BottomSheetClassNames, type BottomSheetDetent, type BottomSheetLabels, type BottomSheetProps, type BottomSheetStyleProps, BreakpointName, BuiltInThemeName, Button, type ButtonActionProps, type ButtonClassNames, ButtonContext, type ButtonContextValue, ButtonGroup, type ButtonGroupClassNames, type ButtonGroupLabels, type ButtonGroupProps, type ButtonGroupSelectionMode, type ButtonGroupVariant, type ButtonLabels, type ButtonLinkProps, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonStyleProps, type ButtonToggleProps, type ButtonVariant, COLOR_MODES, COLOR_ROLES, CONTRAST_LEVELS, CONTRAST_LEVEL_NAMES, CORNERS, CORNER_NAMES, CUSTOM_COLORS, CUSTOM_COLOR_ROLES, Card, type CardActionProps, type CardLinkProps, type CardProps, type CardStaticProps, type CardStyleProps, type CardVariant, Carousel, type CarouselClassNames, type CarouselProps, type CarouselStyleProps, Checkbox, type CheckboxClassNames, type CheckboxProps, type CheckboxStyleProps, type ChipClassNames, type ChipLabels, type ChipOutline, ChipSet, type ChipSetClassNames, type ChipSetLayout, type ChipSetProps, type ChipStyleProps, CircularProgressIndicator, type CircularProgressIndicatorClassNames, type CircularProgressIndicatorProps, type CircularProgressStyleProps, type ClosedBy, ColorMode, ColorRole, type ComponentToken, type ComponentTokenScope, type ComponentTokenSet, ContextMenuTrigger, type ContextMenuTriggerProps, ContrastLevel, CornerName, type CreateThemeOptions, CustomColorName, DEFAULT_CUSTOM_COLORS, DEFAULT_DENSITY, DEFAULT_MOTION_SCHEME, DEFAULT_STORAGE_KEY, DEFAULT_THEME, DEFAULT_THEME_STATE, DENSITIES, DateField, type DateFieldClassNames, type DateFieldLabels, type DateFieldProps, type DateInputLabels, DatePicker, type DatePickerClassNames, type DatePickerLabels, type DatePickerProps, type DatePickerStyleProps, type DateRange, DateRangePicker, type DateRangePickerClassNames, type DateRangePickerProps, Density, Dialog, DialogActions, type DialogActionsProps, type DialogClassNames, DialogContent, type DialogContentProps, type DialogFullScreen, DialogHeader, type DialogHeaderClassNames, type DialogHeaderLabels, type DialogHeaderProps, type DialogOrigin, type DialogPlacement, type DialogProps, type DialogRenderProps, type DialogStyleProps, DialogTitle, type DialogTitleProps, type DialogTransition, DialogTrigger, type DialogTriggerProps, Divider, type DividerInset, type DividerOrientation, type DividerProps, type DividerStyleProps, DockedToolbar, type DockedToolbarArrangement, type DockedToolbarClassNames, type DockedToolbarColor, type DockedToolbarProps, type DockedToolbarStyleProps, ELEVATION_LEVELS, ELEVATION_LEVEL_NAMES, ElevationLevel, ExtendedFab, type ExtendedFabClassNames, type ExtendedFabProps, type ExtendedFabSize, type ExtendedFabStyleProps, FOCUS_INDICATOR, Fab, type FabClassNames, type FabColor, type FabElevation, FabMenu, type FabMenuClassNames, type FabMenuColor, FabMenuItem, type FabMenuItemClassNames, type FabMenuItemProps, type FabMenuPresentation, type FabMenuProps, type FabMenuSize, type FabMenuStyleProps, type FabProps, type FabSize, type FabStyleProps, FilterChip, type FilterChipClassNames, type FilterChipProps, FloatingToolbar, type FloatingToolbarClassNames, type FloatingToolbarColor, type FloatingToolbarProps, type FloatingToolbarStyleProps, IconButton, type IconButtonActionProps, type IconButtonClassNames, type IconButtonLinkProps, type IconButtonProps, type IconButtonStyleProps, type IconButtonToggleProps, type IconButtonVariant, type IconButtonWidth, type IconTransition, InputChip, type InputChipClassNames, type InputChipProps, LEGACY_DURATIONS, LEGACY_EASINGS, LabeledDivider, type LabeledDividerClassNames, type LabeledDividerProps, type LineLimit, LinearProgressIndicator, type LinearProgressIndicatorClassNames, type LinearProgressIndicatorProps, type LinearProgressStyleProps, List, type ListClassNames, type ListDividers, ListItem, ListItemAvatar, type ListItemAvatarProps, ListItemImage, type ListItemImageProps, type ListItemProps, ListItemVideo, type ListItemVideoProps, type ListProps, ListSection, type ListSectionProps, type ListStyleProps, type ListVariant, LoadingIndicator, type LoadingIndicatorClassNames, type LoadingIndicatorProps, type LoadingIndicatorStyleProps, type LoadingIndicatorVariant, MOTION_SCHEMES, Menu, type MenuClassNames, MenuGroup, type MenuGroupProps, MenuItem, type MenuItemProps, type Key as MenuKey, type MenuLabels, type MenuLayout, type MenuPlacement, type MenuPresentation, type MenuProps, type MenuStyleProps, MenuTrigger, type MenuTriggerProps, type MenuVariant, MotionScheme, MotionSpring, type NavItemClassNames, type NavItemLayout, NavigationBar, type NavigationBarArrangement, type NavigationBarClassNames, NavigationBarItem, type NavigationBarItemProps, type NavigationBarProps, type NavigationBarStyleProps, NavigationRail, type NavigationRailClassNames, NavigationRailItem, type NavigationRailItemProps, type NavigationRailProps, type NavigationRailState, type OptionItemProps, OptionPopover, type OptionSectionProps, PALETTE_NAMES, PaletteName, PaletteSource, PickerDialog, type PickerDialogClassNames, type PickerDialogLabels, type PickerDialogProps, type PublicComponentToken, PullToRefresh, type PullToRefreshClassNames, type PullToRefreshLabels, type PullToRefreshProps, Radio, type RadioClassNames, RadioGroup, type RadioGroupClassNames, type RadioGroupProps, type RadioGroupStyleProps, type RadioProps, type RadioStyleProps, RangeSlider, type RangeSliderLabels, type RangeSliderProps, ResolvedColorMode, RichTooltip, type RichTooltipClassNames, type RichTooltipProps, type RichTooltipStyleProps, RichTooltipTrigger, type RichTooltipTriggerProps, SCHEME_VARIANTS, SHADOW_AMBIENT_OPACITY, SHADOW_KEY_OPACITY, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, STATE_OPACITIES, SchemeVariant, SearchAppBar, type SearchAppBarClassNames, type SearchAppBarProps, type SearchAppBarStyleProps, SearchBar, type SearchBarClassNames, type SearchBarIconState, type SearchBarInputProps, type SearchBarProps, type SearchBarStyleProps, type SearchBarView, Select, type SelectClassNames, SelectItem, type SelectKey, type SelectLabels, type SelectPresentation, type SelectProps, SelectSection, type SelectedOption, SheetTrigger, type SheetTriggerProps, type ShowSnackbarOptions, SideSheet, type SideSheetClassNames, type SideSheetLabels, type SideSheetProps, type SideSheetStyleProps, Slider, type SliderClassNames, type SliderOrientation, type SliderProps, type SliderSize, type SliderStyleProps, Snackbar, type SnackbarClassNames, type SnackbarData, type SnackbarDuration, SnackbarHost, type SnackbarHostProps, SnackbarHostState, type SnackbarLabels, type SnackbarProps, type SnackbarResult, type SnackbarStyleProps, type SnackbarVisuals, SplitButton, type SplitButtonClassNames, type SplitButtonLabels, type SplitButtonProps, type SplitButtonSize, type SplitButtonStyleProps, type SplitButtonVariant, SpringFamily, SpringSpeed, SpringToken, StateName, SubmenuTrigger, type SubmenuTriggerProps, SuggestionChip, type SuggestionChipProps, Switch, type SwitchClassNames, type SwitchProps, type SwitchStyleProps, TYPEFACES, TYPE_ROLES, TYPE_SCALE, Tab, type TabProps, Tabs, type TabsClassNames, type TabsProps, type TabsStyleProps, type TabsVariant, TextField, type TextFieldClassNames, type TextFieldLabels, type TextFieldProps, type TextFieldStyleProps, type TextFieldVariant, type ThemeContextValue, type ThemeDefinition, ThemePalettes, ThemeProvider, type ThemeProviderProps, ThemeScope, type ThemeScopeProps, ThemeScript, type ThemeScriptProps, ThemeSeed, type ThemeState, type ThemeStorage, Time, TimeField, type TimeFieldClassNames, type TimeFieldLabels, type TimeFieldProps, TimePicker, type TimePickerClassNames, type TimePickerLabels, type TimePickerMode, TimePickerModeToggle, type TimePickerModeToggleProps, type TimePickerProps, type TimePickerStyleProps, ToggleGroupStateContext, type TokenPaints, type TokenValue, type ToolbarExitEdge, ToolbarFab, type ToolbarFabClassNames, type ToolbarFabProps, type ToolbarOrientation, type ToolbarScrollExitOptions, type ToolbarScrollExpansionOptions, Tooltip, type TooltipClassNames, type TooltipPlacement, TooltipPlacementContext, type TooltipProps, TooltipTrigger, type TooltipTriggerProps, TopAppBar, type TopAppBarClassNames, type TopAppBarProps, type TopAppBarScrollBehavior, type TopAppBarScrolledColor, type TopAppBarStyleProps, type TopAppBarTitleAlign, type TopAppBarVariant, TypeRole, TypeStyle, Typeface, type VariantProps, ZIndexName, Z_INDEX, appBarTokenSet, assistChipTokenSet, badgeStyles, badgeTokenSet, badgedBoxStyles, bottomSheetStyles, bottomSheetTokenSet, buttonGroupStyles, buttonStyles, buttonTokenSet, buttonVariantClasses, cardStyles, cardTokenSet, carouselStyles, carouselTokenSet, checkboxStyles, checkboxTokenSet, chipSetStyles, chipStyles, circularProgressStyles, cn, color, colorAt, componentTokenList, componentTokensCss, corner, createTheme, datePickerStyles, datePickerTokenSet, defineComponentTokens, densityAttribute, dialogStyles, dialogTokenSet, dividerStyles, dividerTokenSet, dockedDatePickerStyles, dockedToolbarStyles, dockedToolbarTokenSet, elevation, extendedFabStyles, extendedFabTokenSet, fabMenuStyles, fabMenuTokenSet, fabStyles, fabTokenSet, filterChipTokenSet, floatingToolbarStyles, floatingToolbarTokenSet, getM3Spring, getThemeScriptSource, iconButtonStyles, iconButtonTokenSet, inputChipTokenSet, isComponentTokenSet, isDensity, labeledDividerStyles, linearProgressStyles, listMediaStyles, listStyles, listTokenSet, loadingIndicatorStyles, loadingIndicatorTokenSet, matchesSearch, menuStyles, menuTokenSet, navBarTokenSet, navItemStyles, navRailTokenSet, navigationBarStyles, navigationRailStyles, normalizeSearch, parseThemeState, parseTime, pickerDialogStyles, plainTooltipTokenSet, progressIndicatorTokenSet, pullToRefreshStyles, px, radioGroupStyles, radioStyles, radioTokenSet, richTooltipStyles, richTooltipTokenSet, searchAppBarStyles, searchBarStyles, searchBarTokenSet, searchViewTokenSet, serializeThemeState, sideSheetStyles, sideSheetTokenSet, sliderStyles, sliderTokenSet, snackbarHostStyles, snackbarStyles, snackbarTokenSet, splitButtonStyles, splitButtonTokenSet, spring, springPosition, springSettleDuration, springToLinearEasing, suggestionChipTokenSet, switchStyles, switchTokenSet, tabsStyles, tabsTokenSet, textFieldStyles, textFieldTokenSet, themeAttributes, timePickerStyles, timePickerTokenSet, toMotionSpring, toolbarFabStyles, toolbarFabTokenSet, tooltipStyles, topAppBarStyles, tv, twMergeConfig, typeTokens, typescale, useM3Spring, useNavigationRail, useSnackbarHostState, useTheme, useThemeScope, useTimePickerRoom, useToolbarScrollExit, useToolbarScrollExpansion };

package/dist/index.js

@@ -48,7 +48,7 @@ import { badgeStyles, badgedBoxStyles } from "./components/badge/badge-styles.js
 import { Badge, BadgedBox } from "./components/badge/Badge.js";
 import { navItemStyles } from "./components/navigation/nav-item-styles.js";
 import { navigationBarStyles, navigationRailStyles } from "./components/navigation/navigation-styles.js";
-import { NavigationRail, NavigationRailItem } from "./components/navigation/NavigationRail.js";
+import { NavigationRail, NavigationRailItem, useNavigationRail } from "./components/navigation/NavigationRail.js";
 import { NavigationBar, NavigationBarItem } from "./components/navigation/NavigationBar.js";
 import { navBarTokenSet, navRailTokenSet } from "./components/navigation/navigation-tokens.js";
 import { tabsStyles } from "./components/tabs/tabs-styles.js";
@@ -132,5 +132,7 @@ import { pickerDialogStyles } from "./components/date-picker/picker-dialog-style
 import { PickerDialog } from "./components/date-picker/PickerDialog.js";
 import { timePickerStyles } from "./components/time-picker/time-picker-styles.js";
 import { TimePicker, TimePickerModeToggle, useTimePickerRoom } from "./components/time-picker/TimePicker.js";
+import { TimeField } from "./components/time-picker/TimeField.js";
 import { timePickerTokenSet } from "./components/time-picker/time-picker-tokens.js";
-export { AssistChip, Autocomplete, AutocompleteItem, AutocompleteSection, BREAKPOINTS, BREAKPOINT_NAMES, BUILT_IN_THEMES, BUILT_IN_THEME_NAMES, Badge, BadgedBox, BottomSheet, Button, ButtonContext, ButtonGroup, COLOR_MODES, COLOR_ROLES, CONTRAST_LEVELS, CONTRAST_LEVEL_NAMES, CORNERS, CORNER_NAMES, CUSTOM_COLORS, CUSTOM_COLOR_ROLES, Card, Carousel, Checkbox, ChipSet, CircularProgressIndicator, ContextMenuTrigger, DEFAULT_CUSTOM_COLORS, DEFAULT_DENSITY, DEFAULT_MOTION_SCHEME, DEFAULT_STORAGE_KEY, DEFAULT_THEME, DEFAULT_THEME_STATE, DENSITIES, DateField, DatePicker, DateRangePicker, Dialog, DialogActions, DialogContent, DialogHeader, DialogTitle, DialogTrigger, Divider, DockedToolbar, ELEVATION_LEVELS, ELEVATION_LEVEL_NAMES, ExtendedFab, FOCUS_INDICATOR, Fab, FabMenu, FabMenuItem, FilterChip, FloatingToolbar, IconButton, InputChip, LEGACY_DURATIONS, LEGACY_EASINGS, LabeledDivider, LinearProgressIndicator, List, ListItem, ListItemAvatar, ListItemImage, ListItemVideo, ListSection, LoadingIndicator, MOTION_SCHEMES, Menu, MenuGroup, MenuItem, MenuTrigger, NavigationBar, NavigationBarItem, NavigationRail, NavigationRailItem, OptionPopover, PALETTE_NAMES, PickerDialog, PullToRefresh, Radio, RadioGroup, RangeSlider, RichTooltip, RichTooltipTrigger, SCHEME_VARIANTS, SHADOW_AMBIENT_OPACITY, SHADOW_KEY_OPACITY, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, STATE_OPACITIES, SearchAppBar, SearchBar, Select, SelectItem, SelectSection, SheetTrigger, SideSheet, Slider, Snackbar, SnackbarHost, SnackbarHostState, SplitButton, SubmenuTrigger, SuggestionChip, Switch, TYPEFACES, TYPE_ROLES, TYPE_SCALE, Tab, Tabs, TextField, ThemeProvider, ThemeScope, ThemeScript, TimePicker, TimePickerModeToggle, ToggleGroupStateContext, ToolbarFab, Tooltip, TooltipPlacementContext, TooltipTrigger, TopAppBar, Z_INDEX, appBarTokenSet, assistChipTokenSet, badgeStyles, badgeTokenSet, badgedBoxStyles, bottomSheetStyles, bottomSheetTokenSet, buttonGroupStyles, buttonStyles, buttonTokenSet, buttonVariantClasses, cardStyles, cardTokenSet, carouselStyles, carouselTokenSet, checkboxStyles, checkboxTokenSet, chipSetStyles, chipStyles, circularProgressStyles, cn, color, colorAt, componentTokenList, componentTokensCss, corner, createTheme, datePickerStyles, datePickerTokenSet, defineComponentTokens, densityAttribute, dialogStyles, dialogTokenSet, dividerStyles, dividerTokenSet, dockedDatePickerStyles, dockedToolbarStyles, dockedToolbarTokenSet, elevation, extendedFabStyles, extendedFabTokenSet, fabMenuStyles, fabMenuTokenSet, fabStyles, fabTokenSet, filterChipTokenSet, floatingToolbarStyles, floatingToolbarTokenSet, getM3Spring, getThemeScriptSource, iconButtonStyles, iconButtonTokenSet, inputChipTokenSet, isComponentTokenSet, isDensity, labeledDividerStyles, linearProgressStyles, listMediaStyles, listStyles, listTokenSet, loadingIndicatorStyles, loadingIndicatorTokenSet, matchesSearch, menuStyles, menuTokenSet, navBarTokenSet, navItemStyles, navRailTokenSet, navigationBarStyles, navigationRailStyles, normalizeSearch, parseThemeState, pickerDialogStyles, plainTooltipTokenSet, progressIndicatorTokenSet, pullToRefreshStyles, px, radioGroupStyles, radioStyles, radioTokenSet, richTooltipStyles, richTooltipTokenSet, searchAppBarStyles, searchBarStyles, searchBarTokenSet, searchViewTokenSet, serializeThemeState, sideSheetStyles, sideSheetTokenSet, sliderStyles, sliderTokenSet, snackbarHostStyles, snackbarStyles, snackbarTokenSet, splitButtonStyles, splitButtonTokenSet, spring, springPosition, springSettleDuration, springToLinearEasing, suggestionChipTokenSet, switchStyles, switchTokenSet, tabsStyles, tabsTokenSet, textFieldStyles, textFieldTokenSet, themeAttributes, timePickerStyles, timePickerTokenSet, toMotionSpring, toolbarFabStyles, toolbarFabTokenSet, tooltipStyles, topAppBarStyles, tv, twMergeConfig, typeTokens, typescale, useM3Spring, useSnackbarHostState, useTheme, useThemeScope, useTimePickerRoom, useToolbarScrollExit, useToolbarScrollExpansion };
+import { Time, parseTime } from "@internationalized/date";
+export { AssistChip, Autocomplete, AutocompleteItem, AutocompleteSection, BREAKPOINTS, BREAKPOINT_NAMES, BUILT_IN_THEMES, BUILT_IN_THEME_NAMES, Badge, BadgedBox, BottomSheet, Button, ButtonContext, ButtonGroup, COLOR_MODES, COLOR_ROLES, CONTRAST_LEVELS, CONTRAST_LEVEL_NAMES, CORNERS, CORNER_NAMES, CUSTOM_COLORS, CUSTOM_COLOR_ROLES, Card, Carousel, Checkbox, ChipSet, CircularProgressIndicator, ContextMenuTrigger, DEFAULT_CUSTOM_COLORS, DEFAULT_DENSITY, DEFAULT_MOTION_SCHEME, DEFAULT_STORAGE_KEY, DEFAULT_THEME, DEFAULT_THEME_STATE, DENSITIES, DateField, DatePicker, DateRangePicker, Dialog, DialogActions, DialogContent, DialogHeader, DialogTitle, DialogTrigger, Divider, DockedToolbar, ELEVATION_LEVELS, ELEVATION_LEVEL_NAMES, ExtendedFab, FOCUS_INDICATOR, Fab, FabMenu, FabMenuItem, FilterChip, FloatingToolbar, IconButton, InputChip, LEGACY_DURATIONS, LEGACY_EASINGS, LabeledDivider, LinearProgressIndicator, List, ListItem, ListItemAvatar, ListItemImage, ListItemVideo, ListSection, LoadingIndicator, MOTION_SCHEMES, Menu, MenuGroup, MenuItem, MenuTrigger, NavigationBar, NavigationBarItem, NavigationRail, NavigationRailItem, OptionPopover, PALETTE_NAMES, PickerDialog, PullToRefresh, Radio, RadioGroup, RangeSlider, RichTooltip, RichTooltipTrigger, SCHEME_VARIANTS, SHADOW_AMBIENT_OPACITY, SHADOW_KEY_OPACITY, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, STATE_OPACITIES, SearchAppBar, SearchBar, Select, SelectItem, SelectSection, SheetTrigger, SideSheet, Slider, Snackbar, SnackbarHost, SnackbarHostState, SplitButton, SubmenuTrigger, SuggestionChip, Switch, TYPEFACES, TYPE_ROLES, TYPE_SCALE, Tab, Tabs, TextField, ThemeProvider, ThemeScope, ThemeScript, Time, TimeField, TimePicker, TimePickerModeToggle, ToggleGroupStateContext, ToolbarFab, Tooltip, TooltipPlacementContext, TooltipTrigger, TopAppBar, Z_INDEX, appBarTokenSet, assistChipTokenSet, badgeStyles, badgeTokenSet, badgedBoxStyles, bottomSheetStyles, bottomSheetTokenSet, buttonGroupStyles, buttonStyles, buttonTokenSet, buttonVariantClasses, cardStyles, cardTokenSet, carouselStyles, carouselTokenSet, checkboxStyles, checkboxTokenSet, chipSetStyles, chipStyles, circularProgressStyles, cn, color, colorAt, componentTokenList, componentTokensCss, corner, createTheme, datePickerStyles, datePickerTokenSet, defineComponentTokens, densityAttribute, dialogStyles, dialogTokenSet, dividerStyles, dividerTokenSet, dockedDatePickerStyles, dockedToolbarStyles, dockedToolbarTokenSet, elevation, extendedFabStyles, extendedFabTokenSet, fabMenuStyles, fabMenuTokenSet, fabStyles, fabTokenSet, filterChipTokenSet, floatingToolbarStyles, floatingToolbarTokenSet, getM3Spring, getThemeScriptSource, iconButtonStyles, iconButtonTokenSet, inputChipTokenSet, isComponentTokenSet, isDensity, labeledDividerStyles, linearProgressStyles, listMediaStyles, listStyles, listTokenSet, loadingIndicatorStyles, loadingIndicatorTokenSet, matchesSearch, menuStyles, menuTokenSet, navBarTokenSet, navItemStyles, navRailTokenSet, navigationBarStyles, navigationRailStyles, normalizeSearch, parseThemeState, parseTime, pickerDialogStyles, plainTooltipTokenSet, progressIndicatorTokenSet, pullToRefreshStyles, px, radioGroupStyles, radioStyles, radioTokenSet, richTooltipStyles, richTooltipTokenSet, searchAppBarStyles, searchBarStyles, searchBarTokenSet, searchViewTokenSet, serializeThemeState, sideSheetStyles, sideSheetTokenSet, sliderStyles, sliderTokenSet, snackbarHostStyles, snackbarStyles, snackbarTokenSet, splitButtonStyles, splitButtonTokenSet, spring, springPosition, springSettleDuration, springToLinearEasing, suggestionChipTokenSet, switchStyles, switchTokenSet, tabsStyles, tabsTokenSet, textFieldStyles, textFieldTokenSet, themeAttributes, timePickerStyles, timePickerTokenSet, toMotionSpring, toolbarFabStyles, toolbarFabTokenSet, tooltipStyles, topAppBarStyles, tv, twMergeConfig, typeTokens, typescale, useM3Spring, useNavigationRail, useSnackbarHostState, useTheme, useThemeScope, useTimePickerRoom, useToolbarScrollExit, useToolbarScrollExpansion };

package/dist/primitives/ButtonBase.js

@@ -136,6 +136,7 @@ function LinkBase({ ref, href, ...props }) {
 		...pendingAttributes(pending, domRest),
 		...element,
 		href: disabled ? void 0 : href,
+		...disabled && dom.role === void 0 && { role: "link" },
 		ref: domRef,
 		children: render(children, false)
 	});

package/dist/primitives/ButtonBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonBase.js","names":[],"sources":["../../src/primitives/ButtonBase.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  useContext,\n  useEffect,\n  type RefObject,\n  type ComponentPropsWithoutRef,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {\n  mergeProps,\n  mergeRefs,\n  useButton,\n  useLink,\n  useObjectRef,\n  useToggleButton,\n  useToggleButtonGroupItem,\n  type PressEvents,\n} from 'react-aria';\nimport { useToggleState, type ToggleGroupState } from 'react-stately';\nimport { TriggerContext, type TriggerContextValue } from './TriggerContext';\nimport { useM3Interaction } from './use-m3-interaction';\n\n/**\n * Selection state of an enclosing toggle group (e.g. a connected `ButtonGroup`). Toggle\n * buttons with a `value` inside it are selected through the group instead of on their own.\n */\nexport const ToggleGroupStateContext = createContext<ToggleGroupState | null>(null);\n\ntype PressHandlers = Pick<\n  PressEvents,\n  'onPress' | 'onPressStart' | 'onPressEnd' | 'onPressChange' | 'onPressUp'\n> & {\n  /** Don't move focus to the element on press (set by menu triggers). @default false */\n  preventFocusOnPress?: boolean;\n};\n\nexport interface ButtonBaseRenderState {\n  isSelected: boolean;\n}\n\ninterface ButtonBaseCommonProps extends PressHandlers {\n  /** Disables the element: it can't be pressed or focused, and shows the disabled style. @default false */\n  disabled?: boolean;\n  /** Classes for the root element, merged with `classNames.root`; consumer classes win. */\n  className?: string;\n  /** Inline styles for the root element. */\n  style?: CSSProperties;\n  /**\n   * The element is being dragged (e.g. a card picked up to move it): sets `data-dragged`\n   * for the dragged state layer. A consumer's own `data-dragged` attribute counts too.\n   * @default false\n   */\n  dragged?: boolean;\n  /** Content, or a function of the selection state (e.g. to swap a toggle's icon). */\n  children?: ReactNode | ((state: ButtonBaseRenderState) => ReactNode);\n}\n\n/**\n * The pending state `Button` and `IconButton` build on. It isn't part of the other props types,\n * so components that extend them (FABs, chips, cards) don't inherit it; pass it to `ButtonBase`\n * alongside them.\n */\nexport interface ButtonBasePendingProps {\n  /**\n   * An action started by the element is running: presses are blocked (`onPress`, `onClick`,\n   * Enter and Space do nothing, no hover or pressed state), but the element stays focusable and\n   * in the Tab order, unlike `disabled`. Sets `aria-disabled=\"true\"` and `data-pending`; a\n   * submit button renders `type=\"button\"` meanwhile, so the form isn't submitted again, and a\n   * link keeps its `href` with its navigation prevented. `disabled` wins when both are set.\n   * A toggle ignores it.\n   * @default false\n   */\n  pending?: boolean;\n}\n\ntype OwnKeys = keyof ButtonBaseCommonProps | 'color';\n\nexport interface ButtonBaseActionProps\n  extends ButtonBaseCommonProps, Omit<ComponentPropsWithoutRef<'button'>, OwnKeys> {\n  /** Ref to the root `<button>` element. */\n  ref?: Ref<HTMLButtonElement>;\n  /** The element rendered: a native `<button>`. @default \"button\" */\n  as?: 'button';\n  /**\n   * The value a submit button sends with its form, under its `name`. On a toggle (`toggle`)\n   * it's a `string` naming the button in a selection group instead, required to take part in\n   * the group's selection.\n   */\n  value?: ComponentPropsWithoutRef<'button'>['value'];\n  /** Renders a link (`<a>`) instead of a button. */\n  href?: undefined;\n  /** Makes the button a toggle (`aria-pressed`) with `selected` and `onSelectedChange`. @default false */\n  toggle?: false;\n}\n\n/**\n * A `div` with `role=\"button\"`, for pressable containers whose content a `<button>` may\n * not hold (headings, images, block layout), such as clickable cards.\n */\nexport interface ButtonBaseDivActionProps\n  extends ButtonBaseCommonProps, Omit<ComponentPropsWithoutRef<'div'>, OwnKeys> {\n  /** Ref to the root `<div>` element. */\n  ref?: Ref<HTMLDivElement>;\n  /** Renders a `div` with `role=\"button\"`, for content a `<button>` may not hold. */\n  as: 'div';\n  /** Renders a link (`<a>`) instead of a button. */\n  href?: undefined;\n  /** Makes the button a toggle (`aria-pressed`) with `selected` and `onSelectedChange`. @default false */\n  toggle?: false;\n}\n\nexport interface ButtonBaseLinkProps\n  extends ButtonBaseCommonProps, Omit<ComponentPropsWithoutRef<'a'>, OwnKeys | 'href'> {\n  /** Ref to the root `<a>` element. */\n  ref?: Ref<HTMLAnchorElement>;\n  /** Renders a link. Navigation goes through React Aria's `RouterProvider` when one is set. */\n  href: string;\n  /** Makes the button a toggle (`aria-pressed`) with `selected` and `onSelectedChange`. @default false */\n  toggle?: false;\n}\n\nexport interface ButtonBaseToggleProps\n  extends\n    ButtonBaseCommonProps,\n    Omit<ComponentPropsWithoutRef<'button'>, OwnKeys | 'aria-pressed' | 'onChange'> {\n  /** Ref to the root `<button>` element. */\n  ref?: Ref<HTMLButtonElement>;\n  /** Renders a link (`<a>`) instead of a button. */\n  href?: undefined;\n  /** Makes the button a toggle (`aria-pressed`). */\n  toggle: true;\n  /** Identifies the button in a selection group; required to take part in its selection. */\n  value?: string;\n  /** Controlled selection. Ignored inside a selection group. */\n  selected?: boolean;\n  /** Initial selection when uncontrolled. */\n  defaultSelected?: boolean;\n  /** Called with the new selection when the user toggles the button. */\n  onSelectedChange?: (selected: boolean) => void;\n}\n\nexport type ButtonBaseProps =\n  ButtonBaseActionProps | ButtonBaseDivActionProps | ButtonBaseLinkProps | ButtonBaseToggleProps;\n\nfunction splitProps<T extends ButtonBaseCommonProps & { pending?: boolean }>(props: T) {\n  const {\n    disabled = false,\n    pending: pendingProp = false,\n    className,\n    style,\n    children,\n    onPress,\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    onPressUp,\n    preventFocusOnPress,\n    dragged,\n    ...dom\n  } = props;\n  const consumerDragged = (dom as Record<string, unknown>)['data-dragged'];\n  // `disabled` wins: a disabled element is natively disabled even while its action runs.\n  const pending = pendingProp && !disabled;\n  return {\n    disabled,\n    pending,\n    /** Presses, hover and the pressed state are off: disabled, or pending. */\n    blocked: disabled || pending,\n    // Our `data-*` attributes are spread last, so a consumer's `data-dragged` feeds the state.\n    isDragged:\n      dragged ??\n      (consumerDragged !== undefined && consumerDragged !== false && consumerDragged !== 'false'),\n    element: { className, style },\n    children,\n    // React Aria options, not DOM attributes: they go to the press hooks.\n    press: { onPress, onPressStart, onPressEnd, onPressChange, onPressUp, preventFocusOnPress },\n    dom,\n  };\n}\n\n/**\n * While a submit button is pending it renders `type=\"button\"`, but a form left without a submit\n * button still submits on Enter in its only field (HTML's implicit submission). This stops a\n * submission with no submitter (or this button) before it reaches React or the browser, so\n * Enter doesn't send the form again; another submit button of the form still works.\n */\nfunction useBlockImplicitSubmit(ref: RefObject<HTMLElement | null>, enabled: boolean) {\n  useEffect(() => {\n    const button = ref.current;\n    const form = button instanceof HTMLButtonElement ? button.form : null;\n    if (!enabled || !form) return;\n    const block = (event: Event) => {\n      // A plain `Event` (no `submitter`) counts as implicit too.\n      const submitter = (event as Partial<SubmitEvent>).submitter;\n      if (submitter && submitter !== button) return;\n      event.preventDefault();\n      event.stopPropagation();\n    };\n    form.addEventListener('submit', block, true);\n    return () => form.removeEventListener('submit', block, true);\n  }, [ref, enabled]);\n}\n\n/** A pending element ignores clicks: a consumer's `onClick` is left out while it waits. */\nfunction withoutClickWhilePending<T extends { onClick?: unknown }>(dom: T, pending: boolean) {\n  if (!pending) return dom;\n  const { onClick: _onClick, ...rest } = dom;\n  return rest;\n}\n\n/**\n * What a pending element changes on top of the blocked hooks' props (React Aria's pending\n * `Button`): it stays focusable (React Aria's `isDisabled` would make a `<button>` natively\n * disabled and drop its tab stop), says it's unavailable with `aria-disabled`, and keeps the\n * enabled look (`data-disabled` only for `disabled`).\n */\nfunction pendingAttributes(pending: boolean, dom: { tabIndex?: number }) {\n  return pending\n    ? {\n        disabled: undefined,\n        tabIndex: dom.tabIndex ?? 0,\n        'aria-disabled': true as const,\n        'data-disabled': undefined,\n        'data-pending': true as const,\n      }\n    : {};\n}\n\nconst render = (children: ButtonBaseCommonProps['children'], isSelected: boolean) =>\n  typeof children === 'function' ? children({ isSelected }) : children;\n\nfunction ActionBase(\n  props: (ButtonBaseActionProps | ButtonBaseDivActionProps) & ButtonBasePendingProps,\n) {\n  const { ref, as: elementType = 'button', ...rest } = props;\n  const type =\n    elementType === 'button' ? ((rest as ButtonBaseActionProps).type ?? 'button') : undefined;\n  const { pending, blocked, isDragged, element, children, press, dom } = splitProps(rest);\n  const domRest = withoutClickWhilePending(dom, pending);\n  const domRef = useObjectRef(ref as Ref<HTMLElement>);\n  const { buttonProps, isPressed } = useButton(\n    { ...press, type, isDisabled: blocked, elementType },\n    domRef,\n  );\n  const { interactionProps, dataAttributes } = useM3Interaction(\n    { isDisabled: blocked, isPressed, isDragged },\n    domRef,\n  );\n  useBlockImplicitSubmit(domRef, pending && type === 'submit');\n  const elementProps = {\n    ...mergeProps(domRest, buttonProps, interactionProps),\n    ...dataAttributes,\n    ...pendingAttributes(pending, domRest),\n    // Enter in a form's field would submit it again through a pending submit button.\n    ...(pending && type === 'submit' ? { type: 'button' as const } : {}),\n    ...element,\n  };\n  return elementType === 'div' ? (\n    <div {...elementProps} ref={domRef as Ref<HTMLDivElement>}>\n      {render(children, false)}\n    </div>\n  ) : (\n    <button {...elementProps} ref={domRef as Ref<HTMLButtonElement>}>\n      {render(children, false)}\n    </button>\n  );\n}\n\nfunction LinkBase({ ref, href, ...props }: ButtonBaseLinkProps & ButtonBasePendingProps) {\n  const { disabled, pending, blocked, isDragged, element, children, press, dom } =\n    splitProps(props);\n  const domRest = withoutClickWhilePending(dom, pending);\n  const domRef = useObjectRef(ref);\n  const { linkProps, isPressed } = useLink(\n    // While blocked, the press hook prevents a click's navigation.\n    { ...press, href, isDisabled: blocked, elementType: 'a' },\n    domRef,\n  );\n  const { interactionProps, dataAttributes } = useM3Interaction(\n    { isDisabled: blocked, isPressed, isDragged },\n    domRef,\n  );\n  return (\n    <a\n      {...mergeProps(domRest, linkProps, interactionProps)}\n      {...dataAttributes}\n      {...pendingAttributes(pending, domRest)}\n      {...element}\n      // A pending link stays a link (role and tab stop); only a disabled one drops `href`.\n      href={disabled ? undefined : href}\n      ref={domRef}\n    >\n      {render(children, false)}\n    </a>\n  );\n}\n\nfunction ToggleBase({\n  ref,\n  type = 'button',\n  selected,\n  defaultSelected,\n  onSelectedChange,\n  toggle,\n  ...props\n}: ButtonBaseToggleProps) {\n  const { disabled, isDragged, element, children, press, dom } = splitProps(props);\n  const domRef = useObjectRef(ref);\n  const options = {\n    ...press,\n    type,\n    isDisabled: disabled,\n    isSelected: selected,\n    defaultSelected,\n    onChange: onSelectedChange,\n    elementType: 'button' as const,\n  };\n  const state = useToggleState(options);\n  const { buttonProps, isPressed, isSelected } = useToggleButton(options, state, domRef);\n  const { interactionProps, dataAttributes } = useM3Interaction(\n    { isDisabled: disabled, isPressed, isSelected, isDragged },\n    domRef,\n  );\n  return (\n    <button\n      {...mergeProps(dom, buttonProps, interactionProps)}\n      {...dataAttributes}\n      {...element}\n      ref={domRef}\n    >\n      {render(children, isSelected)}\n    </button>\n  );\n}\n\nfunction GroupItemBase({\n  ref,\n  type = 'button',\n  value,\n  state,\n  ...props\n}: Omit<ButtonBaseToggleProps, 'selected' | 'defaultSelected' | 'onSelectedChange' | 'toggle'> & {\n  value: string;\n  state: ToggleGroupState;\n}) {\n  const { disabled, isDragged, element, children, press, dom } = splitProps(props);\n  const domRef = useObjectRef(ref);\n  const { buttonProps, isPressed, isSelected } = useToggleButtonGroupItem(\n    { ...press, id: value, isDisabled: disabled, elementType: 'button' },\n    state,\n    domRef,\n  );\n  const { interactionProps, dataAttributes } = useM3Interaction(\n    { isDisabled: disabled || state.isDisabled, isPressed, isSelected, isDragged },\n    domRef,\n  );\n  return (\n    <button\n      {...mergeProps(dom, buttonProps, interactionProps)}\n      {...dataAttributes}\n      {...element}\n      type={type}\n      value={value}\n      ref={domRef}\n    >\n      {render(children, isSelected)}\n    </button>\n  );\n}\n\nfunction withTrigger(\n  props: ButtonBaseProps,\n  { ref: triggerRef, ...trigger }: TriggerContextValue,\n): ButtonBaseProps {\n  const merged = mergeProps(trigger, props) as ButtonBaseProps;\n  return {\n    ...merged,\n    ref: mergeRefs(props.ref as Ref<HTMLElement>, triggerRef as Ref<HTMLElement>),\n  } as ButtonBaseProps;\n}\n\n/**\n * Unstyled button behaviour shared by every button-like component: a `<button>`, a\n * link (`href`) or a toggle (`toggle`), with React Aria press, focus and keyboard\n * handling, and the M3 interaction `data-*` attributes and ripple origin from\n * `useM3Interaction`. DOM props pass through; `className` and `style` go on the element.\n * `pending` blocks presses but keeps focus (see {@link ButtonBasePendingProps}).\n */\nexport function ButtonBase(ownProps: ButtonBaseProps & ButtonBasePendingProps) {\n  const groupState = useContext(ToggleGroupStateContext);\n  const trigger = useContext(TriggerContext);\n  // An enclosing overlay trigger adds its press handler (chained), ARIA attributes and ref.\n  const props = trigger ? withTrigger(ownProps, trigger) : ownProps;\n  if (props.href !== undefined) return <LinkBase {...props} />;\n  if (props.toggle) {\n    if (groupState && props.value !== undefined) {\n      const { selected, defaultSelected, onSelectedChange, toggle, value, ...item } = props;\n      if (\n        process.env.NODE_ENV !== 'production' &&\n        (selected !== undefined || defaultSelected !== undefined || onSelectedChange)\n      ) {\n        console.warn(\n          `[@windmorph/react] Toggle \"${value}\" is inside a selection group; use the group's selectedKeys instead of selected / onSelectedChange.`,\n        );\n      }\n      return <GroupItemBase {...item} value={value} state={groupState} />;\n    }\n    return <ToggleBase {...props} />;\n  }\n  return <ActionBase {...props} />;\n}\n"],"mappings":"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"}
+{"version":3,"file":"ButtonBase.js","names":[],"sources":["../../src/primitives/ButtonBase.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  useContext,\n  useEffect,\n  type RefObject,\n  type ComponentPropsWithoutRef,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {\n  mergeProps,\n  mergeRefs,\n  useButton,\n  useLink,\n  useObjectRef,\n  useToggleButton,\n  useToggleButtonGroupItem,\n  type PressEvents,\n} from 'react-aria';\nimport { useToggleState, type ToggleGroupState } from 'react-stately';\nimport { TriggerContext, type TriggerContextValue } from './TriggerContext';\nimport { useM3Interaction } from './use-m3-interaction';\n\n/**\n * Selection state of an enclosing toggle group (e.g. a connected `ButtonGroup`). Toggle\n * buttons with a `value` inside it are selected through the group instead of on their own.\n */\nexport const ToggleGroupStateContext = createContext<ToggleGroupState | null>(null);\n\ntype PressHandlers = Pick<\n  PressEvents,\n  'onPress' | 'onPressStart' | 'onPressEnd' | 'onPressChange' | 'onPressUp'\n> & {\n  /** Don't move focus to the element on press (set by menu triggers). @default false */\n  preventFocusOnPress?: boolean;\n};\n\nexport interface ButtonBaseRenderState {\n  isSelected: boolean;\n}\n\ninterface ButtonBaseCommonProps extends PressHandlers {\n  /** Disables the element: it can't be pressed or focused, and shows the disabled style. @default false */\n  disabled?: boolean;\n  /** Classes for the root element, merged with `classNames.root`; consumer classes win. */\n  className?: string;\n  /** Inline styles for the root element. */\n  style?: CSSProperties;\n  /**\n   * The element is being dragged (e.g. a card picked up to move it): sets `data-dragged`\n   * for the dragged state layer. A consumer's own `data-dragged` attribute counts too.\n   * @default false\n   */\n  dragged?: boolean;\n  /** Content, or a function of the selection state (e.g. to swap a toggle's icon). */\n  children?: ReactNode | ((state: ButtonBaseRenderState) => ReactNode);\n}\n\n/**\n * The pending state `Button` and `IconButton` build on. It isn't part of the other props types,\n * so components that extend them (FABs, chips, cards) don't inherit it; pass it to `ButtonBase`\n * alongside them.\n */\nexport interface ButtonBasePendingProps {\n  /**\n   * An action started by the element is running: presses are blocked (`onPress`, `onClick`,\n   * Enter and Space do nothing, no hover or pressed state), but the element stays focusable and\n   * in the Tab order, unlike `disabled`. Sets `aria-disabled=\"true\"` and `data-pending`; a\n   * submit button renders `type=\"button\"` meanwhile, so the form isn't submitted again, and a\n   * link keeps its `href` with its navigation prevented. `disabled` wins when both are set.\n   * A toggle ignores it.\n   * @default false\n   */\n  pending?: boolean;\n}\n\ntype OwnKeys = keyof ButtonBaseCommonProps | 'color';\n\nexport interface ButtonBaseActionProps\n  extends ButtonBaseCommonProps, Omit<ComponentPropsWithoutRef<'button'>, OwnKeys> {\n  /** Ref to the root `<button>` element. */\n  ref?: Ref<HTMLButtonElement>;\n  /** The element rendered: a native `<button>`. @default \"button\" */\n  as?: 'button';\n  /**\n   * The value a submit button sends with its form, under its `name`. On a toggle (`toggle`)\n   * it's a `string` naming the button in a selection group instead, required to take part in\n   * the group's selection.\n   */\n  value?: ComponentPropsWithoutRef<'button'>['value'];\n  /** Renders a link (`<a>`) instead of a button. */\n  href?: undefined;\n  /** Makes the button a toggle (`aria-pressed`) with `selected` and `onSelectedChange`. @default false */\n  toggle?: false;\n}\n\n/**\n * A `div` with `role=\"button\"`, for pressable containers whose content a `<button>` may\n * not hold (headings, images, block layout), such as clickable cards.\n */\nexport interface ButtonBaseDivActionProps\n  extends ButtonBaseCommonProps, Omit<ComponentPropsWithoutRef<'div'>, OwnKeys> {\n  /** Ref to the root `<div>` element. */\n  ref?: Ref<HTMLDivElement>;\n  /** Renders a `div` with `role=\"button\"`, for content a `<button>` may not hold. */\n  as: 'div';\n  /** Renders a link (`<a>`) instead of a button. */\n  href?: undefined;\n  /** Makes the button a toggle (`aria-pressed`) with `selected` and `onSelectedChange`. @default false */\n  toggle?: false;\n}\n\nexport interface ButtonBaseLinkProps\n  extends ButtonBaseCommonProps, Omit<ComponentPropsWithoutRef<'a'>, OwnKeys | 'href'> {\n  /** Ref to the root `<a>` element. */\n  ref?: Ref<HTMLAnchorElement>;\n  /** Renders a link. Navigation goes through React Aria's `RouterProvider` when one is set. */\n  href: string;\n  /** Makes the button a toggle (`aria-pressed`) with `selected` and `onSelectedChange`. @default false */\n  toggle?: false;\n}\n\nexport interface ButtonBaseToggleProps\n  extends\n    ButtonBaseCommonProps,\n    Omit<ComponentPropsWithoutRef<'button'>, OwnKeys | 'aria-pressed' | 'onChange'> {\n  /** Ref to the root `<button>` element. */\n  ref?: Ref<HTMLButtonElement>;\n  /** Renders a link (`<a>`) instead of a button. */\n  href?: undefined;\n  /** Makes the button a toggle (`aria-pressed`). */\n  toggle: true;\n  /** Identifies the button in a selection group; required to take part in its selection. */\n  value?: string;\n  /** Controlled selection. Ignored inside a selection group. */\n  selected?: boolean;\n  /** Initial selection when uncontrolled. */\n  defaultSelected?: boolean;\n  /** Called with the new selection when the user toggles the button. */\n  onSelectedChange?: (selected: boolean) => void;\n}\n\nexport type ButtonBaseProps =\n  ButtonBaseActionProps | ButtonBaseDivActionProps | ButtonBaseLinkProps | ButtonBaseToggleProps;\n\nfunction splitProps<T extends ButtonBaseCommonProps & { pending?: boolean }>(props: T) {\n  const {\n    disabled = false,\n    pending: pendingProp = false,\n    className,\n    style,\n    children,\n    onPress,\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    onPressUp,\n    preventFocusOnPress,\n    dragged,\n    ...dom\n  } = props;\n  const consumerDragged = (dom as Record<string, unknown>)['data-dragged'];\n  // `disabled` wins: a disabled element is natively disabled even while its action runs.\n  const pending = pendingProp && !disabled;\n  return {\n    disabled,\n    pending,\n    /** Presses, hover and the pressed state are off: disabled, or pending. */\n    blocked: disabled || pending,\n    // Our `data-*` attributes are spread last, so a consumer's `data-dragged` feeds the state.\n    isDragged:\n      dragged ??\n      (consumerDragged !== undefined && consumerDragged !== false && consumerDragged !== 'false'),\n    element: { className, style },\n    children,\n    // React Aria options, not DOM attributes: they go to the press hooks.\n    press: { onPress, onPressStart, onPressEnd, onPressChange, onPressUp, preventFocusOnPress },\n    dom,\n  };\n}\n\n/**\n * While a submit button is pending it renders `type=\"button\"`, but a form left without a submit\n * button still submits on Enter in its only field (HTML's implicit submission). This stops a\n * submission with no submitter (or this button) before it reaches React or the browser, so\n * Enter doesn't send the form again; another submit button of the form still works.\n */\nfunction useBlockImplicitSubmit(ref: RefObject<HTMLElement | null>, enabled: boolean) {\n  useEffect(() => {\n    const button = ref.current;\n    const form = button instanceof HTMLButtonElement ? button.form : null;\n    if (!enabled || !form) return;\n    const block = (event: Event) => {\n      // A plain `Event` (no `submitter`) counts as implicit too.\n      const submitter = (event as Partial<SubmitEvent>).submitter;\n      if (submitter && submitter !== button) return;\n      event.preventDefault();\n      event.stopPropagation();\n    };\n    form.addEventListener('submit', block, true);\n    return () => form.removeEventListener('submit', block, true);\n  }, [ref, enabled]);\n}\n\n/** A pending element ignores clicks: a consumer's `onClick` is left out while it waits. */\nfunction withoutClickWhilePending<T extends { onClick?: unknown }>(dom: T, pending: boolean) {\n  if (!pending) return dom;\n  const { onClick: _onClick, ...rest } = dom;\n  return rest;\n}\n\n/**\n * What a pending element changes on top of the blocked hooks' props (React Aria's pending\n * `Button`): it stays focusable (React Aria's `isDisabled` would make a `<button>` natively\n * disabled and drop its tab stop), says it's unavailable with `aria-disabled`, and keeps the\n * enabled look (`data-disabled` only for `disabled`).\n */\nfunction pendingAttributes(pending: boolean, dom: { tabIndex?: number }) {\n  return pending\n    ? {\n        disabled: undefined,\n        tabIndex: dom.tabIndex ?? 0,\n        'aria-disabled': true as const,\n        'data-disabled': undefined,\n        'data-pending': true as const,\n      }\n    : {};\n}\n\nconst render = (children: ButtonBaseCommonProps['children'], isSelected: boolean) =>\n  typeof children === 'function' ? children({ isSelected }) : children;\n\nfunction ActionBase(\n  props: (ButtonBaseActionProps | ButtonBaseDivActionProps) & ButtonBasePendingProps,\n) {\n  const { ref, as: elementType = 'button', ...rest } = props;\n  const type =\n    elementType === 'button' ? ((rest as ButtonBaseActionProps).type ?? 'button') : undefined;\n  const { pending, blocked, isDragged, element, children, press, dom } = splitProps(rest);\n  const domRest = withoutClickWhilePending(dom, pending);\n  const domRef = useObjectRef(ref as Ref<HTMLElement>);\n  const { buttonProps, isPressed } = useButton(\n    { ...press, type, isDisabled: blocked, elementType },\n    domRef,\n  );\n  const { interactionProps, dataAttributes } = useM3Interaction(\n    { isDisabled: blocked, isPressed, isDragged },\n    domRef,\n  );\n  useBlockImplicitSubmit(domRef, pending && type === 'submit');\n  const elementProps = {\n    ...mergeProps(domRest, buttonProps, interactionProps),\n    ...dataAttributes,\n    ...pendingAttributes(pending, domRest),\n    // Enter in a form's field would submit it again through a pending submit button.\n    ...(pending && type === 'submit' ? { type: 'button' as const } : {}),\n    ...element,\n  };\n  return elementType === 'div' ? (\n    <div {...elementProps} ref={domRef as Ref<HTMLDivElement>}>\n      {render(children, false)}\n    </div>\n  ) : (\n    <button {...elementProps} ref={domRef as Ref<HTMLButtonElement>}>\n      {render(children, false)}\n    </button>\n  );\n}\n\nfunction LinkBase({ ref, href, ...props }: ButtonBaseLinkProps & ButtonBasePendingProps) {\n  const { disabled, pending, blocked, isDragged, element, children, press, dom } =\n    splitProps(props);\n  const domRest = withoutClickWhilePending(dom, pending);\n  const domRef = useObjectRef(ref);\n  const { linkProps, isPressed } = useLink(\n    // While blocked, the press hook prevents a click's navigation.\n    { ...press, href, isDisabled: blocked, elementType: 'a' },\n    domRef,\n  );\n  const { interactionProps, dataAttributes } = useM3Interaction(\n    { isDisabled: blocked, isPressed, isDragged },\n    domRef,\n  );\n  return (\n    <a\n      {...mergeProps(domRest, linkProps, interactionProps)}\n      {...dataAttributes}\n      {...pendingAttributes(pending, domRest)}\n      {...element}\n      // A pending link stays a link (role and tab stop); only a disabled one drops `href`, and\n      // keeps the role an `a` loses without one, so it can still be named.\n      href={disabled ? undefined : href}\n      {...(disabled && dom.role === undefined && { role: 'link' })}\n      ref={domRef}\n    >\n      {render(children, false)}\n    </a>\n  );\n}\n\nfunction ToggleBase({\n  ref,\n  type = 'button',\n  selected,\n  defaultSelected,\n  onSelectedChange,\n  toggle,\n  ...props\n}: ButtonBaseToggleProps) {\n  const { disabled, isDragged, element, children, press, dom } = splitProps(props);\n  const domRef = useObjectRef(ref);\n  const options = {\n    ...press,\n    type,\n    isDisabled: disabled,\n    isSelected: selected,\n    defaultSelected,\n    onChange: onSelectedChange,\n    elementType: 'button' as const,\n  };\n  const state = useToggleState(options);\n  const { buttonProps, isPressed, isSelected } = useToggleButton(options, state, domRef);\n  const { interactionProps, dataAttributes } = useM3Interaction(\n    { isDisabled: disabled, isPressed, isSelected, isDragged },\n    domRef,\n  );\n  return (\n    <button\n      {...mergeProps(dom, buttonProps, interactionProps)}\n      {...dataAttributes}\n      {...element}\n      ref={domRef}\n    >\n      {render(children, isSelected)}\n    </button>\n  );\n}\n\nfunction GroupItemBase({\n  ref,\n  type = 'button',\n  value,\n  state,\n  ...props\n}: Omit<ButtonBaseToggleProps, 'selected' | 'defaultSelected' | 'onSelectedChange' | 'toggle'> & {\n  value: string;\n  state: ToggleGroupState;\n}) {\n  const { disabled, isDragged, element, children, press, dom } = splitProps(props);\n  const domRef = useObjectRef(ref);\n  const { buttonProps, isPressed, isSelected } = useToggleButtonGroupItem(\n    { ...press, id: value, isDisabled: disabled, elementType: 'button' },\n    state,\n    domRef,\n  );\n  const { interactionProps, dataAttributes } = useM3Interaction(\n    { isDisabled: disabled || state.isDisabled, isPressed, isSelected, isDragged },\n    domRef,\n  );\n  return (\n    <button\n      {...mergeProps(dom, buttonProps, interactionProps)}\n      {...dataAttributes}\n      {...element}\n      type={type}\n      value={value}\n      ref={domRef}\n    >\n      {render(children, isSelected)}\n    </button>\n  );\n}\n\nfunction withTrigger(\n  props: ButtonBaseProps,\n  { ref: triggerRef, ...trigger }: TriggerContextValue,\n): ButtonBaseProps {\n  const merged = mergeProps(trigger, props) as ButtonBaseProps;\n  return {\n    ...merged,\n    ref: mergeRefs(props.ref as Ref<HTMLElement>, triggerRef as Ref<HTMLElement>),\n  } as ButtonBaseProps;\n}\n\n/**\n * Unstyled button behaviour shared by every button-like component: a `<button>`, a\n * link (`href`) or a toggle (`toggle`), with React Aria press, focus and keyboard\n * handling, and the M3 interaction `data-*` attributes and ripple origin from\n * `useM3Interaction`. DOM props pass through; `className` and `style` go on the element.\n * `pending` blocks presses but keeps focus (see {@link ButtonBasePendingProps}).\n */\nexport function ButtonBase(ownProps: ButtonBaseProps & ButtonBasePendingProps) {\n  const groupState = useContext(ToggleGroupStateContext);\n  const trigger = useContext(TriggerContext);\n  // An enclosing overlay trigger adds its press handler (chained), ARIA attributes and ref.\n  const props = trigger ? withTrigger(ownProps, trigger) : ownProps;\n  if (props.href !== undefined) return <LinkBase {...props} />;\n  if (props.toggle) {\n    if (groupState && props.value !== undefined) {\n      const { selected, defaultSelected, onSelectedChange, toggle, value, ...item } = props;\n      if (\n        process.env.NODE_ENV !== 'production' &&\n        (selected !== undefined || defaultSelected !== undefined || onSelectedChange)\n      ) {\n        console.warn(\n          `[@windmorph/react] Toggle \"${value}\" is inside a selection group; use the group's selectedKeys instead of selected / onSelectedChange.`,\n        );\n      }\n      return <GroupItemBase {...item} value={value} state={groupState} />;\n    }\n    return <ToggleBase {...props} />;\n  }\n  return <ActionBase {...props} />;\n}\n"],"mappings":"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"}

package/dist/primitives.d.ts

@@ -13,6 +13,7 @@ import { MaterialShapes } from "./shapes/material-shapes.js";
 import { Morph } from "./shapes/morph.js";
 import { M3MorphOptions, MorphShape, getMorph, morphPathAt } from "./primitives/morph-path.js";
 import { SelectionControl, SelectionControlClassNames, SelectionControlProps } from "./primitives/SelectionControl.js";
+import { closedByOverlayOptions } from "./utils/closed-by.js";
 import { M3InteractionDataAttributes, M3InteractionOptions, M3InteractionResult, M3InteractionState, useM3Interaction } from "./primitives/use-m3-interaction.js";
 import { Surface, SurfaceProps, SurfaceVariants, surfaceStyles } from "./primitives/Surface.js";
 import { Overlay, OverlayProps } from "./primitives/Overlay.js";
@@ -22,6 +23,8 @@ import { springProgressWithVelocity, springWithVelocityToLinearEasing } from "./
 import { selectionControlStyles } from "./primitives/selection-control-styles.js";
 import { TriggerContext, TriggerContextValue, useTriggerProps } from "./primitives/TriggerContext.js";
 import { usePresence } from "./primitives/use-presence.js";
+import { useRevealEntering } from "./components/menu/use-reveal-entering.js";
+import { toAriaPlacement } from "./utils/placement.js";
 import { DomDirectionLocale, DomDirectionLocaleProps } from "./primitives/DomDirectionLocale.js";
 import { localeWithDirection } from "./primitives/locale-with-direction.js";
 import { useM3Morph } from "./primitives/use-m3-morph.js";
@@ -33,4 +36,4 @@ import { materialShapeMask } from "./shapes/mask.js";
 import { materialShapePaths } from "./shapes/generated/material-shape-path-record.js";
 import { MorphPathOptions, PathOptions, cubicsToPath, morphToPath, polygonToPath } from "./shapes/path.js";
 import { circle, pill, pillStar, rectangle, star } from "./shapes/shapes.js";
-export { ButtonBase, type ButtonBaseActionProps, type ButtonBaseDivActionProps, type ButtonBaseLinkProps, type ButtonBasePendingProps, type ButtonBaseProps, type ButtonBaseRenderState, type ButtonBaseToggleProps, CharacterCounter, type CharacterCounterProps, CornerRounding, Cubic, type DescriptionAria, DomDirectionLocale, type DomDirectionLocaleProps, ErrorText, type ErrorTextProps, FieldErrorIcon, type FieldErrorIconProps, FieldLabel, type FieldLabelProps, type KeepPressedInPlaceResult, type M3InteractionDataAttributes, type M3InteractionOptions, type M3InteractionResult, type M3InteractionState, type M3MorphOptions, MaterialShapeName, type MaterialShapePath, MaterialShapes, Morph, type MorphPathOptions, type MorphShape, Overlay, type OverlayProps, type PathOptions, type PointTransformer, type RootDOMProps, RoundedPolygon, SelectionControl, type SelectionControlClassNames, type SelectionControlProps, type SplitRootProps, type SplitRootPropsOptions, SupportingText, type SupportingTextProps, Surface, type SurfaceProps, type SurfaceVariants, ThemeScopeContext, TouchTarget, type TouchTargetProps, TriggerContext, type TriggerContextValue, type WidgetAria, type WrapperRootDOMProps, archShape, arrowShape, boomShape, bunShape, burstShape, circle, circleShape, clamShellShape, clover4LeafShape, clover8LeafShape, cookie12SidedShape, cookie4SidedShape, cookie6SidedShape, cookie7SidedShape, cookie9SidedShape, cubicsToPath, diamondShape, fanShape, flowerShape, gemShape, generateSchemeColors, getM3Spring, getMorph, ghostishShape, heartShape, localeWithDirection, materialShapeMask, materialShapeNames, materialShapePaths, mergeDataTokens, morphPathAt, morphToPath, ovalShape, pentagonShape, pickDescriptionAria, pickWidgetAria, pill, pillShape, pillStar, pixelCircleShape, pixelTriangleShape, polygonToPath, puffyDiamondShape, puffyShape, rectangle, selectionControlStyles, semiCircleShape, slantedShape, softBoomShape, softBurstShape, splitDataAttributes, splitRootProps, springProgressWithVelocity, springWithVelocityToLinearEasing, squareShape, star, sunnyShape, surfaceStyles, triangleShape, useKeepPressedInPlace, useM3Interaction, useM3Morph, useM3Spring, usePresence, useTriggerProps, verySunnyShape };
+export { ButtonBase, type ButtonBaseActionProps, type ButtonBaseDivActionProps, type ButtonBaseLinkProps, type ButtonBasePendingProps, type ButtonBaseProps, type ButtonBaseRenderState, type ButtonBaseToggleProps, CharacterCounter, type CharacterCounterProps, CornerRounding, Cubic, type DescriptionAria, DomDirectionLocale, type DomDirectionLocaleProps, ErrorText, type ErrorTextProps, FieldErrorIcon, type FieldErrorIconProps, FieldLabel, type FieldLabelProps, type KeepPressedInPlaceResult, type M3InteractionDataAttributes, type M3InteractionOptions, type M3InteractionResult, type M3InteractionState, type M3MorphOptions, MaterialShapeName, type MaterialShapePath, MaterialShapes, Morph, type MorphPathOptions, type MorphShape, Overlay, type OverlayProps, type PathOptions, type PointTransformer, type RootDOMProps, RoundedPolygon, SelectionControl, type SelectionControlClassNames, type SelectionControlProps, type SplitRootProps, type SplitRootPropsOptions, SupportingText, type SupportingTextProps, Surface, type SurfaceProps, type SurfaceVariants, ThemeScopeContext, TouchTarget, type TouchTargetProps, TriggerContext, type TriggerContextValue, type WidgetAria, type WrapperRootDOMProps, archShape, arrowShape, boomShape, bunShape, burstShape, circle, circleShape, clamShellShape, closedByOverlayOptions, clover4LeafShape, clover8LeafShape, cookie12SidedShape, cookie4SidedShape, cookie6SidedShape, cookie7SidedShape, cookie9SidedShape, cubicsToPath, diamondShape, fanShape, flowerShape, gemShape, generateSchemeColors, getM3Spring, getMorph, ghostishShape, heartShape, localeWithDirection, materialShapeMask, materialShapeNames, materialShapePaths, mergeDataTokens, morphPathAt, morphToPath, ovalShape, pentagonShape, pickDescriptionAria, pickWidgetAria, pill, pillShape, pillStar, pixelCircleShape, pixelTriangleShape, polygonToPath, puffyDiamondShape, puffyShape, rectangle, selectionControlStyles, semiCircleShape, slantedShape, softBoomShape, softBurstShape, splitDataAttributes, splitRootProps, springProgressWithVelocity, springWithVelocityToLinearEasing, squareShape, star, sunnyShape, surfaceStyles, toAriaPlacement, triangleShape, useKeepPressedInPlace, useM3Interaction, useM3Morph, useM3Spring, usePresence, useRevealEntering, useTriggerProps, verySunnyShape };

package/dist/primitives.js

@@ -19,10 +19,13 @@ import { Morph } from "./shapes/morph.js";
 import { cubicsToPath, morphToPath, polygonToPath } from "./shapes/path.js";
 import { getMorph, morphPathAt } from "./primitives/morph-path.js";
 import { Overlay } from "./primitives/Overlay.js";
+import { toAriaPlacement } from "./utils/placement.js";
 import { pickDescriptionAria, pickWidgetAria, splitRootProps } from "./utils/root-props.js";
+import { useRevealEntering } from "./components/menu/use-reveal-entering.js";
 import { CharacterCounter, ErrorText, FieldErrorIcon, FieldLabel, SupportingText } from "./primitives/Field.js";
 import { selectionControlStyles } from "./primitives/selection-control-styles.js";
 import { SelectionControl } from "./primitives/SelectionControl.js";
+import { closedByOverlayOptions } from "./utils/closed-by.js";
 import { useKeepPressedInPlace } from "./utils/keep-pressed-in-place.js";
 import { springProgressWithVelocity, springWithVelocityToLinearEasing } from "./tokens/spring-velocity.js";
 import { Surface, surfaceStyles } from "./primitives/Surface.js";
@@ -31,4 +34,4 @@ import { splitDataAttributes } from "./utils/split-data-attributes.js";
 import { materialShapeMask } from "./shapes/mask.js";
 import { archShape, arrowShape, boomShape, bunShape, burstShape, circleShape, clamShellShape, clover4LeafShape, clover8LeafShape, cookie12SidedShape, cookie4SidedShape, cookie6SidedShape, cookie7SidedShape, cookie9SidedShape, diamondShape, fanShape, flowerShape, gemShape, ghostishShape, heartShape, materialShapeNames, ovalShape, pentagonShape, pillShape, pixelCircleShape, pixelTriangleShape, puffyDiamondShape, puffyShape, semiCircleShape, slantedShape, softBoomShape, softBurstShape, squareShape, sunnyShape, triangleShape, verySunnyShape } from "./shapes/generated/material-shape-paths.js";
 import { materialShapePaths } from "./shapes/generated/material-shape-path-record.js";
-export { ButtonBase, CharacterCounter, CornerRounding, Cubic, DomDirectionLocale, ErrorText, FieldErrorIcon, FieldLabel, MaterialShapes, Morph, Overlay, RoundedPolygon, SelectionControl, SupportingText, Surface, ThemeScopeContext, TouchTarget, TriggerContext, archShape, arrowShape, boomShape, bunShape, burstShape, circle, circleShape, clamShellShape, clover4LeafShape, clover8LeafShape, cookie12SidedShape, cookie4SidedShape, cookie6SidedShape, cookie7SidedShape, cookie9SidedShape, cubicsToPath, diamondShape, fanShape, flowerShape, gemShape, generateSchemeColors, getM3Spring, getMorph, ghostishShape, heartShape, localeWithDirection, materialShapeMask, materialShapeNames, materialShapePaths, mergeDataTokens, morphPathAt, morphToPath, ovalShape, pentagonShape, pickDescriptionAria, pickWidgetAria, pill, pillShape, pillStar, pixelCircleShape, pixelTriangleShape, polygonToPath, puffyDiamondShape, puffyShape, rectangle, selectionControlStyles, semiCircleShape, slantedShape, softBoomShape, softBurstShape, splitDataAttributes, splitRootProps, springProgressWithVelocity, springWithVelocityToLinearEasing, squareShape, star, sunnyShape, surfaceStyles, triangleShape, useKeepPressedInPlace, useM3Interaction, useM3Morph, useM3Spring, usePresence, useTriggerProps, verySunnyShape };
+export { ButtonBase, CharacterCounter, CornerRounding, Cubic, DomDirectionLocale, ErrorText, FieldErrorIcon, FieldLabel, MaterialShapes, Morph, Overlay, RoundedPolygon, SelectionControl, SupportingText, Surface, ThemeScopeContext, TouchTarget, TriggerContext, archShape, arrowShape, boomShape, bunShape, burstShape, circle, circleShape, clamShellShape, closedByOverlayOptions, clover4LeafShape, clover8LeafShape, cookie12SidedShape, cookie4SidedShape, cookie6SidedShape, cookie7SidedShape, cookie9SidedShape, cubicsToPath, diamondShape, fanShape, flowerShape, gemShape, generateSchemeColors, getM3Spring, getMorph, ghostishShape, heartShape, localeWithDirection, materialShapeMask, materialShapeNames, materialShapePaths, mergeDataTokens, morphPathAt, morphToPath, ovalShape, pentagonShape, pickDescriptionAria, pickWidgetAria, pill, pillShape, pillStar, pixelCircleShape, pixelTriangleShape, polygonToPath, puffyDiamondShape, puffyShape, rectangle, selectionControlStyles, semiCircleShape, slantedShape, softBoomShape, softBurstShape, splitDataAttributes, splitRootProps, springProgressWithVelocity, springWithVelocityToLinearEasing, squareShape, star, sunnyShape, surfaceStyles, toAriaPlacement, triangleShape, useKeepPressedInPlace, useM3Interaction, useM3Morph, useM3Spring, usePresence, useRevealEntering, useTriggerProps, verySunnyShape };

package/dist/styles/utilities.css

@@ -281,3 +281,11 @@
 [data-overlay-placement] {
   inset: auto;
 }
+
+/* While ThemeProvider changes the colours: a control's fade is for its hover and press. */
+[data-wm-theme-changing],
+[data-wm-theme-changing] *,
+[data-wm-theme-changing] *::before,
+[data-wm-theme-changing] *::after {
+  transition: none !important;
+}