@appcorp/shadcn 1.0.38 → 1.1.0

package/components/audio.js

@@ -6,12 +6,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AudioControl = void 0;
 var react_1 = __importDefault(require("react"));
-var button_1 = require("./button");
-var label_1 = require("./label");
+var button_1 = require("./ui/button");
+var enhanced_label_1 = require("./enhanced-label");
 var AudioControl = function (_a) {
     var audioUrl = _a.audioUrl, id = _a.id, label = _a.label, onDelete = _a.onDelete, onGenerate = _a.onGenerate, _b = _a.required, required = _b === void 0 ? false : _b;
     return (react_1.default.createElement("div", { className: "space-y-2" },
-        label && (react_1.default.createElement(label_1.Label, { htmlFor: id, required: required }, label)),
+        label && (react_1.default.createElement(enhanced_label_1.EnhancedLabel, { htmlFor: id, required: required }, label)),
         !audioUrl && (react_1.default.createElement("div", { className: "flex gap-2" },
             react_1.default.createElement(button_1.Button, { type: "button", onClick: onGenerate, variant: "outline", className: "flex-1" }, "Generate Audio"),
             react_1.default.createElement(button_1.Button, { type: "button", onClick: onDelete, variant: "destructive", className: "flex-1" }, "Delete Audio"))),

package/components/dashboard.js

@@ -36,8 +36,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Dashboard = void 0;
 var react_1 = __importStar(require("react"));
 var app_sidebar_1 = require("./app-sidebar");
-var breadcrumb_1 = require("./breadcrumb");
-var separator_1 = require("./separator");
+var breadcrumb_1 = require("./ui/breadcrumb");
+var separator_1 = require("./ui/separator");
 var sidebar_1 = require("./sidebar");
 var Dashboard = function (_a) {
     var apps = _a.apps, avatar = _a.avatar, breadcrumbs = _a.breadcrumbs, children = _a.children, email = _a.email, members = _a.members, navItems = _a.navItems, username = _a.username;

package/components/enhanced-checkbox.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+interface EnhancedCheckboxProps extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {
+    error?: string;
+    info?: string;
+    label?: string;
+}
+declare const EnhancedCheckbox: React.ForwardRefExoticComponent<EnhancedCheckboxProps & React.RefAttributes<HTMLButtonElement>>;
+export { EnhancedCheckbox };

package/components/{checkbox.js → enhanced-checkbox.js}

@@ -56,32 +56,31 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Checkbox = Checkbox;
+exports.EnhancedCheckbox = void 0;
 var React = __importStar(require("react"));
-var CheckboxPrimitive = __importStar(require("@radix-ui/react-checkbox"));
-var lucide_react_1 = require("lucide-react");
 var utils_1 = require("../lib/utils");
-var label_1 = require("./label");
-function Checkbox(_a) {
+var checkbox_1 = require("./ui/checkbox");
+var enhanced_label_1 = require("./enhanced-label");
+var EnhancedCheckbox = React.forwardRef(function (_a, ref) {
     var className = _a.className, error = _a.error, info = _a.info, label = _a.label, id = _a.id, props = __rest(_a, ["className", "error", "info", "label", "id"]);
     // Determine if there's an error (for aria-invalid and styling)
     var hasError = Boolean(error);
-    var checkboxElement = (React.createElement(CheckboxPrimitive.Root, __assign({ id: id, "data-slot": "checkbox", "aria-invalid": hasError, className: (0, utils_1.cn)("peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50", 
+    var checkboxElement = (React.createElement(checkbox_1.Checkbox, __assign({ ref: ref, id: id, "data-slot": "checkbox", "aria-invalid": hasError, className: (0, utils_1.cn)(
         // Error state styling
         hasError &&
-            "data-[state=checked]:bg-destructive data-[state=unchecked]:bg-destructive/20 border-destructive focus-visible:border-destructive focus-visible:ring-destructive/20", className) }, props),
-        React.createElement(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "flex items-center justify-center text-current transition-none" },
-            React.createElement(lucide_react_1.CheckIcon, { className: "size-3.5" }))));
+            "data-[state=checked]:bg-destructive data-[state=unchecked]:bg-destructive/20 border-destructive focus-visible:border-destructive focus-visible:ring-destructive/20", className) }, props)));
     // If label is provided, render the complete checkbox with label structure
     if (label) {
         return (React.createElement("div", { className: "w-full space-y-2" },
             React.createElement("div", { className: "flex items-center space-x-2" },
                 checkboxElement,
-                React.createElement(label_1.Label, { htmlFor: id, className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" }, label)),
+                React.createElement(enhanced_label_1.EnhancedLabel, { htmlFor: id, className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" }, label)),
             (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
     }
     // If no label, render just the checkbox with messages (backward compatibility)
     return (React.createElement("div", { className: "w-full" },
         checkboxElement,
         (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
-}
+});
+exports.EnhancedCheckbox = EnhancedCheckbox;
+EnhancedCheckbox.displayName = "EnhancedCheckbox";

package/components/{combobox.d.ts → enhanced-combobox.d.ts}

@@ -4,7 +4,7 @@ export interface ComboboxOption {
     label: string;
     id?: string;
 }
-interface ComboboxProps {
+interface EnhancedComboboxProps {
     options: ComboboxOption[];
     value?: string;
     onValueChange: (value: string) => void;
@@ -24,7 +24,7 @@ interface ComboboxProps {
     info?: string;
     error?: string;
 }
-export declare function Combobox({ className, disabled, emptyText, error, id, info, label, loading, maxHeight, onSearchChange, onValueChange, options, placeholder, required, searchPlaceholder, showScrollIndicators, value, virtualizeThreshold, }: ComboboxProps): React.JSX.Element;
+export declare function EnhancedCombobox({ className, disabled, emptyText, error, id, info, label, loading, maxHeight, onSearchChange, onValueChange, options, placeholder, required, searchPlaceholder, showScrollIndicators, value, virtualizeThreshold, }: EnhancedComboboxProps): React.JSX.Element;
 interface CompanyComboboxProps {
     companies: Array<{
         id?: string;

package/components/{combobox.js → enhanced-combobox.js}

@@ -34,16 +34,16 @@ var __importStar = (this && this.__importStar) || (function () {
     };
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Combobox = Combobox;
+exports.EnhancedCombobox = EnhancedCombobox;
 exports.CompanyCombobox = CompanyCombobox;
 exports.CountryCombobox = CountryCombobox;
 var react_1 = __importStar(require("react"));
 var lucide_react_1 = require("lucide-react");
 var utils_1 = require("../lib/utils");
-var button_1 = require("./button");
-var label_1 = require("./label");
-var command_1 = require("./command");
-var popover_1 = require("./popover");
+var button_1 = require("./ui/button");
+var enhanced_label_1 = require("./enhanced-label");
+var command_1 = require("./ui/command");
+var popover_1 = require("./ui/popover");
 function VirtualizedList(_a) {
     var options = _a.options, selectedValue = _a.selectedValue, onSelect = _a.onSelect, scrollContainer = _a.scrollContainer;
     var _b = (0, react_1.useState)({
@@ -128,7 +128,7 @@ function VirtualizedList(_a) {
             react_1.default.createElement("span", { className: "truncate" }, option.label))); }),
         bottomSpacer > 0 && react_1.default.createElement("div", { style: { height: bottomSpacer } })));
 }
-function Combobox(_a) {
+function EnhancedCombobox(_a) {
     var className = _a.className, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.emptyText, emptyText = _c === void 0 ? "No options found." : _c, error = _a.error, id = _a.id, info = _a.info, label = _a.label, _d = _a.loading, loading = _d === void 0 ? false : _d, _e = _a.maxHeight, maxHeight = _e === void 0 ? 256 : _e, onSearchChange = _a.onSearchChange, onValueChange = _a.onValueChange, _f = _a.options, options = _f === void 0 ? [] : _f, _g = _a.placeholder, placeholder = _g === void 0 ? "Select option..." : _g, _h = _a.required, required = _h === void 0 ? false : _h, _j = _a.searchPlaceholder, searchPlaceholder = _j === void 0 ? "Search..." : _j, _k = _a.showScrollIndicators, showScrollIndicators = _k === void 0 ? true : _k, value = _a.value, _l = _a.virtualizeThreshold, virtualizeThreshold = _l === void 0 ? 50 : _l;
     var _m = (0, react_1.useState)(false), open = _m[0], setOpen = _m[1];
     var _o = (0, react_1.useState)(""), searchValue = _o[0], setSearchValue = _o[1];
@@ -206,8 +206,8 @@ function Combobox(_a) {
                 react_1.default.createElement(lucide_react_1.ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" }))),
         react_1.default.createElement(popover_1.PopoverContent, { className: "w-[var(--radix-popover-trigger-width)] p-0", side: "bottom", align: "start", avoidCollisions: true, collisionPadding: 8, style: { zIndex: 1000 }, onOpenAutoFocus: function (e) { return e.preventDefault(); } },
             react_1.default.createElement(command_1.Command, { shouldFilter: false },
-                react_1.default.createElement(command_1.CommandInput, { placeholder: searchPlaceholder, value: searchValue, onValueChange: handleSearchChange }),
-                react_1.default.createElement(command_1.CommandEmpty, null, loading ? (react_1.default.createElement("div", { className: "flex items-center justify-center py-6" },
+                react_1.default.createElement(command_1.CommandInput, { "data-slot": "command-input", placeholder: searchPlaceholder, value: searchValue, onValueChange: handleSearchChange }),
+                react_1.default.createElement(command_1.CommandEmpty, { "data-slot": "command-empty" }, loading ? (react_1.default.createElement("div", { className: "flex items-center justify-center py-6" },
                     react_1.default.createElement("div", { className: "animate-spin rounded-full h-4 w-4 border-b-2 border-primary" }),
                     react_1.default.createElement("span", { className: "ml-2 text-sm" }, "Searching..."))) : (emptyText)),
                 react_1.default.createElement("div", { className: "relative" },
@@ -229,7 +229,7 @@ function Combobox(_a) {
     // If label is provided, render the complete combobox with label structure
     if (label) {
         return (react_1.default.createElement("div", { className: "w-full space-y-2" },
-            react_1.default.createElement(label_1.Label, { htmlFor: id, required: required }, label),
+            react_1.default.createElement(enhanced_label_1.EnhancedLabel, { htmlFor: id, required: required }, label),
             comboboxElement,
             error && (react_1.default.createElement("p", { className: "text-xs text-destructive dark:text-red-400" }, error)),
             info && !error && (react_1.default.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info))));
@@ -247,7 +247,7 @@ function CompanyCombobox(_a) {
             id: (_b = company.id) === null || _b === void 0 ? void 0 : _b.toString(),
         });
     });
-    return (react_1.default.createElement(Combobox, { options: options, value: value, onValueChange: onValueChange, onSearchChange: onSearchChange, placeholder: placeholder, searchPlaceholder: "Search companies...", emptyText: "No companies found.", loading: loading, className: className, maxHeight: maxHeight, showScrollIndicators: showScrollIndicators, virtualizeThreshold: 100, label: label, required: required, id: id, info: info, error: error }));
+    return (react_1.default.createElement(EnhancedCombobox, { options: options, value: value, onValueChange: onValueChange, onSearchChange: onSearchChange, placeholder: placeholder, searchPlaceholder: "Search companies...", emptyText: "No companies found.", loading: loading, className: className, maxHeight: maxHeight, showScrollIndicators: showScrollIndicators, virtualizeThreshold: 100, label: label, required: required, id: id, info: info, error: error }));
 }
 function CountryCombobox(_a) {
     var _b = _a.countries, countries = _b === void 0 ? [] : _b, value = _a.value, onValueChange = _a.onValueChange, onSearchChange = _a.onSearchChange, _c = _a.loading, loading = _c === void 0 ? false : _c, _d = _a.placeholder, placeholder = _d === void 0 ? "Select country..." : _d, className = _a.className, _e = _a.maxHeight, maxHeight = _e === void 0 ? 280 : _e, _f = _a.showScrollIndicators, showScrollIndicators = _f === void 0 ? true : _f, label = _a.label, _g = _a.required, required = _g === void 0 ? false : _g, id = _a.id, info = _a.info, error = _a.error;
@@ -311,5 +311,5 @@ function CountryCombobox(_a) {
         value: country.name,
         label: country.name,
     }); });
-    return (react_1.default.createElement(Combobox, { options: options, value: value, onValueChange: onValueChange, onSearchChange: onSearchChange, placeholder: placeholder, searchPlaceholder: "Search countries...", emptyText: "No countries found.", loading: loading, className: className, maxHeight: maxHeight, showScrollIndicators: showScrollIndicators, virtualizeThreshold: 30, label: label, required: required, id: id, info: info, error: error }));
+    return (react_1.default.createElement(EnhancedCombobox, { options: options, value: value, onValueChange: onValueChange, onSearchChange: onSearchChange, placeholder: placeholder, searchPlaceholder: "Search countries...", emptyText: "No countries found.", loading: loading, className: className, maxHeight: maxHeight, showScrollIndicators: showScrollIndicators, virtualizeThreshold: 30, label: label, required: required, id: id, info: info, error: error }));
 }

package/components/enhanced-dropzone.js

@@ -58,8 +58,8 @@ exports.EnhancedDropzone = void 0;
 var react_1 = __importStar(require("react"));
 var react_dropzone_1 = require("react-dropzone");
 var utils_1 = require("../lib/utils");
-var carousel_1 = require("./carousel");
-var button_1 = require("./button");
+var carousel_1 = require("./ui/carousel");
+var button_1 = require("./ui/button");
 var lucide_react_1 = require("lucide-react");
 var EnhancedDropzone = function (_a) {
     var id = _a.id, label = _a.label, info = _a.info, error = _a.error, accept = _a.accept, _b = _a.maxFiles, maxFiles = _b === void 0 ? 10 : _b, maxSize = _a.maxSize, minSize = _a.minSize, disabled = _a.disabled, _c = _a.value, value = _c === void 0 ? [] : _c, onChange = _a.onChange, onRemoveRemote = _a.onRemoveRemote, className = _a.className;

package/components/enhanced-input.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+interface EnhancedInputProps extends React.ComponentProps<"input"> {
+    error?: string;
+    info?: string;
+    label?: string;
+}
+declare const EnhancedInput: React.ForwardRefExoticComponent<Omit<EnhancedInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export { EnhancedInput };

package/components/{input.js → enhanced-input.js}

@@ -55,15 +55,16 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Input = void 0;
+exports.EnhancedInput = void 0;
 var React = __importStar(require("react"));
 var utils_1 = require("../lib/utils");
-var label_1 = require("./label");
-var Input = React.forwardRef(function (_a, ref) {
+var enhanced_label_1 = require("./enhanced-label");
+var input_1 = require("./ui/input");
+var EnhancedInput = React.forwardRef(function (_a, ref) {
     var className = _a.className, type = _a.type, error = _a.error, info = _a.info, label = _a.label, required = _a.required, id = _a.id, props = __rest(_a, ["className", "type", "error", "info", "label", "required", "id"]);
     // Determine if there's an error (for aria-invalid and styling)
     var hasError = Boolean(error);
-    var inputElement = (React.createElement("input", __assign({ type: type, ref: ref, id: id, "data-slot": "input", "aria-invalid": hasError, required: required, className: (0, utils_1.cn)("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", 
+    var inputElement = (React.createElement(input_1.Input, __assign({ type: type, ref: ref, id: id, "aria-invalid": hasError, required: required, className: (0, utils_1.cn)(
         // Error state styling
         hasError &&
             "border-destructive focus-visible:border-destructive focus-visible:ring-destructive/20", 
@@ -73,7 +74,7 @@ var Input = React.forwardRef(function (_a, ref) {
     // If label is provided, render the complete input with label structure
     if (label) {
         return (React.createElement("div", { className: "w-full space-y-2" },
-            React.createElement(label_1.Label, { htmlFor: id, required: required }, label),
+            React.createElement(enhanced_label_1.EnhancedLabel, { htmlFor: id, required: required }, label),
             inputElement,
             (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
     }
@@ -82,5 +83,5 @@ var Input = React.forwardRef(function (_a, ref) {
         inputElement,
         (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
 });
-exports.Input = Input;
-Input.displayName = "Input";
+exports.EnhancedInput = EnhancedInput;
+EnhancedInput.displayName = "EnhancedInput";

package/components/enhanced-label.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+interface EnhancedLabelProps extends React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> {
+    required?: boolean;
+}
+declare function EnhancedLabel({ className, required, children, ...props }: EnhancedLabelProps): React.JSX.Element;
+export { EnhancedLabel };

package/components/{label.js → enhanced-label.js}

@@ -56,13 +56,13 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Label = Label;
+exports.EnhancedLabel = EnhancedLabel;
 var React = __importStar(require("react"));
-var LabelPrimitive = __importStar(require("@radix-ui/react-label"));
 var utils_1 = require("../lib/utils");
-function Label(_a) {
+var label_1 = require("./ui/label");
+function EnhancedLabel(_a) {
     var className = _a.className, _b = _a.required, required = _b === void 0 ? false : _b, children = _a.children, props = __rest(_a, ["className", "required", "children"]);
-    return (React.createElement(LabelPrimitive.Root, __assign({ "data-slot": "label", className: (0, utils_1.cn)("flex items-center gap-1 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50 min-h-5", className) }, props),
+    return (React.createElement(label_1.Label, __assign({ "data-slot": "label", className: (0, utils_1.cn)("flex items-center gap-1 select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 min-h-5", className) }, props),
         children,
         required && (React.createElement("span", { className: "text-destructive text-sm", "aria-label": "required" }, "*"))));
 }

package/components/enhanced-select.d.ts

@@ -0,0 +1,25 @@
+import * as React from "react";
+import * as SelectPrimitive from "@radix-ui/react-select";
+interface EnhancedSelectProps {
+    error?: string;
+    info?: string;
+    label?: string;
+    required?: boolean;
+    id?: string;
+    children?: React.ReactNode;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    disabled?: boolean;
+    name?: string;
+    dir?: "ltr" | "rtl";
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+interface EnhancedSelectTriggerProps extends React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger> {
+    error?: string;
+}
+declare const EnhancedSelect: ({ error, info, label, required, id, children, ...selectProps }: EnhancedSelectProps) => React.JSX.Element;
+declare const EnhancedSelectTrigger: React.ForwardRefExoticComponent<EnhancedSelectTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+export { EnhancedSelect, EnhancedSelectTrigger };

package/components/enhanced-select.js

@@ -0,0 +1,81 @@
+"use client";
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EnhancedSelectTrigger = exports.EnhancedSelect = void 0;
+var React = __importStar(require("react"));
+var utils_1 = require("../lib/utils");
+var select_1 = require("./ui/select");
+var enhanced_label_1 = require("./enhanced-label");
+var EnhancedSelect = function (_a) {
+    var error = _a.error, info = _a.info, label = _a.label, required = _a.required, id = _a.id, children = _a.children, selectProps = __rest(_a, ["error", "info", "label", "required", "id", "children"]);
+    return (React.createElement("div", { className: "w-full space-y-2" },
+        label && (React.createElement(enhanced_label_1.EnhancedLabel, { htmlFor: id, required: required }, label)),
+        React.createElement(select_1.Select, __assign({}, selectProps), children),
+        (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
+};
+exports.EnhancedSelect = EnhancedSelect;
+var EnhancedSelectTrigger = React.forwardRef(function (_a, ref) {
+    var className = _a.className, error = _a.error, children = _a.children, props = __rest(_a, ["className", "error", "children"]);
+    var hasError = Boolean(error);
+    return (React.createElement(select_1.SelectTrigger, __assign({ ref: ref, "aria-invalid": hasError, className: (0, utils_1.cn)(
+        // Error state styling
+        hasError &&
+            "border-destructive focus:ring-destructive/20 focus:border-destructive", className) }, props), children));
+});
+exports.EnhancedSelectTrigger = EnhancedSelectTrigger;
+EnhancedSelectTrigger.displayName = "EnhancedSelectTrigger";

package/components/enhanced-switch.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import * as SwitchPrimitives from "@radix-ui/react-switch";
+interface EnhancedSwitchProps extends React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> {
+    error?: string;
+    info?: string;
+    label?: string;
+    description?: string;
+}
+declare const EnhancedSwitch: React.ForwardRefExoticComponent<EnhancedSwitchProps & React.RefAttributes<HTMLButtonElement>>;
+export { EnhancedSwitch };

package/components/{switch.js → enhanced-switch.js}

@@ -56,28 +56,26 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Switch = void 0;
+exports.EnhancedSwitch = void 0;
 var React = __importStar(require("react"));
-var SwitchPrimitive = __importStar(require("@radix-ui/react-switch"));
+var SwitchPrimitives = __importStar(require("@radix-ui/react-switch"));
 var utils_1 = require("../lib/utils");
-var label_1 = require("./label");
-var Switch = React.forwardRef(function (_a, ref) {
+var enhanced_label_1 = require("./enhanced-label");
+var EnhancedSwitch = React.forwardRef(function (_a, ref) {
     var className = _a.className, error = _a.error, info = _a.info, label = _a.label, required = _a.required, id = _a.id, description = _a.description, props = __rest(_a, ["className", "error", "info", "label", "required", "id", "description"]);
     // Determine if there's an error (for aria-invalid and styling)
     var hasError = Boolean(error);
-    var switchElement = (React.createElement(SwitchPrimitive.Root, __assign({ ref: ref, id: id, "data-slot": "switch", "aria-invalid": hasError, required: required, className: (0, utils_1.cn)("peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50", 
+    var switchElement = (React.createElement(SwitchPrimitives.Root, __assign({ ref: ref, id: id, "data-slot": "switch", "aria-invalid": hasError, required: required, className: (0, utils_1.cn)("peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input", 
         // Error state styling
         hasError &&
             "data-[state=checked]:bg-destructive data-[state=unchecked]:bg-destructive/20 border-destructive focus-visible:border-destructive focus-visible:ring-destructive/20", className) }, props),
-        React.createElement(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: (0, utils_1.cn)("bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0", 
-            // Error state thumb styling
-            hasError && "dark:data-[state=checked]:bg-destructive-foreground") })));
+        React.createElement(SwitchPrimitives.Thumb, { "data-slot": "switch-thumb", className: (0, utils_1.cn)("pointer-events-none block h-4 w-4 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0") })));
     // If label is provided, render the complete switch with label structure
     if (label) {
         return (React.createElement("div", { className: "w-full space-y-2" },
             React.createElement("div", { className: "flex items-center justify-between space-x-2" },
                 React.createElement("div", null,
-                    React.createElement(label_1.Label, { htmlFor: id, required: required }, label),
+                    React.createElement(enhanced_label_1.EnhancedLabel, { htmlFor: id, required: required }, label),
                     description && (React.createElement("p", { className: "text-sm text-gray-400" }, description))),
                 switchElement),
             (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
@@ -87,5 +85,5 @@ var Switch = React.forwardRef(function (_a, ref) {
         switchElement,
         (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
 });
-exports.Switch = Switch;
-Switch.displayName = SwitchPrimitive.Root.displayName;
+exports.EnhancedSwitch = EnhancedSwitch;
+EnhancedSwitch.displayName = "EnhancedSwitch";

package/components/enhanced-table-footer-action.js

@@ -20,7 +20,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.EnhancedTableFooterAction = void 0;
 var react_1 = __importDefault(require("react"));
 var lucide_react_1 = require("lucide-react");
-var button_1 = require("./button");
+var button_1 = require("./ui/button");
 var EnhancedTableFooterAction = function (_a) {
     var handleNextOnClick = _a.handleNextOnClick, handlePreviousOnClick = _a.handlePreviousOnClick, isNextDisabled = _a.isNextDisabled, isPreviousDisabled = _a.isPreviousDisabled, _b = _a.isRTL, isRTL = _b === void 0 ? false : _b, loading = _a.loading, _c = _a.nextPageLabel, nextPageLabel = _c === void 0 ? "Next page" : _c, _d = _a.previousPageLabel, previousPageLabel = _d === void 0 ? "Previous page" : _d;
     // In RTL, arrows should be swapped:

package/components/enhanced-table-footer-pagination.js

@@ -18,7 +18,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EnhancedTableFooterPagination = void 0;
-var select_1 = require("./select");
+var select_1 = require("./ui/select");
 var react_1 = __importDefault(require("react"));
 var EnhancedTableFooterPagination = function (_a) {
     var handleOnSelect = _a.handleOnSelect, _b = _a.isRTL, isRTL = _b === void 0 ? false : _b, listOptions = _a.listOptions, loading = _a.loading, nodeSelectKey = _a.nodeSelectKey, pageLimit = _a.pageLimit, _c = _a.rowsPerPageLabel, rowsPerPageLabel = _c === void 0 ? "Rows per page:" : _c, _d = _a.className, className = _d === void 0 ? "" : _d;

package/components/enhanced-table-header-action.js

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.EnhancedTableHeaderAction = void 0;
 var react_1 = __importDefault(require("react"));
 var lucide_react_1 = require("lucide-react");
-var button_1 = require("./button");
-var badge_1 = require("./badge");
+var button_1 = require("./ui/button");
+var badge_1 = require("./ui/badge");
 var EnhancedTableHeaderAction = function (_a) {
     var headerActions = _a.headerActions, numberOfFilters = _a.numberOfFilters, onClearFilters = _a.onClearFilters;
     return (react_1.default.createElement(react_1.default.Fragment, null, headerActions.length > 0 && (react_1.default.createElement("div", { className: "flex gap-2" }, headerActions

package/components/enhanced-table-header-search.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.EnhancedTableHeaderSearch = void 0;
 var react_1 = __importDefault(require("react"));
 var lucide_react_1 = require("lucide-react");
-var input_1 = require("./input");
+var input_1 = require("./ui/input");
 var EnhancedTableHeaderSearch = function (_a) {
     var handleSearchInput = _a.handleSearchInput, loading = _a.loading, _b = _a.searchDisabled, searchDisabled = _b === void 0 ? false : _b, _c = _a.searchEnabled, searchEnabled = _c === void 0 ? true : _c, _d = _a.searchId, searchId = _d === void 0 ? "table-search" : _d, _e = _a.searchPlaceholder, searchPlaceholder = _e === void 0 ? "Search..." : _e, searchValue = _a.searchValue;
     return (react_1.default.createElement(react_1.default.Fragment, null, searchEnabled && (react_1.default.createElement("div", { className: "flex items-center gap-2 max-w-xl" },

package/components/enhanced-table.js

@@ -18,16 +18,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.EnhancedTable = exports.COMPONENT_TYPE = void 0;
 var react_1 = __importDefault(require("react"));
 var lucide_react_1 = require("lucide-react");
-var table_1 = require("./table");
-var dropdown_menu_1 = require("./dropdown-menu");
+var table_1 = require("./ui/table");
+var dropdown_menu_1 = require("./ui/dropdown-menu");
 var utils_1 = require("../lib/utils");
 var enhanced_table_footer_action_1 = require("./enhanced-table-footer-action");
 var enhanced_table_footer_page_1 = require("./enhanced-table-footer-page");
 var enhanced_table_footer_pagination_1 = require("./enhanced-table-footer-pagination");
-var popover_1 = require("./popover");
+var popover_1 = require("./ui/popover");
 var enhanced_table_header_action_1 = require("./enhanced-table-header-action");
 var enhanced_table_header_search_1 = require("./enhanced-table-header-search");
-var badge_1 = require("./badge");
+var badge_1 = require("./ui/badge");
 // Centralized component type values for table cell rendering
 var COMPONENT_TYPE;
 (function (COMPONENT_TYPE) {
@@ -127,7 +127,8 @@ var EnhancedTable = function (_a) {
                 react_1.default.createElement(dropdown_menu_1.DropdownMenuContent, { align: "end" }, rowActions
                     .filter(function (action) { return action.enabled !== false; })
                     .sort(function (a, b) { return (a.order || 0) - (b.order || 0); })
-                    .map(function (action, index) { return (react_1.default.createElement(dropdown_menu_1.DropdownMenuItem, { key: action.id || action.key || index, variant: action.variant, onClick: function () {
+                    .map(function (action, index) { return (react_1.default.createElement(dropdown_menu_1.DropdownMenuItem, { key: action.id || action.key || index, className: (0, utils_1.cn)(action.variant === "destructive" &&
+                        "text-destructive focus:text-destructive"), onClick: function () {
                         if (action.onClick)
                             action.onClick(row);
                         if (action.handleOnClick)

package/components/enhanced-textarea.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+interface EnhancedTextareaProps extends React.ComponentProps<"textarea"> {
+    error?: string;
+    info?: string;
+    label?: string;
+}
+declare const EnhancedTextarea: React.ForwardRefExoticComponent<Omit<EnhancedTextareaProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
+export { EnhancedTextarea };

package/components/{textarea.js → enhanced-textarea.js}

@@ -55,15 +55,16 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Textarea = void 0;
+exports.EnhancedTextarea = void 0;
 var React = __importStar(require("react"));
 var utils_1 = require("../lib/utils");
-var label_1 = require("./label");
-var Textarea = React.forwardRef(function (_a, ref) {
+var label_1 = require("./ui/label");
+var textarea_1 = require("./ui/textarea");
+var EnhancedTextarea = React.forwardRef(function (_a, ref) {
     var className = _a.className, error = _a.error, info = _a.info, label = _a.label, required = _a.required, id = _a.id, props = __rest(_a, ["className", "error", "info", "label", "required", "id"]);
     // Determine if there's an error (for aria-invalid and styling)
     var hasError = Boolean(error);
-    var textareaElement = (React.createElement("textarea", __assign({ ref: ref, id: id, "data-slot": "textarea", "aria-invalid": hasError, required: required, className: (0, utils_1.cn)("placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input min-h-[80px] w-full min-w-0 rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none resize-vertical disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", 
+    var textareaElement = (React.createElement(textarea_1.Textarea, __assign({ ref: ref, id: id, "aria-invalid": hasError, required: required, className: (0, utils_1.cn)(
         // Error state styling
         hasError &&
             "border-destructive focus-visible:border-destructive focus-visible:ring-destructive/20", 
@@ -73,7 +74,9 @@ var Textarea = React.forwardRef(function (_a, ref) {
     // If label is provided, render the complete textarea with label structure
     if (label) {
         return (React.createElement("div", { className: "w-full space-y-2" },
-            React.createElement(label_1.Label, { htmlFor: id, required: required }, label),
+            React.createElement(label_1.Label, { htmlFor: id },
+                label,
+                required && (React.createElement("span", { className: "text-destructive text-sm ml-1", "aria-label": "required" }, "*"))),
             textareaElement,
             (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
     }
@@ -82,5 +85,5 @@ var Textarea = React.forwardRef(function (_a, ref) {
         textareaElement,
         (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
 });
-exports.Textarea = Textarea;
-Textarea.displayName = "Textarea";
+exports.EnhancedTextarea = EnhancedTextarea;
+EnhancedTextarea.displayName = "EnhancedTextarea";

package/components/field.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { type VariantProps } from "class-variance-authority";
-import { Label } from "./label";
+import { Label } from "./ui/label";
 declare function FieldSet({ className, ...props }: React.ComponentProps<"fieldset">): React.JSX.Element;
 declare function FieldLegend({ className, variant, ...props }: React.ComponentProps<"legend"> & {
     variant?: "legend" | "label";

package/components/field.js

@@ -69,8 +69,8 @@ exports.FieldTitle = FieldTitle;
 var react_1 = __importStar(require("react"));
 var class_variance_authority_1 = require("class-variance-authority");
 var utils_1 = require("../lib/utils");
-var label_1 = require("./label");
-var separator_1 = require("./separator");
+var label_1 = require("./ui/label");
+var separator_1 = require("./ui/separator");
 function FieldSet(_a) {
     var className = _a.className, props = __rest(_a, ["className"]);
     return (react_1.default.createElement("fieldset", __assign({ "data-slot": "field-set", className: (0, utils_1.cn)("flex flex-col gap-6", "has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3", className) }, props)));

package/components/nav-main.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.NavMain = NavMain;
 var react_1 = __importDefault(require("react"));
 var lucide_react_1 = require("lucide-react");
-var collapsible_1 = require("./collapsible");
+var collapsible_1 = require("./ui/collapsible");
 var sidebar_1 = require("./sidebar");
 function NavMain(_a) {
     var items = _a.items;

package/components/nav-projects.js

@@ -6,7 +6,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NavProjects = void 0;
 var lucide_react_1 = require("lucide-react");
-var dropdown_menu_1 = require("./dropdown-menu");
+var dropdown_menu_1 = require("./ui/dropdown-menu");
 var sidebar_1 = require("./sidebar");
 var react_1 = __importDefault(require("react"));
 var NavProjects = function (_a) {