@chekinapp/ui 0.0.96 → 0.0.98

package/dist/index.d.cts

@@ -2188,7 +2188,7 @@ declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_run
 type MainLoaderProps = {
     visible?: boolean;
     label?: string | ReactNode;
-    size?: 'sm' | 'md' | 'lg';
+    size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';
     height?: number | string;
     width?: number | string;
     position?: 'center';

package/dist/index.d.ts

@@ -2188,7 +2188,7 @@ declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_run
 type MainLoaderProps = {
     visible?: boolean;
     label?: string | ReactNode;
-    size?: 'sm' | 'md' | 'lg';
+    size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';
     height?: number | string;
     width?: number | string;
     position?: 'center';

package/dist/index.js

@@ -6275,12 +6275,16 @@ import { jsx as jsx72, jsxs as jsxs45 } from "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 = React22.memo(
   ({
@@ -6297,7 +6301,7 @@ var CircularLoader = React22.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
         ),
@@ -7187,7 +7191,16 @@ function useRadioOptions({ options, defaultValue, onChange }) {
 // src/radio/Radio.tsx
 import { Fragment as Fragment8, jsx as jsx84, jsxs as jsxs53 } from "react/jsx-runtime";
 var Radio = forwardRef36(
-  ({ 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,
@@ -7213,7 +7226,7 @@ var Radio = forwardRef36(
             {
               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__ */ jsxs53(Fragment8, { children: [
@@ -7223,6 +7236,7 @@ var Radio = forwardRef36(
                     value: option.value,
                     id: `option-${option.value}`,
                     disabled: option.disabled,
+                    size,
                     className: "radio__indicator"
                   }
                 ),
@@ -7252,7 +7266,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: [
@@ -7266,12 +7280,15 @@ function RadioWithBorder({ size, ...props }) {
                   size
                 }
               ),
-              /* @__PURE__ */ jsxs54("div", { className: "space-y-1 leading-6", children: [
-                /* @__PURE__ */ jsxs54("p", { className: "flex items-center gap-3 font-semibold", children: [
-                  option.label,
-                  data?.subLabel && /* @__PURE__ */ jsx85("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__ */ jsxs54("div", { className: "flex min-w-0 flex-1 items-start justify-between gap-3", children: [
+                /* @__PURE__ */ jsxs54("div", { className: "min-w-0 space-y-1 leading-6", children: [
+                  /* @__PURE__ */ jsxs54("p", { className: "flex items-center gap-3 font-semibold", children: [
+                    option.label,
+                    data?.subLabel && /* @__PURE__ */ jsx85("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__ */ jsx85("p", { className: "text-sm font-medium text-[var(--chekin-color-gray-1)]", children: data.description })
                 ] }),
-                data?.description && /* @__PURE__ */ jsx85("p", { className: "text-sm font-medium text-[var(--chekin-color-gray-1)]", children: data.description })
+                data?.rightContent && /* @__PURE__ */ jsx85("div", { className: "shrink-0", children: data.rightContent })
               ] })
             ]
           }