pixelize-design-library 2.4.2-beta.64 → 2.4.2-beta.66

package/dist/esm/Components/Modal/warnDroppedSlotChildren.js

@@ -1,5 +1,6 @@
 import React from "react";
-const warned = new Set();
+const warnedByOwner = new Map();
+const PORTAL_ADVICE = "Pass nested dialogs and live regions through the portalChildren prop.";
 const nameOf = (type) => {
     if (typeof type === "string")
         return type;
@@ -24,15 +25,18 @@ const collect = (children, slots, dropped) => {
         dropped.set(child.type, nameOf(child.type));
     }
 };
-export const warnDroppedSlotChildren = (owner, children, slots) => {
+export const warnDroppedSlotChildren = (owner, children, slots, advice = PORTAL_ADVICE) => {
+    var _a;
     if (process.env.NODE_ENV === "production")
         return;
+    const warned = (_a = warnedByOwner.get(owner)) !== null && _a !== void 0 ? _a : new Set();
+    warnedByOwner.set(owner, warned);
     const dropped = new Map();
     collect(children, slots, dropped);
     dropped.forEach((name, type) => {
         if (warned.has(type))
             return;
         warned.add(type);
-        console.warn(`[pixelize-design-library] ${owner}: <${name}> is not a ${owner}Header/${owner}Body/${owner}Footer slot and was dropped. Pass nested dialogs and live regions through the portalChildren prop.`);
+        console.warn(`[pixelize-design-library] ${owner}: <${name}> is not a ${owner}Header/${owner}Body/${owner}Footer slot and was dropped. ${advice}`);
     });
 };

package/dist/esm/Components/NavLauncher/LauncherTabs.js

@@ -2,6 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Box, Flex } from "@chakra-ui/react";
 import { useRef } from "react";
 import { focusVisibleStyles } from "../../Theme/chakra/focusRing.styles.js";
+import { raisedRule } from "../../Theme/tokens/builders/surfaceRaised.js";
 import { transitionFor } from "../../Theme/tokens/primitives/motion.js";
 import { useCustomTheme } from "../../Theme/useCustomTheme.js";
 export const tabId = (base, id) => `${base}-tab-${id}`;
@@ -35,14 +36,14 @@ export function LauncherTabs({ tabs, selected, onSelect, idBase, label, onLeaveU
         event.stopPropagation();
         handle();
     };
-    return (_jsx(Flex, { role: "tablist", "aria-label": label, "aria-orientation": "horizontal", flexShrink: 0, px: { base: "10px", md: "16px" }, gap: { base: 0, md: "4px" }, borderBottomWidth: "1px", borderColor: colors.boxborder[200], bg: colors.surfaceRaised, onKeyDown: onKeyDown, children: tabs.map((tab) => {
+    return (_jsx(Flex, { role: "tablist", "aria-label": label, "aria-orientation": "horizontal", flexShrink: 0, px: { base: "10px", md: "16px" }, gap: { base: 0, md: "4px" }, borderBottomWidth: "1px", borderColor: raisedRule(colors), bg: colors.surfaceRaised, onKeyDown: onKeyDown, children: tabs.map((tab) => {
             const isSelected = tab.id === selected;
             return (_jsx(Box, { as: "button", type: "button", role: "tab", id: tabId(idBase, tab.id), ref: (node) => {
                     if (node)
                         refs.current.set(tab.id, node);
                     else
                         refs.current.delete(tab.id);
-                }, "aria-selected": isSelected, "aria-controls": isSelected ? panelId(idBase) : undefined, tabIndex: isSelected ? 0 : -1, onClick: () => onSelect(tab.id), position: "relative", flex: { base: 1, md: "none" }, minW: { md: "112px" }, h: "46px", px: { base: "6px", md: "14px" }, whiteSpace: "nowrap", fontSize: "14px", fontWeight: isSelected ? 600 : 500, color: isSelected ? colors.accentText : colors.textMuted, transition: transitionFor(["color"]), _hover: {
+                }, "aria-selected": isSelected, "aria-controls": isSelected ? panelId(idBase) : undefined, tabIndex: isSelected ? 0 : -1, onClick: () => onSelect(tab.id), position: "relative", flex: { base: 1, md: "none" }, minW: { md: "112px" }, h: "46px", px: { base: "6px", md: "14px" }, whiteSpace: "nowrap", fontSize: "sm", fontWeight: isSelected ? 600 : 500, color: isSelected ? colors.accentText : colors.textMuted, transition: transitionFor(["color"]), _hover: {
                     color: isSelected ? colors.accentText : colors.text[900],
                 }, _after: {
                     content: '""',
@@ -53,6 +54,6 @@ export function LauncherTabs({ tabs, selected, onSelect, idBase, label, onLeaveU
                     h: "2px",
                     borderRadius: "2px 2px 0 0",
                     bg: isSelected ? colors.primary[500] : "transparent",
-                }, sx: { ...ring, borderRadius: "8px" }, children: tab.label }, tab.id));
+                }, sx: { ...ring, borderRadius: "lg" }, children: tab.label }, tab.id));
         }) }));
 }