@snksergio/design-system 0.45.0 → 0.46.0

package/dist-lib/chunks/{toggle-group-BC4eS3Gt.cjs → toggle-group-FJHFIlJP.cjs}

@@ -1387,17 +1387,37 @@ const Slider = React__namespace.forwardRef(({ className, defaultValue, value, ..
   );
 });
 Slider.displayName = SliderPrimitive__namespace.Root.displayName;
-const TabsVariantContext = React__namespace.createContext("segmented");
-const Tabs = React__namespace.forwardRef(({ variant = "segmented", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(TabsVariantContext.Provider, { value: variant, children: /* @__PURE__ */ jsxRuntime.jsx(TabsPrimitive__namespace.Root, { ref, ...props }) }));
+const TabsVariantContext = React__namespace.createContext({
+  variant: "segmented",
+  fullWidth: false
+});
+const Tabs = React__namespace.forwardRef(({ variant = "segmented", fullWidth = false, className, ...props }, ref) => {
+  const ctx = React__namespace.useMemo(() => ({ variant, fullWidth }), [variant, fullWidth]);
+  return /* @__PURE__ */ jsxRuntime.jsx(TabsVariantContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Root,
+    {
+      ref,
+      className: avatar.cn(fullWidth && "w-full", className),
+      ...props
+    }
+  ) });
+});
 Tabs.displayName = "Tabs";
 const TabsList = React__namespace.forwardRef(({ className, ...props }, ref) => {
-  const variant = React__namespace.useContext(TabsVariantContext);
+  const { variant, fullWidth } = React__namespace.useContext(TabsVariantContext);
   return /* @__PURE__ */ jsxRuntime.jsx(
     TabsPrimitive__namespace.List,
     {
       ref,
       className: avatar.cn(
-        variant === "line" ? "inline-flex w-fit items-center gap-gp-xl border-b border-border-subtle" : "inline-flex h-form-lg w-fit items-center bg-bg-muted p-[3px] gap-gp-2xs rounded-radius-lg",
+        variant === "line" ? (
+          /* O trilho atravessa o container por PADRÃO. Era `w-fit`, e aí o `border-b` parava
+             onde as abas paravam — um divisor que não alcança as bordas lê como fragmento, não
+             como divisória. Em toda referência (Material, Carbon, Ant) o trilho do underline é
+             full-bleed e só o indicador acompanha a aba ativa. */
+          "inline-flex w-full items-center gap-gp-xl border-b border-border-subtle"
+        ) : "inline-flex h-form-lg items-center bg-bg-muted p-[3px] gap-gp-2xs rounded-radius-lg",
+        variant === "segmented" && (fullWidth ? "w-full" : "w-fit"),
         className
       ),
       ...props
@@ -1406,7 +1426,7 @@ const TabsList = React__namespace.forwardRef(({ className, ...props }, ref) => {
 });
 TabsList.displayName = TabsPrimitive__namespace.List.displayName;
 const TabsTrigger = React__namespace.forwardRef(({ className, ...props }, ref) => {
-  const variant = React__namespace.useContext(TabsVariantContext);
+  const { variant, fullWidth } = React__namespace.useContext(TabsVariantContext);
   return /* @__PURE__ */ jsxRuntime.jsx(
     TabsPrimitive__namespace.Trigger,
     {
@@ -1417,6 +1437,9 @@ const TabsTrigger = React__namespace.forwardRef(({ className, ...props }, ref) =
         "hover:text-fg-default",
         "disabled:pointer-events-none disabled:opacity-50",
         variant === "line" ? "-mb-px h-[38px] px-[2px] pb-[8px] border-b-2 border-transparent data-[state=active]:border-border-brand data-[state=active]:text-fg-default data-[state=active]:font-semibold" : "h-[34px] px-[14px] rounded-radius-md data-[state=active]:bg-bg-accent data-[state=active]:text-fg-default data-[state=active]:font-semibold data-[state=active]:shadow-sh-sm",
+        /* Sem isto, `w-full` no List estica o container e agrupa os triggers na esquerda — o
+           defeito que 6 dos 7 usos manuais tinham. */
+        fullWidth && "flex-1",
         className
       ),
       ...props
@@ -1599,4 +1622,4 @@ exports.badgeVariants = badgeVariants;
 exports.navigationMenuTriggerStyle = navigationMenuTriggerStyle;
 exports.slotVariants = slotVariants;
 exports.toggleVariants = toggleVariants;
-//# sourceMappingURL=toggle-group-BC4eS3Gt.cjs.map
+//# sourceMappingURL=toggle-group-FJHFIlJP.cjs.map