@chekinapp/ui 0.0.131 → 0.0.132

package/dist/index.js

@@ -7786,7 +7786,6 @@ var SectionTagColors = /* @__PURE__ */ ((SectionTagColors2) => {
 
 // src/section/Section.tsx
 import { forwardRef as forwardRef38 } from "react";
-import { CircleHelp } from "lucide-react";
 import { useTranslation as useTranslation15 } from "react-i18next";
 
 // src/section/constants.ts
@@ -7799,16 +7798,17 @@ var SubSectionSize = /* @__PURE__ */ ((SubSectionSize2) => {
 // src/section/Section.tsx
 import { jsx as jsx98, jsxs as jsxs60 } from "react/jsx-runtime";
 function TooltipInfo({ content, className }) {
-  return /* @__PURE__ */ jsx98(Tooltip, { side: "right", content, contentClassName: "max-w-64", children: /* @__PURE__ */ jsx98(
-    "button",
+  return /* @__PURE__ */ jsx98(
+    HelpTooltip,
     {
-      type: "button",
-      className: cn("inline-flex text-[var(--chekin-color-gray-1)]", className),
+      side: "right",
+      content,
+      contentClassName: "max-w-64",
+      className: cn("text-[var(--chekin-color-gray-1)]", className),
       onClick: (event) => event.stopPropagation(),
-      "aria-label": typeof content === "string" ? content : "More information",
-      children: /* @__PURE__ */ jsx98(CircleHelp, { className: "h-4 w-4" })
+      label: typeof content === "string" ? content : "More information"
     }
-  ) });
+  );
 }
 var Section = forwardRef38(
   ({
@@ -12150,7 +12150,11 @@ var Input = React44.forwardRef(
             /* @__PURE__ */ jsxs89(
               "div",
               {
-                className: cn("input__content relative w-full cursor-text", contentClassName),
+                className: cn(
+                  "input__content relative w-full cursor-text",
+                  readOnly && !disabled && !loading && "cursor-default",
+                  contentClassName
+                ),
                 children: [
                   /* @__PURE__ */ jsx142(
                     Fieldset,
@@ -12205,7 +12209,8 @@ var Input = React44.forwardRef(
                         isEmpty && !isFocused ? "bg-[var(--empty-field-background)]" : "bg-transparent",
                         isEmpty && "text-[var(--chekin-color-gray-1)]",
                         inputType === "password" && "[&:not(:placeholder-shown)]:font-bold [&:not(:placeholder-shown)]:tracking-[2px]",
-                        (disabled || readOnly) && "cursor-not-allowed",
+                        disabled && "cursor-not-allowed",
+                        readOnly && !disabled && !loading && "cursor-default",
                         loading && "cursor-progress",
                         leftIcon && "pl-10",
                         (showRightPaddingForReset || showRightPaddingForReveal) && "pr-10",
@@ -14712,64 +14717,10 @@ var InfiniteScrollMultiSelect = React57.forwardRef(function InfiniteScrollMultiS
 import * as React58 from "react";
 import { useTranslation as useTranslation36 } from "react-i18next";
 
-// src/dashboard/select-checkboxes/SelectCheckboxOption.tsx
-import { jsx as jsx163, jsxs as jsxs102 } from "react/jsx-runtime";
-function SelectCheckboxOption(props) {
-  const {
-    option,
-    index,
-    isSelected,
-    isHighlighted,
-    isDisabled,
-    id,
-    onClick,
-    onHover,
-    innerRef
-  } = props;
-  return /* @__PURE__ */ jsxs102(
-    "button",
-    {
-      id,
-      ref: innerRef,
-      type: "button",
-      role: "option",
-      "aria-selected": isSelected,
-      "aria-disabled": isDisabled,
-      tabIndex: -1,
-      disabled: isDisabled,
-      onClick: () => onClick(option),
-      onMouseMove: () => onHover(index),
-      className: cn(
-        "flex w-full items-center gap-3 rounded-md border-0 bg-transparent px-3 py-2 text-left text-[15px] font-medium leading-5 text-[var(--chekin-color-brand-navy)] outline-none transition-colors duration-100",
-        !isDisabled && "cursor-pointer hover:bg-[var(--chekin-color-surface-pressed)]",
-        isHighlighted && !isDisabled && "bg-[var(--chekin-color-surface-pressed)]",
-        isSelected && "bg-[var(--chekin-color-surface-autocomplete)] font-semibold text-[var(--chekin-color-brand-blue)]",
-        isDisabled && "cursor-not-allowed text-[var(--chekin-color-gray-2)]"
-      ),
-      children: [
-        /* @__PURE__ */ jsx163(
-          BaseCheckbox,
-          {
-            checked: isSelected,
-            disabled: isDisabled,
-            size: "s",
-            tabIndex: -1,
-            className: "pointer-events-none shrink-0"
-          }
-        ),
-        /* @__PURE__ */ jsxs102("span", { className: "flex min-w-0 flex-1 items-center justify-between gap-2", children: [
-          /* @__PURE__ */ jsx163("span", { className: "block break-words", children: option.label }),
-          option.description && /* @__PURE__ */ jsx163("span", { className: "shrink-0 text-[12px] font-medium italic text-[var(--chekin-color-gray-1)]", children: option.description })
-        ] })
-      ]
-    }
-  );
-}
-
 // src/dashboard/select-checkboxes/CountTrigger.tsx
 import { ChevronDown as ChevronDown3 } from "lucide-react";
 import { useTranslation as useTranslation35 } from "react-i18next";
-import { jsx as jsx164, jsxs as jsxs103 } from "react/jsx-runtime";
+import { jsx as jsx163, jsxs as jsxs102 } from "react/jsx-runtime";
 function createCountTrigger(opts) {
   const { valueText, totalCount } = opts;
   function CountTrigger(props) {
@@ -14797,7 +14748,7 @@ function createCountTrigger(opts) {
     const computedText = typeof valueText === "function" ? valueText(count, total) : valueText ?? (count > 0 ? t("n_selected", { count, defaultValue: `${count} selected` }) : "");
     const display = hasValue ? computedText : isOpen ? placeholder ?? null : null;
     const isEmpty = !hasValue;
-    return /* @__PURE__ */ jsxs103(
+    return /* @__PURE__ */ jsxs102(
       "button",
       {
         id: triggerId,
@@ -14820,9 +14771,9 @@ function createCountTrigger(opts) {
           loading && "!cursor-progress"
         ),
         children: [
-          leftIcon && /* @__PURE__ */ jsx164("span", { className: "pointer-events-none absolute left-0 top-0 flex h-full max-w-10 items-center justify-center text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ jsx164("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
-          /* @__PURE__ */ jsx164("span", { id: valueId, className: "block min-w-0 flex-1 truncate text-left", children: display }),
-          /* @__PURE__ */ jsx164("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ jsx164(
+          leftIcon && /* @__PURE__ */ jsx163("span", { className: "pointer-events-none absolute left-0 top-0 flex h-full max-w-10 items-center justify-center text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ jsx163("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
+          /* @__PURE__ */ jsx163("span", { id: valueId, className: "block min-w-0 flex-1 truncate text-left", children: display }),
+          /* @__PURE__ */ jsx163("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ jsx163(
             ChevronDown3,
             {
               size: 16,
@@ -14840,9 +14791,9 @@ function createCountTrigger(opts) {
 }
 
 // src/dashboard/select-checkboxes/SelectAllRow.tsx
-import { jsx as jsx165, jsxs as jsxs104 } from "react/jsx-runtime";
+import { jsx as jsx164, jsxs as jsxs103 } from "react/jsx-runtime";
 function SelectAllRow({ label, checked, disabled, onToggle }) {
-  return /* @__PURE__ */ jsxs104(
+  return /* @__PURE__ */ jsxs103(
     "button",
     {
       type: "button",
@@ -14853,7 +14804,7 @@ function SelectAllRow({ label, checked, disabled, onToggle }) {
         disabled && "cursor-default opacity-40"
       ),
       children: [
-        /* @__PURE__ */ jsx165(
+        /* @__PURE__ */ jsx164(
           BaseCheckbox,
           {
             checked,
@@ -14863,20 +14814,20 @@ function SelectAllRow({ label, checked, disabled, onToggle }) {
             className: "pointer-events-none shrink-0"
           }
         ),
-        /* @__PURE__ */ jsx165("span", { className: "flex-1", children: label })
+        /* @__PURE__ */ jsx164("span", { className: "flex-1", children: label })
       ]
     }
   );
 }
 
 // src/dashboard/select-checkboxes/SelectCheckboxes.tsx
-import { Fragment as Fragment16, jsx as jsx166 } from "react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx165 } from "react/jsx-runtime";
 function hasPaginationProps(props) {
   return props.canLoadMore !== void 0 || props.isLoadingMore !== void 0 || props.loadMoreItems !== void 0 || props.onSearchChange !== void 0;
 }
 function makeTriggerSlot(render) {
   function CustomTrigger(props) {
-    return /* @__PURE__ */ jsx166(Fragment16, { children: render(props.isOpen, props.onContainerClick) });
+    return /* @__PURE__ */ jsx165(Fragment16, { children: render(props.isOpen, props.onContainerClick) });
   }
   return CustomTrigger;
 }
@@ -14961,15 +14912,7 @@ function SelectCheckboxesInternal(props, ref) {
       totalCount: flatRawOptions.length
     });
   }, [trigger, valueText, flatRawOptions.length]);
-  const components = React58.useMemo(
-    () => ({
-      ...userComponents,
-      Control,
-      Option: userComponents?.Option ?? SelectCheckboxOption
-    }),
-    [userComponents, Control]
-  );
-  const menuHeader = allowSelectAll ? /* @__PURE__ */ jsx166(
+  const menuHeader = allowSelectAll ? /* @__PURE__ */ jsx165(
     SelectAllRow,
     {
       label: selectAllLabel ?? t("select_all", { defaultValue: "Select All" }),
@@ -14989,7 +14932,7 @@ function SelectCheckboxesInternal(props, ref) {
     value: currentValue,
     onChange: handleChange,
     filterOption: passthroughFilter2,
-    components,
+    // components,
     closeMenuOnSelect,
     searchPosition: searchable ? "dropdown" : "trigger",
     searchable,
@@ -14998,7 +14941,7 @@ function SelectCheckboxesInternal(props, ref) {
     isMulti: true
   };
   if (isPaginated) {
-    return /* @__PURE__ */ jsx166(
+    return /* @__PURE__ */ jsx165(
       InfiniteScrollSelect,
       {
         ref,
@@ -15009,7 +14952,7 @@ function SelectCheckboxesInternal(props, ref) {
       }
     );
   }
-  return /* @__PURE__ */ jsx166(
+  return /* @__PURE__ */ jsx165(
     Select,
     {
       ref,
@@ -15024,6 +14967,60 @@ var SelectCheckboxes = React58.forwardRef(
   SelectCheckboxesInternal
 );
 
+// src/dashboard/select-checkboxes/SelectCheckboxOption.tsx
+import { jsx as jsx166, jsxs as jsxs104 } from "react/jsx-runtime";
+function SelectCheckboxOption(props) {
+  const {
+    option,
+    index,
+    isSelected,
+    isHighlighted,
+    isDisabled,
+    id,
+    onClick,
+    onHover,
+    innerRef
+  } = props;
+  return /* @__PURE__ */ jsxs104(
+    "button",
+    {
+      id,
+      ref: innerRef,
+      type: "button",
+      role: "option",
+      "aria-selected": isSelected,
+      "aria-disabled": isDisabled,
+      tabIndex: -1,
+      disabled: isDisabled,
+      onClick: () => onClick(option),
+      onMouseMove: () => onHover(index),
+      className: cn(
+        "flex w-full items-center gap-3 rounded-md border-0 bg-transparent px-3 py-2 text-left text-[15px] font-medium leading-5 text-[var(--chekin-color-brand-navy)] outline-none transition-colors duration-100",
+        !isDisabled && "cursor-pointer hover:bg-[var(--chekin-color-surface-pressed)]",
+        isHighlighted && !isDisabled && "bg-[var(--chekin-color-surface-pressed)]",
+        isSelected && "bg-[var(--chekin-color-surface-autocomplete)] font-semibold text-[var(--chekin-color-brand-blue)]",
+        isDisabled && "cursor-not-allowed text-[var(--chekin-color-gray-2)]"
+      ),
+      children: [
+        /* @__PURE__ */ jsx166(
+          BaseCheckbox,
+          {
+            checked: isSelected,
+            disabled: isDisabled,
+            size: "s",
+            tabIndex: -1,
+            className: "pointer-events-none shrink-0"
+          }
+        ),
+        /* @__PURE__ */ jsxs104("span", { className: "flex min-w-0 flex-1 items-center justify-between gap-2", children: [
+          /* @__PURE__ */ jsx166("span", { className: "block break-words", children: option.label }),
+          option.description && /* @__PURE__ */ jsx166("span", { className: "shrink-0 text-[12px] font-medium italic text-[var(--chekin-color-gray-1)]", children: option.description })
+        ] })
+      ]
+    }
+  );
+}
+
 // src/dashboard/textarea/Textarea.tsx
 import * as React60 from "react";
 import { useTranslation as useTranslation37 } from "react-i18next";