@moduix/react 1.1.1 → 2.0.0

package/dist/components/marquee/Marquee.d.ts

@@ -9,5 +9,6 @@ declare const Marquee$1: import("react").ForwardRefExoticComponent<Omit<Marquee.
   Item: import("react").ForwardRefExoticComponent<Omit<Marquee.ItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   Edge: import("react").ForwardRefExoticComponent<Omit<Marquee.EdgeProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 };
+declare const useMarquee$1: (props?: import("@ark-ui/react/marquee").UseMarqueeProps) => import("@ark-ui/react/marquee").UseMarqueeReturn;
 //#endregion
-export { Marquee$1 as Marquee };
+export { Marquee$1 as Marquee, useMarquee$1 as useMarquee };

package/dist/components/marquee/Marquee.js

@@ -1,9 +1,9 @@
 import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
 import Marquee_module_default from "./Marquee.module.js";
-import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
-import { Marquee } from "@ark-ui/react/marquee";
+import { jsx } from "react/jsx-runtime";
+import { Marquee, useMarquee } from "@ark-ui/react/marquee";
 //#region src/components/marquee/Marquee.tsx
 const MarqueeRoot = forwardRef(function MarqueeRoot({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(Marquee.Root, {
@@ -61,5 +61,6 @@ const Marquee$1 = Object.assign(MarqueeRoot, {
 	Item: MarqueeItem,
 	Edge: MarqueeEdge
 });
+const useMarquee$1 = useMarquee;
 //#endregion
-export { Marquee$1 as Marquee };
+export { Marquee$1 as Marquee, useMarquee$1 as useMarquee };

package/dist/components/marquee/index.d.ts

@@ -1,2 +1,2 @@
-import { Marquee } from "./Marquee.js";
-export { Marquee };
+import { Marquee, useMarquee } from "./Marquee.js";
+export { Marquee, useMarquee };

package/dist/components/menu/Menu.css

@@ -97,11 +97,15 @@
     overflow: auto;
 
     &[data-state="open"] {
-      animation: AJ5G3W_menuContentIn var(--menu-transition, var(--transition-default));
+      animation: AJ5G3W_menuContentIn
+        var(--menu-transition, var(--popup-motion-duration, var(--duration-normal))
+            var(--popup-motion-easing, var(--ease-in-out)));
     }
 
     &[data-state="closed"] {
-      animation: AJ5G3W_menuContentOut var(--menu-transition, var(--transition-default));
+      animation: AJ5G3W_menuContentOut
+        var(--menu-transition, var(--popup-motion-duration, var(--duration-normal))
+            var(--popup-motion-easing, var(--ease-in-out)));
     }
   }
 
@@ -345,9 +349,10 @@
 
   @keyframes AJ5G3W_menuContentIn {
     from {
-      opacity: var(--menu-popup-starting-opacity, 0);
-      translate: var(--menu-popup-starting-translate-x, 0) var(--menu-popup-starting-translate-y, 0);
-      transform: scale(var(--menu-popup-starting-scale, var(--scale-popup)));
+      opacity: var(--menu-popup-starting-opacity, var(--popup-motion-starting-opacity, 0));
+      translate: var(--menu-popup-starting-translate-x, var(--popup-motion-starting-translate-x, 0))
+        var(--menu-popup-starting-translate-y, var(--popup-motion-starting-translate-y, 0));
+      transform: scale(var(--menu-popup-starting-scale, var(--popup-motion-starting-scale, var(--scale-popup))));
     }
 
     to {
@@ -363,9 +368,10 @@
     }
 
     to {
-      opacity: var(--menu-popup-ending-opacity, 0);
-      translate: var(--menu-popup-ending-translate-x, 0) var(--menu-popup-ending-translate-y, 0);
-      transform: scale(var(--menu-popup-ending-scale, var(--scale-popup)));
+      opacity: var(--menu-popup-ending-opacity, var(--popup-motion-ending-opacity, 0));
+      translate: var(--menu-popup-ending-translate-x, var(--popup-motion-ending-translate-x, 0))
+        var(--menu-popup-ending-translate-y, var(--popup-motion-ending-translate-y, 0));
+      transform: scale(var(--menu-popup-ending-scale, var(--popup-motion-ending-scale, var(--scale-popup))));
     }
   }
 }

package/dist/components/menu/Menu.d.ts

@@ -1,6 +1,6 @@
 import { OverlayPortalProps } from "../../lib/moduix/overlayPortal.js";
 import { ComponentProps } from "react";
-import { Menu } from "@ark-ui/react/menu";
+import { Menu, useMenu } from "@ark-ui/react/menu";
 
 //#region src/components/menu/Menu.d.ts
 type MenuIndicatorPosition = 'start' | 'end' | 'none';
@@ -78,6 +78,7 @@ declare const Menu$1: typeof MenuRoot & {
   ItemTextIcon: typeof MenuItemTextIcon;
   ItemTextLabel: typeof MenuItemTextLabel;
   ItemShortcut: typeof MenuItemShortcut;
+  ItemContext: (props: Menu.ItemContextProps) => import("react").ReactNode;
 };
 //#endregion
-export { Menu$1 as Menu };
+export { Menu$1 as Menu, useMenu };

package/dist/components/menu/Menu.js

@@ -1,11 +1,11 @@
-import { CheckIcon, ChevronDownIcon, ChevronRightIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import { CheckIcon, ChevronDownIcon, ChevronRightIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import { OverlayPortal, OverlayPortalProvider } from "../../lib/moduix/overlayPortal.js";
 import Menu_module_default from "./Menu.module.js";
-import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
-import { Menu } from "@ark-ui/react/menu";
+import { jsx } from "react/jsx-runtime";
+import { Menu, useMenu } from "@ark-ui/react/menu";
 //#region src/components/menu/Menu.tsx
 function MenuRoot({ portalled, portalRef, ...props }) {
 	return /* @__PURE__ */ jsx(OverlayPortalProvider, {
@@ -234,7 +234,8 @@ const Menu$1 = Object.assign(MenuRoot, {
 	ItemTextContent: MenuItemTextContent,
 	ItemTextIcon: MenuItemTextIcon,
 	ItemTextLabel: MenuItemTextLabel,
-	ItemShortcut: MenuItemShortcut
+	ItemShortcut: MenuItemShortcut,
+	ItemContext: Menu.ItemContext
 });
 //#endregion
-export { Menu$1 as Menu };
+export { Menu$1 as Menu, useMenu };

package/dist/components/menu/index.d.ts

@@ -1,2 +1,2 @@
-import { Menu } from "./Menu.js";
-export { Menu };
+import { Menu, useMenu } from "./Menu.js";
+export { Menu, useMenu };

package/dist/components/native-select/NativeSelect.d.ts

@@ -1,8 +1,12 @@
+import { ComponentProps } from "react";
 import { Field } from "@ark-ui/react/field";
 
 //#region src/components/native-select/NativeSelect.d.ts
-declare const NativeSelect: import("react").ForwardRefExoticComponent<Omit<Field.SelectProps & import("react").RefAttributes<HTMLSelectElement>, "ref"> & import("react").RefAttributes<HTMLSelectElement>> & {
-  Root: import("react").ForwardRefExoticComponent<Omit<Field.SelectProps & import("react").RefAttributes<HTMLSelectElement>, "ref"> & import("react").RefAttributes<HTMLSelectElement>>;
+type NativeSelectRootProps = ComponentProps<typeof Field.Select> & {
+  controlProps?: ComponentProps<'span'>;
+};
+declare const NativeSelect: import("react").ForwardRefExoticComponent<Omit<NativeSelectRootProps, "ref"> & import("react").RefAttributes<HTMLSelectElement>> & {
+  Root: import("react").ForwardRefExoticComponent<Omit<NativeSelectRootProps, "ref"> & import("react").RefAttributes<HTMLSelectElement>>;
 };
 //#endregion
 export { NativeSelect };

package/dist/components/native-select/NativeSelect.js

@@ -1,17 +1,18 @@
-import { ChevronDownIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import { ChevronDownIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import NativeSelect_module_default from "./NativeSelect.module.js";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Field } from "@ark-ui/react/field";
 //#region src/components/native-select/NativeSelect.tsx
-const NativeSelectRoot = forwardRef(function NativeSelectRoot({ className, ...props }, ref) {
+const NativeSelectRoot = forwardRef(function NativeSelectRoot({ className, controlProps, ...props }, ref) {
 	return /* @__PURE__ */ jsxs("span", {
+		...controlProps,
 		"data-scope": "native-select",
 		"data-part": "control",
 		"data-slot": "native-select-control",
-		className: NativeSelect_module_default.control,
+		className: clsx(NativeSelect_module_default.control, normalizeClassName(controlProps?.className)),
 		children: [/* @__PURE__ */ jsx(Field.Select, {
 			...props,
 			ref,

package/dist/components/number-input/NumberInput.css

@@ -29,7 +29,6 @@
 
     &[data-disabled] {
       cursor: default;
-      opacity: var(--number-input-disabled-opacity, var(--opacity-disabled));
     }
   }
 
@@ -79,7 +78,6 @@
     }
 
     &:is([data-disabled], :disabled) {
-      opacity: var(--number-input-disabled-opacity, var(--opacity-disabled));
       pointer-events: none;
     }
 
@@ -147,10 +145,6 @@
         outline-color: var(--number-input-border-color-invalid, var(--color-destructive));
       }
     }
-
-    &:is([data-disabled], :disabled) {
-      opacity: var(--number-input-disabled-opacity, var(--opacity-disabled));
-    }
   }
 
   .ZjEX8G_valueText {

package/dist/components/number-input/NumberInput.d.ts

@@ -1,16 +1,21 @@
-import { NumberInput } from "@ark-ui/react/number-input";
+import { ComponentProps } from "react";
+import { NumberInput, useNumberInput, useNumberInputContext } from "@ark-ui/react/number-input";
 
 //#region src/components/number-input/NumberInput.d.ts
+declare const NumberInputControl: import("react").ForwardRefExoticComponent<Omit<NumberInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+type NumberInputFieldProps = Omit<ComponentProps<typeof NumberInputControl>, 'asChild' | 'children'>;
 declare const NumberInput$1: import("react").ForwardRefExoticComponent<Omit<NumberInput.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
   Root: import("react").ForwardRefExoticComponent<Omit<NumberInput.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   RootProvider: import("react").ForwardRefExoticComponent<Omit<NumberInput.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Context: (props: NumberInput.ContextProps) => import("react").ReactNode;
   Label: import("react").ForwardRefExoticComponent<Omit<NumberInput.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
   Scrubber: import("react").ForwardRefExoticComponent<Omit<NumberInput.ScrubberProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   Control: import("react").ForwardRefExoticComponent<Omit<NumberInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Field: import("react").ForwardRefExoticComponent<Omit<NumberInputFieldProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   DecrementTrigger: import("react").ForwardRefExoticComponent<Omit<NumberInput.DecrementTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
   Input: import("react").ForwardRefExoticComponent<Omit<NumberInput.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
   IncrementTrigger: import("react").ForwardRefExoticComponent<Omit<NumberInput.IncrementTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
   ValueText: import("react").ForwardRefExoticComponent<Omit<NumberInput.ValueTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
 };
 //#endregion
-export { NumberInput$1 as NumberInput };
+export { NumberInput$1 as NumberInput, useNumberInput, useNumberInputContext };

package/dist/components/number-input/NumberInput.js

@@ -1,10 +1,10 @@
-import { MinusIcon, PlusIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import { MinusIcon, PlusIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import NumberInput_module_default from "./NumberInput.module.js";
-import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
-import { NumberInput } from "@ark-ui/react/number-input";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { NumberInput, useNumberInput, useNumberInputContext } from "@ark-ui/react/number-input";
 //#region src/components/number-input/NumberInput.tsx
 const NumberInputRoot = forwardRef(function NumberInputRoot({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(NumberInput.Root, {
@@ -80,16 +80,29 @@ const NumberInputValueText = forwardRef(function NumberInputValueText({ classNam
 		...props
 	});
 });
+const NumberInputField = forwardRef(function NumberInputField(props, ref) {
+	return /* @__PURE__ */ jsxs(NumberInputControl, {
+		ref,
+		...props,
+		children: [
+			/* @__PURE__ */ jsx(NumberInputDecrementTrigger, {}),
+			/* @__PURE__ */ jsx(NumberInputInput, {}),
+			/* @__PURE__ */ jsx(NumberInputIncrementTrigger, {})
+		]
+	});
+});
 const NumberInput$1 = Object.assign(NumberInputRoot, {
 	Root: NumberInputRoot,
 	RootProvider: NumberInputRootProvider,
+	Context: NumberInput.Context,
 	Label: NumberInputLabel,
 	Scrubber: NumberInputScrubber,
 	Control: NumberInputControl,
+	Field: NumberInputField,
 	DecrementTrigger: NumberInputDecrementTrigger,
 	Input: NumberInputInput,
 	IncrementTrigger: NumberInputIncrementTrigger,
 	ValueText: NumberInputValueText
 });
 //#endregion
-export { NumberInput$1 as NumberInput };
+export { NumberInput$1 as NumberInput, useNumberInput, useNumberInputContext };

package/dist/components/number-input/index.d.ts

@@ -1,2 +1,2 @@
-import { NumberInput } from "./NumberInput.js";
-export { NumberInput };
+import { NumberInput, useNumberInput, useNumberInputContext } from "./NumberInput.js";
+export { NumberInput, useNumberInput, useNumberInputContext };

package/dist/components/pagination/Pagination.d.ts

@@ -1,6 +1,7 @@
 import { Pagination } from "@ark-ui/react/pagination";
 
 //#region src/components/pagination/Pagination.d.ts
+declare function PaginationItems(): import("react").JSX.Element;
 declare const Pagination$1: import("react").ForwardRefExoticComponent<Omit<Pagination.RootProps & import("react").RefAttributes<HTMLElement>, "ref"> & import("react").RefAttributes<HTMLElement>> & {
   Root: import("react").ForwardRefExoticComponent<Omit<Pagination.RootProps & import("react").RefAttributes<HTMLElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
   RootProvider: import("react").ForwardRefExoticComponent<Omit<Pagination.RootProviderProps & import("react").RefAttributes<HTMLElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
@@ -11,6 +12,9 @@ declare const Pagination$1: import("react").ForwardRefExoticComponent<Omit<Pagin
   FirstTrigger: import("react").ForwardRefExoticComponent<Omit<Pagination.FirstTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
   LastTrigger: import("react").ForwardRefExoticComponent<Omit<Pagination.LastTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
   Context: (props: Pagination.ContextProps) => import("react").ReactNode;
+  Items: typeof PaginationItems;
+  usePagination: (props?: import("@ark-ui/react/pagination").UsePaginationProps) => import("@ark-ui/react/pagination").UsePaginationReturn;
+  usePaginationContext: () => import("@ark-ui/react/pagination").UsePaginationContext;
 };
 //#endregion
 export { Pagination$1 as Pagination };

package/dist/components/pagination/Pagination.js

@@ -1,10 +1,10 @@
-import { ChevronLeftIcon, ChevronRightIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import { ChevronLeftIcon, ChevronRightIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import Pagination_module_default from "./Pagination.module.js";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
-import { Pagination } from "@ark-ui/react/pagination";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Pagination, usePagination, usePaginationContext } from "@ark-ui/react/pagination";
 //#region src/components/pagination/Pagination.tsx
 const PaginationRoot = forwardRef(function PaginationRoot({ "aria-label": ariaLabel = "Pagination", className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(Pagination.Root, {
@@ -86,6 +86,12 @@ const PaginationLastTrigger = forwardRef(function PaginationLastTrigger({ classN
 	});
 });
 const PaginationContext = Pagination.Context;
+function PaginationItems() {
+	return /* @__PURE__ */ jsx(PaginationContext, { children: (pagination) => pagination.pages.map((page, index) => page.type === "page" ? /* @__PURE__ */ jsx(PaginationItem, {
+		...page,
+		children: page.value
+	}, index) : /* @__PURE__ */ jsx(PaginationEllipsis, { index }, index)) });
+}
 const Pagination$1 = Object.assign(PaginationRoot, {
 	Root: PaginationRoot,
 	RootProvider: PaginationRootProvider,
@@ -95,7 +101,10 @@ const Pagination$1 = Object.assign(PaginationRoot, {
 	NextTrigger: PaginationNextTrigger,
 	FirstTrigger: PaginationFirstTrigger,
 	LastTrigger: PaginationLastTrigger,
-	Context: PaginationContext
+	Context: PaginationContext,
+	Items: PaginationItems,
+	usePagination,
+	usePaginationContext
 });
 //#endregion
 export { Pagination$1 as Pagination };

package/dist/components/password-input/PasswordInput.d.ts

@@ -1,11 +1,15 @@
+import { ComponentProps } from "react";
 import { PasswordInput, usePasswordInput } from "@ark-ui/react/password-input";
 
 //#region src/components/password-input/PasswordInput.d.ts
+declare const PasswordInputControl: import("react").ForwardRefExoticComponent<Omit<PasswordInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+type PasswordInputFieldProps = Omit<ComponentProps<typeof PasswordInputControl>, 'asChild' | 'children'>;
 declare const PasswordInput$1: import("react").ForwardRefExoticComponent<Omit<PasswordInput.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
   Root: import("react").ForwardRefExoticComponent<Omit<PasswordInput.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   RootProvider: import("react").ForwardRefExoticComponent<Omit<PasswordInput.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   Label: import("react").ForwardRefExoticComponent<Omit<PasswordInput.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
   Control: import("react").ForwardRefExoticComponent<Omit<PasswordInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Field: import("react").ForwardRefExoticComponent<Omit<PasswordInputFieldProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   Input: import("react").ForwardRefExoticComponent<Omit<PasswordInput.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
   VisibilityTrigger: import("react").ForwardRefExoticComponent<Omit<PasswordInput.VisibilityTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
   Indicator: import("react").ForwardRefExoticComponent<Omit<PasswordInput.IndicatorProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;

package/dist/components/password-input/PasswordInput.js

@@ -1,9 +1,9 @@
-import { EyeClosedIcon, EyeIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import { EyeClosedIcon, EyeIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import PasswordInput_module_default from "./PasswordInput.module.js";
-import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { PasswordInput, usePasswordInput } from "@ark-ui/react/password-input";
 //#region src/components/password-input/PasswordInput.tsx
 const PasswordInputRoot = forwardRef(function PasswordInputRoot({ className, ...props }, ref) {
@@ -64,11 +64,19 @@ const PasswordInputIndicator = forwardRef(function PasswordInputIndicator({ clas
 		children: children ?? /* @__PURE__ */ jsx(EyeIcon, {})
 	});
 });
+const PasswordInputField = forwardRef(function PasswordInputField(props, ref) {
+	return /* @__PURE__ */ jsxs(PasswordInputControl, {
+		ref,
+		...props,
+		children: [/* @__PURE__ */ jsx(PasswordInputInput, {}), /* @__PURE__ */ jsx(PasswordInputVisibilityTrigger, { children: /* @__PURE__ */ jsx(PasswordInputIndicator, {}) })]
+	});
+});
 const PasswordInput$1 = Object.assign(PasswordInputRoot, {
 	Root: PasswordInputRoot,
 	RootProvider: PasswordInputRootProvider,
 	Label: PasswordInputLabel,
 	Control: PasswordInputControl,
+	Field: PasswordInputField,
 	Input: PasswordInputInput,
 	VisibilityTrigger: PasswordInputVisibilityTrigger,
 	Indicator: PasswordInputIndicator

package/dist/components/pin-input/PinInput.d.ts

@@ -2,6 +2,11 @@ import { ComponentProps } from "react";
 import { PinInput, UsePinInputProps } from "@ark-ui/react/pin-input";
 
 //#region src/components/pin-input/PinInput.d.ts
+declare function PinInputInputs({
+  className
+}: {
+  className?: string;
+}): import("react").JSX.Element[];
 declare function PinInputSeparator({
   className,
   'aria-hidden': ariaHidden,
@@ -16,7 +21,7 @@ declare const PinInput$1: import("react").ForwardRefExoticComponent<Omit<PinInpu
   Label: import("react").ForwardRefExoticComponent<Omit<PinInput.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
   Control: import("react").ForwardRefExoticComponent<Omit<PinInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   Input: import("react").ForwardRefExoticComponent<Omit<PinInput.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
-  HiddenInput: import("react").ForwardRefExoticComponent<Omit<PinInput.HiddenInputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+  Inputs: typeof PinInputInputs;
   Separator: typeof PinInputSeparator;
 };
 //#endregion

package/dist/components/pin-input/PinInput.js

@@ -1,28 +1,31 @@
-import { SeparatorMarkIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import { SeparatorMarkIcon } from "../../lib/moduix/icons/ui/Icons.js";
 import PinInput_module_default from "./PinInput.module.js";
-import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { forwardRef } from "react";
-import { PinInput, usePinInput } from "@ark-ui/react/pin-input";
+import { Children, cloneElement, forwardRef } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { PinInput, usePinInput, usePinInputContext } from "@ark-ui/react/pin-input";
 //#region src/components/pin-input/PinInput.tsx
-const PinInputRoot = forwardRef(function PinInputRoot({ children, className, count, placeholder = "", ...props }, ref) {
+const PinInputRoot = forwardRef(function PinInputRoot({ asChild, children, className, count, placeholder = "", ...props }, ref) {
 	return /* @__PURE__ */ jsx(PinInput.Root, {
 		ref,
+		asChild,
 		"data-slot": "pin-input-root",
 		className: clsx(PinInput_module_default.root, normalizeClassName(className)),
 		count,
 		placeholder,
 		...props,
-		children
+		children: withHiddenInput(children, asChild)
 	});
 });
-const PinInputRootProvider = forwardRef(function PinInputRootProvider({ className, ...props }, ref) {
+const PinInputRootProvider = forwardRef(function PinInputRootProvider({ asChild, children, className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(PinInput.RootProvider, {
 		ref,
+		asChild,
 		"data-slot": "pin-input-root-provider",
 		className: clsx(PinInput_module_default.root, normalizeClassName(className)),
-		...props
+		...props,
+		children: withHiddenInput(children, asChild)
 	});
 });
 const PinInputLabel = forwardRef(function PinInputLabel({ className, ...props }, ref) {
@@ -49,13 +52,19 @@ const PinInputInput = forwardRef(function PinInputInput({ className, ...props },
 		...props
 	});
 });
-const PinInputHiddenInput = forwardRef(function PinInputHiddenInput(props, ref) {
-	return /* @__PURE__ */ jsx(PinInput.HiddenInput, {
-		ref,
-		"data-slot": "pin-input-hidden-input",
-		...props
-	});
-});
+function PinInputInputs({ className }) {
+	const { items } = usePinInputContext();
+	return items.map((index) => /* @__PURE__ */ jsx(PinInputInput, {
+		index,
+		className
+	}, index));
+}
+function withHiddenInput(children, asChild) {
+	const hiddenInput = /* @__PURE__ */ jsx(PinInput.HiddenInput, { "data-slot": "pin-input-hidden-input" });
+	if (!asChild) return /* @__PURE__ */ jsxs(Fragment$1, { children: [children, hiddenInput] });
+	const child = Children.only(children);
+	return cloneElement(child, {}, child.props.children, hiddenInput);
+}
 function PinInputSeparator({ className, "aria-hidden": ariaHidden = true, role = "presentation", children, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		"data-slot": "pin-input-separator",
@@ -78,7 +87,7 @@ const PinInput$1 = Object.assign(PinInputRoot, {
 	Label: PinInputLabel,
 	Control: PinInputControl,
 	Input: PinInputInput,
-	HiddenInput: PinInputHiddenInput,
+	Inputs: PinInputInputs,
 	Separator: PinInputSeparator
 });
 //#endregion

package/dist/components/popover/Popover.css

@@ -75,11 +75,21 @@
     overflow: visible;
 
     &[data-state="open"] {
-      animation: Qww_tG_popover-enter var(--popover-transition, var(--duration-fast)) both;
+      animation: Qww_tG_popover-enter
+        var(--popover-transition, var(--popup-motion-duration, var(--duration-fast)) var(--popup-motion-easing, ease))
+        both;
     }
 
     &[data-state="closed"] {
-      animation: Qww_tG_popover-exit var(--popover-transition, var(--duration-fast)) both;
+      animation: Qww_tG_popover-exit
+        var(--popover-transition, var(--popup-motion-duration, var(--duration-fast)) var(--popup-motion-easing, ease))
+        both;
+    }
+
+    &:has(.Qww_tG_closeIcon) {
+      & .Qww_tG_header {
+        padding-inline-end: var(--popover-header-padding-inline-end-effective);
+      }
     }
   }
 
@@ -126,7 +136,6 @@
 
   .Qww_tG_header {
     gap: var(--popover-header-gap, var(--spacing-1));
-    padding-inline-end: var(--popover-header-padding-inline-end-effective);
     display: grid;
   }
 
@@ -144,19 +153,19 @@
 
   @keyframes Qww_tG_popover-enter {
     from {
-      opacity: var(--popover-content-starting-opacity, 0);
-      translate: var(--popover-content-starting-translate-x, 0)
-        var(--popover-content-starting-translate-y, 0);
-      scale: var(--popover-content-starting-scale, var(--scale-popup));
+      opacity: var(--popover-content-starting-opacity, var(--popup-motion-starting-opacity, 0));
+      translate: var(--popover-content-starting-translate-x, var(--popup-motion-starting-translate-x, 0))
+        var(--popover-content-starting-translate-y, var(--popup-motion-starting-translate-y, 0));
+      scale: var(--popover-content-starting-scale, var(--popup-motion-starting-scale, var(--scale-popup)));
     }
   }
 
   @keyframes Qww_tG_popover-exit {
     to {
-      opacity: var(--popover-content-ending-opacity, 0);
-      translate: var(--popover-content-ending-translate-x, 0)
-        var(--popover-content-ending-translate-y, 0);
-      scale: var(--popover-content-ending-scale, var(--scale-popup));
+      opacity: var(--popover-content-ending-opacity, var(--popup-motion-ending-opacity, 0));
+      translate: var(--popover-content-ending-translate-x, var(--popup-motion-ending-translate-x, 0))
+        var(--popover-content-ending-translate-y, var(--popup-motion-ending-translate-y, 0));
+      scale: var(--popover-content-ending-scale, var(--popup-motion-ending-scale, var(--scale-popup)));
     }
   }
 }

package/dist/components/popover/Popover.js

@@ -2,9 +2,9 @@ import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
 import { CloseButton } from "../close-button/CloseButton.js";
 import { OverlayPortal, OverlayPortalProvider } from "../../lib/moduix/overlayPortal.js";
 import Popover_module_default from "./Popover.module.js";
-import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
 import { Popover, usePopover } from "@ark-ui/react/popover";
 //#region src/components/popover/Popover.tsx
 const DEFAULT_CLOSE_BUTTON_LABEL = "Close popover";

package/dist/components/progress-circular/ProgressCircular.d.ts

@@ -1,15 +1,21 @@
+import { ComponentProps } from "react";
 import { Progress } from "@ark-ui/react/progress";
 
 //#region src/components/progress-circular/ProgressCircular.d.ts
+type ProgressCircularRingProps = Omit<ComponentProps<typeof Progress.Circle>, 'asChild' | 'children'>;
 declare const ProgressCircular: import("react").ForwardRefExoticComponent<Omit<Progress.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
   Root: import("react").ForwardRefExoticComponent<Omit<Progress.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   RootProvider: import("react").ForwardRefExoticComponent<Omit<Progress.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Context: (props: Progress.ContextProps) => import("react").ReactNode;
   Label: import("react").ForwardRefExoticComponent<Omit<Progress.LabelProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
   ValueText: import("react").ForwardRefExoticComponent<Omit<Progress.ValueTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
   Circle: import("react").ForwardRefExoticComponent<Omit<Progress.CircleProps & import("react").RefAttributes<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
   CircleTrack: import("react").ForwardRefExoticComponent<Omit<Progress.CircleTrackProps & import("react").RefAttributes<SVGCircleElement>, "ref"> & import("react").RefAttributes<SVGCircleElement>>;
   CircleRange: import("react").ForwardRefExoticComponent<Omit<Progress.CircleRangeProps & import("react").RefAttributes<SVGCircleElement>, "ref"> & import("react").RefAttributes<SVGCircleElement>>;
+  Ring: import("react").ForwardRefExoticComponent<Omit<ProgressCircularRingProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
   View: import("react").ForwardRefExoticComponent<Omit<Progress.ViewProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+  useProgress: (props?: import("@ark-ui/react/progress").UseProgressProps) => import("@ark-ui/react/progress").UseProgressReturn;
+  useProgressContext: () => import("@ark-ui/react/progress").UseProgressContext;
 };
 //#endregion
 export { ProgressCircular };

package/dist/components/progress-circular/ProgressCircular.js

@@ -1,9 +1,9 @@
 import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
 import ProgressCircular_module_default from "./ProgressCircular.module.js";
-import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
-import { Progress } from "@ark-ui/react/progress";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Progress, useProgress, useProgressContext } from "@ark-ui/react/progress";
 //#region src/components/progress-circular/ProgressCircular.tsx
 const ProgressCircularRoot = forwardRef(function ProgressCircularRoot({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(Progress.Root, {
@@ -61,6 +61,13 @@ const ProgressCircularCircleRange = forwardRef(function ProgressCircularCircleRa
 		...props
 	});
 });
+const ProgressCircularRing = forwardRef(function ProgressCircularRing(props, ref) {
+	return /* @__PURE__ */ jsxs(ProgressCircularCircle, {
+		ref,
+		...props,
+		children: [/* @__PURE__ */ jsx(ProgressCircularCircleTrack, {}), /* @__PURE__ */ jsx(ProgressCircularCircleRange, {})]
+	});
+});
 const ProgressCircularView = forwardRef(function ProgressCircularView({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx(Progress.View, {
 		ref,
@@ -72,12 +79,16 @@ const ProgressCircularView = forwardRef(function ProgressCircularView({ classNam
 const ProgressCircular = Object.assign(ProgressCircularRoot, {
 	Root: ProgressCircularRoot,
 	RootProvider: ProgressCircularRootProvider,
+	Context: Progress.Context,
 	Label: ProgressCircularLabel,
 	ValueText: ProgressCircularValueText,
 	Circle: ProgressCircularCircle,
 	CircleTrack: ProgressCircularCircleTrack,
 	CircleRange: ProgressCircularCircleRange,
-	View: ProgressCircularView
+	Ring: ProgressCircularRing,
+	View: ProgressCircularView,
+	useProgress,
+	useProgressContext
 });
 //#endregion
 export { ProgressCircular };