@chekinapp/ui 0.0.96 → 0.0.98

package/dist/index.cjs

@@ -6657,12 +6657,16 @@ var import_jsx_runtime74 = require("react/jsx-runtime");
 var loaderSizePixels = {
   sm: 16,
   md: 32,
-  lg: 48
+  lg: 48,
+  xl: 58,
+  "2xl": 72
 };
 var labelSizeClassName = {
   sm: "text-xs",
   md: "text-sm",
-  lg: "text-base"
+  lg: "text-base",
+  xl: "text-base",
+  "2xl": "text-base"
 };
 var CircularLoader = import_react57.default.memo(
   ({
@@ -6679,7 +6683,7 @@ var CircularLoader = import_react57.default.memo(
       "div",
       {
         className: cn(
-          "main-loader flex flex-col items-center justify-center gap-2",
+          "main-loader flex flex-col items-center justify-center gap-2 z-50",
           position === "center" && "h-full",
           className
         ),
@@ -7569,7 +7573,16 @@ function useRadioOptions({ options, defaultValue, onChange }) {
 // src/radio/Radio.tsx
 var import_jsx_runtime86 = require("react/jsx-runtime");
 var Radio = (0, import_react64.forwardRef)(
-  ({ options, value, onChange, error, className = "", disabled = false, renderOption }, ref) => {
+  ({
+    options,
+    value,
+    onChange,
+    error,
+    className = "",
+    size,
+    disabled = false,
+    renderOption
+  }, ref) => {
     const { selectedValue, handleValueChange } = useRadioOptions({
       options,
       defaultValue: value,
@@ -7595,7 +7608,7 @@ var Radio = (0, import_react64.forwardRef)(
             {
               className: cn(
                 "radio__wrapper",
-                "flex cursor-pointer items-center gap-2",
+                "flex cursor-pointer items-center gap-2 transition-all duration-200",
                 (disabled || option.disabled) && "cursor-default opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
               ),
               children: renderOption ? renderOption({ option, isSelected: getIsSelected(option) }) : /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(import_jsx_runtime86.Fragment, { children: [
@@ -7605,6 +7618,7 @@ var Radio = (0, import_react64.forwardRef)(
                     value: option.value,
                     id: `option-${option.value}`,
                     disabled: option.disabled,
+                    size,
                     className: "radio__indicator"
                   }
                 ),
@@ -7634,7 +7648,7 @@ function RadioWithBorder({ size, ...props }) {
           "div",
           {
             className: cn(
-              "flex w-full items-start gap-3 rounded-lg border p-4",
+              "flex w-full items-start gap-3 rounded-lg border p-4 transition-all duration-200",
               isSelected && "border-[var(--chekin-color-brand-blue)] bg-[var(--chekin-color-surface-autocomplete)]"
             ),
             children: [
@@ -7648,12 +7662,15 @@ function RadioWithBorder({ size, ...props }) {
                   size
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "space-y-1 leading-6", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("p", { className: "flex items-center gap-3 font-semibold", children: [
-                  option.label,
-                  data?.subLabel && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("span", { className: "rounded bg-[color-mix(in_srgb,var(--chekin-color-brand-blue)_10%,transparent)] px-2 py-1 text-sm font-semibold leading-4 text-[var(--chekin-color-brand-blue)]", children: data.subLabel })
+              /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "flex min-w-0 flex-1 items-start justify-between gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "min-w-0 space-y-1 leading-6", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("p", { className: "flex items-center gap-3 font-semibold", children: [
+                    option.label,
+                    data?.subLabel && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("span", { className: "rounded bg-[color-mix(in_srgb,var(--chekin-color-brand-blue)_10%,transparent)] px-2 py-1 text-sm font-semibold leading-4 text-[var(--chekin-color-brand-blue)]", children: data.subLabel })
+                  ] }),
+                  data?.description && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("p", { className: "text-sm font-medium text-[var(--chekin-color-gray-1)]", children: data.description })
                 ] }),
-                data?.description && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("p", { className: "text-sm font-medium text-[var(--chekin-color-gray-1)]", children: data.description })
+                data?.rightContent && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("div", { className: "shrink-0", children: data.rightContent })
               ] })
             ]
           }