@nextworks/blocks-core 0.2.0-alpha.0 → 0.2.0-alpha.2

package/dist-cjs/ui/button.cjs

@@ -0,0 +1,108 @@
+"use strict";
+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.buttonVariants = exports.Button = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const react_slot_1 = require("@radix-ui/react-slot");
+const class_variance_authority_1 = require("class-variance-authority");
+const utils_1 = require("../lib/utils");
+const buttonVariants = (0, class_variance_authority_1.cva)("focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/90 shadow-xs",
+            destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 shadow-xs",
+            outline: "bg-background hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border shadow-xs",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-xs",
+            ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+            link: "text-primary underline-offset-4 hover:underline",
+        },
+        size: {
+            default: "h-9 px-4 py-2 has-[>svg]:px-3",
+            sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
+            lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+            icon: "size-9",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+exports.buttonVariants = buttonVariants;
+const Button = React.forwardRef((_a, ref) => {
+    var _b;
+    var { className, variant, size, asChild = false, unstyled = false, forceInlineVars = false } = _a, props = __rest(_a, ["className", "variant", "size", "asChild", "unstyled", "forceInlineVars"]);
+    const Comp = asChild ? react_slot_1.Slot : "button";
+    // Use caller-provided style; only inject inline var-driven colors when explicitly requested
+    const incomingStyle = (_b = props.style) !== null && _b !== void 0 ? _b : undefined;
+    const finalStyle = forceInlineVars && !unstyled
+        ? Object.assign(Object.assign({}, incomingStyle), { color: "var(--btn-fg)", backgroundColor: "var(--btn-bg)", borderColor: "var(--btn-border)", "--tw-ring-color": "var(--btn-ring)" }) : incomingStyle;
+    // Only enable CSS variable hooks when explicitly requested via inline vars
+    // or when the caller sets any [--btn-*] classes in className.
+    const wantsVarHooks = !unstyled &&
+        (forceInlineVars ||
+            (typeof className === "string" && className.includes("[--btn-")));
+    return ((0, jsx_runtime_1.jsx)(Comp, Object.assign({ ref: ref, "data-slot": "button", className: unstyled
+            ? (0, utils_1.cn)("inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap disabled:pointer-events-none disabled:opacity-50", className)
+            : (0, utils_1.cn)(buttonVariants({ variant, size }), wantsVarHooks && [
+                // Color var hooks (apply only when CSS vars are provided)
+                "text-[var(--btn-fg)]",
+                "bg-[var(--btn-bg)]",
+                "hover:bg-[var(--btn-hover-bg)]",
+                "hover:text-[var(--btn-hover-fg)]",
+                // explicit dark variants to compete with dark: utilities from variants like outline
+                "dark:bg-[var(--btn-bg)]",
+                "dark:hover:bg-[var(--btn-hover-bg)]",
+                "dark:hover:text-[var(--btn-hover-fg)]",
+                // Focus ring and border hooks
+                "focus-visible:ring-[var(--btn-ring)]",
+                "border-[var(--btn-border)]",
+                "dark:border-[var(--btn-border)]",
+            ], className), style: finalStyle }, props)));
+});
+exports.Button = Button;
+Button.displayName = "Button";

package/dist-cjs/ui/card.cjs

@@ -0,0 +1,54 @@
+"use strict";
+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.Card = Card;
+exports.CardHeader = CardHeader;
+exports.CardFooter = CardFooter;
+exports.CardTitle = CardTitle;
+exports.CardAction = CardAction;
+exports.CardDescription = CardDescription;
+exports.CardContent = CardContent;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("../lib/utils");
+function Card(_a) {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ "data-slot": "card", className: (0, utils_1.cn)(
+        // Structural + token fallbacks
+        "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm", 
+        // CSS variable hooks for preset-first overrides
+        "border-[var(--card-border)] bg-[var(--card-bg)] text-[var(--card-fg)] shadow-[var(--card-shadow)]", className) }, props)));
+}
+function CardHeader(_a) {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ "data-slot": "card-header", className: (0, utils_1.cn)("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6", className) }, props)));
+}
+function CardTitle(_a) {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ "data-slot": "card-title", className: (0, utils_1.cn)("leading-none font-semibold", className) }, props)));
+}
+function CardDescription(_a) {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ "data-slot": "card-description", className: (0, utils_1.cn)("text-muted-foreground text-sm", className) }, props)));
+}
+function CardAction(_a) {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ "data-slot": "card-action", className: (0, utils_1.cn)("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className) }, props)));
+}
+function CardContent(_a) {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ "data-slot": "card-content", className: (0, utils_1.cn)("px-6", className) }, props)));
+}
+function CardFooter(_a) {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ "data-slot": "card-footer", className: (0, utils_1.cn)("flex items-center px-6 [.border-t]:pt-6", className) }, props)));
+}

package/dist-cjs/ui/checkbox.cjs

@@ -0,0 +1,60 @@
+"use strict";
+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.Checkbox = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const utils_1 = require("../lib/utils");
+const Checkbox = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    // Use the native accent-color where supported for consistent checkbox fill
+    const style = { accentColor: "var(--primary)" }; // fallback; modern browsers will use this accent color
+    return ((0, jsx_runtime_1.jsx)("input", Object.assign({ type: "checkbox", ref: ref, style: style, className: (0, utils_1.cn)(
+        // Keep layout small but add smooth transitions and focus ring
+        "h-4 w-4 rounded border-[var(--input-border)] bg-[var(--input-bg)] text-[var(--input-fg)] transition-colors duration-200 ease-in-out", "focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:outline-none", "disabled:cursor-not-allowed disabled:opacity-50", className) }, props)));
+});
+exports.Checkbox = Checkbox;
+Checkbox.displayName = "Checkbox";

package/dist-cjs/ui/cta-button.cjs

@@ -0,0 +1,53 @@
+"use strict";
+"use client";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CTAButton = CTAButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const link_1 = __importDefault(require("next/link"));
+const button_1 = require("../ui/button");
+const utils_1 = require("../lib/utils");
+function CTAButton({ id, className, onClick, ctaButtonLabel = "Get Started", ctaButtonHref = "#contact", ctaButtonTextColor, ctaButtonBgColor, ctaButtonBorderColor, ctaButtonDarkMode, ctaButtonHoverStyle, button = {
+    variant: "default",
+    size: "lg",
+    className: "bg-primary text-primary-foreground hover:bg-primary/90 font-medium shadow-md hover:shadow-lg transition-all duration-200 hover:-translate-y-0.5",
+}, }) {
+    if (!ctaButtonLabel)
+        return null;
+    // Build dynamic classes from deprecated style props (kept for compatibility)
+    const dynamic = [];
+    if (ctaButtonTextColor)
+        dynamic.push(`text-${ctaButtonTextColor}`);
+    if (ctaButtonBgColor)
+        dynamic.push(`bg-${ctaButtonBgColor}`);
+    if (ctaButtonBorderColor)
+        dynamic.push(`border-${ctaButtonBorderColor}`);
+    if (ctaButtonHoverStyle) {
+        const { color, bg, borderColor, transform, boxShadow } = ctaButtonHoverStyle;
+        if (color)
+            dynamic.push(`hover:text-${color}`);
+        if (bg)
+            dynamic.push(`hover:bg-${bg}`);
+        if (borderColor)
+            dynamic.push(`hover:border-${borderColor}`);
+        if (transform)
+            dynamic.push(`hover:${transform}`);
+        if (boxShadow)
+            dynamic.push(`hover:${boxShadow}`);
+    }
+    if (ctaButtonDarkMode) {
+        const { color, bg, borderColor } = ctaButtonDarkMode;
+        if (color)
+            dynamic.push(`dark:text-${color}`);
+        if (bg)
+            dynamic.push(`dark:bg-${bg}`);
+        if (borderColor)
+            dynamic.push(`dark:border-${borderColor}`);
+    }
+    const finalClassName = (0, utils_1.cn)(
+    // Allow var hooks to flow through to Button
+    "border-[var(--btn-border)] focus-visible:ring-[var(--btn-ring)]", button.className, className, dynamic.join(" "));
+    return ((0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ asChild: true, variant: button.variant, size: button.size, className: finalClassName }, (button.unstyled ? { unstyled: true } : {}), { style: button.style, children: (0, jsx_runtime_1.jsx)(link_1.default, { id: id, href: ctaButtonHref || "#", onClick: onClick, "aria-label": ctaButtonLabel, children: ctaButtonLabel }) })));
+}

package/dist-cjs/ui/dropdown-menu.cjs

@@ -0,0 +1,122 @@
+"use strict";
+"use client";
+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.DropdownMenuRadioGroup = exports.DropdownMenuSubTrigger = exports.DropdownMenuSubContent = exports.DropdownMenuSub = exports.DropdownMenuPortal = exports.DropdownMenuGroup = exports.DropdownMenuShortcut = exports.DropdownMenuSeparator = exports.DropdownMenuLabel = exports.DropdownMenuRadioItem = exports.DropdownMenuCheckboxItem = exports.DropdownMenuItem = exports.DropdownMenuContent = exports.DropdownMenuTrigger = exports.DropdownMenu = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const DropdownMenuPrimitive = __importStar(require("@radix-ui/react-dropdown-menu"));
+const lucide_react_1 = require("lucide-react");
+const utils_1 = require("../lib/utils");
+const DropdownMenu = DropdownMenuPrimitive.Root;
+exports.DropdownMenu = DropdownMenu;
+const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+exports.DropdownMenuTrigger = DropdownMenuTrigger;
+const DropdownMenuGroup = DropdownMenuPrimitive.Group;
+exports.DropdownMenuGroup = DropdownMenuGroup;
+const DropdownMenuPortal = DropdownMenuPrimitive.Portal;
+exports.DropdownMenuPortal = DropdownMenuPortal;
+const DropdownMenuSub = DropdownMenuPrimitive.Sub;
+exports.DropdownMenuSub = DropdownMenuSub;
+const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+exports.DropdownMenuRadioGroup = DropdownMenuRadioGroup;
+const DropdownMenuSubTrigger = React.forwardRef((_a, ref) => {
+    var { className, inset, children } = _a, props = __rest(_a, ["className", "inset", "children"]);
+    return ((0, jsx_runtime_1.jsxs)(DropdownMenuPrimitive.SubTrigger, Object.assign({ ref: ref, className: (0, utils_1.cn)("focus:bg-accent data-[state=open]:bg-accent flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none", inset && "pl-8", className) }, props, { children: [children, (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "ml-auto h-4 w-4" })] })));
+});
+exports.DropdownMenuSubTrigger = DropdownMenuSubTrigger;
+DropdownMenuSubTrigger.displayName =
+    DropdownMenuPrimitive.SubTrigger.displayName;
+const DropdownMenuSubContent = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.SubContent, Object.assign({ ref: ref, className: (0, utils_1.cn)("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border p-1 shadow-lg", className) }, props)));
+});
+exports.DropdownMenuSubContent = DropdownMenuSubContent;
+DropdownMenuSubContent.displayName =
+    DropdownMenuPrimitive.SubContent.displayName;
+const DropdownMenuContent = React.forwardRef((_a, ref) => {
+    var { className, sideOffset = 4 } = _a, props = __rest(_a, ["className", "sideOffset"]);
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Portal, { children: (0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Content, Object.assign({ ref: ref, sideOffset: sideOffset, className: (0, utils_1.cn)("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border p-1 shadow-md", className) }, props)) }));
+});
+exports.DropdownMenuContent = DropdownMenuContent;
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+const DropdownMenuItem = React.forwardRef((_a, ref) => {
+    var { className, inset } = _a, props = __rest(_a, ["className", "inset"]);
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Item, Object.assign({ ref: ref, className: (0, utils_1.cn)("focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm transition-colors outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50", inset && "pl-8", className) }, props)));
+});
+exports.DropdownMenuItem = DropdownMenuItem;
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+const DropdownMenuCheckboxItem = React.forwardRef((_a, ref) => {
+    var { className, children, checked } = _a, props = __rest(_a, ["className", "children", "checked"]);
+    return ((0, jsx_runtime_1.jsxs)(DropdownMenuPrimitive.CheckboxItem, Object.assign({ ref: ref, className: (0, utils_1.cn)("focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-sm transition-colors outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className), checked: checked }, props, { children: [(0, jsx_runtime_1.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: (0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: (0, jsx_runtime_1.jsx)(lucide_react_1.Check, { className: "h-4 w-4" }) }) }), children] })));
+});
+exports.DropdownMenuCheckboxItem = DropdownMenuCheckboxItem;
+DropdownMenuCheckboxItem.displayName =
+    DropdownMenuPrimitive.CheckboxItem.displayName;
+const DropdownMenuRadioItem = React.forwardRef((_a, ref) => {
+    var { className, children } = _a, props = __rest(_a, ["className", "children"]);
+    return ((0, jsx_runtime_1.jsxs)(DropdownMenuPrimitive.RadioItem, Object.assign({ ref: ref, className: (0, utils_1.cn)("focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-sm transition-colors outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className) }, props, { children: [(0, jsx_runtime_1.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: (0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: (0, jsx_runtime_1.jsx)(lucide_react_1.Circle, { className: "h-2 w-2 fill-current" }) }) }), children] })));
+});
+exports.DropdownMenuRadioItem = DropdownMenuRadioItem;
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+const DropdownMenuLabel = React.forwardRef((_a, ref) => {
+    var { className, inset } = _a, props = __rest(_a, ["className", "inset"]);
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Label, Object.assign({ ref: ref, className: (0, utils_1.cn)("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className) }, props)));
+});
+exports.DropdownMenuLabel = DropdownMenuLabel;
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+const DropdownMenuSeparator = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)(DropdownMenuPrimitive.Separator, Object.assign({ ref: ref, className: (0, utils_1.cn)("bg-muted -mx-1 my-1 h-px", className) }, props)));
+});
+exports.DropdownMenuSeparator = DropdownMenuSeparator;
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+const DropdownMenuShortcut = (_a) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: (0, utils_1.cn)("ml-auto text-xs tracking-widest opacity-60", className) }, props)));
+};
+exports.DropdownMenuShortcut = DropdownMenuShortcut;
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";

package/dist-cjs/ui/feature-card.cjs

@@ -0,0 +1,20 @@
+"use strict";
+"use client";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FeatureCard = FeatureCard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const image_1 = __importDefault(require("next/image"));
+const card_1 = require("../ui/card");
+const utils_1 = require("../lib/utils");
+function FeatureCard({ id, className, cardImageSrc, cardImageAlt, cardHeadingText, cardSubheadingText, card = {
+    className: "h-full transition-all duration-200 hover:shadow-lg bg-card text-card-foreground border rounded-md border-border",
+}, image = { className: "object-cover" }, heading = {
+    className: "mb-2 text-lg font-semibold text-foreground text-[var(--card-title-fg)]",
+}, subheading = {
+    className: "text-sm leading-relaxed text-muted-foreground text-[var(--card-muted-fg)]",
+}, imageQuality = 85, imageSizes = "(max-width: 480px) 100vw, (max-width: 768px) 50vw, 33vw", }) {
+    return ((0, jsx_runtime_1.jsx)(card_1.Card, { id: id, className: (0, utils_1.cn)("group", card.className, className), children: (0, jsx_runtime_1.jsxs)(card_1.CardContent, { className: "relative flex h-full flex-col p-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "pointer-events-none absolute inset-0 -z-10 opacity-0 transition-opacity duration-500 group-hover:opacity-100", children: (0, jsx_runtime_1.jsx)("div", { className: "absolute -top-10 -left-10 h-40 w-40 rounded-full bg-white/5 blur-2xl dark:bg-white/10" }) }), (0, jsx_runtime_1.jsx)("div", { className: "relative mb-4 h-48 w-full overflow-hidden rounded-md", children: cardImageSrc ? ((0, jsx_runtime_1.jsx)(image_1.default, { src: cardImageSrc, alt: cardImageAlt || "Feature image", fill: true, className: (0, utils_1.cn)("transition-transform duration-500 group-hover:scale-105", image.className), quality: imageQuality, sizes: imageSizes })) : ((0, jsx_runtime_1.jsx)("div", { className: "bg-muted text-muted-foreground flex h-full w-full items-center justify-center", children: (0, jsx_runtime_1.jsx)("span", { className: "text-xs", children: "No image" }) })) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 flex-col", children: [(0, jsx_runtime_1.jsx)("h3", { className: heading.className, children: cardHeadingText }), (0, jsx_runtime_1.jsx)("p", { className: subheading.className, children: cardSubheadingText })] })] }) }));
+}

package/dist-cjs/ui/input.cjs

@@ -0,0 +1,60 @@
+"use strict";
+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.Input = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const utils_1 = require("../lib/utils");
+const Input = React.forwardRef((_a, ref) => {
+    var { className, type } = _a, props = __rest(_a, ["className", "type"]);
+    return ((0, jsx_runtime_1.jsx)("input", Object.assign({ type: type, className: (0, utils_1.cn)(
+        // Base structural + token fallbacks
+        "border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive/30 dark:aria-invalid:focus-visible:ring-destructive/40 flex h-10 w-full rounded-md border px-3 py-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50", 
+        // CSS variable hooks (preset-first). When vars are unset, these are ignored and tokens above apply.
+        "focus-visible:ring-offset-background border-[var(--input-border)] bg-[var(--input-bg)] text-[var(--input-fg)] placeholder:text-[var(--input-placeholder)] focus-visible:ring-[var(--input-focus-ring,var(--ring))] focus-visible:ring-offset-2", className), ref: ref }, props)));
+});
+exports.Input = Input;
+Input.displayName = "Input";

package/dist-cjs/ui/label.cjs

@@ -0,0 +1,61 @@
+"use strict";
+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.Label = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const LabelPrimitive = __importStar(require("@radix-ui/react-label"));
+const class_variance_authority_1 = require("class-variance-authority");
+const utils_1 = require("../lib/utils");
+const labelVariants = (0, class_variance_authority_1.cva)("text-sm leading-none font-medium peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
+const Label = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsx)(LabelPrimitive.Root, Object.assign({ ref: ref, className: (0, utils_1.cn)(labelVariants(), 
+        // Optional color override via var; falls back to inherited color when unset
+        "text-[var(--label-fg)]", className) }, props)));
+});
+exports.Label = Label;
+Label.displayName = LabelPrimitive.Root.displayName;

package/dist-cjs/ui/pricing-card.cjs

@@ -0,0 +1,28 @@
+"use strict";
+"use client";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PricingCard = PricingCard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const link_1 = __importDefault(require("next/link"));
+const button_1 = require("../ui/button");
+const card_1 = require("../ui/card");
+const utils_1 = require("../lib/utils");
+const lucide_react_1 = require("lucide-react");
+function PricingCard({ id, className, pricingCardTitle = "Basic Plan", pricingCardPrice = "$9.99", pricingCardFeatures = ["Feature 1", "Feature 2", "Feature 3"], pricingCardCTALabel = "Select Plan", pricingCardCTAHref = "#contact", isPopular = false, card = {
+    className: "relative bg-card text-card-foreground border border-border rounded-lg shadow-md hover:shadow-lg transition-shadow duration-200",
+}, header = { className: "p-6 text-center border-b border-border" }, title = { className: "text-xl font-bold text-foreground mb-2" }, price = { className: "text-3xl font-bold text-foreground mb-4" }, features = { className: "p-6 space-y-3" }, featureItem = {
+    className: "flex items-center text-muted-foreground text-sm",
+}, cta = {
+    variant: "default",
+    size: "lg",
+    className: "w-full bg-primary text-primary-foreground hover:bg-primary/90 font-medium shadow-md hover:shadow-lg transition-all duration-200 hover:-translate-y-0.5",
+}, popularBadge = {
+    className: "absolute -top-3 left-1/2 transform -translate-x-1/2 bg-primary text-primary-foreground px-4 py-1 rounded-full text-sm font-medium",
+}, }) {
+    return ((0, jsx_runtime_1.jsxs)(card_1.Card, { id: id, className: (0, utils_1.cn)(card.className, className, "rounded-lg"), children: [isPopular && (0, jsx_runtime_1.jsx)("div", { className: popularBadge.className, children: "Most Popular" }), (0, jsx_runtime_1.jsxs)("div", { className: header.className, children: [(0, jsx_runtime_1.jsx)("h3", { className: title.className, children: pricingCardTitle }), (0, jsx_runtime_1.jsx)("div", { className: price.className, children: pricingCardPrice })] }), (0, jsx_runtime_1.jsx)("div", { className: features.className, children: pricingCardFeatures === null || pricingCardFeatures === void 0 ? void 0 : pricingCardFeatures.map((feature, index) => ((0, jsx_runtime_1.jsxs)("div", { className: featureItem.className, children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Check, { className: "mr-3 h-4 w-4 flex-shrink-0 text-green-500" }), (0, jsx_runtime_1.jsx)("span", { children: feature })] }, index))) }), (0, jsx_runtime_1.jsx)("div", { className: "p-6 pt-0", children: (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ asChild: true, variant: cta.variant, size: cta.size, className: (0, utils_1.cn)(
+                    // Allow presets to take over with var hooks from Button
+                    "border-[var(--btn-border)] focus-visible:ring-[var(--btn-ring)]", cta.className, "hover:animate-none motion-safe:animate-none") }, (cta.unstyled ? { unstyled: true } : {}), { style: cta.style, children: (0, jsx_runtime_1.jsx)(link_1.default, { href: pricingCardCTAHref || "#", children: pricingCardCTALabel }) })) })] }));
+}

package/dist-cjs/ui/select.cjs

@@ -0,0 +1,56 @@
+"use strict";
+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.Select = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const utils_1 = require("../lib/utils");
+const Select = React.forwardRef((_a, ref) => {
+    var { className, children } = _a, props = __rest(_a, ["className", "children"]);
+    return ((0, jsx_runtime_1.jsx)("select", Object.assign({ ref: ref, className: (0, utils_1.cn)("border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive/30 dark:aria-invalid:focus-visible:ring-destructive/40 flex h-10 w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50", "bg-[var(--input-bg)] text-[var(--input-fg)]", className) }, props, { children: children })));
+});
+exports.Select = Select;
+Select.displayName = "Select";