@seed-design/react 2.3.0 → 2.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/ActionButton/ActionButton.cjs +5 -2
- package/lib/components/ActionButton/ActionButton.d.ts.map +1 -1
- package/lib/components/ActionButton/ActionButton.js +5 -2
- package/lib/components/AttachmentDisplay/AttachmentDisplayItem.cjs +9 -6
- package/lib/components/AttachmentDisplay/AttachmentDisplayItem.d.ts.map +1 -1
- package/lib/components/AttachmentDisplay/AttachmentDisplayItem.js +9 -6
- package/lib/components/AttachmentDisplay/AttachmentDisplayTrigger.cjs +2 -1
- package/lib/components/AttachmentDisplay/AttachmentDisplayTrigger.d.ts.map +1 -1
- package/lib/components/AttachmentDisplay/AttachmentDisplayTrigger.js +2 -1
- package/lib/components/AttachmentInput/AttachmentInputItem.cjs +9 -6
- package/lib/components/AttachmentInput/AttachmentInputItem.d.ts.map +1 -1
- package/lib/components/AttachmentInput/AttachmentInputItem.js +9 -6
- package/lib/components/AttachmentInput/AttachmentInputTrigger.cjs +2 -1
- package/lib/components/AttachmentInput/AttachmentInputTrigger.d.ts.map +1 -1
- package/lib/components/AttachmentInput/AttachmentInputTrigger.js +2 -1
- package/lib/components/BottomSheet/BottomSheet.cjs +5 -3
- package/lib/components/BottomSheet/BottomSheet.d.ts.map +1 -1
- package/lib/components/BottomSheet/BottomSheet.js +5 -3
- package/lib/components/Callout/Callout.cjs +3 -2
- package/lib/components/Callout/Callout.d.ts.map +1 -1
- package/lib/components/Callout/Callout.js +3 -2
- package/lib/components/Checkbox/Checkbox.cjs +2 -1
- package/lib/components/Checkbox/Checkbox.d.ts.map +1 -1
- package/lib/components/Checkbox/Checkbox.js +2 -1
- package/lib/components/Chip/Chip.cjs +2 -1
- package/lib/components/Chip/Chip.d.ts.map +1 -1
- package/lib/components/Chip/Chip.js +2 -1
- package/lib/components/ChipTabs/ChipTabs.cjs +2 -1
- package/lib/components/ChipTabs/ChipTabs.d.ts.map +1 -1
- package/lib/components/ChipTabs/ChipTabs.js +2 -1
- package/lib/components/ContentDialog/ContentDialog.cjs +5 -3
- package/lib/components/ContentDialog/ContentDialog.d.ts.map +1 -1
- package/lib/components/ContentDialog/ContentDialog.js +5 -3
- package/lib/components/ContextualFloatingButton/ContextualFloatingButton.cjs +5 -2
- package/lib/components/ContextualFloatingButton/ContextualFloatingButton.d.ts.map +1 -1
- package/lib/components/ContextualFloatingButton/ContextualFloatingButton.js +5 -2
- package/lib/components/DatePicker/DatePicker.cjs +2 -2
- package/lib/components/DatePicker/DatePicker.d.ts +10 -4
- package/lib/components/DatePicker/DatePicker.d.ts.map +1 -1
- package/lib/components/DatePicker/DatePicker.js +2 -2
- package/lib/components/DatePicker/index.d.ts +1 -1
- package/lib/components/DatePicker/index.d.ts.map +1 -1
- package/lib/components/FieldButton/FieldButton.cjs +2 -1
- package/lib/components/FieldButton/FieldButton.d.ts.map +1 -1
- package/lib/components/FieldButton/FieldButton.js +2 -1
- package/lib/components/FloatingActionButton/FloatingActionButton.cjs +2 -1
- package/lib/components/FloatingActionButton/FloatingActionButton.d.ts.map +1 -1
- package/lib/components/FloatingActionButton/FloatingActionButton.js +2 -1
- package/lib/components/HelpBubble/HelpBubble.cjs +2 -1
- package/lib/components/HelpBubble/HelpBubble.d.ts.map +1 -1
- package/lib/components/HelpBubble/HelpBubble.js +2 -1
- package/lib/components/ImageFrame/ImageFrame.cjs +5 -2
- package/lib/components/ImageFrame/ImageFrame.d.ts.map +1 -1
- package/lib/components/ImageFrame/ImageFrame.js +5 -2
- package/lib/components/LoadingIndicator/usePendingButton.d.ts +57 -57
- package/lib/components/MenuSheet/MenuSheet.cjs +2 -1
- package/lib/components/MenuSheet/MenuSheet.d.ts.map +1 -1
- package/lib/components/MenuSheet/MenuSheet.js +2 -1
- package/lib/components/PageBanner/PageBanner.cjs +3 -2
- package/lib/components/PageBanner/PageBanner.d.ts.map +1 -1
- package/lib/components/PageBanner/PageBanner.js +3 -2
- package/lib/components/QuantityPicker/QuantityPicker.cjs +8 -4
- package/lib/components/QuantityPicker/QuantityPicker.d.ts.map +1 -1
- package/lib/components/QuantityPicker/QuantityPicker.js +8 -4
- package/lib/components/RadioGroup/RadioGroup.cjs +2 -1
- package/lib/components/RadioGroup/RadioGroup.d.ts.map +1 -1
- package/lib/components/RadioGroup/RadioGroup.js +2 -1
- package/lib/components/ReactionButton/ReactionButton.cjs +5 -2
- package/lib/components/ReactionButton/ReactionButton.d.ts.map +1 -1
- package/lib/components/ReactionButton/ReactionButton.js +5 -2
- package/lib/components/ScrollFog/ScrollFog.d.ts +4 -6
- package/lib/components/ScrollFog/ScrollFog.d.ts.map +1 -1
- package/lib/components/ScrollFog/ScrollFog.test.d.ts +2 -0
- package/lib/components/ScrollFog/ScrollFog.test.d.ts.map +1 -0
- package/lib/components/SideNavigation/SideNavigation.cjs +1 -1
- package/lib/components/SideNavigation/SideNavigation.js +1 -1
- package/lib/components/SidePanel/SidePanel.cjs +5 -3
- package/lib/components/SidePanel/SidePanel.d.ts.map +1 -1
- package/lib/components/SidePanel/SidePanel.js +5 -3
- package/lib/components/Slider/Slider.cjs +1 -1
- package/lib/components/Slider/Slider.js +1 -1
- package/lib/components/Snackbar/Snackbar.cjs +2 -1
- package/lib/components/Snackbar/Snackbar.d.ts.map +1 -1
- package/lib/components/Snackbar/Snackbar.js +2 -1
- package/lib/components/SwipeableMenuSheet/SwipeableMenuSheet.cjs +2 -1
- package/lib/components/SwipeableMenuSheet/SwipeableMenuSheet.d.ts.map +1 -1
- package/lib/components/SwipeableMenuSheet/SwipeableMenuSheet.js +2 -1
- package/lib/components/Switch/Switch.cjs +2 -1
- package/lib/components/Switch/Switch.d.ts.map +1 -1
- package/lib/components/Switch/Switch.js +2 -1
- package/lib/components/Tabs/Tabs.cjs +2 -1
- package/lib/components/Tabs/Tabs.d.ts.map +1 -1
- package/lib/components/Tabs/Tabs.js +2 -1
- package/lib/components/TextField/TextField.cjs +1 -1
- package/lib/components/TextField/TextField.js +1 -1
- package/lib/components/ToggleButton/ToggleButton.cjs +5 -2
- package/lib/components/ToggleButton/ToggleButton.d.ts.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.js +5 -2
- package/lib/components/WheelPicker/WheelPicker.cjs +94 -0
- package/lib/components/WheelPicker/WheelPicker.d.ts +56 -0
- package/lib/components/WheelPicker/WheelPicker.d.ts.map +1 -0
- package/lib/components/WheelPicker/WheelPicker.js +89 -0
- package/lib/components/WheelPicker/WheelPicker.namespace.cjs +15 -0
- package/lib/components/WheelPicker/WheelPicker.namespace.d.ts +2 -0
- package/lib/components/WheelPicker/WheelPicker.namespace.d.ts.map +1 -0
- package/lib/components/WheelPicker/WheelPicker.namespace.js +10 -0
- package/lib/components/WheelPicker/WheelPicker.test.d.ts +2 -0
- package/lib/components/WheelPicker/WheelPicker.test.d.ts.map +1 -0
- package/lib/components/WheelPicker/index.cjs +12 -0
- package/lib/components/WheelPicker/index.d.ts +3 -0
- package/lib/components/WheelPicker/index.d.ts.map +1 -0
- package/lib/components/WheelPicker/index.js +3 -0
- package/lib/components/index.cjs +11 -0
- package/lib/components/index.d.ts +1 -0
- package/lib/components/index.d.ts.map +1 -1
- package/lib/components/index.js +3 -1
- package/lib/components/private/WheelPicker.cjs +2 -3
- package/lib/components/private/WheelPicker.d.ts +3 -3
- package/lib/components/private/WheelPicker.d.ts.map +1 -1
- package/lib/components/private/WheelPicker.js +3 -3
- package/lib/components/private/useDismissible.d.ts +123 -123
- package/lib/index.cjs +14 -0
- package/lib/index.d.ts +2 -0
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +4 -1
- package/lib/utils/elementSizeVars.cjs +76 -0
- package/lib/utils/elementSizeVars.d.ts +15 -0
- package/lib/utils/elementSizeVars.d.ts.map +1 -0
- package/lib/utils/elementSizeVars.js +74 -0
- package/lib/utils/scaleFeedback.cjs +99 -0
- package/lib/utils/scaleFeedback.d.ts +58 -0
- package/lib/utils/scaleFeedback.d.ts.map +1 -0
- package/lib/utils/scaleFeedback.js +94 -0
- package/package.json +4 -4
- package/src/components/ActionButton/ActionButton.tsx +5 -2
- package/src/components/AttachmentDisplay/AttachmentDisplayItem.tsx +14 -9
- package/src/components/AttachmentDisplay/AttachmentDisplayTrigger.tsx +7 -4
- package/src/components/AttachmentInput/AttachmentInputItem.tsx +14 -9
- package/src/components/AttachmentInput/AttachmentInputTrigger.tsx +3 -3
- package/src/components/BottomSheet/BottomSheet.tsx +5 -3
- package/src/components/Callout/Callout.tsx +9 -4
- package/src/components/Checkbox/Checkbox.tsx +3 -3
- package/src/components/Chip/Chip.tsx +2 -1
- package/src/components/ChipTabs/ChipTabs.tsx +3 -3
- package/src/components/ContentDialog/ContentDialog.tsx +5 -3
- package/src/components/ContextualFloatingButton/ContextualFloatingButton.tsx +5 -2
- package/src/components/DatePicker/DatePicker.test.tsx +20 -0
- package/src/components/DatePicker/DatePicker.tsx +14 -2
- package/src/components/DatePicker/index.ts +2 -0
- package/src/components/FieldButton/FieldButton.tsx +6 -3
- package/src/components/FloatingActionButton/FloatingActionButton.tsx +4 -4
- package/src/components/HelpBubble/HelpBubble.tsx +7 -4
- package/src/components/HelpBubbleTooltip/HelpBubbleTooltip.tsx +1 -1
- package/src/components/ImageFrame/ImageFrame.tsx +8 -1
- package/src/components/MenuSheet/MenuSheet.tsx +6 -3
- package/src/components/PageBanner/PageBanner.tsx +5 -6
- package/src/components/QuantityPicker/QuantityPicker.tsx +8 -4
- package/src/components/RadioGroup/RadioGroup.tsx +7 -4
- package/src/components/ReactionButton/ReactionButton.tsx +5 -2
- package/src/components/ScrollFog/ScrollFog.test.tsx +13 -0
- package/src/components/ScrollFog/ScrollFog.tsx +5 -7
- package/src/components/SidePanel/SidePanel.tsx +5 -3
- package/src/components/Snackbar/Snackbar.tsx +6 -3
- package/src/components/SwipeableMenuSheet/SwipeableMenuSheet.tsx +7 -4
- package/src/components/Switch/Switch.tsx +3 -3
- package/src/components/Tabs/Tabs.tsx +3 -3
- package/src/components/ToggleButton/ToggleButton.tsx +5 -2
- package/src/components/WheelPicker/WheelPicker.namespace.ts +9 -0
- package/src/components/WheelPicker/WheelPicker.test.tsx +270 -0
- package/src/components/WheelPicker/WheelPicker.tsx +210 -0
- package/src/components/WheelPicker/index.ts +11 -0
- package/src/components/index.ts +1 -0
- package/src/components/private/WheelPicker.test.tsx +1 -0
- package/src/components/private/WheelPicker.tsx +6 -6
- package/src/index.ts +2 -0
- package/src/utils/elementSizeVars.tsx +112 -0
- package/src/utils/scaleFeedback.tsx +128 -0
package/lib/index.cjs
CHANGED
|
@@ -2,6 +2,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
|
2
2
|
require("./_virtual/_rolldown/runtime.cjs");
|
|
3
3
|
const require_Accordion = require("./components/Accordion/Accordion.cjs");
|
|
4
4
|
const require_Accordion_namespace = require("./components/Accordion/Accordion.namespace.cjs");
|
|
5
|
+
const require_scaleFeedback = require("./utils/scaleFeedback.cjs");
|
|
5
6
|
const require_Icon = require("./components/Icon/Icon.cjs");
|
|
6
7
|
const require_ActionButton = require("./components/ActionButton/ActionButton.cjs");
|
|
7
8
|
const require_ActionChip = require("./components/ActionChip/ActionChip.cjs");
|
|
@@ -146,6 +147,8 @@ const require_TextField_namespace = require("./components/TextField/TextField.na
|
|
|
146
147
|
const require_TimePicker = require("./components/TimePicker/TimePicker.cjs");
|
|
147
148
|
const require_ToggleButton = require("./components/ToggleButton/ToggleButton.cjs");
|
|
148
149
|
const require_VisuallyHidden = require("./components/VisuallyHidden/VisuallyHidden.cjs");
|
|
150
|
+
const require_WheelPicker = require("./components/WheelPicker/WheelPicker.cjs");
|
|
151
|
+
const require_WheelPicker_namespace = require("./components/WheelPicker/WheelPicker.namespace.cjs");
|
|
149
152
|
const require_BreakpointProvider = require("./providers/BreakpointProvider.cjs");
|
|
150
153
|
let _seed_design_react_portal = require("@seed-design/react-portal");
|
|
151
154
|
let _seed_design_react_date_picker = require("@seed-design/react-date-picker");
|
|
@@ -764,6 +767,7 @@ exports.ResponsiveSidePanelPositioner = require_ResponsiveSidePanel.ResponsiveSi
|
|
|
764
767
|
exports.ResponsiveSidePanelRoot = require_ResponsiveSidePanel.ResponsiveSidePanelRoot;
|
|
765
768
|
exports.ResponsiveSidePanelTitle = require_ResponsiveSidePanel.ResponsiveSidePanelTitle;
|
|
766
769
|
exports.ResponsiveSidePanelTrigger = require_ResponsiveSidePanel.ResponsiveSidePanelTrigger;
|
|
770
|
+
exports.ScaleFeedback = require_scaleFeedback.ScaleFeedback;
|
|
767
771
|
exports.ScrollFog = require_ScrollFog.ScrollFog;
|
|
768
772
|
Object.defineProperty(exports, "SegmentedControl", {
|
|
769
773
|
enumerable: true,
|
|
@@ -951,6 +955,15 @@ exports.TwoMonthDatePicker = require_DatePicker.TwoMonthDatePicker;
|
|
|
951
955
|
exports.VStack = require_Stack.VStack;
|
|
952
956
|
exports.VisuallyHidden = require_VisuallyHidden.VisuallyHidden;
|
|
953
957
|
exports.WeekDatePicker = require_DatePicker.WeekDatePicker;
|
|
958
|
+
Object.defineProperty(exports, "WheelPicker", {
|
|
959
|
+
enumerable: true,
|
|
960
|
+
get: function() {
|
|
961
|
+
return require_WheelPicker_namespace.WheelPicker_namespace_exports;
|
|
962
|
+
}
|
|
963
|
+
});
|
|
964
|
+
exports.WheelPickerColumn = require_WheelPicker.WheelPickerColumn;
|
|
965
|
+
exports.WheelPickerItemLabel = require_WheelPicker.WheelPickerItemLabel;
|
|
966
|
+
exports.WheelPickerRoot = require_WheelPicker.WheelPickerRoot;
|
|
954
967
|
Object.defineProperty(exports, "compareDates", {
|
|
955
968
|
enumerable: true,
|
|
956
969
|
get: function() {
|
|
@@ -1021,6 +1034,7 @@ exports.useBreakpoint = require_useBreakpoint.useBreakpoint;
|
|
|
1021
1034
|
exports.useBreakpointValue = require_useBreakpointValue.useBreakpointValue;
|
|
1022
1035
|
exports.useResponsiveDialogContext = require_ResponsiveDialog.useResponsiveDialogContext;
|
|
1023
1036
|
exports.useResponsiveSidePanelContext = require_ResponsiveSidePanel.useResponsiveSidePanelContext;
|
|
1037
|
+
exports.useScaleFeedback = require_scaleFeedback.useScaleFeedback;
|
|
1024
1038
|
exports.useSnackbarAdapter = require_useSnackbarAdapter.useSnackbarAdapter;
|
|
1025
1039
|
Object.defineProperty(exports, "useSnackbarContext", {
|
|
1026
1040
|
enumerable: true,
|
package/lib/index.d.ts
CHANGED
|
@@ -3,6 +3,8 @@ export type { ResponsiveValue, UnwrapResponsive, BreakpointThreshold } from './t
|
|
|
3
3
|
export { useBreakpoint } from './hooks/useBreakpoint';
|
|
4
4
|
export type { UseBreakpointOptions } from './hooks/useBreakpoint';
|
|
5
5
|
export { useBreakpointValue } from './hooks/useBreakpointValue';
|
|
6
|
+
export { useScaleFeedback, ScaleFeedback } from './utils/scaleFeedback';
|
|
7
|
+
export type { ScaleFeedbackProps } from './utils/scaleFeedback';
|
|
6
8
|
export { BreakpointProvider } from './providers/BreakpointProvider';
|
|
7
9
|
export type { BreakpointProviderProps } from './providers/BreakpointProvider';
|
|
8
10
|
export type { StyleProps as unstable_StyleProps } from './utils/styled';
|
package/lib/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAE7B,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAEjG,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,YAAY,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,YAAY,EAAE,uBAAuB,EAAE,MAAM,gCAAgC,CAAC;AAG9E,YAAY,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,gBAAgB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAE7B,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAEjG,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,YAAY,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACxE,YAAY,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,YAAY,EAAE,uBAAuB,EAAE,MAAM,gCAAgC,CAAC;AAG9E,YAAY,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,gBAAgB,CAAC"}
|
package/lib/index.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { AccordionBody, AccordionContent, AccordionDescription, AccordionHeader, AccordionItem, AccordionPrefix, AccordionRoot, AccordionSuffixIcon, AccordionTitle, AccordionTrigger } from "./components/Accordion/Accordion.js";
|
|
2
2
|
import { Accordion_namespace_exports } from "./components/Accordion/Accordion.namespace.js";
|
|
3
|
+
import { ScaleFeedback, useScaleFeedback } from "./utils/scaleFeedback.js";
|
|
3
4
|
import { Icon, PrefixIcon, SuffixIcon } from "./components/Icon/Icon.js";
|
|
4
5
|
import { ActionButton } from "./components/ActionButton/ActionButton.js";
|
|
5
6
|
import { ActionChip } from "./components/ActionChip/ActionChip.js";
|
|
@@ -149,5 +150,7 @@ import { TextField_namespace_exports } from "./components/TextField/TextField.na
|
|
|
149
150
|
import { TimePicker } from "./components/TimePicker/TimePicker.js";
|
|
150
151
|
import { ToggleButton } from "./components/ToggleButton/ToggleButton.js";
|
|
151
152
|
import { VisuallyHidden } from "./components/VisuallyHidden/VisuallyHidden.js";
|
|
153
|
+
import { WheelPickerColumn, WheelPickerItemLabel, WheelPickerRoot } from "./components/WheelPicker/WheelPicker.js";
|
|
154
|
+
import { WheelPicker_namespace_exports } from "./components/WheelPicker/WheelPicker.namespace.js";
|
|
152
155
|
import { BreakpointProvider } from "./providers/BreakpointProvider.js";
|
|
153
|
-
export { Accordion_namespace_exports as Accordion, AccordionBody, AccordionContent, AccordionDescription, AccordionHeader, AccordionItem, AccordionPrefix, AccordionRoot, AccordionSuffixIcon, AccordionTitle, AccordionTrigger, ActionButton, ActionChip, ActionSheet_namespace_exports as ActionSheet, ActionSheetBackdrop, ActionSheetCloseButton, ActionSheetContent, ActionSheetDescription, ActionSheetHeader, ActionSheetItem, ActionSheetList, ActionSheetPositioner, ActionSheetRoot, ActionSheetTitle, ActionSheetTrigger, Article, AspectRatio, AttachmentDisplay_namespace_exports as AttachmentDisplay, AttachmentDisplayContainer, AttachmentDisplayContext, AttachmentDisplayControl, AttachmentDisplayDescription, AttachmentDisplayErrorMessage, AttachmentDisplayFooter, AttachmentDisplayHeader, AttachmentDisplayIndicatorText, AttachmentDisplayItem, AttachmentDisplayItemActionButton, AttachmentDisplayItemBackdrop, AttachmentDisplayItemBadge, AttachmentDisplayItemGroup, AttachmentDisplayItemImage, AttachmentDisplayItemMetadata, AttachmentDisplayItemRemoveButton, AttachmentDisplayItemThumbnail, AttachmentDisplayLabel, AttachmentDisplayRequiredIndicator, AttachmentDisplayRoot, AttachmentDisplayTrigger, AttachmentDisplayTriggerIcon, AttachmentDisplayTriggerItemCount, AttachmentInput_namespace_exports as AttachmentInput, AttachmentInputContainer, AttachmentInputContext, AttachmentInputDropzone, AttachmentInputDropzoneLabel, AttachmentInputHiddenInput, AttachmentInputItem, AttachmentInputItemActionButton, AttachmentInputItemBackdrop, AttachmentInputItemBadge, AttachmentInputItemGroup, AttachmentInputItemImage, AttachmentInputItemMetadata, AttachmentInputItemName, AttachmentInputItemRemoveButton, AttachmentInputItemSize, AttachmentInputItemThumbnail, AttachmentInputRoot, AttachmentInputTrigger, AttachmentInputTriggerIcon, AttachmentInputTriggerItemCount, Avatar_namespace_exports as Avatar, AvatarBadge, AvatarFallback, AvatarImage, AvatarRoot, AvatarStack, Badge, BottomSheet_namespace_exports as BottomSheet, BottomSheetBackdrop, BottomSheetBody, BottomSheetCloseButton, BottomSheetContent, BottomSheetDescription, BottomSheetFooter, BottomSheetHeader, BottomSheetPositioner, BottomSheetRoot, BottomSheetTitle, BottomSheetTrigger, Box, BreakpointProvider, Callout_namespace_exports as Callout, CalloutCloseButton, CalloutContent, CalloutDescription, CalloutLink, CalloutRoot, CalloutTitle, Celsius, CheckSelectBox_namespace_exports as CheckSelectBox, CheckSelectBoxBody, CheckSelectBoxCheckmarkControl, CheckSelectBoxCheckmarkIcon, CheckSelectBoxContent, CheckSelectBoxDescription, CheckSelectBoxFooter, CheckSelectBoxGroup, CheckSelectBoxHiddenInput, CheckSelectBoxLabel, CheckSelectBoxRoot, CheckSelectBoxTrigger, Checkbox_namespace_exports as Checkbox, CheckboxControl, CheckboxGroup, CheckboxHiddenInput, CheckboxIndicator, CheckboxLabel, CheckboxRoot, Chip_namespace_exports as Chip, ChipLabel, ChipPrefixAvatar, ChipPrefixIcon, ChipRoot, ChipSuffixIcon, ChipTabs_namespace_exports as ChipTabs, ChipTabsCarousel, ChipTabsCarouselCamera, ChipTabsContent, ChipTabsList, ChipTabsRoot, ChipTabsTrigger, Column, Columns, ConsistentWidth, ContentDialog_namespace_exports as ContentDialog, ContentDialogAction, ContentDialogBackdrop, ContentDialogBody, ContentDialogCloseButton, ContentDialogContent, ContentDialogDescription, ContentDialogFooter, ContentDialogHeader, ContentDialogPositioner, ContentDialogRoot, ContentDialogTitle, ContentDialogTrigger, ContentPlaceholder_namespace_exports as ContentPlaceholder, ContentPlaceholderAsset, ContentPlaceholderRoot, ContextualFloatingButton, ContinuousDatePicker, ControlChip, Count, DatePicker, Dialog_namespace_exports as Dialog, DialogAction, DialogBackdrop, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPositioner, DialogRoot, DialogTitle, DialogTrigger, Divider, ExtendedActionSheet_namespace_exports as ExtendedActionSheet, ExtendedActionSheetBackdrop, ExtendedActionSheetCloseButton, ExtendedActionSheetContent, ExtendedActionSheetFooter, ExtendedActionSheetGroup, ExtendedActionSheetHeader, ExtendedActionSheetItem, ExtendedActionSheetList, ExtendedActionSheetPositioner, ExtendedActionSheetRoot, ExtendedActionSheetTitle, ExtendedActionSheetTrigger, ExtendedFab, Fab, Field_namespace_exports as Field, FieldButton_namespace_exports as FieldButton, FieldButtonButton, FieldButtonClearButton, FieldButtonControl, FieldButtonDescription, FieldButtonErrorMessage, FieldButtonFooter, FieldButtonHeader, FieldButtonHiddenInput, FieldButtonIndicatorText, FieldButtonLabel, FieldButtonPlaceholder, FieldButtonPrefixIcon, FieldButtonPrefixText, FieldButtonRequiredIndicator, FieldButtonRoot, FieldButtonSuffixIcon, FieldButtonSuffixText, FieldButtonValue, FieldCharacterCount, FieldDescription, FieldErrorMessage, FieldFooter, FieldHeader, FieldIndicatorText, FieldLabel, FieldRequiredIndicator, FieldRoot, Fieldset_namespace_exports as Fieldset, FieldsetDescription, FieldsetErrorMessage, FieldsetFooter, FieldsetHeader, FieldsetIndicatorText, FieldsetLabel, FieldsetRequiredIndicator, FieldsetRoot, Flex, Float, FloatingActionButton_namespace_exports as FloatingActionButton, FloatingActionButtonIcon, FloatingActionButtonLabel, FloatingActionButtonRoot, Footer_namespace_exports as Footer, FooterLinkText, Grid, GridItem, HStack, HelpBubble_namespace_exports as HelpBubble, HelpBubbleAnchor, HelpBubbleArrow, HelpBubbleArrowTip, HelpBubbleBody, HelpBubbleCloseButton, HelpBubbleContent, HelpBubbleDescription, HelpBubblePositioner, HelpBubblePositionerPortal, HelpBubbleRoot, HelpBubbleTitle, HelpBubbleTooltip_namespace_exports as HelpBubbleTooltip, HelpBubbleTooltipArrow, HelpBubbleTooltipArrowTip, HelpBubbleTooltipBody, HelpBubbleTooltipContent, HelpBubbleTooltipDelayGroup, HelpBubbleTooltipDescription, HelpBubbleTooltipPositioner, HelpBubbleTooltipPositionerPortal, HelpBubbleTooltipRoot, HelpBubbleTooltipTitle, HelpBubbleTooltipTrigger, HelpBubbleTrigger, Icon, IdentityPlaceholder_namespace_exports as IdentityPlaceholder, IdentityPlaceholderImage, IdentityPlaceholderRoot, ImageFrame, ImageFrameBadge, ImageFrameFloater, ImageFrameIcon, ImageFrameIndicator, ImageFrameReactionButton, Inline, InlineBanner_namespace_exports as InlineBanner, InlineBannerCloseButton, InlineBannerContent, InlineBannerDescription, InlineBannerLink, InlineBannerRoot, InlineBannerTitle, Layout_namespace_exports as Layout, LayoutContent, LayoutRoot, LinkContent, List_namespace_exports as List, ListContent, ListDetail, ListHeader, ListItem, ListPrefix, ListRoot, ListSuffix, ListTitle, LoadingIndicator, MannerTemp, MannerTempBadge, MannerTempEmote, Menu_namespace_exports as Menu, MenuAnchor, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuItemBody, MenuItemDescription, MenuItemLabel, MenuPositioner, MenuRoot, MenuScrollArea, MenuSheet_namespace_exports as MenuSheet, MenuSheetBackdrop, MenuSheetCloseButton, MenuSheetContent, MenuSheetDescription, MenuSheetFooter, MenuSheetGroup, MenuSheetHeader, MenuSheetItem, MenuSheetItemContent, MenuSheetItemDescription, MenuSheetItemLabel, MenuSheetList, MenuSheetPositioner, MenuSheetRoot, MenuSheetTitle, MenuSheetTrigger, MenuTrigger, NavigationMenu_namespace_exports as NavigationMenu, NavigationMenuContent, NavigationMenuGroup, NavigationMenuGroupLabel, NavigationMenuItem, NavigationMenuItemBody, NavigationMenuItemDescription, NavigationMenuItemLabel, NavigationMenuPositioner, NavigationMenuProvider, NavigationMenuRoot, NavigationMenuScrollArea, NavigationMenuTrigger, NotificationBadge, NotificationBadgePositioner, PageBanner_namespace_exports as PageBanner, PageBannerBody, PageBannerButton, PageBannerCloseButton, PageBannerContent, PageBannerDescription, PageBannerRoot, PageBannerTitle, Portal, PrefixIcon, ProgressCircle_namespace_exports as ProgressCircle, ProgressCircleRange, ProgressCircleRoot, ProgressCircleTrack, PullToRefresh_namespace_exports as PullToRefresh, PullToRefreshContent, PullToRefreshIndicator, PullToRefreshRoot, QuantityPicker_namespace_exports as QuantityPicker, QuantityPickerDecrementButton, QuantityPickerHiddenInput, QuantityPickerIncrementButton, QuantityPickerRoot, QuantityPickerValueDisplay, RadioGroup_namespace_exports as RadioGroup, RadioGroupField_namespace_exports as RadioGroupField, RadioGroupFieldDescription, RadioGroupFieldErrorMessage, RadioGroupFieldFooter, RadioGroupFieldHeader, RadioGroupFieldIndicatorText, RadioGroupFieldLabel, RadioGroupFieldRequiredIndicator, RadioGroupFieldRoot, RadioGroupItem, RadioGroupItemControl, RadioGroupItemHiddenInput, RadioGroupItemIndicator, RadioGroupItemLabel, RadioGroupRoot, RadioSelectBox_namespace_exports as RadioSelectBox, RadioSelectBoxBody, RadioSelectBoxContent, RadioSelectBoxDescription, RadioSelectBoxFooter, RadioSelectBoxGroup, RadioSelectBoxHiddenInput, RadioSelectBoxItem, RadioSelectBoxLabel, RadioSelectBoxTrigger, ReactionButton, ResponsiveDialog_namespace_exports as ResponsiveDialog, ResponsiveDialogAction, ResponsiveDialogBackdrop, ResponsiveDialogBody, ResponsiveDialogCloseButton, ResponsiveDialogContent, ResponsiveDialogDescription, ResponsiveDialogFooter, ResponsiveDialogHandle, ResponsiveDialogHeader, ResponsiveDialogPositioner, ResponsiveDialogRoot, ResponsiveDialogTitle, ResponsiveDialogTrigger, ResponsivePair, ResponsiveSidePanel_namespace_exports as ResponsiveSidePanel, ResponsiveSidePanelBackdrop, ResponsiveSidePanelBody, ResponsiveSidePanelCloseButton, ResponsiveSidePanelContent, ResponsiveSidePanelDescription, ResponsiveSidePanelFooter, ResponsiveSidePanelHandle, ResponsiveSidePanelHeader, ResponsiveSidePanelPositioner, ResponsiveSidePanelRoot, ResponsiveSidePanelTitle, ResponsiveSidePanelTrigger, ScrollFog, SegmentedControl_namespace_exports as SegmentedControl, SegmentedControlIndicator, SegmentedControlItem, SegmentedControlItemHiddenInput, SegmentedControlRoot, Select_namespace_exports as Select, SelectContent, SelectGroup, SelectGroupLabel, SelectHiddenSelect, SelectItem, SelectItemBody, SelectItemDescription, SelectItemIndicator, SelectItemLabel, SelectItemPrefixIcon, SelectPlaceholder, SelectPositioner, SelectPrefixIcon, SelectRoot, SelectScrollArea, SelectSuffixIcon, SelectTrigger, SelectValue, SideNavigation_namespace_exports as SideNavigation, SideNavigationContent, SideNavigationFooter, SideNavigationGroup, SideNavigationGroupLabel, SideNavigationHeader, SideNavigationInset, SideNavigationItem, SideNavigationItemCollapsibleContent, SideNavigationItemCollapsibleRoot, SideNavigationItemCollapsibleTrigger, SideNavigationItemLabel, SideNavigationItemPrefixIcon, SideNavigationItemSuffixIcon, SideNavigationProvider, SideNavigationRoot, SideNavigationTrigger, SidePanel_namespace_exports as SidePanel, SidePanelBackdrop, SidePanelBody, SidePanelCloseButton, SidePanelContent, SidePanelDescription, SidePanelFooter, SidePanelHeader, SidePanelPositioner, SidePanelRoot, SidePanelTitle, SidePanelTrigger, Skeleton, Slider_namespace_exports as Slider, SliderControl, SliderHiddenInput, SliderMarker, SliderMarkers, SliderRange, SliderRoot, SliderThumb, SliderTick, SliderTrack, SliderValueIndicatorArrow, SliderValueIndicatorArrowTip, SliderValueIndicatorLabel, SliderValueIndicatorRoot, Snackbar_namespace_exports as Snackbar, SnackbarActionButton, SnackbarAvoidOverlap, SnackbarHiddenCloseButton, SnackbarMessage, SnackbarPrefixIcon, SnackbarRegion, SnackbarRenderer, SnackbarRoot, SnackbarRootProvider, Stack, SuffixIcon, SwipeableMenuSheet_namespace_exports as SwipeableMenuSheet, SwipeableMenuSheetBackdrop, SwipeableMenuSheetCloseButton, SwipeableMenuSheetContent, SwipeableMenuSheetDescription, SwipeableMenuSheetFooter, SwipeableMenuSheetGroup, SwipeableMenuSheetHandle, SwipeableMenuSheetHeader, SwipeableMenuSheetItem, SwipeableMenuSheetItemContent, SwipeableMenuSheetItemDescription, SwipeableMenuSheetItemLabel, SwipeableMenuSheetList, SwipeableMenuSheetPositioner, SwipeableMenuSheetRoot, SwipeableMenuSheetTitle, SwipeableMenuSheetTrigger, Switch_namespace_exports as Switch, SwitchControl, SwitchHiddenInput, SwitchLabel, SwitchRoot, SwitchThumb, Tabs_namespace_exports as Tabs, TabsCarousel, TabsCarouselCamera, TabsContent, TabsIndicator, TabsList, TabsRoot, TabsTrigger, TagGroup_namespace_exports as TagGroup, TagGroupItem, TagGroupItemLabel, TagGroupRoot, Text, TextField_namespace_exports as TextField, TextFieldInput, TextFieldPrefixIcon, TextFieldPrefixText, TextFieldRoot, TextFieldSuffixIcon, TextFieldSuffixText, TextFieldTextarea, TimePicker, ToggleButton, TwoMonthDatePicker, VStack, VisuallyHidden, WeekDatePicker, compareDates, dateKey, dateOnOrAfter, dateOnOrBefore, excludeDates, isSameDate, maxSelectionCount, pullToRefreshPreventPull, rangeDayCountAtLeast, rangeDayCountAtMost, tabsCarouselPreventDrag, useBreakpoint, useBreakpointValue, useResponsiveDialogContext, useResponsiveSidePanelContext, useSnackbarAdapter, useSnackbarContext, useTextFieldWithGraphemes };
|
|
156
|
+
export { Accordion_namespace_exports as Accordion, AccordionBody, AccordionContent, AccordionDescription, AccordionHeader, AccordionItem, AccordionPrefix, AccordionRoot, AccordionSuffixIcon, AccordionTitle, AccordionTrigger, ActionButton, ActionChip, ActionSheet_namespace_exports as ActionSheet, ActionSheetBackdrop, ActionSheetCloseButton, ActionSheetContent, ActionSheetDescription, ActionSheetHeader, ActionSheetItem, ActionSheetList, ActionSheetPositioner, ActionSheetRoot, ActionSheetTitle, ActionSheetTrigger, Article, AspectRatio, AttachmentDisplay_namespace_exports as AttachmentDisplay, AttachmentDisplayContainer, AttachmentDisplayContext, AttachmentDisplayControl, AttachmentDisplayDescription, AttachmentDisplayErrorMessage, AttachmentDisplayFooter, AttachmentDisplayHeader, AttachmentDisplayIndicatorText, AttachmentDisplayItem, AttachmentDisplayItemActionButton, AttachmentDisplayItemBackdrop, AttachmentDisplayItemBadge, AttachmentDisplayItemGroup, AttachmentDisplayItemImage, AttachmentDisplayItemMetadata, AttachmentDisplayItemRemoveButton, AttachmentDisplayItemThumbnail, AttachmentDisplayLabel, AttachmentDisplayRequiredIndicator, AttachmentDisplayRoot, AttachmentDisplayTrigger, AttachmentDisplayTriggerIcon, AttachmentDisplayTriggerItemCount, AttachmentInput_namespace_exports as AttachmentInput, AttachmentInputContainer, AttachmentInputContext, AttachmentInputDropzone, AttachmentInputDropzoneLabel, AttachmentInputHiddenInput, AttachmentInputItem, AttachmentInputItemActionButton, AttachmentInputItemBackdrop, AttachmentInputItemBadge, AttachmentInputItemGroup, AttachmentInputItemImage, AttachmentInputItemMetadata, AttachmentInputItemName, AttachmentInputItemRemoveButton, AttachmentInputItemSize, AttachmentInputItemThumbnail, AttachmentInputRoot, AttachmentInputTrigger, AttachmentInputTriggerIcon, AttachmentInputTriggerItemCount, Avatar_namespace_exports as Avatar, AvatarBadge, AvatarFallback, AvatarImage, AvatarRoot, AvatarStack, Badge, BottomSheet_namespace_exports as BottomSheet, BottomSheetBackdrop, BottomSheetBody, BottomSheetCloseButton, BottomSheetContent, BottomSheetDescription, BottomSheetFooter, BottomSheetHeader, BottomSheetPositioner, BottomSheetRoot, BottomSheetTitle, BottomSheetTrigger, Box, BreakpointProvider, Callout_namespace_exports as Callout, CalloutCloseButton, CalloutContent, CalloutDescription, CalloutLink, CalloutRoot, CalloutTitle, Celsius, CheckSelectBox_namespace_exports as CheckSelectBox, CheckSelectBoxBody, CheckSelectBoxCheckmarkControl, CheckSelectBoxCheckmarkIcon, CheckSelectBoxContent, CheckSelectBoxDescription, CheckSelectBoxFooter, CheckSelectBoxGroup, CheckSelectBoxHiddenInput, CheckSelectBoxLabel, CheckSelectBoxRoot, CheckSelectBoxTrigger, Checkbox_namespace_exports as Checkbox, CheckboxControl, CheckboxGroup, CheckboxHiddenInput, CheckboxIndicator, CheckboxLabel, CheckboxRoot, Chip_namespace_exports as Chip, ChipLabel, ChipPrefixAvatar, ChipPrefixIcon, ChipRoot, ChipSuffixIcon, ChipTabs_namespace_exports as ChipTabs, ChipTabsCarousel, ChipTabsCarouselCamera, ChipTabsContent, ChipTabsList, ChipTabsRoot, ChipTabsTrigger, Column, Columns, ConsistentWidth, ContentDialog_namespace_exports as ContentDialog, ContentDialogAction, ContentDialogBackdrop, ContentDialogBody, ContentDialogCloseButton, ContentDialogContent, ContentDialogDescription, ContentDialogFooter, ContentDialogHeader, ContentDialogPositioner, ContentDialogRoot, ContentDialogTitle, ContentDialogTrigger, ContentPlaceholder_namespace_exports as ContentPlaceholder, ContentPlaceholderAsset, ContentPlaceholderRoot, ContextualFloatingButton, ContinuousDatePicker, ControlChip, Count, DatePicker, Dialog_namespace_exports as Dialog, DialogAction, DialogBackdrop, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogPositioner, DialogRoot, DialogTitle, DialogTrigger, Divider, ExtendedActionSheet_namespace_exports as ExtendedActionSheet, ExtendedActionSheetBackdrop, ExtendedActionSheetCloseButton, ExtendedActionSheetContent, ExtendedActionSheetFooter, ExtendedActionSheetGroup, ExtendedActionSheetHeader, ExtendedActionSheetItem, ExtendedActionSheetList, ExtendedActionSheetPositioner, ExtendedActionSheetRoot, ExtendedActionSheetTitle, ExtendedActionSheetTrigger, ExtendedFab, Fab, Field_namespace_exports as Field, FieldButton_namespace_exports as FieldButton, FieldButtonButton, FieldButtonClearButton, FieldButtonControl, FieldButtonDescription, FieldButtonErrorMessage, FieldButtonFooter, FieldButtonHeader, FieldButtonHiddenInput, FieldButtonIndicatorText, FieldButtonLabel, FieldButtonPlaceholder, FieldButtonPrefixIcon, FieldButtonPrefixText, FieldButtonRequiredIndicator, FieldButtonRoot, FieldButtonSuffixIcon, FieldButtonSuffixText, FieldButtonValue, FieldCharacterCount, FieldDescription, FieldErrorMessage, FieldFooter, FieldHeader, FieldIndicatorText, FieldLabel, FieldRequiredIndicator, FieldRoot, Fieldset_namespace_exports as Fieldset, FieldsetDescription, FieldsetErrorMessage, FieldsetFooter, FieldsetHeader, FieldsetIndicatorText, FieldsetLabel, FieldsetRequiredIndicator, FieldsetRoot, Flex, Float, FloatingActionButton_namespace_exports as FloatingActionButton, FloatingActionButtonIcon, FloatingActionButtonLabel, FloatingActionButtonRoot, Footer_namespace_exports as Footer, FooterLinkText, Grid, GridItem, HStack, HelpBubble_namespace_exports as HelpBubble, HelpBubbleAnchor, HelpBubbleArrow, HelpBubbleArrowTip, HelpBubbleBody, HelpBubbleCloseButton, HelpBubbleContent, HelpBubbleDescription, HelpBubblePositioner, HelpBubblePositionerPortal, HelpBubbleRoot, HelpBubbleTitle, HelpBubbleTooltip_namespace_exports as HelpBubbleTooltip, HelpBubbleTooltipArrow, HelpBubbleTooltipArrowTip, HelpBubbleTooltipBody, HelpBubbleTooltipContent, HelpBubbleTooltipDelayGroup, HelpBubbleTooltipDescription, HelpBubbleTooltipPositioner, HelpBubbleTooltipPositionerPortal, HelpBubbleTooltipRoot, HelpBubbleTooltipTitle, HelpBubbleTooltipTrigger, HelpBubbleTrigger, Icon, IdentityPlaceholder_namespace_exports as IdentityPlaceholder, IdentityPlaceholderImage, IdentityPlaceholderRoot, ImageFrame, ImageFrameBadge, ImageFrameFloater, ImageFrameIcon, ImageFrameIndicator, ImageFrameReactionButton, Inline, InlineBanner_namespace_exports as InlineBanner, InlineBannerCloseButton, InlineBannerContent, InlineBannerDescription, InlineBannerLink, InlineBannerRoot, InlineBannerTitle, Layout_namespace_exports as Layout, LayoutContent, LayoutRoot, LinkContent, List_namespace_exports as List, ListContent, ListDetail, ListHeader, ListItem, ListPrefix, ListRoot, ListSuffix, ListTitle, LoadingIndicator, MannerTemp, MannerTempBadge, MannerTempEmote, Menu_namespace_exports as Menu, MenuAnchor, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuItemBody, MenuItemDescription, MenuItemLabel, MenuPositioner, MenuRoot, MenuScrollArea, MenuSheet_namespace_exports as MenuSheet, MenuSheetBackdrop, MenuSheetCloseButton, MenuSheetContent, MenuSheetDescription, MenuSheetFooter, MenuSheetGroup, MenuSheetHeader, MenuSheetItem, MenuSheetItemContent, MenuSheetItemDescription, MenuSheetItemLabel, MenuSheetList, MenuSheetPositioner, MenuSheetRoot, MenuSheetTitle, MenuSheetTrigger, MenuTrigger, NavigationMenu_namespace_exports as NavigationMenu, NavigationMenuContent, NavigationMenuGroup, NavigationMenuGroupLabel, NavigationMenuItem, NavigationMenuItemBody, NavigationMenuItemDescription, NavigationMenuItemLabel, NavigationMenuPositioner, NavigationMenuProvider, NavigationMenuRoot, NavigationMenuScrollArea, NavigationMenuTrigger, NotificationBadge, NotificationBadgePositioner, PageBanner_namespace_exports as PageBanner, PageBannerBody, PageBannerButton, PageBannerCloseButton, PageBannerContent, PageBannerDescription, PageBannerRoot, PageBannerTitle, Portal, PrefixIcon, ProgressCircle_namespace_exports as ProgressCircle, ProgressCircleRange, ProgressCircleRoot, ProgressCircleTrack, PullToRefresh_namespace_exports as PullToRefresh, PullToRefreshContent, PullToRefreshIndicator, PullToRefreshRoot, QuantityPicker_namespace_exports as QuantityPicker, QuantityPickerDecrementButton, QuantityPickerHiddenInput, QuantityPickerIncrementButton, QuantityPickerRoot, QuantityPickerValueDisplay, RadioGroup_namespace_exports as RadioGroup, RadioGroupField_namespace_exports as RadioGroupField, RadioGroupFieldDescription, RadioGroupFieldErrorMessage, RadioGroupFieldFooter, RadioGroupFieldHeader, RadioGroupFieldIndicatorText, RadioGroupFieldLabel, RadioGroupFieldRequiredIndicator, RadioGroupFieldRoot, RadioGroupItem, RadioGroupItemControl, RadioGroupItemHiddenInput, RadioGroupItemIndicator, RadioGroupItemLabel, RadioGroupRoot, RadioSelectBox_namespace_exports as RadioSelectBox, RadioSelectBoxBody, RadioSelectBoxContent, RadioSelectBoxDescription, RadioSelectBoxFooter, RadioSelectBoxGroup, RadioSelectBoxHiddenInput, RadioSelectBoxItem, RadioSelectBoxLabel, RadioSelectBoxTrigger, ReactionButton, ResponsiveDialog_namespace_exports as ResponsiveDialog, ResponsiveDialogAction, ResponsiveDialogBackdrop, ResponsiveDialogBody, ResponsiveDialogCloseButton, ResponsiveDialogContent, ResponsiveDialogDescription, ResponsiveDialogFooter, ResponsiveDialogHandle, ResponsiveDialogHeader, ResponsiveDialogPositioner, ResponsiveDialogRoot, ResponsiveDialogTitle, ResponsiveDialogTrigger, ResponsivePair, ResponsiveSidePanel_namespace_exports as ResponsiveSidePanel, ResponsiveSidePanelBackdrop, ResponsiveSidePanelBody, ResponsiveSidePanelCloseButton, ResponsiveSidePanelContent, ResponsiveSidePanelDescription, ResponsiveSidePanelFooter, ResponsiveSidePanelHandle, ResponsiveSidePanelHeader, ResponsiveSidePanelPositioner, ResponsiveSidePanelRoot, ResponsiveSidePanelTitle, ResponsiveSidePanelTrigger, ScaleFeedback, ScrollFog, SegmentedControl_namespace_exports as SegmentedControl, SegmentedControlIndicator, SegmentedControlItem, SegmentedControlItemHiddenInput, SegmentedControlRoot, Select_namespace_exports as Select, SelectContent, SelectGroup, SelectGroupLabel, SelectHiddenSelect, SelectItem, SelectItemBody, SelectItemDescription, SelectItemIndicator, SelectItemLabel, SelectItemPrefixIcon, SelectPlaceholder, SelectPositioner, SelectPrefixIcon, SelectRoot, SelectScrollArea, SelectSuffixIcon, SelectTrigger, SelectValue, SideNavigation_namespace_exports as SideNavigation, SideNavigationContent, SideNavigationFooter, SideNavigationGroup, SideNavigationGroupLabel, SideNavigationHeader, SideNavigationInset, SideNavigationItem, SideNavigationItemCollapsibleContent, SideNavigationItemCollapsibleRoot, SideNavigationItemCollapsibleTrigger, SideNavigationItemLabel, SideNavigationItemPrefixIcon, SideNavigationItemSuffixIcon, SideNavigationProvider, SideNavigationRoot, SideNavigationTrigger, SidePanel_namespace_exports as SidePanel, SidePanelBackdrop, SidePanelBody, SidePanelCloseButton, SidePanelContent, SidePanelDescription, SidePanelFooter, SidePanelHeader, SidePanelPositioner, SidePanelRoot, SidePanelTitle, SidePanelTrigger, Skeleton, Slider_namespace_exports as Slider, SliderControl, SliderHiddenInput, SliderMarker, SliderMarkers, SliderRange, SliderRoot, SliderThumb, SliderTick, SliderTrack, SliderValueIndicatorArrow, SliderValueIndicatorArrowTip, SliderValueIndicatorLabel, SliderValueIndicatorRoot, Snackbar_namespace_exports as Snackbar, SnackbarActionButton, SnackbarAvoidOverlap, SnackbarHiddenCloseButton, SnackbarMessage, SnackbarPrefixIcon, SnackbarRegion, SnackbarRenderer, SnackbarRoot, SnackbarRootProvider, Stack, SuffixIcon, SwipeableMenuSheet_namespace_exports as SwipeableMenuSheet, SwipeableMenuSheetBackdrop, SwipeableMenuSheetCloseButton, SwipeableMenuSheetContent, SwipeableMenuSheetDescription, SwipeableMenuSheetFooter, SwipeableMenuSheetGroup, SwipeableMenuSheetHandle, SwipeableMenuSheetHeader, SwipeableMenuSheetItem, SwipeableMenuSheetItemContent, SwipeableMenuSheetItemDescription, SwipeableMenuSheetItemLabel, SwipeableMenuSheetList, SwipeableMenuSheetPositioner, SwipeableMenuSheetRoot, SwipeableMenuSheetTitle, SwipeableMenuSheetTrigger, Switch_namespace_exports as Switch, SwitchControl, SwitchHiddenInput, SwitchLabel, SwitchRoot, SwitchThumb, Tabs_namespace_exports as Tabs, TabsCarousel, TabsCarouselCamera, TabsContent, TabsIndicator, TabsList, TabsRoot, TabsTrigger, TagGroup_namespace_exports as TagGroup, TagGroupItem, TagGroupItemLabel, TagGroupRoot, Text, TextField_namespace_exports as TextField, TextFieldInput, TextFieldPrefixIcon, TextFieldPrefixText, TextFieldRoot, TextFieldSuffixIcon, TextFieldSuffixText, TextFieldTextarea, TimePicker, ToggleButton, TwoMonthDatePicker, VStack, VisuallyHidden, WeekDatePicker, WheelPicker_namespace_exports as WheelPicker, WheelPickerColumn, WheelPickerItemLabel, WheelPickerRoot, compareDates, dateKey, dateOnOrAfter, dateOnOrBefore, excludeDates, isSameDate, maxSelectionCount, pullToRefreshPreventPull, rangeDayCountAtLeast, rangeDayCountAtMost, tabsCarouselPreventDrag, useBreakpoint, useBreakpointValue, useResponsiveDialogContext, useResponsiveSidePanelContext, useScaleFeedback, useSnackbarAdapter, useSnackbarContext, useTextFieldWithGraphemes };
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
const require_runtime = require("../_virtual/_rolldown/runtime.cjs");
|
|
3
|
+
let react = require("react");
|
|
4
|
+
react = require_runtime.__toESM(react);
|
|
5
|
+
//#region src/utils/elementSizeVars.tsx
|
|
6
|
+
/**
|
|
7
|
+
* Publishes an element's rendered size as CSS custom properties.
|
|
8
|
+
*
|
|
9
|
+
* The size is a plain fact about the element rather than a feature, so this
|
|
10
|
+
* util keeps unitless `--seed-element-width` / `--seed-element-height` in sync
|
|
11
|
+
* on the element and stops there. Whatever needs the size derives its own
|
|
12
|
+
* values from those vars in CSS.
|
|
13
|
+
*
|
|
14
|
+
* The names must stay in sync with `@seed-design/qvism-preset`
|
|
15
|
+
* (utils/scale-feedback.ts), which owns the formula that consumes them. Press
|
|
16
|
+
* detection stays in CSS (`:active` gates), so nothing here tracks interaction;
|
|
17
|
+
* without JS the vars are simply never set and consumers fall back to scale 1.
|
|
18
|
+
*/
|
|
19
|
+
var sharedObserver = null;
|
|
20
|
+
function getSharedObserver() {
|
|
21
|
+
sharedObserver ??= new ResizeObserver((entries) => {
|
|
22
|
+
const measurements = entries.map((entry) => {
|
|
23
|
+
const element = entry.target;
|
|
24
|
+
const size = entry.borderBoxSize?.[0];
|
|
25
|
+
return {
|
|
26
|
+
element,
|
|
27
|
+
width: size ? size.inlineSize : element.offsetWidth,
|
|
28
|
+
height: size ? size.blockSize : element.offsetHeight
|
|
29
|
+
};
|
|
30
|
+
});
|
|
31
|
+
for (const { element, width, height } of measurements) {
|
|
32
|
+
element.style.setProperty("--seed-element-width", String(width));
|
|
33
|
+
element.style.setProperty("--seed-element-height", String(height));
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
return sharedObserver;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* Returns a callback ref that keeps the size vars in sync on the element it is
|
|
40
|
+
* attached to. Compose it with the element's other refs however you like: being
|
|
41
|
+
* handed an element it already watches is a no-op, so the observation survives a
|
|
42
|
+
* ref whose identity changes every render and the vars are republished on resize
|
|
43
|
+
* rather than on render.
|
|
44
|
+
*
|
|
45
|
+
* Teardown still runs when the ref genuinely leaves an element — it is unobserved
|
|
46
|
+
* and its vars removed — so an element that keeps the class but loses the ref
|
|
47
|
+
* falls back to a ratio of 1 instead of holding a stale one.
|
|
48
|
+
*/
|
|
49
|
+
function useElementSizeVars() {
|
|
50
|
+
const attachedRef = react.useRef(null);
|
|
51
|
+
const observedRef = react.useRef(null);
|
|
52
|
+
const release = react.useCallback(() => {
|
|
53
|
+
const observed = observedRef.current;
|
|
54
|
+
if (!observed) return;
|
|
55
|
+
observedRef.current = null;
|
|
56
|
+
getSharedObserver().unobserve(observed);
|
|
57
|
+
observed.style.removeProperty("--seed-element-width");
|
|
58
|
+
observed.style.removeProperty("--seed-element-height");
|
|
59
|
+
}, []);
|
|
60
|
+
return { sizeVarsRef: react.useCallback((node) => {
|
|
61
|
+
attachedRef.current = node;
|
|
62
|
+
if (!node) {
|
|
63
|
+
queueMicrotask(() => {
|
|
64
|
+
if (attachedRef.current === observedRef.current) return;
|
|
65
|
+
release();
|
|
66
|
+
});
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
if (observedRef.current === node) return;
|
|
70
|
+
release();
|
|
71
|
+
observedRef.current = node;
|
|
72
|
+
getSharedObserver().observe(node, { box: "border-box" });
|
|
73
|
+
}, [release]) };
|
|
74
|
+
}
|
|
75
|
+
//#endregion
|
|
76
|
+
exports.useElementSizeVars = useElementSizeVars;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Returns a callback ref that keeps the size vars in sync on the element it is
|
|
3
|
+
* attached to. Compose it with the element's other refs however you like: being
|
|
4
|
+
* handed an element it already watches is a no-op, so the observation survives a
|
|
5
|
+
* ref whose identity changes every render and the vars are republished on resize
|
|
6
|
+
* rather than on render.
|
|
7
|
+
*
|
|
8
|
+
* Teardown still runs when the ref genuinely leaves an element — it is unobserved
|
|
9
|
+
* and its vars removed — so an element that keeps the class but loses the ref
|
|
10
|
+
* falls back to a ratio of 1 instead of holding a stale one.
|
|
11
|
+
*/
|
|
12
|
+
export declare function useElementSizeVars(): {
|
|
13
|
+
sizeVarsRef: (node: HTMLElement | null) => void;
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=elementSizeVars.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"elementSizeVars.d.ts","sourceRoot":"","sources":["../../src/utils/elementSizeVars.tsx"],"names":[],"mappings":"AAgDA;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB;wBAkBvB,WAAW,GAAG,IAAI;EAkC5B"}
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import * as React$1 from "react";
|
|
3
|
+
//#region src/utils/elementSizeVars.tsx
|
|
4
|
+
/**
|
|
5
|
+
* Publishes an element's rendered size as CSS custom properties.
|
|
6
|
+
*
|
|
7
|
+
* The size is a plain fact about the element rather than a feature, so this
|
|
8
|
+
* util keeps unitless `--seed-element-width` / `--seed-element-height` in sync
|
|
9
|
+
* on the element and stops there. Whatever needs the size derives its own
|
|
10
|
+
* values from those vars in CSS.
|
|
11
|
+
*
|
|
12
|
+
* The names must stay in sync with `@seed-design/qvism-preset`
|
|
13
|
+
* (utils/scale-feedback.ts), which owns the formula that consumes them. Press
|
|
14
|
+
* detection stays in CSS (`:active` gates), so nothing here tracks interaction;
|
|
15
|
+
* without JS the vars are simply never set and consumers fall back to scale 1.
|
|
16
|
+
*/
|
|
17
|
+
var sharedObserver = null;
|
|
18
|
+
function getSharedObserver() {
|
|
19
|
+
sharedObserver ??= new ResizeObserver((entries) => {
|
|
20
|
+
const measurements = entries.map((entry) => {
|
|
21
|
+
const element = entry.target;
|
|
22
|
+
const size = entry.borderBoxSize?.[0];
|
|
23
|
+
return {
|
|
24
|
+
element,
|
|
25
|
+
width: size ? size.inlineSize : element.offsetWidth,
|
|
26
|
+
height: size ? size.blockSize : element.offsetHeight
|
|
27
|
+
};
|
|
28
|
+
});
|
|
29
|
+
for (const { element, width, height } of measurements) {
|
|
30
|
+
element.style.setProperty("--seed-element-width", String(width));
|
|
31
|
+
element.style.setProperty("--seed-element-height", String(height));
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
return sharedObserver;
|
|
35
|
+
}
|
|
36
|
+
/**
|
|
37
|
+
* Returns a callback ref that keeps the size vars in sync on the element it is
|
|
38
|
+
* attached to. Compose it with the element's other refs however you like: being
|
|
39
|
+
* handed an element it already watches is a no-op, so the observation survives a
|
|
40
|
+
* ref whose identity changes every render and the vars are republished on resize
|
|
41
|
+
* rather than on render.
|
|
42
|
+
*
|
|
43
|
+
* Teardown still runs when the ref genuinely leaves an element — it is unobserved
|
|
44
|
+
* and its vars removed — so an element that keeps the class but loses the ref
|
|
45
|
+
* falls back to a ratio of 1 instead of holding a stale one.
|
|
46
|
+
*/
|
|
47
|
+
function useElementSizeVars() {
|
|
48
|
+
const attachedRef = React$1.useRef(null);
|
|
49
|
+
const observedRef = React$1.useRef(null);
|
|
50
|
+
const release = React$1.useCallback(() => {
|
|
51
|
+
const observed = observedRef.current;
|
|
52
|
+
if (!observed) return;
|
|
53
|
+
observedRef.current = null;
|
|
54
|
+
getSharedObserver().unobserve(observed);
|
|
55
|
+
observed.style.removeProperty("--seed-element-width");
|
|
56
|
+
observed.style.removeProperty("--seed-element-height");
|
|
57
|
+
}, []);
|
|
58
|
+
return { sizeVarsRef: React$1.useCallback((node) => {
|
|
59
|
+
attachedRef.current = node;
|
|
60
|
+
if (!node) {
|
|
61
|
+
queueMicrotask(() => {
|
|
62
|
+
if (attachedRef.current === observedRef.current) return;
|
|
63
|
+
release();
|
|
64
|
+
});
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
if (observedRef.current === node) return;
|
|
68
|
+
release();
|
|
69
|
+
observedRef.current = node;
|
|
70
|
+
getSharedObserver().observe(node, { box: "border-box" });
|
|
71
|
+
}, [release]) };
|
|
72
|
+
}
|
|
73
|
+
//#endregion
|
|
74
|
+
export { useElementSizeVars };
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
const require_runtime = require("../_virtual/_rolldown/runtime.cjs");
|
|
3
|
+
const require_elementSizeVars = require("./elementSizeVars.cjs");
|
|
4
|
+
let clsx = require("clsx");
|
|
5
|
+
clsx = require_runtime.__toESM(clsx);
|
|
6
|
+
let react = require("react");
|
|
7
|
+
react = require_runtime.__toESM(react);
|
|
8
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
9
|
+
let _radix_ui_react_compose_refs = require("@radix-ui/react-compose-refs");
|
|
10
|
+
let _seed_design_css_scale_feedback = require("@seed-design/css/scale-feedback");
|
|
11
|
+
let _radix_ui_react_slot = require("@radix-ui/react-slot");
|
|
12
|
+
//#region src/utils/scaleFeedback.tsx
|
|
13
|
+
/**
|
|
14
|
+
* Opts an element into scale feedback: put `scaleFeedbackRef` and
|
|
15
|
+
* `scaleFeedbackClassName` on the same element, and it publishes
|
|
16
|
+
* `--seed-feedback-scale`, a ratio that shrinks it by a fixed 2px when consumed.
|
|
17
|
+
* `ScaleFeedback` pairs them up for an element you render; reach for the hook when
|
|
18
|
+
* you can't wrap one, such as inside a component already assembling its own
|
|
19
|
+
* `ref` and `className`.
|
|
20
|
+
*
|
|
21
|
+
* The two halves belong together — the size vars `useElementSizeVars` publishes,
|
|
22
|
+
* and the class that derives the ratio from them — so the hook hands them back
|
|
23
|
+
* as a pair. If one goes missing the derivation stays guaranteed-invalid and
|
|
24
|
+
* `--seed-feedback-scale` resolves to 1: a mistake costs the effect rather than
|
|
25
|
+
* producing a wrong scale.
|
|
26
|
+
*
|
|
27
|
+
* Applying the ratio is yours, because the selector that scales the element is
|
|
28
|
+
* usually the same one that changes its background, and splitting them across
|
|
29
|
+
* two rules lets them fire under different conditions:
|
|
30
|
+
*
|
|
31
|
+
* .my-button {
|
|
32
|
+
* transition: background-color 0.2s, var(--seed-feedback-scale-transition);
|
|
33
|
+
* }
|
|
34
|
+
* .my-button:active {
|
|
35
|
+
* background-color: ...;
|
|
36
|
+
* scale: var(--seed-feedback-scale);
|
|
37
|
+
* }
|
|
38
|
+
*
|
|
39
|
+
* The resting `scale: 1` comes with the class rather than with the rule above:
|
|
40
|
+
* it keeps the element a stacking context throughout, instead of becoming one
|
|
41
|
+
* mid-press and dragging `position: fixed` descendants with it.
|
|
42
|
+
*/
|
|
43
|
+
function useScaleFeedback() {
|
|
44
|
+
const { sizeVarsRef } = require_elementSizeVars.useElementSizeVars();
|
|
45
|
+
return {
|
|
46
|
+
scaleFeedbackRef: sizeVarsRef,
|
|
47
|
+
scaleFeedbackClassName: _seed_design_css_scale_feedback.SCALE_FEEDBACK_CLASS_NAME
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
var ScaleFeedbackSlot = (0, _radix_ui_react_slot.createSlot)("ScaleFeedback");
|
|
51
|
+
/**
|
|
52
|
+
* Opts its child into scale feedback, so the ref and the class can no longer
|
|
53
|
+
* land on different elements or go missing one at a time. The child keeps its own
|
|
54
|
+
* `ref` and `className`, and applying the ratio is still yours — see
|
|
55
|
+
* `useScaleFeedback` for the rule this expects you to write.
|
|
56
|
+
*
|
|
57
|
+
* There is no `asChild` prop because rendering an element of our own is never the
|
|
58
|
+
* right answer: that element would be the one measured, and a block wrapper around
|
|
59
|
+
* an inline-block button reports the container's width, so the ratio would come
|
|
60
|
+
* out wrong rather than absent. The resting `scale: 1` would settle on the wrapper
|
|
61
|
+
* too, leaving the child to become a stacking context mid-press.
|
|
62
|
+
*/
|
|
63
|
+
var ScaleFeedback = react.forwardRef(({ children }, ref) => {
|
|
64
|
+
const { scaleFeedbackRef, scaleFeedbackClassName } = useScaleFeedback();
|
|
65
|
+
const childRef = react.useRef(null);
|
|
66
|
+
const composedRef = (0, _radix_ui_react_compose_refs.useComposedRefs)(scaleFeedbackRef, childRef, ref);
|
|
67
|
+
react.useEffect(() => {
|
|
68
|
+
if (process.env.NODE_ENV === "production") return;
|
|
69
|
+
const node = childRef.current;
|
|
70
|
+
if (!node) {
|
|
71
|
+
console.warn("ScaleFeedback: the child never forwarded `ref` to a DOM element, so its size is never measured. A Fragment cannot receive one.");
|
|
72
|
+
return;
|
|
73
|
+
}
|
|
74
|
+
if (!node.classList.contains(_seed_design_css_scale_feedback.SCALE_FEEDBACK_CLASS_NAME)) console.warn("ScaleFeedback: the child dropped the `className` it was handed, so no ratio is derived. Forward `className` to the element that takes `ref`.");
|
|
75
|
+
}, []);
|
|
76
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScaleFeedbackSlot, {
|
|
77
|
+
ref: composedRef,
|
|
78
|
+
className: scaleFeedbackClassName,
|
|
79
|
+
children
|
|
80
|
+
});
|
|
81
|
+
});
|
|
82
|
+
ScaleFeedback.displayName = "ScaleFeedback";
|
|
83
|
+
function withScaleFeedback(Component) {
|
|
84
|
+
const Pressable = react.forwardRef((props, ref) => {
|
|
85
|
+
const { scaleFeedbackRef, scaleFeedbackClassName } = useScaleFeedback();
|
|
86
|
+
const composedRef = (0, _radix_ui_react_compose_refs.useComposedRefs)(scaleFeedbackRef, ref);
|
|
87
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
|
|
88
|
+
...props,
|
|
89
|
+
ref: composedRef,
|
|
90
|
+
className: (0, clsx.default)(scaleFeedbackClassName, props.className)
|
|
91
|
+
});
|
|
92
|
+
});
|
|
93
|
+
Pressable.displayName = Component.displayName;
|
|
94
|
+
return Pressable;
|
|
95
|
+
}
|
|
96
|
+
//#endregion
|
|
97
|
+
exports.ScaleFeedback = ScaleFeedback;
|
|
98
|
+
exports.useScaleFeedback = useScaleFeedback;
|
|
99
|
+
exports.withScaleFeedback = withScaleFeedback;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Opts an element into scale feedback: put `scaleFeedbackRef` and
|
|
4
|
+
* `scaleFeedbackClassName` on the same element, and it publishes
|
|
5
|
+
* `--seed-feedback-scale`, a ratio that shrinks it by a fixed 2px when consumed.
|
|
6
|
+
* `ScaleFeedback` pairs them up for an element you render; reach for the hook when
|
|
7
|
+
* you can't wrap one, such as inside a component already assembling its own
|
|
8
|
+
* `ref` and `className`.
|
|
9
|
+
*
|
|
10
|
+
* The two halves belong together — the size vars `useElementSizeVars` publishes,
|
|
11
|
+
* and the class that derives the ratio from them — so the hook hands them back
|
|
12
|
+
* as a pair. If one goes missing the derivation stays guaranteed-invalid and
|
|
13
|
+
* `--seed-feedback-scale` resolves to 1: a mistake costs the effect rather than
|
|
14
|
+
* producing a wrong scale.
|
|
15
|
+
*
|
|
16
|
+
* Applying the ratio is yours, because the selector that scales the element is
|
|
17
|
+
* usually the same one that changes its background, and splitting them across
|
|
18
|
+
* two rules lets them fire under different conditions:
|
|
19
|
+
*
|
|
20
|
+
* .my-button {
|
|
21
|
+
* transition: background-color 0.2s, var(--seed-feedback-scale-transition);
|
|
22
|
+
* }
|
|
23
|
+
* .my-button:active {
|
|
24
|
+
* background-color: ...;
|
|
25
|
+
* scale: var(--seed-feedback-scale);
|
|
26
|
+
* }
|
|
27
|
+
*
|
|
28
|
+
* The resting `scale: 1` comes with the class rather than with the rule above:
|
|
29
|
+
* it keeps the element a stacking context throughout, instead of becoming one
|
|
30
|
+
* mid-press and dragging `position: fixed` descendants with it.
|
|
31
|
+
*/
|
|
32
|
+
export declare function useScaleFeedback(): {
|
|
33
|
+
scaleFeedbackRef: (node: HTMLElement | null) => void;
|
|
34
|
+
scaleFeedbackClassName: "seed-scale-feedback";
|
|
35
|
+
};
|
|
36
|
+
export interface ScaleFeedbackProps {
|
|
37
|
+
children: React.ReactElement;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* Opts its child into scale feedback, so the ref and the class can no longer
|
|
41
|
+
* land on different elements or go missing one at a time. The child keeps its own
|
|
42
|
+
* `ref` and `className`, and applying the ratio is still yours — see
|
|
43
|
+
* `useScaleFeedback` for the rule this expects you to write.
|
|
44
|
+
*
|
|
45
|
+
* There is no `asChild` prop because rendering an element of our own is never the
|
|
46
|
+
* right answer: that element would be the one measured, and a block wrapper around
|
|
47
|
+
* an inline-block button reports the container's width, so the ratio would come
|
|
48
|
+
* out wrong rather than absent. The resting `scale: 1` would settle on the wrapper
|
|
49
|
+
* too, leaving the child to become a stacking context mid-press.
|
|
50
|
+
*/
|
|
51
|
+
export declare const ScaleFeedback: React.ForwardRefExoticComponent<ScaleFeedbackProps & React.RefAttributes<HTMLElement>>;
|
|
52
|
+
/**
|
|
53
|
+
* Wraps a component so its element opts into scale feedback — for one-liner
|
|
54
|
+
* factory components (`withContext`/`withProvider` results). Hand-written
|
|
55
|
+
* forwardRef components call `useScaleFeedback` directly instead.
|
|
56
|
+
*/
|
|
57
|
+
export declare function withScaleFeedback<P>(Component: React.ForwardRefExoticComponent<P>): React.ForwardRefExoticComponent<P>;
|
|
58
|
+
//# sourceMappingURL=scaleFeedback.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scaleFeedback.d.ts","sourceRoot":"","sources":["../../src/utils/scaleFeedback.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,gBAAgB;;;EAI/B;AAID,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC;CAC9B;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,aAAa,wFAkCzB,CAAC;AAIF;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,EACjC,SAAS,EAAE,KAAK,CAAC,yBAAyB,CAAC,CAAC,CAAC,GAC5C,KAAK,CAAC,yBAAyB,CAAC,CAAC,CAAC,CAAC"}
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { useElementSizeVars } from "./elementSizeVars.js";
|
|
3
|
+
import clsx$1 from "clsx";
|
|
4
|
+
import * as React$1 from "react";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
|
+
import { useComposedRefs } from "@radix-ui/react-compose-refs";
|
|
7
|
+
import { SCALE_FEEDBACK_CLASS_NAME } from "@seed-design/css/scale-feedback";
|
|
8
|
+
import { createSlot } from "@radix-ui/react-slot";
|
|
9
|
+
//#region src/utils/scaleFeedback.tsx
|
|
10
|
+
/**
|
|
11
|
+
* Opts an element into scale feedback: put `scaleFeedbackRef` and
|
|
12
|
+
* `scaleFeedbackClassName` on the same element, and it publishes
|
|
13
|
+
* `--seed-feedback-scale`, a ratio that shrinks it by a fixed 2px when consumed.
|
|
14
|
+
* `ScaleFeedback` pairs them up for an element you render; reach for the hook when
|
|
15
|
+
* you can't wrap one, such as inside a component already assembling its own
|
|
16
|
+
* `ref` and `className`.
|
|
17
|
+
*
|
|
18
|
+
* The two halves belong together — the size vars `useElementSizeVars` publishes,
|
|
19
|
+
* and the class that derives the ratio from them — so the hook hands them back
|
|
20
|
+
* as a pair. If one goes missing the derivation stays guaranteed-invalid and
|
|
21
|
+
* `--seed-feedback-scale` resolves to 1: a mistake costs the effect rather than
|
|
22
|
+
* producing a wrong scale.
|
|
23
|
+
*
|
|
24
|
+
* Applying the ratio is yours, because the selector that scales the element is
|
|
25
|
+
* usually the same one that changes its background, and splitting them across
|
|
26
|
+
* two rules lets them fire under different conditions:
|
|
27
|
+
*
|
|
28
|
+
* .my-button {
|
|
29
|
+
* transition: background-color 0.2s, var(--seed-feedback-scale-transition);
|
|
30
|
+
* }
|
|
31
|
+
* .my-button:active {
|
|
32
|
+
* background-color: ...;
|
|
33
|
+
* scale: var(--seed-feedback-scale);
|
|
34
|
+
* }
|
|
35
|
+
*
|
|
36
|
+
* The resting `scale: 1` comes with the class rather than with the rule above:
|
|
37
|
+
* it keeps the element a stacking context throughout, instead of becoming one
|
|
38
|
+
* mid-press and dragging `position: fixed` descendants with it.
|
|
39
|
+
*/
|
|
40
|
+
function useScaleFeedback() {
|
|
41
|
+
const { sizeVarsRef } = useElementSizeVars();
|
|
42
|
+
return {
|
|
43
|
+
scaleFeedbackRef: sizeVarsRef,
|
|
44
|
+
scaleFeedbackClassName: SCALE_FEEDBACK_CLASS_NAME
|
|
45
|
+
};
|
|
46
|
+
}
|
|
47
|
+
var ScaleFeedbackSlot = createSlot("ScaleFeedback");
|
|
48
|
+
/**
|
|
49
|
+
* Opts its child into scale feedback, so the ref and the class can no longer
|
|
50
|
+
* land on different elements or go missing one at a time. The child keeps its own
|
|
51
|
+
* `ref` and `className`, and applying the ratio is still yours — see
|
|
52
|
+
* `useScaleFeedback` for the rule this expects you to write.
|
|
53
|
+
*
|
|
54
|
+
* There is no `asChild` prop because rendering an element of our own is never the
|
|
55
|
+
* right answer: that element would be the one measured, and a block wrapper around
|
|
56
|
+
* an inline-block button reports the container's width, so the ratio would come
|
|
57
|
+
* out wrong rather than absent. The resting `scale: 1` would settle on the wrapper
|
|
58
|
+
* too, leaving the child to become a stacking context mid-press.
|
|
59
|
+
*/
|
|
60
|
+
var ScaleFeedback = React$1.forwardRef(({ children }, ref) => {
|
|
61
|
+
const { scaleFeedbackRef, scaleFeedbackClassName } = useScaleFeedback();
|
|
62
|
+
const childRef = React$1.useRef(null);
|
|
63
|
+
const composedRef = useComposedRefs(scaleFeedbackRef, childRef, ref);
|
|
64
|
+
React$1.useEffect(() => {
|
|
65
|
+
if (process.env.NODE_ENV === "production") return;
|
|
66
|
+
const node = childRef.current;
|
|
67
|
+
if (!node) {
|
|
68
|
+
console.warn("ScaleFeedback: the child never forwarded `ref` to a DOM element, so its size is never measured. A Fragment cannot receive one.");
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
if (!node.classList.contains(SCALE_FEEDBACK_CLASS_NAME)) console.warn("ScaleFeedback: the child dropped the `className` it was handed, so no ratio is derived. Forward `className` to the element that takes `ref`.");
|
|
72
|
+
}, []);
|
|
73
|
+
return /* @__PURE__ */ jsx(ScaleFeedbackSlot, {
|
|
74
|
+
ref: composedRef,
|
|
75
|
+
className: scaleFeedbackClassName,
|
|
76
|
+
children
|
|
77
|
+
});
|
|
78
|
+
});
|
|
79
|
+
ScaleFeedback.displayName = "ScaleFeedback";
|
|
80
|
+
function withScaleFeedback(Component) {
|
|
81
|
+
const Pressable = React$1.forwardRef((props, ref) => {
|
|
82
|
+
const { scaleFeedbackRef, scaleFeedbackClassName } = useScaleFeedback();
|
|
83
|
+
const composedRef = useComposedRefs(scaleFeedbackRef, ref);
|
|
84
|
+
return /* @__PURE__ */ jsx(Component, {
|
|
85
|
+
...props,
|
|
86
|
+
ref: composedRef,
|
|
87
|
+
className: clsx$1(scaleFeedbackClassName, props.className)
|
|
88
|
+
});
|
|
89
|
+
});
|
|
90
|
+
Pressable.displayName = Component.displayName;
|
|
91
|
+
return Pressable;
|
|
92
|
+
}
|
|
93
|
+
//#endregion
|
|
94
|
+
export { ScaleFeedback, useScaleFeedback, withScaleFeedback };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@seed-design/react",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.4.0",
|
|
4
4
|
"repository": {
|
|
5
5
|
"type": "git",
|
|
6
6
|
"url": "git+https://github.com/daangn/seed-design.git",
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
"@seed-design/react-checkbox": "^2.0.1",
|
|
50
50
|
"@seed-design/react-collapsible": "^1.0.1",
|
|
51
51
|
"@seed-design/react-dialog": "^2.0.3",
|
|
52
|
-
"@seed-design/react-date-picker": "^1.
|
|
52
|
+
"@seed-design/react-date-picker": "^1.2.0",
|
|
53
53
|
"@seed-design/react-drawer": "^2.0.6",
|
|
54
54
|
"@seed-design/react-field": "^2.0.1",
|
|
55
55
|
"@seed-design/react-field-button": "^2.0.1",
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
"@seed-design/react-portal": "^2.0.1",
|
|
64
64
|
"@seed-design/react-primitive": "^2.0.1",
|
|
65
65
|
"@seed-design/react-progress": "^2.0.1",
|
|
66
|
-
"@seed-design/react-pull-to-refresh": "^2.0
|
|
66
|
+
"@seed-design/react-pull-to-refresh": "^2.1.0",
|
|
67
67
|
"@seed-design/react-quantity-picker": "^1.0.0",
|
|
68
68
|
"@seed-design/react-radio-group": "^2.0.1",
|
|
69
69
|
"@seed-design/react-segmented-control": "^2.0.2",
|
|
@@ -77,7 +77,7 @@
|
|
|
77
77
|
"@seed-design/react-time-picker": "^1.0.0",
|
|
78
78
|
"@seed-design/react-toggle": "^2.0.1",
|
|
79
79
|
"@seed-design/react-tooltip": "^1.0.1",
|
|
80
|
-
"@seed-design/react-wheel-picker": "^1.
|
|
80
|
+
"@seed-design/react-wheel-picker": "^1.1.0",
|
|
81
81
|
"clsx": "^2.1.1",
|
|
82
82
|
"unicode-segmenter": "^0.17.3"
|
|
83
83
|
},
|
|
@@ -2,9 +2,11 @@ import {
|
|
|
2
2
|
actionButton,
|
|
3
3
|
type ActionButtonVariantProps,
|
|
4
4
|
} from "@seed-design/css/recipes/action-button";
|
|
5
|
+
import { useComposedRefs } from "@radix-ui/react-compose-refs";
|
|
5
6
|
import { Primitive, type PrimitiveProps } from "@seed-design/react-primitive";
|
|
6
7
|
import clsx from "clsx";
|
|
7
8
|
import * as React from "react";
|
|
9
|
+
import { useScaleFeedback } from "../../utils/scaleFeedback";
|
|
8
10
|
import { handleColor, useStyleProps, type StyleProps } from "../../utils/styled";
|
|
9
11
|
import { IconRequired } from "../Icon/Icon";
|
|
10
12
|
import {
|
|
@@ -58,6 +60,7 @@ export const ActionButton = React.forwardRef<HTMLButtonElement, ActionButtonProp
|
|
|
58
60
|
const recipeClassName = actionButton({ variant, layout, size });
|
|
59
61
|
const api = usePendingButton({ loading, disabled: otherProps.disabled });
|
|
60
62
|
const { style, restProps } = useStyleProps(otherProps);
|
|
63
|
+
const { scaleFeedbackRef, scaleFeedbackClassName } = useScaleFeedback();
|
|
61
64
|
|
|
62
65
|
if (layout === "iconOnly" && !(otherProps["aria-label"] || otherProps["aria-labelledby"])) {
|
|
63
66
|
console.warn(
|
|
@@ -69,8 +72,8 @@ export const ActionButton = React.forwardRef<HTMLButtonElement, ActionButtonProp
|
|
|
69
72
|
<PendingButtonProvider value={api}>
|
|
70
73
|
<IconRequired enabled={layout === "iconOnly"}>
|
|
71
74
|
<Primitive.button
|
|
72
|
-
ref={ref}
|
|
73
|
-
className={clsx(recipeClassName, className)}
|
|
75
|
+
ref={useComposedRefs(scaleFeedbackRef, ref)}
|
|
76
|
+
className={clsx(recipeClassName, scaleFeedbackClassName, className)}
|
|
74
77
|
// NOTE: Should we handle color as a style prop?
|
|
75
78
|
style={
|
|
76
79
|
{
|