import { cn } from "../../utils/cn.mjs";
import { jsx, jsxs } from "react/jsx-runtime";

//#region src/components/Label/index.tsx
/**
* Label Component
*
* A form label component that provides accessible labeling for form controls.
* Establishes proper relationships between labels and their associated form elements
* with visual indicators for required and disabled states.
*
* @example
* ```tsx
* // Basic usage
* <Label htmlFor="email">Email Address</Label>
* <input id="email" type="email" />
*
* // Required field
* <Label htmlFor="password" required>Password</Label>
* <input id="password" type="password" required />
*
* // Disabled field
* <Label htmlFor="disabled-field" disabled>Disabled Field</Label>
* <input id="disabled-field" type="text" disabled />
*
* // With custom styling
* <Label htmlFor="custom" className="text-blue-600 font-semibold">
*   Custom Styled Label
* </Label>
* ```
*
* @component
* @accessibility
* - Uses semantic HTML <label> element
* - Properly associates with form controls via htmlFor/id relationship
* - Supports click-to-focus behavior automatically
* - Visual indicators for required and disabled states
* - Screen reader compatible with proper ARIA relationships
*/
const Label = ({ htmlFor, required = false, disabled = false, className, children,...props }) => /* @__PURE__ */ jsxs("label", {
	className: cn("select-none font-medium text-sm leading-none", "peer-disabled:cursor-not-allowed peer-disabled:opacity-70", disabled && "cursor-not-allowed text-muted-foreground opacity-70", className),
	htmlFor,
	...props,
	children: [children, required && /* @__PURE__ */ jsx("span", {
		className: "ml-1 text-destructive",
		"aria-label": "required",
		title: "This field is required",
		children: "*"
	})]
});

//#endregion
export { Label };
//# sourceMappingURL=index.mjs.map