@bubo-squared/ui-framework 0.1.98 → 0.2.0

package/dist/index.cjs

@@ -1827,7 +1827,7 @@ function PopoverContent({
       align,
       sideOffset,
       className: cn(
-        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md p-4 shadow-md outline-hidden",
         className
       ),
       ...props
@@ -2045,7 +2045,7 @@ var CountrySelect = ({
           PopoverContent,
           {
             align: "start",
-            className: "p-0 bg-(--background-primary) shadow-card-md rounded-4 border-none outline-1 outline-solid outline-(--border-primary-hover) **:data-[slot='command-input-wrapper']:border-b-(--border-secondary)",
+            className: "p-0 bg-(--background-primary) shadow-card-md rounded-4 border-none outline-1 outline-solid outline-(--border-secondary-hover) **:data-[slot='command-input-wrapper']:border-b-(--border-secondary)",
             children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(Command, { children: [
               /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                 CommandInput,
@@ -2691,61 +2691,68 @@ var Slider = (props) => {
       index
     );
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: wrapperBase2, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: cn("w-full flex flex-col gap-1", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "relative w-full", children: [
-      showTooltip && primary !== void 0 && renderTooltipBubble(
-        "primary",
-        primaryPercent,
-        formatDisplayValue(primary),
-        hoveredThumbIndex === 0 || draggingThumbIndex === 0
-      ),
-      showTooltip && isRange && secondary !== void 0 && renderTooltipBubble(
-        "secondary",
-        secondaryPercent,
-        formatDisplayValue(secondary),
-        hoveredThumbIndex === 1 || draggingThumbIndex === 1
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
-        "div",
-        {
-          className: cn(
-            "relative w-full flex items-center rounded-4",
-            disabled ? "bg-(--background-primary-disabled) cursor-default" : "bg-(--background-secondary) cursor-pointer"
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    "div",
+    {
+      className: wrapperBase2,
+      style: { marginInline: `${thumbRadius}px` },
+      children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: cn("w-full flex flex-col gap-1", className), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "relative w-full", children: [
+          showTooltip && primary !== void 0 && renderTooltipBubble(
+            "primary",
+            primaryPercent,
+            formatDisplayValue(primary),
+            hoveredThumbIndex === 0 || draggingThumbIndex === 0
           ),
-          style: { height: `${trackHeight}px` },
-          ref: trackRef,
-          onPointerDown: handleTrackPointerDown,
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
-              "div",
-              {
-                className: cn(
-                  "absolute h-full rounded-4",
-                  disabled ? "bg-(--background-primary-disabled)" : "bg-(--background-secondary)"
+          showTooltip && isRange && secondary !== void 0 && renderTooltipBubble(
+            "secondary",
+            secondaryPercent,
+            formatDisplayValue(secondary),
+            hoveredThumbIndex === 1 || draggingThumbIndex === 1
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+            "div",
+            {
+              className: cn(
+                "relative w-full flex items-center rounded-4",
+                disabled ? "bg-(--background-primary-disabled) cursor-default" : "bg-(--background-secondary) cursor-pointer"
+              ),
+              style: { height: `${trackHeight}px` },
+              ref: trackRef,
+              onPointerDown: handleTrackPointerDown,
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+                  "div",
+                  {
+                    className: cn(
+                      "absolute h-full rounded-4",
+                      disabled ? "bg-(--background-primary-disabled)" : "bg-(--background-secondary)"
+                    ),
+                    style: {
+                      width: `calc(100% + ${thumbWidth}px)`,
+                      left: `-${thumbRadius}px`
+                    }
+                  }
                 ),
-                style: {
-                  width: `calc(100% + ${thumbWidth}px)`,
-                  left: `-${thumbRadius}px`
-                }
-              }
+                renderHandle(0, primaryPercent, formatDisplayValue(primary)),
+                isRange && secondary !== void 0 && renderHandle(1, secondaryPercent, formatDisplayValue(secondary))
+              ]
+            }
+          )
+        ] }),
+        showNumeric && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+          "p",
+          {
+            className: cn(
+              "paragraph-s text-primary",
+              disabled && "text-primary-disabled"
             ),
-            renderHandle(0, primaryPercent, formatDisplayValue(primary)),
-            isRange && secondary !== void 0 && renderHandle(1, secondaryPercent, formatDisplayValue(secondary))
-          ]
-        }
-      )
-    ] }),
-    showNumeric && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
-      "p",
-      {
-        className: cn(
-          "paragraph-s text-primary",
-          disabled && "text-primary-disabled"
-        ),
-        children: formatNumericLabel()
-      }
-    )
-  ] }) });
+            children: formatNumericLabel()
+          }
+        )
+      ] })
+    }
+  );
 };
 Slider.displayName = "Slider";
 
@@ -3104,7 +3111,7 @@ var Toggle = (props) => {
                 "peer-checked:border-(--border-brand)",
                 // 4: enabled, checked, hovered, unfocused
                 "peer-checked:hover:border-(--border-brand-hover)",
-                "peer-checked:hover:shadow-[0_0_0_var(--focus-ring-spread)_var(--color-b-100)]",
+                "peer-checked:hover:shadow-[0_0_0_var(--focus-ring-spread)_var(--focus-secondary)]",
                 // 5: enabled, unchecked, unhovered, focused
                 "peer-focus-visible:border-(--border-brand-focus)",
                 // 6: enabled, checked, unhovered, focused