@almadar/ui 5.2.0 → 5.3.0

package/dist/docs/index.js

@@ -3655,7 +3655,7 @@ function resolveIconForFamily(name, family) {
 var sizeClasses = {
   xs: "w-3 h-3",
   sm: "w-4 h-4",
-  md: "w-5 h-5",
+  md: "h-icon-default w-icon-default",
   lg: "w-6 h-6",
   xl: "w-8 h-8"
 };
@@ -3773,14 +3773,14 @@ var variantStyles2 = {
 };
 variantStyles2.destructive = variantStyles2.danger;
 var sizeStyles2 = {
-  sm: "px-3 py-1.5 text-sm",
-  md: "px-4 py-2 text-sm",
-  lg: "px-6 py-3 text-base"
+  sm: "h-button-sm px-3 text-sm",
+  md: "h-button-md px-4 text-sm",
+  lg: "h-button-lg px-6 text-base"
 };
 var iconSizeStyles = {
-  sm: "h-3.5 w-3.5",
+  sm: "h-icon-default w-icon-default",
   md: "h-icon-default w-icon-default",
-  lg: "h-5 w-5"
+  lg: "h-icon-default w-icon-default"
 };
 function resolveIconProp(value, sizeClass) {
   if (!value) return null;
@@ -3836,7 +3836,7 @@ var Button = React7.forwardRef(
         disabled: disabled || isLoading,
         className: cn(
           "inline-flex items-center justify-center gap-2",
-          "font-[var(--font-weight-medium)]",
+          "font-medium",
           "rounded-sm",
           "cursor-pointer",
           "transition-all duration-[var(--transition-normal)]",
@@ -3865,21 +3865,21 @@ var variantStyles3 = {
     "border-[length:var(--border-width)] border-border",
     "shadow-elevation-card",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   bordered: [
     "bg-card",
     "border-[length:var(--border-width)] border-border",
     "shadow-elevation-card",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   elevated: [
     "bg-card",
     "border-[length:var(--border-width)] border-border",
     "shadow",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   // Interactive variant with theme-specific hover effects
   interactive: [
@@ -3929,7 +3929,7 @@ var Card = React7.forwardRef(
         ...props,
         children: [
           (title || subtitle) && /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
-            title && /* @__PURE__ */ jsx("h3", { className: "text-lg text-card-foreground font-[var(--font-weight-bold)]", children: title }),
+            title && /* @__PURE__ */ jsx("h3", { className: "text-lg text-card-foreground font-bold", children: title }),
             subtitle && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mt-1", children: subtitle })
           ] }),
           children
@@ -3947,7 +3947,7 @@ var CardTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__
     ref,
     className: cn(
       "text-lg text-card-foreground",
-      "font-[var(--font-weight-bold)]",
+      "font-bold",
       className
     ),
     ...props
@@ -4057,10 +4057,11 @@ var Input = React7.forwardRef(
     const type = inputType || htmlType || "text";
     const resolvedLeftIcon = leftIcon || IconComponent && /* @__PURE__ */ jsx(IconComponent, { className: "h-icon-default w-icon-default" });
     const showClearButton = clearable && value && String(value).length > 0;
+    const isMultiline = type === "textarea";
     const baseClassName = cn(
       "block w-full rounded-sm transition-all duration-[var(--transition-fast)]",
       "border-[length:var(--border-width-thin)] border-border",
-      "px-3 py-2 text-sm",
+      isMultiline ? "px-3 py-2 text-sm" : "h-input-md px-3 text-sm",
       "bg-card hover:bg-muted focus:bg-card",
       "text-foreground placeholder:text-muted-foreground",
       "focus:outline-none focus:ring-1 focus:ring-ring focus:border-ring",
@@ -4112,7 +4113,7 @@ var Input = React7.forwardRef(
           checked: props.checked,
           onChange,
           className: cn(
-            "h-4 w-4 rounded-sm",
+            "h-icon-default w-icon-default rounded-sm",
             "border-border",
             "text-primary focus:ring-ring",
             "disabled:opacity-50 disabled:cursor-not-allowed",

package/dist/marketing/index.cjs

@@ -3682,7 +3682,7 @@ function resolveIconForFamily(name, family) {
 var sizeClasses = {
   xs: "w-3 h-3",
   sm: "w-4 h-4",
-  md: "w-5 h-5",
+  md: "h-icon-default w-icon-default",
   lg: "w-6 h-6",
   xl: "w-8 h-8"
 };
@@ -3800,14 +3800,14 @@ var variantStyles2 = {
 };
 variantStyles2.destructive = variantStyles2.danger;
 var sizeStyles2 = {
-  sm: "px-3 py-1.5 text-sm",
-  md: "px-4 py-2 text-sm",
-  lg: "px-6 py-3 text-base"
+  sm: "h-button-sm px-3 text-sm",
+  md: "h-button-md px-4 text-sm",
+  lg: "h-button-lg px-6 text-base"
 };
 var iconSizeStyles = {
-  sm: "h-3.5 w-3.5",
+  sm: "h-icon-default w-icon-default",
   md: "h-icon-default w-icon-default",
-  lg: "h-5 w-5"
+  lg: "h-icon-default w-icon-default"
 };
 function resolveIconProp(value, sizeClass) {
   if (!value) return null;
@@ -3863,7 +3863,7 @@ var Button = React8__default.default.forwardRef(
         disabled: disabled || isLoading,
         className: cn(
           "inline-flex items-center justify-center gap-2",
-          "font-[var(--font-weight-medium)]",
+          "font-medium",
           "rounded-sm",
           "cursor-pointer",
           "transition-all duration-[var(--transition-normal)]",
@@ -3925,7 +3925,11 @@ var sizeStyles3 = {
 };
 var Badge = React8__default.default.forwardRef(
   ({ className, variant = "default", size = "sm", amount, label, icon, children, onRemove, removeLabel, ...props }, ref) => {
-    const iconSizes = { sm: "w-3 h-3", md: "w-3.5 h-3.5", lg: "w-4 h-4" };
+    const iconSizes = {
+      sm: "h-icon-default w-icon-default",
+      md: "h-icon-default w-icon-default",
+      lg: "h-icon-default w-icon-default"
+    };
     const resolvedIcon = typeof icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: icon, className: iconSizes[size] }) : icon;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "span",
@@ -3972,21 +3976,21 @@ var variantStyles4 = {
     "border-[length:var(--border-width)] border-border",
     "shadow-elevation-card",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   bordered: [
     "bg-card",
     "border-[length:var(--border-width)] border-border",
     "shadow-elevation-card",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   elevated: [
     "bg-card",
     "border-[length:var(--border-width)] border-border",
     "shadow",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   // Interactive variant with theme-specific hover effects
   interactive: [
@@ -4036,7 +4040,7 @@ var Card = React8__default.default.forwardRef(
         ...props,
         children: [
           (title || subtitle) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
-            title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg text-card-foreground font-[var(--font-weight-bold)]", children: title }),
+            title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg text-card-foreground font-bold", children: title }),
             subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: subtitle })
           ] }),
           children
@@ -4054,7 +4058,7 @@ var CardTitle = React8__default.default.forwardRef(({ className, ...props }, ref
     ref,
     className: cn(
       "text-lg text-card-foreground",
-      "font-[var(--font-weight-bold)]",
+      "font-bold",
       className
     ),
     ...props

package/dist/marketing/index.js

@@ -3655,7 +3655,7 @@ function resolveIconForFamily(name, family) {
 var sizeClasses = {
   xs: "w-3 h-3",
   sm: "w-4 h-4",
-  md: "w-5 h-5",
+  md: "h-icon-default w-icon-default",
   lg: "w-6 h-6",
   xl: "w-8 h-8"
 };
@@ -3773,14 +3773,14 @@ var variantStyles2 = {
 };
 variantStyles2.destructive = variantStyles2.danger;
 var sizeStyles2 = {
-  sm: "px-3 py-1.5 text-sm",
-  md: "px-4 py-2 text-sm",
-  lg: "px-6 py-3 text-base"
+  sm: "h-button-sm px-3 text-sm",
+  md: "h-button-md px-4 text-sm",
+  lg: "h-button-lg px-6 text-base"
 };
 var iconSizeStyles = {
-  sm: "h-3.5 w-3.5",
+  sm: "h-icon-default w-icon-default",
   md: "h-icon-default w-icon-default",
-  lg: "h-5 w-5"
+  lg: "h-icon-default w-icon-default"
 };
 function resolveIconProp(value, sizeClass) {
   if (!value) return null;
@@ -3836,7 +3836,7 @@ var Button = React8.forwardRef(
         disabled: disabled || isLoading,
         className: cn(
           "inline-flex items-center justify-center gap-2",
-          "font-[var(--font-weight-medium)]",
+          "font-medium",
           "rounded-sm",
           "cursor-pointer",
           "transition-all duration-[var(--transition-normal)]",
@@ -3898,7 +3898,11 @@ var sizeStyles3 = {
 };
 var Badge = React8.forwardRef(
   ({ className, variant = "default", size = "sm", amount, label, icon, children, onRemove, removeLabel, ...props }, ref) => {
-    const iconSizes = { sm: "w-3 h-3", md: "w-3.5 h-3.5", lg: "w-4 h-4" };
+    const iconSizes = {
+      sm: "h-icon-default w-icon-default",
+      md: "h-icon-default w-icon-default",
+      lg: "h-icon-default w-icon-default"
+    };
     const resolvedIcon = typeof icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: icon, className: iconSizes[size] }) : icon;
     return /* @__PURE__ */ jsxs(
       "span",
@@ -3945,21 +3949,21 @@ var variantStyles4 = {
     "border-[length:var(--border-width)] border-border",
     "shadow-elevation-card",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   bordered: [
     "bg-card",
     "border-[length:var(--border-width)] border-border",
     "shadow-elevation-card",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   elevated: [
     "bg-card",
     "border-[length:var(--border-width)] border-border",
     "shadow",
     "transition-all duration-[var(--transition-normal)]",
-    "hover:shadow-elevation-dialog hover:-translate-y-0.5"
+    "hover:shadow-elevation-dialog hover:translate-y-[var(--hover-translate-y)]"
   ].join(" "),
   // Interactive variant with theme-specific hover effects
   interactive: [
@@ -4009,7 +4013,7 @@ var Card = React8.forwardRef(
         ...props,
         children: [
           (title || subtitle) && /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
-            title && /* @__PURE__ */ jsx("h3", { className: "text-lg text-card-foreground font-[var(--font-weight-bold)]", children: title }),
+            title && /* @__PURE__ */ jsx("h3", { className: "text-lg text-card-foreground font-bold", children: title }),
             subtitle && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mt-1", children: subtitle })
           ] }),
           children
@@ -4027,7 +4031,7 @@ var CardTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__
     ref,
     className: cn(
       "text-lg text-card-foreground",
-      "font-[var(--font-weight-bold)]",
+      "font-bold",
       className
     ),
     ...props