@pixpilot/shadcn-ui 0.45.0 → 0.46.0

package/dist/AbsoluteFill.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 
 //#region src/AbsoluteFill.d.ts
 
@@ -10,7 +10,7 @@ import * as react_jsx_runtime0 from "react/jsx-runtime";
  */
 declare function AbsoluteFill(props: React.HTMLAttributes<HTMLDivElement> & {
   ref?: React.Ref<HTMLDivElement>;
-}): react_jsx_runtime0.JSX.Element;
+}): react_jsx_runtime3.JSX.Element;
 declare namespace AbsoluteFill {
   var displayName: string;
 }

package/dist/Button.d.ts

@@ -1,6 +1,6 @@
 import { Button, Tooltip, buttonVariants } from "@pixpilot/shadcn";
 import React from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
 
 //#region src/Button.d.ts
@@ -39,7 +39,7 @@ interface ButtonProps extends React.ComponentProps<typeof Button>, VariantProps<
 }
 declare function Button$1(props: ButtonProps & {
   ref?: React.Ref<HTMLButtonElement>;
-}): react_jsx_runtime0.JSX.Element;
+}): react_jsx_runtime4.JSX.Element;
 declare namespace Button$1 {
   var displayName: string;
 }

package/dist/ColorSelect.d.ts

@@ -1,6 +1,6 @@
 import { Select, SelectContent } from "@pixpilot/shadcn";
 import React, { ComponentProps } from "react";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime5 from "react/jsx-runtime";
 
 //#region src/ColorSelect.d.ts
 interface ColorSelectOption {
@@ -15,6 +15,6 @@ type BaseColorSelectProps = {
   placeholder?: string;
   keyboardMode?: 'cycle' | 'dropdown';
 } & Omit<ComponentProps<typeof Select>, 'value' | 'onValueChange' | 'children'>;
-declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime1.JSX.Element;
+declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime5.JSX.Element;
 //#endregion
 export { BaseColorSelectProps, ColorSelect, ColorSelectOption };

package/dist/ContentCard.d.ts

@@ -1,6 +1,6 @@
 import { Card } from "@pixpilot/shadcn";
 import React, { ReactNode } from "react";
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime6 from "react/jsx-runtime";
 
 //#region src/ContentCard.d.ts
 interface SectionCardProps extends React.ComponentProps<typeof Card> {
@@ -8,7 +8,7 @@ interface SectionCardProps extends React.ComponentProps<typeof Card> {
   children: ReactNode;
   marginBottom?: boolean;
 }
-declare function ContentCard(props: SectionCardProps): react_jsx_runtime2.JSX.Element;
+declare function ContentCard(props: SectionCardProps): react_jsx_runtime6.JSX.Element;
 declare namespace ContentCard {
   var displayName: string;
 }

package/dist/DatePicker.d.ts

@@ -1,6 +1,6 @@
 import { Calendar } from "@pixpilot/shadcn";
 import { ComponentProps } from "react";
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
 
 //#region src/DatePicker.d.ts
 type DatePickerProps = {
@@ -8,7 +8,7 @@ type DatePickerProps = {
   onChange?: (date: Date | undefined) => void;
   placeholder?: string;
 } & Omit<ComponentProps<typeof Calendar>, 'selected' | 'onSelect' | 'mode'>;
-declare function DatePicker(props: DatePickerProps): react_jsx_runtime3.JSX.Element;
+declare function DatePicker(props: DatePickerProps): react_jsx_runtime7.JSX.Element;
 declare namespace DatePicker {
   var displayName: string;
 }

package/dist/Rating.cjs

@@ -1,39 +1,204 @@
 const require_rolldown_runtime = require('./_virtual/rolldown_runtime.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");
 __pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+let lucide_react = require("lucide-react");
+lucide_react = require_rolldown_runtime.__toESM(lucide_react);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
 react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+let class_variance_authority = require("class-variance-authority");
+class_variance_authority = require_rolldown_runtime.__toESM(class_variance_authority);
 
 //#region src/Rating.tsx
 const DEFAULT_MAX_RATING = 5;
+const ratingVariants = (0, class_variance_authority.cva)("inline-flex items-center gap-1", {
+	variants: { size: {
+		sm: "[&_svg]:size-4",
+		default: "[&_svg]:size-5",
+		lg: "[&_svg]:size-6",
+		xl: "[&_svg]:size-7"
+	} },
+	defaultVariants: { size: "default" }
+});
+const sizePixels = {
+	sm: 16,
+	default: 20,
+	lg: 24,
+	xl: 28
+};
 const colorClasses = {
-	default: "[&_svg]:!fill-yellow-400 [&_svg]:!text-yellow-400 dark:[&_svg]:!fill-yellow-500 dark:[&_svg]:!text-yellow-500 [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	primary: "[&_svg]:!fill-primary [&_svg]:!text-primary [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	secondary: "[&_svg]:!fill-secondary [&_svg]:!text-secondary-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	destructive: "[&_svg]:!fill-destructive [&_svg]:!text-destructive [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
+	default: "[&_svg]:!fill-yellow-400 [&_svg]:!text-yellow-400 dark:[&_svg]:!fill-yellow-500 dark:[&_svg]:!text-yellow-500 [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	primary: "[&_svg]:!fill-primary [&_svg]:!text-primary [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	secondary: "[&_svg]:!fill-secondary [&_svg]:!text-secondary-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	destructive: "[&_svg]:!fill-destructive [&_svg]:!text-destructive [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
 	foreground: "[&_svg]:!fill-foreground [&_svg]:!text-foreground [&_svg.fill-transparent]:!fill-transparent",
-	accent: "[&_svg]:!fill-accent [&_svg]:!text-accent-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	muted: "[&_svg]:!fill-muted [&_svg]:!text-muted-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	ring: "[&_svg]:!fill-ring [&_svg]:!text-ring [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground"
+	accent: "[&_svg]:!fill-accent [&_svg]:!text-accent-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	muted: "[&_svg]:!fill-muted [&_svg]:!text-muted-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	ring: "[&_svg]:!fill-ring [&_svg]:!text-ring [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30"
 };
-/**
-* Rating component wrapper with enhanced functionality
-*/
-function Rating({ max = DEFAULT_MAX_RATING, color = "default",...props }) {
-	const colorClass = colorClasses[color];
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.Rating, {
-		max,
+const RatingContext = react.createContext(null);
+function useRating() {
+	const context = react.use(RatingContext);
+	if (!context) throw new Error("useRating must be used within a Rating component");
+	return context;
+}
+function buildFallbackOptions(max) {
+	return Array.from({ length: max }, (_, index) => {
+		const value = index + 1;
+		return {
+			value,
+			label: `Rate ${value}`
+		};
+	});
+}
+function getIndexForValue(value, options) {
+	if (!value) return 0;
+	const foundIndex = options.findIndex((option) => option.value === value);
+	return foundIndex === -1 ? 0 : foundIndex + 1;
+}
+function RatingButton({ index, className,...props }) {
+	const { selectedIndex, hoverIndex, setHoverIndex, setValueByIndex, max, readOnly, disabled, size, iconType, options, colorClassName } = useRating();
+	const isFilled = (hoverIndex || selectedIndex) >= index;
+	const label = options[index - 1]?.label;
+	const labelText = typeof label === "string" && label.length > 0 ? label : void 0;
+	const hasLabelText = labelText !== void 0;
+	const labelTextOrEmpty = labelText ?? "";
+	const Icon = iconType === "circle" ? lucide_react.Circle : lucide_react.Star;
+	const handleClick = () => {
+		if (readOnly || disabled) return;
+		setValueByIndex(index);
+	};
+	const handleMouseEnter = () => {
+		if (readOnly || disabled) return;
+		setHoverIndex(index);
+	};
+	const handleKeyDown = (event) => {
+		if (readOnly || disabled) return;
+		switch (event.key) {
+			case "ArrowLeft":
+			case "ArrowDown":
+				event.preventDefault();
+				setValueByIndex(Math.max(1, index - 1));
+				break;
+			case "ArrowRight":
+			case "ArrowUp":
+				event.preventDefault();
+				setValueByIndex(Math.min(max, index + 1));
+				break;
+			case "Home":
+				event.preventDefault();
+				setValueByIndex(1);
+				break;
+			case "End":
+				event.preventDefault();
+				setValueByIndex(max);
+				break;
+			case "Enter":
+			case " ":
+				event.preventDefault();
+				setValueByIndex(index);
+				break;
+			default: break;
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		role: "radio",
+		"aria-checked": index === selectedIndex,
+		"aria-label": labelText ?? `Rate ${index}`,
+		title: labelText,
+		disabled: disabled || readOnly,
+		onClick: handleClick,
+		onMouseEnter: handleMouseEnter,
+		onKeyDown: handleKeyDown,
+		className: (0, __pixpilot_shadcn.cn)("inline-flex items-center justify-center transition-all outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded-sm", readOnly && "cursor-default", !readOnly && !disabled && "cursor-pointer hover:scale-110", disabled && "opacity-50 cursor-not-allowed", colorClassName, className),
 		...props,
-		children: Array.from({ length: max }, (_, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.RatingButton, {
-			index: i + 1,
-			className: colorClass
-		}, i + 1))
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+			className: (0, __pixpilot_shadcn.cn)("transition-all", isFilled ? "fill-current text-current" : "fill-transparent text-foreground/30"),
+			size,
+			"aria-hidden": "true"
+		}), hasLabelText ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "sr-only",
+			children: labelTextOrEmpty
+		}) : null]
+	});
+}
+function Rating({ value: valueProp, defaultValue, onValueChange, options: optionsProp, max: maxProp = DEFAULT_MAX_RATING, iconType = "star", size = "default", readOnly = false, disabled = false, name, required, color = "default", className, children,...props }) {
+	const isControlled = valueProp !== void 0;
+	const [internalValue, setInternalValue] = react.useState(defaultValue ?? 0);
+	const [hoverIndex, setHoverIndex] = react.useState(0);
+	const value = isControlled ? valueProp : internalValue;
+	const options = react.useMemo(() => {
+		const explicitOptions = optionsProp?.filter(Boolean);
+		return explicitOptions && explicitOptions.length > 0 ? explicitOptions : buildFallbackOptions(maxProp);
+	}, [maxProp, optionsProp]);
+	const max = options.length;
+	const selectedIndex = react.useMemo(() => getIndexForValue(value, options), [options, value]);
+	const setValue = react.useCallback((nextValue) => {
+		if (!isControlled) setInternalValue(nextValue);
+		onValueChange?.(nextValue);
+	}, [isControlled, onValueChange]);
+	const setValueByIndex = react.useCallback((index) => {
+		const nextOption = options[Math.min(Math.max(index, 1), max) - 1];
+		if (!nextOption) return;
+		setValue(nextOption.value);
+	}, [
+		max,
+		options,
+		setValue
+	]);
+	const colorClassName = colorClasses[color];
+	const contextValue = react.useMemo(() => ({
+		value,
+		hoverIndex,
+		selectedIndex,
+		options,
+		max,
+		readOnly,
+		disabled,
+		size: sizePixels[size ?? "default"],
+		iconType,
+		colorClassName,
+		setHoverIndex,
+		setValueByIndex
+	}), [
+		colorClassName,
+		disabled,
+		hoverIndex,
+		iconType,
+		max,
+		options,
+		readOnly,
+		selectedIndex,
+		size,
+		value,
+		setValueByIndex
+	]);
+	const handleMouseLeave = () => {
+		if (readOnly || disabled) return;
+		setHoverIndex(0);
+	};
+	const nameText = typeof name === "string" && name.length > 0 ? name : void 0;
+	const hasNameText = nameText !== void 0;
+	const nameTextOrEmpty = nameText ?? "";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RatingContext, {
+		value: contextValue,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			role: "radiogroup",
+			tabIndex: 0,
+			className: (0, __pixpilot_shadcn.cn)(ratingVariants({ size }), className),
+			onMouseLeave: handleMouseLeave,
+			...props,
+			children: [children ?? Array.from({ length: max }, (_, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RatingButton, { index: index + 1 }, index)), hasNameText ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				type: "hidden",
+				name: nameTextOrEmpty,
+				value: value || "",
+				required
+			}) : null]
+		})
 	});
 }
-/**
-* Individual rating button component
-*/
-const RatingButton = __pixpilot_shadcn.RatingButton;
 
 //#endregion
 exports.Rating = Rating;

package/dist/Rating.d.cts

@@ -1,26 +1,57 @@
 import * as react_jsx_runtime4 from "react/jsx-runtime";
-import { RatingButton, RatingButtonProps, RatingProps } from "@pixpilot/shadcn";
+import * as React$1 from "react";
+import { VariantProps } from "class-variance-authority";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
 
 //#region src/Rating.d.ts
-interface RatingProps$1 extends Omit<RatingProps, 'children'> {
-  /**
-   * Color variant for the rating
-   * @default 'default'
-   */
-  color?: 'default' | 'primary' | 'secondary' | 'destructive' | 'foreground' | 'accent' | 'muted' | 'ring';
+type RatingColor = 'default' | 'primary' | 'secondary' | 'destructive' | 'foreground' | 'accent' | 'muted' | 'ring';
+interface RatingOption {
+  label: string;
+  value: number;
 }
-interface RatingButtonProps$1 extends RatingButtonProps {}
-/**
- * Rating component wrapper with enhanced functionality
- */
+declare const ratingVariants: (props?: ({
+  size?: "sm" | "default" | "lg" | "xl" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+type RatingSize = VariantProps<typeof ratingVariants>['size'];
+type IconType = 'star' | 'circle';
+interface RatingProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'defaultValue'> {
+  value?: number;
+  defaultValue?: number;
+  onValueChange?: (value: number) => void;
+  max?: number;
+  options?: RatingOption[];
+  iconType?: IconType;
+  size?: RatingSize;
+  readOnly?: boolean;
+  disabled?: boolean;
+  name?: string;
+  required?: boolean;
+  color?: RatingColor;
+}
+interface RatingButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
+  index: number;
+}
+declare function RatingButton({
+  index,
+  className,
+  ...props
+}: RatingButtonProps): react_jsx_runtime4.JSX.Element;
 declare function Rating({
-  max,
+  value: valueProp,
+  defaultValue,
+  onValueChange,
+  options: optionsProp,
+  max: maxProp,
+  iconType,
+  size,
+  readOnly,
+  disabled,
+  name,
+  required,
   color,
+  className,
+  children,
   ...props
-}: RatingProps$1): react_jsx_runtime4.JSX.Element;
-/**
- * Individual rating button component
- */
-declare const RatingButton$1: typeof RatingButton;
+}: React$1.PropsWithChildren<RatingProps>): react_jsx_runtime4.JSX.Element;
 //#endregion
-export { Rating, RatingButton$1 as RatingButton, RatingButtonProps$1 as RatingButtonProps, RatingProps$1 as RatingProps };
+export { Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps };

package/dist/Rating.d.ts

@@ -1,26 +1,57 @@
-import { RatingButton, RatingButtonProps, RatingProps } from "@pixpilot/shadcn";
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as React$1 from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
 
 //#region src/Rating.d.ts
-interface RatingProps$1 extends Omit<RatingProps, 'children'> {
-  /**
-   * Color variant for the rating
-   * @default 'default'
-   */
-  color?: 'default' | 'primary' | 'secondary' | 'destructive' | 'foreground' | 'accent' | 'muted' | 'ring';
+type RatingColor = 'default' | 'primary' | 'secondary' | 'destructive' | 'foreground' | 'accent' | 'muted' | 'ring';
+interface RatingOption {
+  label: string;
+  value: number;
 }
-interface RatingButtonProps$1 extends RatingButtonProps {}
-/**
- * Rating component wrapper with enhanced functionality
- */
-declare function Rating$1({
-  max,
+declare const ratingVariants: (props?: ({
+  size?: "sm" | "default" | "lg" | "xl" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+type RatingSize = VariantProps<typeof ratingVariants>['size'];
+type IconType = 'star' | 'circle';
+interface RatingProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'defaultValue'> {
+  value?: number;
+  defaultValue?: number;
+  onValueChange?: (value: number) => void;
+  max?: number;
+  options?: RatingOption[];
+  iconType?: IconType;
+  size?: RatingSize;
+  readOnly?: boolean;
+  disabled?: boolean;
+  name?: string;
+  required?: boolean;
+  color?: RatingColor;
+}
+interface RatingButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
+  index: number;
+}
+declare function RatingButton({
+  index,
+  className,
+  ...props
+}: RatingButtonProps): react_jsx_runtime0.JSX.Element;
+declare function Rating({
+  value: valueProp,
+  defaultValue,
+  onValueChange,
+  options: optionsProp,
+  max: maxProp,
+  iconType,
+  size,
+  readOnly,
+  disabled,
+  name,
+  required,
   color,
+  className,
+  children,
   ...props
-}: RatingProps$1): react_jsx_runtime4.JSX.Element;
-/**
- * Individual rating button component
- */
-declare const RatingButton$1: typeof RatingButton;
+}: React$1.PropsWithChildren<RatingProps>): react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Rating$1 as Rating, RatingButton$1 as RatingButton, RatingButtonProps$1 as RatingButtonProps, RatingProps$1 as RatingProps };
+export { Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps };

package/dist/Rating.js

@@ -1,36 +1,198 @@
-import { Rating, RatingButton } from "@pixpilot/shadcn";
-import { jsx } from "react/jsx-runtime";
+import { cn } from "@pixpilot/shadcn";
+import { Circle, Star } from "lucide-react";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
 
 //#region src/Rating.tsx
 const DEFAULT_MAX_RATING = 5;
+const ratingVariants = cva("inline-flex items-center gap-1", {
+	variants: { size: {
+		sm: "[&_svg]:size-4",
+		default: "[&_svg]:size-5",
+		lg: "[&_svg]:size-6",
+		xl: "[&_svg]:size-7"
+	} },
+	defaultVariants: { size: "default" }
+});
+const sizePixels = {
+	sm: 16,
+	default: 20,
+	lg: 24,
+	xl: 28
+};
 const colorClasses = {
-	default: "[&_svg]:!fill-yellow-400 [&_svg]:!text-yellow-400 dark:[&_svg]:!fill-yellow-500 dark:[&_svg]:!text-yellow-500 [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	primary: "[&_svg]:!fill-primary [&_svg]:!text-primary [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	secondary: "[&_svg]:!fill-secondary [&_svg]:!text-secondary-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	destructive: "[&_svg]:!fill-destructive [&_svg]:!text-destructive [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
+	default: "[&_svg]:!fill-yellow-400 [&_svg]:!text-yellow-400 dark:[&_svg]:!fill-yellow-500 dark:[&_svg]:!text-yellow-500 [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	primary: "[&_svg]:!fill-primary [&_svg]:!text-primary [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	secondary: "[&_svg]:!fill-secondary [&_svg]:!text-secondary-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	destructive: "[&_svg]:!fill-destructive [&_svg]:!text-destructive [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
 	foreground: "[&_svg]:!fill-foreground [&_svg]:!text-foreground [&_svg.fill-transparent]:!fill-transparent",
-	accent: "[&_svg]:!fill-accent [&_svg]:!text-accent-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	muted: "[&_svg]:!fill-muted [&_svg]:!text-muted-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground",
-	ring: "[&_svg]:!fill-ring [&_svg]:!text-ring [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground"
+	accent: "[&_svg]:!fill-accent [&_svg]:!text-accent-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	muted: "[&_svg]:!fill-muted [&_svg]:!text-muted-foreground [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30",
+	ring: "[&_svg]:!fill-ring [&_svg]:!text-ring [&_svg.fill-transparent]:!fill-transparent [&_svg.fill-transparent]:!text-foreground/30"
 };
-/**
-* Rating component wrapper with enhanced functionality
-*/
-function Rating$1({ max = DEFAULT_MAX_RATING, color = "default",...props }) {
-	const colorClass = colorClasses[color];
-	return /* @__PURE__ */ jsx(Rating, {
-		max,
+const RatingContext = React$1.createContext(null);
+function useRating() {
+	const context = React$1.use(RatingContext);
+	if (!context) throw new Error("useRating must be used within a Rating component");
+	return context;
+}
+function buildFallbackOptions(max) {
+	return Array.from({ length: max }, (_, index) => {
+		const value = index + 1;
+		return {
+			value,
+			label: `Rate ${value}`
+		};
+	});
+}
+function getIndexForValue(value, options) {
+	if (!value) return 0;
+	const foundIndex = options.findIndex((option) => option.value === value);
+	return foundIndex === -1 ? 0 : foundIndex + 1;
+}
+function RatingButton({ index, className,...props }) {
+	const { selectedIndex, hoverIndex, setHoverIndex, setValueByIndex, max, readOnly, disabled, size, iconType, options, colorClassName } = useRating();
+	const isFilled = (hoverIndex || selectedIndex) >= index;
+	const label = options[index - 1]?.label;
+	const labelText = typeof label === "string" && label.length > 0 ? label : void 0;
+	const hasLabelText = labelText !== void 0;
+	const labelTextOrEmpty = labelText ?? "";
+	const Icon = iconType === "circle" ? Circle : Star;
+	const handleClick = () => {
+		if (readOnly || disabled) return;
+		setValueByIndex(index);
+	};
+	const handleMouseEnter = () => {
+		if (readOnly || disabled) return;
+		setHoverIndex(index);
+	};
+	const handleKeyDown = (event) => {
+		if (readOnly || disabled) return;
+		switch (event.key) {
+			case "ArrowLeft":
+			case "ArrowDown":
+				event.preventDefault();
+				setValueByIndex(Math.max(1, index - 1));
+				break;
+			case "ArrowRight":
+			case "ArrowUp":
+				event.preventDefault();
+				setValueByIndex(Math.min(max, index + 1));
+				break;
+			case "Home":
+				event.preventDefault();
+				setValueByIndex(1);
+				break;
+			case "End":
+				event.preventDefault();
+				setValueByIndex(max);
+				break;
+			case "Enter":
+			case " ":
+				event.preventDefault();
+				setValueByIndex(index);
+				break;
+			default: break;
+		}
+	};
+	return /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		role: "radio",
+		"aria-checked": index === selectedIndex,
+		"aria-label": labelText ?? `Rate ${index}`,
+		title: labelText,
+		disabled: disabled || readOnly,
+		onClick: handleClick,
+		onMouseEnter: handleMouseEnter,
+		onKeyDown: handleKeyDown,
+		className: cn("inline-flex items-center justify-center transition-all outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded-sm", readOnly && "cursor-default", !readOnly && !disabled && "cursor-pointer hover:scale-110", disabled && "opacity-50 cursor-not-allowed", colorClassName, className),
 		...props,
-		children: Array.from({ length: max }, (_, i) => /* @__PURE__ */ jsx(RatingButton, {
-			index: i + 1,
-			className: colorClass
-		}, i + 1))
+		children: [/* @__PURE__ */ jsx(Icon, {
+			className: cn("transition-all", isFilled ? "fill-current text-current" : "fill-transparent text-foreground/30"),
+			size,
+			"aria-hidden": "true"
+		}), hasLabelText ? /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: labelTextOrEmpty
+		}) : null]
+	});
+}
+function Rating({ value: valueProp, defaultValue, onValueChange, options: optionsProp, max: maxProp = DEFAULT_MAX_RATING, iconType = "star", size = "default", readOnly = false, disabled = false, name, required, color = "default", className, children,...props }) {
+	const isControlled = valueProp !== void 0;
+	const [internalValue, setInternalValue] = React$1.useState(defaultValue ?? 0);
+	const [hoverIndex, setHoverIndex] = React$1.useState(0);
+	const value = isControlled ? valueProp : internalValue;
+	const options = React$1.useMemo(() => {
+		const explicitOptions = optionsProp?.filter(Boolean);
+		return explicitOptions && explicitOptions.length > 0 ? explicitOptions : buildFallbackOptions(maxProp);
+	}, [maxProp, optionsProp]);
+	const max = options.length;
+	const selectedIndex = React$1.useMemo(() => getIndexForValue(value, options), [options, value]);
+	const setValue = React$1.useCallback((nextValue) => {
+		if (!isControlled) setInternalValue(nextValue);
+		onValueChange?.(nextValue);
+	}, [isControlled, onValueChange]);
+	const setValueByIndex = React$1.useCallback((index) => {
+		const nextOption = options[Math.min(Math.max(index, 1), max) - 1];
+		if (!nextOption) return;
+		setValue(nextOption.value);
+	}, [
+		max,
+		options,
+		setValue
+	]);
+	const colorClassName = colorClasses[color];
+	const contextValue = React$1.useMemo(() => ({
+		value,
+		hoverIndex,
+		selectedIndex,
+		options,
+		max,
+		readOnly,
+		disabled,
+		size: sizePixels[size ?? "default"],
+		iconType,
+		colorClassName,
+		setHoverIndex,
+		setValueByIndex
+	}), [
+		colorClassName,
+		disabled,
+		hoverIndex,
+		iconType,
+		max,
+		options,
+		readOnly,
+		selectedIndex,
+		size,
+		value,
+		setValueByIndex
+	]);
+	const handleMouseLeave = () => {
+		if (readOnly || disabled) return;
+		setHoverIndex(0);
+	};
+	const nameText = typeof name === "string" && name.length > 0 ? name : void 0;
+	const hasNameText = nameText !== void 0;
+	const nameTextOrEmpty = nameText ?? "";
+	return /* @__PURE__ */ jsx(RatingContext, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsxs("div", {
+			role: "radiogroup",
+			tabIndex: 0,
+			className: cn(ratingVariants({ size }), className),
+			onMouseLeave: handleMouseLeave,
+			...props,
+			children: [children ?? Array.from({ length: max }, (_, index) => /* @__PURE__ */ jsx(RatingButton, { index: index + 1 }, index)), hasNameText ? /* @__PURE__ */ jsx("input", {
+				type: "hidden",
+				name: nameTextOrEmpty,
+				value: value || "",
+				required
+			}) : null]
+		})
 	});
 }
-/**
-* Individual rating button component
-*/
-const RatingButton$1 = RatingButton;
 
 //#endregion
-export { Rating$1 as Rating, RatingButton$1 as RatingButton };
+export { Rating, RatingButton };

package/dist/Select.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime6 from "react/jsx-runtime";
 import { Select, SelectContent } from "@pixpilot/shadcn";
 import React, { ComponentProps } from "react";
 
@@ -46,6 +46,6 @@ type BaseSelectProps = {
    */
   clearable?: boolean;
 } & Omit<ComponentProps<typeof Select>, 'value' | 'onValueChange' | 'children'>;
-declare function Select$1(props: BaseSelectProps): react_jsx_runtime5.JSX.Element;
+declare function Select$1(props: BaseSelectProps): react_jsx_runtime6.JSX.Element;
 //#endregion
 export { Select$1 as Select, SelectContentProps, SelectOption };

package/dist/Select.d.ts

@@ -1,6 +1,6 @@
 import { Select, SelectContent } from "@pixpilot/shadcn";
 import React, { ComponentProps } from "react";
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 
 //#region src/Select.d.ts
 interface SelectOption {
@@ -46,6 +46,6 @@ type BaseSelectProps = {
    */
   clearable?: boolean;
 } & Omit<ComponentProps<typeof Select>, 'value' | 'onValueChange' | 'children'>;
-declare function Select$1(props: BaseSelectProps): react_jsx_runtime5.JSX.Element;
+declare function Select$1(props: BaseSelectProps): react_jsx_runtime1.JSX.Element;
 //#endregion
 export { Select$1 as Select, SelectContentProps, SelectOption };

package/dist/TagsInput.d.cts

@@ -1,5 +1,5 @@
 import { CommandOptionListItem } from "./CommandOptionList.cjs";
-import * as react_jsx_runtime6 from "react/jsx-runtime";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
 
 //#region src/TagsInput.d.ts
 interface TagsInputProps {
@@ -55,6 +55,6 @@ declare function TagsInput({
   addOnPaste,
   addOnTab,
   onValidate
-}: TagsInputProps): react_jsx_runtime6.JSX.Element;
+}: TagsInputProps): react_jsx_runtime7.JSX.Element;
 //#endregion
 export { TagsInput, TagsInputProps };

package/dist/TagsInput.d.ts

@@ -1,5 +1,5 @@
 import { CommandOptionListItem } from "./CommandOptionList.js";
-import * as react_jsx_runtime6 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 
 //#region src/TagsInput.d.ts
 interface TagsInputProps {
@@ -55,6 +55,6 @@ declare function TagsInput({
   addOnPaste,
   addOnTab,
   onValidate
-}: TagsInputProps): react_jsx_runtime6.JSX.Element;
+}: TagsInputProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 export { TagsInput, TagsInputProps };

package/dist/dialog/Dialog.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime9 from "react/jsx-runtime";
 import * as React$1 from "react";
 import * as _radix_ui_react_dialog0 from "@radix-ui/react-dialog";
 
@@ -9,14 +9,14 @@ declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<_radix_ui_re
 declare function DialogHeader({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
 declare function DialogBody({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
 declare function DialogFooter({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
 //#endregion
 export { DialogBody, DialogContent, DialogFooter, DialogHeader };

package/dist/dialog/Dialog.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 import * as _radix_ui_react_dialog0 from "@radix-ui/react-dialog";
 
 //#region src/dialog/Dialog.d.ts
@@ -9,14 +9,14 @@ declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<_radix_ui_re
 declare function DialogHeader({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 declare function DialogBody({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 declare function DialogFooter({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 //#endregion
 export { DialogBody, DialogContent, DialogFooter, DialogHeader };

package/dist/file-upload/FileUpload.d.cts

@@ -1,7 +1,7 @@
 import { FileUploadProps } from "./types/index.cjs";
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 
 //#region src/file-upload/FileUpload.d.ts
-declare function FileUpload(props: FileUploadProps): react_jsx_runtime7.JSX.Element;
+declare function FileUpload(props: FileUploadProps): react_jsx_runtime8.JSX.Element;
 //#endregion
 export { FileUpload };

package/dist/file-upload/FileUpload.d.ts

@@ -1,7 +1,7 @@
 import { FileUploadProps } from "./types/index.js";
-import * as react_jsx_runtime12 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 
 //#region src/file-upload/FileUpload.d.ts
-declare function FileUpload(props: FileUploadProps): react_jsx_runtime12.JSX.Element;
+declare function FileUpload(props: FileUploadProps): react_jsx_runtime17.JSX.Element;
 //#endregion
 export { FileUpload };

package/dist/file-upload-inline/FileUploadInline.d.cts

@@ -1,10 +1,10 @@
 import { FileUploadInlineProps } from "./types.cjs";
-import * as react_jsx_runtime11 from "react/jsx-runtime";
+import * as react_jsx_runtime13 from "react/jsx-runtime";
 
 //#region src/file-upload-inline/FileUploadInline.d.ts
 /**
  * FileUploadInline - An inline file upload component using FileUpload primitives
  */
-declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime11.JSX.Element;
+declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime13.JSX.Element;
 //#endregion
 export { FileUploadInline };

package/dist/file-upload-inline/FileUploadInline.d.ts

@@ -1,10 +1,10 @@
 import { FileUploadInlineProps } from "./types.js";
-import * as react_jsx_runtime10 from "react/jsx-runtime";
+import * as react_jsx_runtime12 from "react/jsx-runtime";
 
 //#region src/file-upload-inline/FileUploadInline.d.ts
 /**
  * FileUploadInline - An inline file upload component using FileUpload primitives
  */
-declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime10.JSX.Element;
+declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime12.JSX.Element;
 //#endregion
 export { FileUploadInline };

package/dist/index.d.cts

@@ -45,7 +45,7 @@ import { Pagination, PaginationProps } from "./pagination/Pagination.cjs";
 import "./pagination/index.cjs";
 import { Popover, PopoverAnchor, PopoverContent, PopoverContentProps, PopoverTrigger } from "./popover/Popover.cjs";
 import "./popover/index.cjs";
-import { Rating, RatingButton, RatingButtonProps, RatingProps } from "./Rating.cjs";
+import { Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps } from "./Rating.cjs";
 import { RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ToolbarItems } from "./rich-text-editor/RichTextEditor.cjs";
 import "./rich-text-editor/index.cjs";
 import { ScaledPreview, ScaledPreviewProps, ScaledPreviewSize } from "./ScaledPreview.cjs";
@@ -74,4 +74,4 @@ import { Toaster } from "./toast/ToastProvider.cjs";
 import "./toast/index.cjs";
 import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.cjs";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.d.ts

@@ -47,7 +47,7 @@ import { Pagination, PaginationProps } from "./pagination/Pagination.js";
 import "./pagination/index.js";
 import { Popover, PopoverAnchor, PopoverContent, PopoverContentProps, PopoverTrigger } from "./popover/Popover.js";
 import "./popover/index.js";
-import { Rating, RatingButton, RatingButtonProps, RatingProps } from "./Rating.js";
+import { Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps } from "./Rating.js";
 import { RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ToolbarItems } from "./rich-text-editor/RichTextEditor.js";
 import "./rich-text-editor/index.js";
 import { ScaledPreview, ScaledPreviewProps, ScaledPreviewSize } from "./ScaledPreview.js";
@@ -76,4 +76,4 @@ import { Toaster } from "./toast/ToastProvider.js";
 import "./toast/index.js";
 import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.js";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/theme-toggle/ThemeModeDropdown.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime13 from "react/jsx-runtime";
+import * as react_jsx_runtime15 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeDropdown.d.ts
 interface ThemeModeDropdownProps {
@@ -17,7 +17,7 @@ interface ThemeModeDropdownProps {
  * Provides Light / Dark / System options.
  * Pure component - requires themeValue and onChange props.
  */
-declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime13.JSX.Element;
+declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime15.JSX.Element;
 declare namespace ThemeModeDropdown {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchInside.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime14 from "react/jsx-runtime";
+import * as react_jsx_runtime16 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchInside.d.ts
 type ThemeModeSwitchInsideSize = 'sm' | 'md' | 'lg';
@@ -25,7 +25,7 @@ interface ThemeModeSwitchInsideProps {
  * Icons are embedded within the switch control.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime14.JSX.Element;
+declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime16.JSX.Element;
 declare namespace ThemeModeSwitchInside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchOutside.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime15 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchOutside.d.ts
 interface ThemeModeSwitchOutsideProps {
@@ -22,7 +22,7 @@ interface ThemeModeSwitchOutsideProps {
  * Icons flank the switch control on either side.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime15.JSX.Element;
+declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime17.JSX.Element;
 declare namespace ThemeModeSwitchOutside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeToggleButton.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime16 from "react/jsx-runtime";
+import * as react_jsx_runtime14 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeToggleButton.d.ts
 interface ThemeModeToggleButtonProps {
@@ -13,7 +13,7 @@ interface ThemeModeToggleButtonProps {
  * Light/Dark toggle button.
  * Pure component - toggles between light and dark.
  */
-declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime16.JSX.Element;
+declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime14.JSX.Element;
 declare namespace ThemeModeToggleButton {
   var displayName: string;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pixpilot/shadcn-ui",
   "type": "module",
-  "version": "0.45.0",
+  "version": "0.46.0",
   "description": "Custom UI components and utilities built with shadcn/ui.",
   "author": "m.doaie <m.doaie@hotmail.com>",
   "license": "MIT",
@@ -61,11 +61,11 @@
     "tsdown": "^0.15.12",
     "typescript": "^5.9.3",
     "@internal/eslint-config": "0.3.0",
+    "@internal/hooks": "0.0.0",
     "@internal/prettier-config": "0.0.1",
     "@internal/tsconfig": "0.1.0",
     "@internal/tsdown-config": "0.1.0",
-    "@internal/vitest-config": "0.1.0",
-    "@internal/hooks": "0.0.0"
+    "@internal/vitest-config": "0.1.0"
   },
   "prettier": "@internal/prettier-config",
   "scripts": {