sellmate-design-system-react 0.8.0 → 0.8.2

package/dist/index.cjs

@@ -4427,6 +4427,7 @@ function SPortal({
   viewportPadding = 0,
   onOpenAutoFocus,
   onCloseAutoFocus,
+  onPointerDownOutside,
   children,
   className,
   style,
@@ -4455,7 +4456,9 @@ function SPortal({
             onPointerDownOutside: (e) => {
               if (persistent || anchorRef.current?.contains(e.target)) {
                 e.preventDefault();
+                return;
               }
+              onPointerDownOutside?.(e);
             },
             onFocusOutside: (e) => {
               if (persistent || anchorRef.current?.contains(e.target)) {
@@ -6359,6 +6362,7 @@ var SSelect = react.forwardRef(function SSelect2({
   const triggerRef = react.useRef(null);
   const searchInputRef = react.useRef(null);
   const listRef = react.useRef(null);
+  const dismissedByPointerRef = react.useRef(false);
   const flat = react.useMemo(() => flattenOptions(options), [options]);
   const selectable = react.useMemo(() => selectableOptions(flat), [flat]);
   const hasLeaf = react.useMemo(() => flat.some((o) => !o.isGroup), [flat]);
@@ -6388,7 +6392,9 @@ var SSelect = react.forwardRef(function SSelect2({
   const commitOpen = (next) => {
     setOpen(next);
     onOpenChange?.(next);
-    if (!next) {
+    if (next) {
+      dismissedByPointerRef.current = false;
+    } else {
       setPendingOpen(false);
       setSearch("");
       if (rules && rules.length > 0) {
@@ -6612,8 +6618,12 @@ var SSelect = react.forwardRef(function SSelect2({
               event.preventDefault();
               requestAnimationFrame(() => searchInputRef.current?.focus());
             },
+            onPointerDownOutside: () => {
+              dismissedByPointerRef.current = true;
+            },
             onCloseAutoFocus: (event) => {
               event.preventDefault();
+              if (dismissedByPointerRef.current) return;
               triggerRef.current?.focus();
             },
             className: "rounded-[var(--cmp-listBox-radius)] bg-[var(--cmp-listBox-bg)] shadow-[2px_2px_12px_2px_rgba(0,0,0,0.1)]",
@@ -9387,14 +9397,14 @@ function SKeyValueTable({
                       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12px] font-bold leading-[20px] text-[color:var(--sys-color-fg-primary)]", children: f.label }),
                       f.required && /* @__PURE__ */ jsxRuntime.jsx(SIcon, { name: "star", size: 12, color: "var(--sys-color-fg-accent)" })
                     ] }),
-                    f.helpText && /* @__PURE__ */ jsxRuntime.jsx(
+                    f.helpText && f.helpText.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
                       STooltip,
                       {
                         trigger: "hover",
                         icon: "helpOutline",
                         iconSize: 16,
                         color: "var(--sys-color-fg-success)",
-                        message: [f.helpText]
+                        message: f.helpText
                       }
                     )
                   ] })