@mks2508/mks-ui 0.6.2 → 0.6.4

package/dist/react-ui/index.js

@@ -37,7 +37,7 @@ import { AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescript
 import { checkboxStyles } from "./ui/Checkbox/Checkbox.styles.js";
 import { Checkbox, CheckboxIndicator, useCheckbox } from "./ui/Checkbox/index.js";
 import { dialogStyles } from "./ui/Dialog/Dialog.styles.js";
-import { Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, DialogViewport, useDialog } from "./ui/Dialog/index.js";
+import { Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, useDialog } from "./ui/Dialog/index.js";
 import { useDataState } from "./hooks/State/UseDataState.js";
 import { Menu, MenuArrow, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuGroup, MenuGroupLabel, MenuHighlight, MenuHighlightItem, MenuItem, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuSeparator, MenuShortcut, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, useMenu, useMenuActiveValue } from "./ui/Menu/index.js";
 import { popoverStyles } from "./ui/Popover/Popover.styles.js";
@@ -115,4 +115,4 @@ import { HugeIcons } from "./icons/index.js";
 import { IconWrapper } from "./lib/icon-wrapper.js";
 import "./lib/index.js";
 
-export { ANIMATION_CONFIGS, ANIMATION_DEFAULTS, Accordion, AccordionHeader, AccordionItem, AccordionPanel, AccordionStyles, AccordionTrigger, ActivityIcon, AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPopup, AlertDialogPortal, AlertDialogStyles, AlertDialogTitle, AlertDialogTrigger, ArrowDownToLineIcon, ArrowUpIcon, AutoHeight, Badge, BellElectricIcon, BellIcon, BotIcon, BoxIcon, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Check, Checkbox, CheckboxIndicator, CircleCheckIcon, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, CornerBracket, CountingNumber, DataCard, DataCardActions, DataCardBracket, DataCardLabel, DataCardToggle, DataCardValue, DeleteIcon, Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, DialogViewport, DownloadIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicToggle, DynamicToggleGroup, DynamicToggleOption, EASINGS, EFFECTS, Edit2, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, GOOEY_DEFAULTS, Globe, GooeyCanvas, GooeyFilter, Highlight, HighlightItem, HomeIcon, HugeIcons, IconWrapper, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, Layers, LayoutPanelTopIcon, ListIcon, Menu, MenuArrow, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuGroup, MenuGroupLabel, MenuHighlight, MenuHighlightItem, MenuItem, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuSeparator, MenuShortcut, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, Morph, MorphPath, MorphingPopover, MorphingPopoverWithTarget, PRESETS, Package, Palette, PlusIcon, Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverDescription, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverTitle, PopoverTrigger, Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, RESPONSIVE_CONFIGS, RefreshCw, ReorderRoot as Reorder, Rocket, Save, SearchIcon, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, SettingsIcon, SlidingNumber, SlidingText, Slot, Switch, SwitchIcon, SwitchThumb, TIMING, TRANSFORMS, Tabs, TabsHighlight, TabsHighlightItem, TabsList, TabsPanel, TabsPanels, TabsTab, TerminalIcon, TextFlow, Textarea, Tooltip, TooltipArrow, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipProvider, TooltipTrigger, Trash2, TrendingDownIcon, TrendingUpIcon, Type, Upload, XIcon, accordionVariants, badgeVariants, bracketVariants, buildColorMatrixValues, buildFilterString, buttonStateStyles, buttonVariants, calculateSeparatorCoordination, cardVariants, checkboxStyles, cn, computeBlur, dataCardStyles, dataCardVariants, dialogStyles, dynamicToggleStyles, dynamicToggleVariants, fieldVariants, getResponsiveDuration, getResponsiveStagger, getStrictContext, inputGroupAddonVariants, inputGroupButtonVariants, morphPathDown, morphPathUp, popoverStyles, progressStyles, shouldShowSeparator, switchStyles, tabsIndicatorVariants, tabsListVariants, tabsTabVariants, tooltipStyles, useAccordionItem, useAlertDialog, useAnimationOrchestrator, useAutoHeight, useCSSGridMorph, useCheckbox, useComboboxAnchor, useControlledState, useDataCard, useDataState, useDialog, useDynamicToggle, useElementRegistry, useFLIPAnimation, useFLIPClipPath, useHighlight, useIsInView, useListFormat, useMenu, useMenuActiveValue, useMorph, useMorphContext, useMorphPath, usePopover, usePositionCapture, useProgress, useReorder, useReorderPresence, useSwitch, useTooltip, useViewTransitions };
+export { ANIMATION_CONFIGS, ANIMATION_DEFAULTS, Accordion, AccordionHeader, AccordionItem, AccordionPanel, AccordionStyles, AccordionTrigger, ActivityIcon, AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPopup, AlertDialogPortal, AlertDialogStyles, AlertDialogTitle, AlertDialogTrigger, ArrowDownToLineIcon, ArrowUpIcon, AutoHeight, Badge, BellElectricIcon, BellIcon, BotIcon, BoxIcon, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Check, Checkbox, CheckboxIndicator, CircleCheckIcon, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, CornerBracket, CountingNumber, DataCard, DataCardActions, DataCardBracket, DataCardLabel, DataCardToggle, DataCardValue, DeleteIcon, Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, DownloadIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicToggle, DynamicToggleGroup, DynamicToggleOption, EASINGS, EFFECTS, Edit2, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, GOOEY_DEFAULTS, Globe, GooeyCanvas, GooeyFilter, Highlight, HighlightItem, HomeIcon, HugeIcons, IconWrapper, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, Layers, LayoutPanelTopIcon, ListIcon, Menu, MenuArrow, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuGroup, MenuGroupLabel, MenuHighlight, MenuHighlightItem, MenuItem, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuSeparator, MenuShortcut, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, Morph, MorphPath, MorphingPopover, MorphingPopoverWithTarget, PRESETS, Package, Palette, PlusIcon, Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverDescription, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverTitle, PopoverTrigger, Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, RESPONSIVE_CONFIGS, RefreshCw, ReorderRoot as Reorder, Rocket, Save, SearchIcon, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, SettingsIcon, SlidingNumber, SlidingText, Slot, Switch, SwitchIcon, SwitchThumb, TIMING, TRANSFORMS, Tabs, TabsHighlight, TabsHighlightItem, TabsList, TabsPanel, TabsPanels, TabsTab, TerminalIcon, TextFlow, Textarea, Tooltip, TooltipArrow, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipProvider, TooltipTrigger, Trash2, TrendingDownIcon, TrendingUpIcon, Type, Upload, XIcon, accordionVariants, badgeVariants, bracketVariants, buildColorMatrixValues, buildFilterString, buttonStateStyles, buttonVariants, calculateSeparatorCoordination, cardVariants, checkboxStyles, cn, computeBlur, dataCardStyles, dataCardVariants, dialogStyles, dynamicToggleStyles, dynamicToggleVariants, fieldVariants, getResponsiveDuration, getResponsiveStagger, getStrictContext, inputGroupAddonVariants, inputGroupButtonVariants, morphPathDown, morphPathUp, popoverStyles, progressStyles, shouldShowSeparator, switchStyles, tabsIndicatorVariants, tabsListVariants, tabsTabVariants, tooltipStyles, useAccordionItem, useAlertDialog, useAnimationOrchestrator, useAutoHeight, useCSSGridMorph, useCheckbox, useComboboxAnchor, useControlledState, useDataCard, useDataState, useDialog, useDynamicToggle, useElementRegistry, useFLIPAnimation, useFLIPClipPath, useHighlight, useIsInView, useListFormat, useMenu, useMenuActiveValue, useMorph, useMorphContext, useMorphPath, usePopover, usePositionCapture, useProgress, useReorder, useReorderPresence, useSwitch, useTooltip, useViewTransitions };

package/dist/react-ui/ui/AlertDialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/AlertDialog/index.tsx"],"names":[],"mappings":"AAiEA,OAAO,KAAK,EACV,sBAAsB,EACtB,iBAAiB,EACjB,wBAAwB,EACxB,uBAAuB,EACvB,yBAAyB,EACzB,sBAAsB,EACtB,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,EACvB,sBAAsB,EACtB,4BAA4B,EAC7B,MAAM,qBAAqB,CAAC;AAM7B,QAAA,MAA4B,cAAc,8BACsB,CAAC;AAMjE;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,iBAAS,WAAW,CAAC,EACnB,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,OAAO,EACf,GAAG,KAAK,EACT,EAAE,iBAAiB,2CAgBnB;AAMD;;;;;;;;;;;;;GAaG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,KAAK,EAAE,MAAM,EACb,GAAG,KAAK,EACT,EAAE,wBAAwB,2CAO1B;AAMD;;;;;;;;;;;;;;;;;GAiBG;AACH,iBAAS,iBAAiB,CAAC,KAAK,EAAE,uBAAuB,2CAcxD;AAMD;;;;;;;;;;;;;;;;;;GAkBG;AACH,iBAAS,mBAAmB,CAAC,EAC3B,UAAiD,EACjD,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,yBAAyB,2CAqB3B;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,iBAAS,gBAAgB,CAAC,EACxB,IAAY,EACZ,YAAY,EACZ,UAAU,EACV,UAA4D,EAC5D,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAoCxB;AAMD;;;;;;;;;;;;;GAaG;AACH,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAQxB;AAMD;;;;;;;;;;;;;;GAcG;AACH,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAQzB;AAMD;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAQzB;AAMD;;;;;;;;;;;;;GAaG;AACH,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAQxB;AAMD;;;;;;;;;;;;;;;GAeG;AACH,iBAAS,sBAAsB,CAAC,EAC9B,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,4BAA4B,2CAY9B;AAMD,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,cAAc,GACf,CAAC;AAGF,YAAY,EACV,iBAAiB,EACjB,wBAAwB,EACxB,uBAAuB,EACvB,sBAAsB,EACtB,yBAAyB,EACzB,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,EACvB,sBAAsB,EACtB,4BAA4B,EAC5B,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,wBAAwB,GACzB,MAAM,qBAAqB,CAAC;AAG7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/AlertDialog/index.tsx"],"names":[],"mappings":"AAiEA,OAAO,KAAK,EACV,sBAAsB,EACtB,iBAAiB,EACjB,wBAAwB,EACxB,uBAAuB,EACvB,yBAAyB,EACzB,sBAAsB,EACtB,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,EACvB,sBAAsB,EACtB,4BAA4B,EAC7B,MAAM,qBAAqB,CAAC;AAM7B,QAAA,MAA4B,cAAc,8BACsB,CAAC;AAMjE;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,iBAAS,WAAW,CAAC,EACnB,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,OAAO,EACf,GAAG,KAAK,EACT,EAAE,iBAAiB,2CAgBnB;AAMD;;;;;;;;;;;;;GAaG;AACH,iBAAS,kBAAkB,CAAC,EAC1B,KAAK,EAAE,MAAM,EACb,GAAG,KAAK,EACT,EAAE,wBAAwB,2CAO1B;AAMD;;;;;;;;;;;;;;;;;GAiBG;AACH,iBAAS,iBAAiB,CAAC,KAAK,EAAE,uBAAuB,2CAcxD;AAMD;;;;;;;;;;;;;;;;;;GAkBG;AACH,iBAAS,mBAAmB,CAAC,EAC3B,UAAiD,EACjD,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,yBAAyB,2CAqB3B;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,iBAAS,gBAAgB,CAAC,EACxB,IAAY,EACZ,YAAY,EACZ,UAAU,EACV,UAA4D,EAC5D,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAsCxB;AAMD;;;;;;;;;;;;;GAaG;AACH,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAQxB;AAMD;;;;;;;;;;;;;;GAcG;AACH,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAQzB;AAMD;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAQzB;AAMD;;;;;;;;;;;;;GAaG;AACH,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAQxB;AAMD;;;;;;;;;;;;;;;GAeG;AACH,iBAAS,sBAAsB,CAAC,EAC9B,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,4BAA4B,2CAY9B;AAMD,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,cAAc,GACf,CAAC;AAGF,YAAY,EACV,iBAAiB,EACjB,wBAAwB,EACxB,uBAAuB,EACvB,sBAAsB,EACtB,yBAAyB,EACzB,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,EACvB,sBAAsB,EACtB,4BAA4B,EAC5B,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,wBAAwB,GACzB,MAAM,qBAAqB,CAAC;AAG7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/react-ui/ui/AlertDialog/index.js

@@ -177,30 +177,33 @@ function AlertDialogPopup({ from = "top", initialFocus, finalFocus, transition =
 }, slots, className, ...props }) {
 	const initialRotation = from === "bottom" || from === "left" ? "20deg" : "-20deg";
 	const rotateAxis = from === "top" || from === "bottom" ? "rotateX" : "rotateY";
-	return /* @__PURE__ */ jsx(AlertDialog.Popup, {
-		initialFocus,
-		finalFocus,
-		render: /* @__PURE__ */ jsx(motion.div, {
-			"data-slot": "alert-dialog-popup",
-			className: cn(AlertDialogStyles.popup, slots?.popup, className),
-			initial: {
-				opacity: 0,
-				filter: "blur(4px)",
-				transform: `perspective(500px) ${rotateAxis}(${initialRotation}) scale(0.8)`
-			},
-			animate: {
-				opacity: 1,
-				filter: "blur(0px)",
-				transform: `perspective(500px) ${rotateAxis}(0deg) scale(1)`
-			},
-			exit: {
-				opacity: 0,
-				filter: "blur(4px)",
-				transform: `perspective(500px) ${rotateAxis}(${initialRotation}) scale(0.8)`
-			},
-			transition,
-			...props
-		}, "alert-dialog-popup")
+	return /* @__PURE__ */ jsx(AlertDialog.Viewport, {
+		"data-slot": "alert-dialog-viewport",
+		children: /* @__PURE__ */ jsx(AlertDialog.Popup, {
+			initialFocus,
+			finalFocus,
+			render: /* @__PURE__ */ jsx(motion.div, {
+				"data-slot": "alert-dialog-popup",
+				className: cn(AlertDialogStyles.popup, slots?.popup, className),
+				initial: {
+					opacity: 0,
+					filter: "blur(4px)",
+					transform: `perspective(500px) ${rotateAxis}(${initialRotation}) scale(0.8)`
+				},
+				animate: {
+					opacity: 1,
+					filter: "blur(0px)",
+					transform: `perspective(500px) ${rotateAxis}(0deg) scale(1)`
+				},
+				exit: {
+					opacity: 0,
+					filter: "blur(4px)",
+					transform: `perspective(500px) ${rotateAxis}(${initialRotation}) scale(0.8)`
+				},
+				transition,
+				...props
+			}, "alert-dialog-popup")
+		})
 	});
 }
 /**

package/dist/react-ui/ui/Dialog/index.d.ts

@@ -1,4 +1,4 @@
-import type { DialogContextType, IDialogProps, IDialogTriggerProps, IDialogPortalProps, IDialogViewportProps, IDialogBackdropProps, IDialogPopupProps, IDialogCloseProps, IDialogHeaderProps, IDialogFooterProps, IDialogTitleProps, IDialogDescriptionProps } from './Dialog.types';
+import type { DialogContextType, IDialogProps, IDialogTriggerProps, IDialogPortalProps, IDialogBackdropProps, IDialogPopupProps, IDialogCloseProps, IDialogHeaderProps, IDialogFooterProps, IDialogTitleProps, IDialogDescriptionProps } from './Dialog.types';
 declare const useDialog: () => DialogContextType;
 /**
  * Root Dialog component.
@@ -54,39 +54,23 @@ declare function DialogPortal({ slots: _slots, ...props }: IDialogPortalProps):
  * ```
  */
 declare function DialogBackdrop({ slots, className, transition, ...props }: IDialogBackdropProps): import("react/jsx-runtime").JSX.Element;
-/**
- * Required viewport wrapper around DialogPopup.
- * Base UI v1.x requires Dialog.Viewport as a direct child of Dialog.Portal
- * and parent of Dialog.Popup.
- *
- * @param props - Viewport props forwarded to Base UI Dialog.Viewport
- *
- * @example
- * ```tsx
- * <DialogPortal>
- *   <DialogBackdrop />
- *   <DialogViewport>
- *     <DialogPopup>...</DialogPopup>
- *   </DialogViewport>
- * </DialogPortal>
- * ```
- */
-declare function DialogViewport({ slots, className, ...props }: IDialogViewportProps): import("react/jsx-runtime").JSX.Element;
 /**
  * Main dialog content container with a perspective-flip entrance animation.
  * The `from` prop controls the axis and direction of the 3D rotation.
- * Must be wrapped in a `DialogViewport`.
+ *
+ * Internally wraps content in `Dialog.Viewport` as required by Base UI v1.x.
  *
  * @param props - Popup props including `from` direction and motion transition overrides
  *
  * @example
  * ```tsx
- * <DialogViewport>
+ * <DialogPortal>
+ *   <DialogBackdrop />
  *   <DialogPopup from="bottom" className="max-w-md">
  *     <DialogTitle>Confirm</DialogTitle>
  *     <p>Are you sure?</p>
  *   </DialogPopup>
- * </DialogViewport>
+ * </DialogPortal>
  * ```
  */
 declare function DialogPopup({ from, initialFocus, finalFocus, slots, className, transition, ...props }: IDialogPopupProps): import("react/jsx-runtime").JSX.Element;
@@ -153,7 +137,7 @@ declare function DialogTitle({ slots, className, ...props }: IDialogTitleProps):
  * ```
  */
 declare function DialogDescription({ slots, className, ...props }: IDialogDescriptionProps): import("react/jsx-runtime").JSX.Element;
-export { Dialog, DialogPortal, DialogViewport, DialogBackdrop, DialogClose, DialogTrigger, DialogPopup, DialogHeader, DialogFooter, DialogTitle, DialogDescription, useDialog, };
-export type { IDialogProps, IDialogTriggerProps, IDialogPortalProps, IDialogViewportProps, IDialogCloseProps, IDialogBackdropProps, IDialogPopupProps, IDialogHeaderProps, IDialogFooterProps, IDialogTitleProps, IDialogDescriptionProps, DialogContextType, DialogFlipDirection, DialogSlot, IDialogConfig, } from './Dialog.types';
+export { Dialog, DialogPortal, DialogBackdrop, DialogClose, DialogTrigger, DialogPopup, DialogHeader, DialogFooter, DialogTitle, DialogDescription, useDialog, };
+export type { IDialogProps, IDialogTriggerProps, IDialogPortalProps, IDialogCloseProps, IDialogBackdropProps, IDialogPopupProps, IDialogHeaderProps, IDialogFooterProps, IDialogTitleProps, IDialogDescriptionProps, DialogContextType, DialogFlipDirection, DialogSlot, IDialogConfig, } from './Dialog.types';
 export { dialogStyles } from './Dialog.styles';
 //# sourceMappingURL=index.d.ts.map

package/dist/react-ui/ui/Dialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/Dialog/index.tsx"],"names":[],"mappings":"AA+DA,OAAO,KAAK,EACV,iBAAiB,EAEjB,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,oBAAoB,EACpB,oBAAoB,EACpB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,EACxB,MAAM,gBAAgB,CAAC;AAMxB,QAAA,MAAuB,SAAS,yBACsB,CAAC;AAMvD;;;;;;;;;;;;GAYG;AACH,iBAAS,MAAM,CAAC,KAAK,EAAE,YAAY,2CAkBlC;AAMD;;;;;;;;;;;GAWG;AACH,iBAAS,aAAa,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CAQzE;AAMD;;;;;;;;;;;;;GAaG;AACH,iBAAS,YAAY,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAcpE;AAMD;;;;;;;;;;GAUG;AACH,iBAAS,cAAc,CAAC,EACtB,KAAK,EACL,SAAS,EACT,UAAiD,EACjD,GAAG,KAAK,EACT,EAAE,oBAAoB,2CAiBtB;AAMD;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,cAAc,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,2CAQ3E;AAMD;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,WAAW,CAAC,EACnB,IAAY,EACZ,YAAY,EACZ,UAAU,EACV,KAAK,EACL,SAAS,EACT,UAA4D,EAC5D,GAAG,KAAK,EACT,EAAE,iBAAiB,2CAsCnB;AAMD;;;;;;;;;;;GAWG;AACH,iBAAS,WAAW,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,2CAQrE;AAMD;;;;;;;;;;;;GAYG;AACH,iBAAS,YAAY,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAQvE;AAMD;;;;;;;;;;;;GAYG;AACH,iBAAS,YAAY,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAQvE;AAMD;;;;;;;;;GASG;AACH,iBAAS,WAAW,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,2CAQrE;AAMD;;;;;;;;;GASG;AACH,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAQzB;AAMD,OAAO,EACL,MAAM,EACN,YAAY,EACZ,cAAc,EACd,cAAc,EACd,WAAW,EACX,aAAa,EACb,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,SAAS,GACV,CAAC;AAGF,YAAY,EACV,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,EACvB,iBAAiB,EACjB,mBAAmB,EACnB,UAAU,EACV,aAAa,GACd,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/Dialog/index.tsx"],"names":[],"mappings":"AA4DA,OAAO,KAAK,EACV,iBAAiB,EAEjB,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,oBAAoB,EACpB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,EACxB,MAAM,gBAAgB,CAAC;AAMxB,QAAA,MAAuB,SAAS,yBACsB,CAAC;AAMvD;;;;;;;;;;;;GAYG;AACH,iBAAS,MAAM,CAAC,KAAK,EAAE,YAAY,2CAkBlC;AAMD;;;;;;;;;;;GAWG;AACH,iBAAS,aAAa,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CAQzE;AAMD;;;;;;;;;;;;;GAaG;AACH,iBAAS,YAAY,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAcpE;AAMD;;;;;;;;;;GAUG;AACH,iBAAS,cAAc,CAAC,EACtB,KAAK,EACL,SAAS,EACT,UAAiD,EACjD,GAAG,KAAK,EACT,EAAE,oBAAoB,2CAiBtB;AAOD;;;;;;;;;;;;;;;;;;GAkBG;AACH,iBAAS,WAAW,CAAC,EACnB,IAAY,EACZ,YAAY,EACZ,UAAU,EACV,KAAK,EACL,SAAS,EACT,UAA4D,EAC5D,GAAG,KAAK,EACT,EAAE,iBAAiB,2CAsCnB;AAMD;;;;;;;;;;;GAWG;AACH,iBAAS,WAAW,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,2CAQrE;AAMD;;;;;;;;;;;;GAYG;AACH,iBAAS,YAAY,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAQvE;AAMD;;;;;;;;;;;;GAYG;AACH,iBAAS,YAAY,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAQvE;AAMD;;;;;;;;;GASG;AACH,iBAAS,WAAW,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,2CAQrE;AAMD;;;;;;;;;GASG;AACH,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAQzB;AAMD,OAAO,EACL,MAAM,EACN,YAAY,EACZ,cAAc,EACd,WAAW,EACX,aAAa,EACb,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,SAAS,GACV,CAAC;AAGF,YAAY,EACV,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EACjB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,EACvB,iBAAiB,EACjB,mBAAmB,EACnB,UAAU,EACV,aAAa,GACd,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/react-ui/ui/Dialog/index.js

@@ -121,44 +121,22 @@ function DialogBackdrop({ slots, className, transition = {
 	});
 }
 /**
-* Required viewport wrapper around DialogPopup.
-* Base UI v1.x requires Dialog.Viewport as a direct child of Dialog.Portal
-* and parent of Dialog.Popup.
-*
-* @param props - Viewport props forwarded to Base UI Dialog.Viewport
-*
-* @example
-* ```tsx
-* <DialogPortal>
-*   <DialogBackdrop />
-*   <DialogViewport>
-*     <DialogPopup>...</DialogPopup>
-*   </DialogViewport>
-* </DialogPortal>
-* ```
-*/
-function DialogViewport({ slots, className, ...props }) {
-	return /* @__PURE__ */ jsx(Dialog.Viewport, {
-		"data-slot": "dialog-viewport",
-		className: cn(dialogStyles.viewport, slots?.viewport, className),
-		...props
-	});
-}
-/**
 * Main dialog content container with a perspective-flip entrance animation.
 * The `from` prop controls the axis and direction of the 3D rotation.
-* Must be wrapped in a `DialogViewport`.
+*
+* Internally wraps content in `Dialog.Viewport` as required by Base UI v1.x.
 *
 * @param props - Popup props including `from` direction and motion transition overrides
 *
 * @example
 * ```tsx
-* <DialogViewport>
+* <DialogPortal>
+*   <DialogBackdrop />
 *   <DialogPopup from="bottom" className="max-w-md">
 *     <DialogTitle>Confirm</DialogTitle>
 *     <p>Are you sure?</p>
 *   </DialogPopup>
-* </DialogViewport>
+* </DialogPortal>
 * ```
 */
 function DialogPopup({ from = "top", initialFocus, finalFocus, slots, className, transition = {
@@ -168,31 +146,34 @@ function DialogPopup({ from = "top", initialFocus, finalFocus, slots, className,
 }, ...props }) {
 	const initialRotation = from === "bottom" || from === "left" ? "20deg" : "-20deg";
 	const rotateAxis = from === "top" || from === "bottom" ? "rotateX" : "rotateY";
-	return /* @__PURE__ */ jsx(Dialog.Viewport, { children: /* @__PURE__ */ jsx(Dialog.Popup, {
-		initialFocus,
-		finalFocus,
-		render: /* @__PURE__ */ jsx(motion.div, {
-			"data-slot": "dialog-popup",
-			className: cn(dialogStyles.popup, slots?.popup, className),
-			initial: {
-				opacity: 0,
-				filter: "blur(4px)",
-				transform: `perspective(500px) ${rotateAxis}(${initialRotation}) scale(0.8)`
-			},
-			animate: {
-				opacity: 1,
-				filter: "blur(0px)",
-				transform: `perspective(500px) ${rotateAxis}(0deg) scale(1)`
-			},
-			exit: {
-				opacity: 0,
-				filter: "blur(4px)",
-				transform: `perspective(500px) ${rotateAxis}(${initialRotation}) scale(0.8)`
-			},
-			transition,
-			...props
-		}, "dialog-popup")
-	}) });
+	return /* @__PURE__ */ jsx(Dialog.Viewport, {
+		"data-slot": "dialog-viewport",
+		children: /* @__PURE__ */ jsx(Dialog.Popup, {
+			initialFocus,
+			finalFocus,
+			render: /* @__PURE__ */ jsx(motion.div, {
+				"data-slot": "dialog-popup",
+				className: cn(dialogStyles.popup, slots?.popup, className),
+				initial: {
+					opacity: 0,
+					filter: "blur(4px)",
+					transform: `perspective(500px) ${rotateAxis}(${initialRotation}) scale(0.8)`
+				},
+				animate: {
+					opacity: 1,
+					filter: "blur(0px)",
+					transform: `perspective(500px) ${rotateAxis}(0deg) scale(1)`
+				},
+				exit: {
+					opacity: 0,
+					filter: "blur(4px)",
+					transform: `perspective(500px) ${rotateAxis}(${initialRotation}) scale(0.8)`
+				},
+				transition,
+				...props
+			}, "dialog-popup")
+		})
+	});
 }
 /**
 * Button that closes the dialog when clicked.
@@ -289,4 +270,4 @@ function DialogDescription({ slots, className, ...props }) {
 }
 
 //#endregion
-export { Dialog$1 as Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, DialogViewport, useDialog };
+export { Dialog$1 as Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, useDialog };

package/dist/react-ui/ui/index.js

@@ -5,7 +5,7 @@ import { AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescript
 import { checkboxStyles } from "./Checkbox/Checkbox.styles.js";
 import { Checkbox, CheckboxIndicator, useCheckbox } from "./Checkbox/index.js";
 import { dialogStyles } from "./Dialog/Dialog.styles.js";
-import { Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, DialogViewport, useDialog } from "./Dialog/index.js";
+import { Dialog, DialogBackdrop, DialogClose, DialogDescription, DialogFooter, DialogHeader, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, useDialog } from "./Dialog/index.js";
 import { Menu, MenuArrow, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuGroup, MenuGroupLabel, MenuHighlight, MenuHighlightItem, MenuItem, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuSeparator, MenuShortcut, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, useMenu, useMenuActiveValue } from "./Menu/index.js";
 import { popoverStyles } from "./Popover/Popover.styles.js";
 import { Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverDescription, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverTitle, PopoverTrigger, usePopover } from "./Popover/index.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mks2508/mks-ui",
-  "version": "0.6.2",
+  "version": "0.6.4",
   "description": "UI component library - Shadcn/Animate UI based with DevEnv components",
   "type": "module",
   "main": "./dist/index.js",