diff --git a/.changeset/brave-laws-enjoy.md b/.changeset/brave-laws-enjoy.md
new file mode 100644
index 0000000000..4dffac7aeb
--- /dev/null
+++ b/.changeset/brave-laws-enjoy.md
@@ -0,0 +1,5 @@
+---
+"@heroui/number-input": patch
+---
+
+allow inheriting labelPlacement from HeroUIProvider (#5845)
diff --git a/packages/components/number-input/__tests__/number-input.test.tsx b/packages/components/number-input/__tests__/number-input.test.tsx
index d11fbdc61a..f7c8a21ae1 100644
--- a/packages/components/number-input/__tests__/number-input.test.tsx
+++ b/packages/components/number-input/__tests__/number-input.test.tsx
@@ -5,6 +5,7 @@ import {render, fireEvent, act} from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import {useForm} from "react-hook-form";
import {Form} from "@heroui/form";
+import {HeroUIProvider} from "@heroui/system";
import {NumberInput} from "../src";
@@ -680,4 +681,32 @@ describe("NumberInput with React Hook Form", () => {
});
});
});
+
+ describe("NumberInput with HeroUIProvider context", () => {
+ it("should inherit labelPlacement from HeroUIProvider", () => {
+ const {container} = render(
+
+
+ ,
+ );
+
+ const label = container.querySelector("label");
+
+ expect(label).toBeTruthy();
+ expect(label?.className).toMatch(/translate-y.*100%/);
+ });
+
+ it("should prioritize labelPlacement prop over HeroUIProvider context", () => {
+ const {container} = render(
+
+
+ ,
+ );
+
+ const label = container.querySelector("label");
+
+ expect(label).toBeTruthy();
+ expect(label?.className).not.toMatch(/translate-y.*100%/);
+ });
+ });
});
diff --git a/packages/components/number-input/src/use-number-input.ts b/packages/components/number-input/src/use-number-input.ts
index 04d74cf810..651115046e 100644
--- a/packages/components/number-input/src/use-number-input.ts
+++ b/packages/components/number-input/src/use-number-input.ts
@@ -234,10 +234,18 @@ export function useNumberInput(originalProps: UseNumberInputProps) {
numberInput({
...variantProps,
isInvalid,
+ labelPlacement,
isClearable,
disableAnimation,
}),
- [objectToDeps(variantProps), isInvalid, isClearable, hasStartContent, disableAnimation],
+ [
+ objectToDeps(variantProps),
+ isInvalid,
+ labelPlacement,
+ isClearable,
+ hasStartContent,
+ disableAnimation,
+ ],
);
const handleKeyDown = useCallback(