diff --git a/package-lock.json b/package-lock.json index 6d47acb..c4c0aa5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -29,6 +29,7 @@ "@hookform/resolvers": "^5.4.0", "@radix-ui/react-collapsible": "^1.1.12", "@radix-ui/react-context-menu": "^2.2.16", + "@radix-ui/react-label": "^2.1.8", "@radix-ui/react-scroll-area": "^1.2.10", "@radix-ui/react-slot": "^1.2.4", "@tanstack/react-table": "^8.21.3", @@ -4113,6 +4114,52 @@ } } }, + "node_modules/@radix-ui/react-label": { + "version": "2.1.8", + "resolved": "https://registry.npmjs.org/@radix-ui/react-label/-/react-label-2.1.8.tgz", + "integrity": "sha512-FmXs37I6hSBVDlO4y764TNz1rLgKwjJMQ0EGte6F3Cb3f4bIuHB/iLa/8I9VKkmOy+gNHq8rql3j686ACVV21A==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-primitive": "2.1.4" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-label/node_modules/@radix-ui/react-primitive": { + "version": "2.1.4", + "resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.1.4.tgz", + "integrity": "sha512-9hQc4+GNVtJAIEPEqlYqW5RiYdrr8ea5XQ0ZOnD6fgru+83kqT15mq2OCcbe8KnjRZl5vF3ks69AKz3kh1jrhg==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-slot": "1.2.4" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-menu": { "version": "2.1.16", "resolved": "https://registry.npmjs.org/@radix-ui/react-menu/-/react-menu-2.1.16.tgz", diff --git a/package.json b/package.json index 1a0011e..ed9130b 100644 --- a/package.json +++ b/package.json @@ -100,6 +100,7 @@ "@hookform/resolvers": "^5.4.0", "@radix-ui/react-collapsible": "^1.1.12", "@radix-ui/react-context-menu": "^2.2.16", + "@radix-ui/react-label": "^2.1.8", "@radix-ui/react-scroll-area": "^1.2.10", "@radix-ui/react-slot": "^1.2.4", "@tanstack/react-table": "^8.21.3", diff --git a/src/renderer/components/ui/label.tsx b/src/renderer/components/ui/label.tsx new file mode 100644 index 0000000..97dea45 --- /dev/null +++ b/src/renderer/components/ui/label.tsx @@ -0,0 +1,20 @@ +import * as React from "react" +import * as LabelPrimitive from "@radix-ui/react-label" +import { cn } from "@/lib/utils" + +const Label = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +Label.displayName = LabelPrimitive.Root.displayName + +export { Label } diff --git a/tests/component/ui/label.test.tsx b/tests/component/ui/label.test.tsx new file mode 100644 index 0000000..f7d5927 --- /dev/null +++ b/tests/component/ui/label.test.tsx @@ -0,0 +1,17 @@ +import { describe, it, expect } from 'vitest'; +import { render, screen } from '@testing-library/react'; +import { Label } from '@/components/ui/label'; + +describe('Label', () => { + it('renders children and associates with a control', () => { + render( + <> + + + + ); + const label = screen.getByText(/username/i); + expect(label).toBeInTheDocument(); + expect(label.tagName).toBe('LABEL'); + }); +});