braid-design-system 33.11.4 → 33.11.6-test-20251007010150

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # braid-design-system
 
+## 33.11.6-test-20251007010150
+
+### Patch Changes
+
+- test (354a279dec86922b4f73a611552c2cbe3a128824)
+
+## 33.11.5
+
+### Patch Changes
+
+- **Button, ButtonIcon, ButtonLink:** Remove use of deprecated `outline` atoms value, in favour of CSS property ([#1871](https://github.com/seek-oss/braid-design-system/pull/1871))
+
 ## 33.11.4
 
 ### Patch Changes

package/dist/lib/components/Accordion/AccordionItem.cjs

@@ -63,9 +63,9 @@ const AccordionItem = ({
     !icon || icon.props.size === void 0 && icon.props.tone === void 0,
     "Icons cannot set the 'size' or 'tone' prop when passed to an AccordionItem component"
   );
-  const size = (accordionContext == null ? void 0 : accordionContext.size) ?? sizeProp ?? lib_components_Accordion_Accordion_cjs.defaultSize;
-  const tone = (accordionContext == null ? void 0 : accordionContext.tone) ?? toneProp ?? "neutral";
-  const weight = (accordionContext == null ? void 0 : accordionContext.weight) ?? weightProp ?? "medium";
+  const size = accordionContext?.size ?? sizeProp ?? lib_components_Accordion_Accordion_cjs.defaultSize;
+  const tone = accordionContext?.tone ?? toneProp ?? "neutral";
+  const weight = accordionContext?.weight ?? weightProp ?? "medium";
   const itemSpace = itemSpaceForSize[size] ?? "none";
   assert__default.default(
     typeof label === "undefined" || typeof label === "string",

package/dist/lib/components/Accordion/AccordionItem.mjs

@@ -60,9 +60,9 @@ const AccordionItem = ({
     !icon || icon.props.size === void 0 && icon.props.tone === void 0,
     "Icons cannot set the 'size' or 'tone' prop when passed to an AccordionItem component"
   );
-  const size = (accordionContext == null ? void 0 : accordionContext.size) ?? sizeProp ?? defaultSize;
-  const tone = (accordionContext == null ? void 0 : accordionContext.tone) ?? toneProp ?? "neutral";
-  const weight = (accordionContext == null ? void 0 : accordionContext.weight) ?? weightProp ?? "medium";
+  const size = accordionContext?.size ?? sizeProp ?? defaultSize;
+  const tone = accordionContext?.tone ?? toneProp ?? "neutral";
+  const weight = accordionContext?.weight ?? weightProp ?? "medium";
   const itemSpace = itemSpaceForSize[size] ?? "none";
   assert(
     typeof label === "undefined" || typeof label === "string",

package/dist/lib/components/Autosuggest/Autosuggest.cjs

@@ -351,7 +351,7 @@ const Autosuggest = react.forwardRef(function({
   });
   const isOpen = showSuggestionsIfAvailable && hasItems;
   const highlightedItem = typeof highlightedIndex === "number" ? document.getElementById(lib_components_Autosuggest_createAccessibilityProps_cjs.getItemId(resolvedId, highlightedIndex)) : null;
-  highlightedItem == null ? void 0 : highlightedItem.scrollIntoView({ block: "nearest" });
+  highlightedItem?.scrollIntoView({ block: "nearest" });
   react.useEffect(() => {
     dispatch({
       type: HAS_SUGGESTIONS_CHANGED

package/dist/lib/components/Autosuggest/Autosuggest.mjs

@@ -346,7 +346,7 @@ const Autosuggest = forwardRef(function({
   });
   const isOpen = showSuggestionsIfAvailable && hasItems;
   const highlightedItem = typeof highlightedIndex === "number" ? document.getElementById(getItemId(resolvedId, highlightedIndex)) : null;
-  highlightedItem == null ? void 0 : highlightedItem.scrollIntoView({ block: "nearest" });
+  highlightedItem?.scrollIntoView({ block: "nearest" });
   useEffect(() => {
     dispatch({
       type: HAS_SUGGESTIONS_CHANGED

package/dist/lib/components/Autosuggest/Autosuggest.playroom.cjs

@@ -25,7 +25,7 @@ function Autosuggest({
       onChange: handleChange,
       onClear: () => {
         handleChange(blankValue);
-        onClear == null ? void 0 : onClear();
+        onClear?.();
       },
       tabIndex: lib_components_private_validateTabIndex_cjs.validTabIndexes.includes(tabIndex) ? tabIndex : void 0,
       ...restProps

package/dist/lib/components/Autosuggest/Autosuggest.playroom.mjs

@@ -24,7 +24,7 @@ function Autosuggest({
       onChange: handleChange,
       onClear: () => {
         handleChange(blankValue);
-        onClear == null ? void 0 : onClear();
+        onClear?.();
       },
       tabIndex: validTabIndexes.includes(tabIndex) ? tabIndex : void 0,
       ...restProps

package/dist/lib/components/BraidTestProvider/BraidTestProvider.cjs

@@ -1,8 +1,4 @@
 "use strict";
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-var _a;
 const jsxRuntime = require("react/jsx-runtime");
 const lib_themes_index_cjs = require("../../themes/index.cjs");
 const lib_components_BraidProvider_BraidProvider_cjs = require("../BraidProvider/BraidProvider.cjs");
@@ -10,27 +6,23 @@ const lib_components_BraidProvider_BreakpointContext_cjs = require("../BraidProv
 const lib_components_BraidTestProvider_BraidTestProviderContext_cjs = require("./BraidTestProviderContext.cjs");
 const noop = () => {
 };
-if (typeof navigator !== "undefined" && ((_a = navigator == null ? void 0 : navigator.userAgent) == null ? void 0 : _a.includes("jsdom"))) {
+if (typeof navigator !== "undefined" && navigator?.userAgent?.includes("jsdom")) {
   window.HTMLElement.prototype.scrollIntoView = window.HTMLElement.prototype.scrollIntoView || (() => {
   });
   class MockResizeObserver {
-    constructor() {
-      __publicField(this, "observe", noop);
-      __publicField(this, "unobserve", noop);
-      __publicField(this, "disconnect", noop);
-    }
+    observe = noop;
+    unobserve = noop;
+    disconnect = noop;
   }
   window.ResizeObserver = MockResizeObserver;
   class MockIntersectionObserver {
-    constructor() {
-      __publicField(this, "root", null);
-      __publicField(this, "rootMargin", "");
-      __publicField(this, "thresholds", []);
-      __publicField(this, "observe", noop);
-      __publicField(this, "unobserve", noop);
-      __publicField(this, "disconnect", noop);
-      __publicField(this, "takeRecords", () => []);
-    }
+    root = null;
+    rootMargin = "";
+    thresholds = [];
+    observe = noop;
+    unobserve = noop;
+    disconnect = noop;
+    takeRecords = () => [];
   }
   window.IntersectionObserver = MockIntersectionObserver;
 }

package/dist/lib/components/BraidTestProvider/BraidTestProvider.mjs

@@ -1,7 +1,3 @@
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-var _a;
 import { jsx } from "react/jsx-runtime";
 import { themes } from "../../themes/index.mjs";
 import { BraidProvider } from "../BraidProvider/BraidProvider.mjs";
@@ -9,27 +5,23 @@ import { breakpointContext } from "../BraidProvider/BreakpointContext.mjs";
 import { BraidTestProviderContext } from "./BraidTestProviderContext.mjs";
 const noop = () => {
 };
-if (typeof navigator !== "undefined" && ((_a = navigator == null ? void 0 : navigator.userAgent) == null ? void 0 : _a.includes("jsdom"))) {
+if (typeof navigator !== "undefined" && navigator?.userAgent?.includes("jsdom")) {
   window.HTMLElement.prototype.scrollIntoView = window.HTMLElement.prototype.scrollIntoView || (() => {
   });
   class MockResizeObserver {
-    constructor() {
-      __publicField(this, "observe", noop);
-      __publicField(this, "unobserve", noop);
-      __publicField(this, "disconnect", noop);
-    }
+    observe = noop;
+    unobserve = noop;
+    disconnect = noop;
   }
   window.ResizeObserver = MockResizeObserver;
   class MockIntersectionObserver {
-    constructor() {
-      __publicField(this, "root", null);
-      __publicField(this, "rootMargin", "");
-      __publicField(this, "thresholds", []);
-      __publicField(this, "observe", noop);
-      __publicField(this, "unobserve", noop);
-      __publicField(this, "disconnect", noop);
-      __publicField(this, "takeRecords", () => []);
-    }
+    root = null;
+    rootMargin = "";
+    thresholds = [];
+    observe = noop;
+    unobserve = noop;
+    disconnect = noop;
+    takeRecords = () => [];
   }
   window.IntersectionObserver = MockIntersectionObserver;
 }

package/dist/lib/components/Button/Button.cjs

@@ -239,7 +239,7 @@ const ButtonText = ({
   const lightness = lib_components_Box_BackgroundContext_cjs.useBackgroundLightness();
   const actionsContext = react.useContext(lib_components_Actions_ActionsContext_cjs.ActionsContext);
   const isLegacyTheme = lib_components_BraidProvider_BraidThemeContext_cjs.useBraidTheme().legacy;
-  const size = sizeProp ?? (actionsContext == null ? void 0 : actionsContext.size) ?? "standard";
+  const size = sizeProp ?? actionsContext?.size ?? "standard";
   const stylesForVariant = variants[variant][tone];
   const shouldReducePaddingX = size === "small" || variant === "transparent";
   const labelPaddingXForTheme = isLegacyTheme ? "medium" : "gutter";
@@ -311,7 +311,7 @@ const useButtonStyles = ({
     legacy: lib_components_BraidProvider_BraidThemeContext_cjs.useBraidTheme().legacy
   });
   const actionsContext = react.useContext(lib_components_Actions_ActionsContext_cjs.ActionsContext);
-  const size = sizeProp ?? (actionsContext == null ? void 0 : actionsContext.size) ?? "standard";
+  const size = sizeProp ?? actionsContext?.size ?? "standard";
   const stylesForVariant = variants[variant][tone];
   const colorContrast = lib_components_Box_BackgroundContext_cjs.useColorContrast();
   const lightness = lib_components_Box_BackgroundContext_cjs.useBackgroundLightness();
@@ -321,7 +321,6 @@ const useButtonStyles = ({
       width: "full",
       borderRadius: radius,
       cursor: !loading ? "pointer" : void 0,
-      outline: "none",
       className: [lib_components_Button_Button_css_cjs.root, size === "small" ? lib_components_private_touchable_virtualTouchable_css_cjs.virtualTouchable : void 0]
     },
     content: {

package/dist/lib/components/Button/Button.css.cjs

@@ -13,7 +13,7 @@ const root = css.style({
   // Necessary to overwrite Safari's default value for 'align-items' in 'button' elements (which is 'flex-start')
   alignItems: "stretch",
   // Necessary to overwrite browser default for 'a' elements (which is '1px'), keeping Button & ButtonLink uniform.
-  outlineOffset: 0
+  outline: "none"
 }, "root");
 const forceActive = css.style({}, "forceActive");
 const activeAnimation = css.style({

package/dist/lib/components/Button/Button.css.mjs

@@ -12,7 +12,7 @@ const root = style({
   // Necessary to overwrite Safari's default value for 'align-items' in 'button' elements (which is 'flex-start')
   alignItems: "stretch",
   // Necessary to overwrite browser default for 'a' elements (which is '1px'), keeping Button & ButtonLink uniform.
-  outlineOffset: 0
+  outline: "none"
 }, "root");
 const forceActive = style({}, "forceActive");
 const activeAnimation = style({

package/dist/lib/components/Button/Button.mjs

@@ -236,7 +236,7 @@ const ButtonText = ({
   const lightness = useBackgroundLightness();
   const actionsContext = useContext(ActionsContext);
   const isLegacyTheme = useBraidTheme().legacy;
-  const size = sizeProp ?? (actionsContext == null ? void 0 : actionsContext.size) ?? "standard";
+  const size = sizeProp ?? actionsContext?.size ?? "standard";
   const stylesForVariant = variants[variant][tone];
   const shouldReducePaddingX = size === "small" || variant === "transparent";
   const labelPaddingXForTheme = isLegacyTheme ? "medium" : "gutter";
@@ -308,7 +308,7 @@ const useButtonStyles = ({
     legacy: useBraidTheme().legacy
   });
   const actionsContext = useContext(ActionsContext);
-  const size = sizeProp ?? (actionsContext == null ? void 0 : actionsContext.size) ?? "standard";
+  const size = sizeProp ?? actionsContext?.size ?? "standard";
   const stylesForVariant = variants[variant][tone];
   const colorContrast = useColorContrast();
   const lightness = useBackgroundLightness();
@@ -318,7 +318,6 @@ const useButtonStyles = ({
       width: "full",
       borderRadius: radius,
       cursor: !loading ? "pointer" : void 0,
-      outline: "none",
       className: [root, size === "small" ? virtualTouchable : void 0]
     },
     content: {

package/dist/lib/components/Disclosure/Disclosure.cjs

@@ -55,7 +55,7 @@ const Disclosure = ({
       onToggle: restProps.onToggle
     }
   });
-  const size = sizeProp ?? (textContext == null ? void 0 : textContext.size) ?? "standard";
+  const size = sizeProp ?? textContext?.size ?? "standard";
   const defaultSpace = isInline ? (
     /*
      * If inline, only use `xxsmall` space between the trigger and the content

package/dist/lib/components/Disclosure/Disclosure.mjs

@@ -52,7 +52,7 @@ const Disclosure = ({
       onToggle: restProps.onToggle
     }
   });
-  const size = sizeProp ?? (textContext == null ? void 0 : textContext.size) ?? "standard";
+  const size = sizeProp ?? textContext?.size ?? "standard";
   const defaultSpace = isInline ? (
     /*
      * If inline, only use `xxsmall` space between the trigger and the content

package/dist/lib/components/Link/Link.playroom.cjs

@@ -8,7 +8,7 @@ const Link = react.forwardRef(
     {
       ref,
       href: href ?? "",
-      onClick: onClick ? onClick : (event) => event == null ? void 0 : event.preventDefault(),
+      onClick: onClick ? onClick : (event) => event?.preventDefault(),
       ...restProps
     }
   )

package/dist/lib/components/Link/Link.playroom.mjs

@@ -7,7 +7,7 @@ const Link = forwardRef(
     {
       ref,
       href: href ?? "",
-      onClick: onClick ? onClick : (event) => event == null ? void 0 : event.preventDefault(),
+      onClick: onClick ? onClick : (event) => event?.preventDefault(),
       ...restProps
     }
   )

package/dist/lib/components/MenuItem/useMenuItem.cjs

@@ -48,13 +48,11 @@ function useMenuItem({
   const { isHighlighted, index, dispatch, focusTrigger } = menuRendererItemContext;
   const menuItemRef = react.useRef(null);
   react.useEffect(() => {
-    var _a;
     if (isHighlighted) {
-      (_a = menuItemRef.current) == null ? void 0 : _a.focus();
+      menuItemRef.current?.focus();
     }
   }, [isHighlighted]);
   const onKeyDown = (event) => {
-    var _a;
     const targetKey = lib_components_private_normalizeKey_cjs.normalizeKey(event);
     const closeActionKeys = ["Enter", " "];
     const isArrowPress = targetKey.indexOf("Arrow") === 0;
@@ -72,7 +70,7 @@ function useMenuItem({
       dispatch(action[targetKey]);
     }
     if (targetKey === "Enter" || targetKey === " ") {
-      (_a = menuItemRef.current) == null ? void 0 : _a.click();
+      menuItemRef.current?.click();
     }
     if (!formElement && closeActionKeys.indexOf(targetKey) > -1) {
       focusTrigger();

package/dist/lib/components/MenuItem/useMenuItem.mjs

@@ -45,13 +45,11 @@ function useMenuItem({
   const { isHighlighted, index, dispatch, focusTrigger } = menuRendererItemContext;
   const menuItemRef = useRef(null);
   useEffect(() => {
-    var _a;
     if (isHighlighted) {
-      (_a = menuItemRef.current) == null ? void 0 : _a.focus();
+      menuItemRef.current?.focus();
     }
   }, [isHighlighted]);
   const onKeyDown = (event) => {
-    var _a;
     const targetKey = normalizeKey(event);
     const closeActionKeys = ["Enter", " "];
     const isArrowPress = targetKey.indexOf("Arrow") === 0;
@@ -69,7 +67,7 @@ function useMenuItem({
       dispatch(action[targetKey]);
     }
     if (targetKey === "Enter" || targetKey === " ") {
-      (_a = menuItemRef.current) == null ? void 0 : _a.click();
+      menuItemRef.current?.click();
     }
     if (!formElement && closeActionKeys.indexOf(targetKey) > -1) {
       focusTrigger();

package/dist/lib/components/TextLink/TextLink.cjs

@@ -25,7 +25,7 @@ const useLinkStyles = ({
   const backgroundContext = lib_components_Box_BackgroundContext_cjs.useBackground();
   const textContext = react.useContext(lib_components_Text_TextContext_cjs.TextContext);
   const headingContext = react.useContext(lib_components_Heading_HeadingContext_cjs.HeadingContext);
-  const isWeakDueToTextTone = !headingContext && (textContext == null ? void 0 : textContext.tone) !== "neutral";
+  const isWeakDueToTextTone = !headingContext && textContext?.tone !== "neutral";
   const linkStyles = weight === "weak" || isWeakDueToTextTone ? lib_components_TextLink_TextLink_css_cjs.weakLink : [
     isPlainBackground(backgroundContext.lightMode, "light") || weight === "regular" ? lib_components_TextLink_TextLink_css_cjs.regularLinkLightMode[backgroundLightness.lightMode] : lib_components_TextLink_TextLink_css_cjs.weakLink,
     isPlainBackground(backgroundContext.darkMode, "dark") || weight === "regular" ? lib_components_TextLink_TextLink_css_cjs.regularLinkDarkMode[backgroundLightness.darkMode] : lib_components_TextLink_TextLink_css_cjs.weakLink

package/dist/lib/components/TextLink/TextLink.mjs

@@ -22,7 +22,7 @@ const useLinkStyles = ({
   const backgroundContext = useBackground();
   const textContext = useContext(TextContext);
   const headingContext = useContext(HeadingContext);
-  const isWeakDueToTextTone = !headingContext && (textContext == null ? void 0 : textContext.tone) !== "neutral";
+  const isWeakDueToTextTone = !headingContext && textContext?.tone !== "neutral";
   const linkStyles = weight === "weak" || isWeakDueToTextTone ? weakLink : [
     isPlainBackground(backgroundContext.lightMode, "light") || weight === "regular" ? regularLinkLightMode[backgroundLightness.lightMode] : weakLink,
     isPlainBackground(backgroundContext.darkMode, "dark") || weight === "regular" ? regularLinkDarkMode[backgroundLightness.darkMode] : weakLink

package/dist/lib/components/TextLinkButton/TextLinkButton.cjs

@@ -30,10 +30,9 @@ const TextLinkButton = ({
   });
   const handleKeyboard = react.useCallback(
     (event) => {
-      var _a;
       if (event.key === "Enter" || event.key === " ") {
         event.preventDefault();
-        (_a = buttonRef.current) == null ? void 0 : _a.click();
+        buttonRef.current?.click();
       }
     },
     [buttonRef]

package/dist/lib/components/TextLinkButton/TextLinkButton.mjs

@@ -29,10 +29,9 @@ const TextLinkButton = ({
   });
   const handleKeyboard = useCallback(
     (event) => {
-      var _a;
       if (event.key === "Enter" || event.key === " ") {
         event.preventDefault();
-        (_a = buttonRef.current) == null ? void 0 : _a.click();
+        buttonRef.current?.click();
       }
     },
     [buttonRef]

package/dist/lib/components/private/Popover/Popover.cjs

@@ -59,9 +59,8 @@ const PopoverContent = react.forwardRef(
     const alignmentAnchor = align === "center" ? "left" : align;
     react.useEffect(() => {
       const handleKeydown = (event) => {
-        var _a;
         if (event.key === "Escape" || event.key === "Tab") {
-          (_a = triggerRef.current) == null ? void 0 : _a.focus();
+          triggerRef.current?.focus();
           if (process.env.NODE_ENV !== "production") {
             if (!triggerRef.current) {
               console.error(
@@ -87,11 +86,10 @@ const PopoverContent = react.forwardRef(
     }, [triggerRef]);
     react.useEffect(() => {
       setTimeout(() => {
-        var _a;
         if (!enterFocusRef) {
           return;
         }
-        (_a = enterFocusRef.current) == null ? void 0 : _a.focus();
+        enterFocusRef.current?.focus();
         if (process.env.NODE_ENV !== "production") {
           if (!enterFocusRef.current) {
             console.error(
@@ -117,8 +115,7 @@ const PopoverContent = react.forwardRef(
       };
     }, [triggerRef]);
     const handlePlacement = () => {
-      var _a;
-      const popoverBoundingRect = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.getBoundingClientRect();
+      const popoverBoundingRect = ref?.current?.getBoundingClientRect();
       if (!popoverBoundingRect) {
         return;
       }
@@ -131,11 +128,10 @@ const PopoverContent = react.forwardRef(
       }
     };
     const handleHorizontalShift = () => {
-      var _a;
       if (!triggerPosition) {
         return;
       }
-      const popoverBoundingRect = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.getBoundingClientRect();
+      const popoverBoundingRect = ref?.current?.getBoundingClientRect();
       if (!popoverBoundingRect) {
         return;
       }
@@ -178,8 +174,8 @@ const PopoverContent = react.forwardRef(
       // Vertical positioning
       [lib_components_private_Popover_Popover_css_cjs.triggerVars[actualPlacement]]: `${triggerPosition[actualPlacement]}`,
       // Horizontal positioning
-      [lib_components_private_Popover_Popover_css_cjs.triggerVars.left]: width === "full" || alignmentAnchor === "left" ? `${triggerPosition == null ? void 0 : triggerPosition.left}` : void 0,
-      [lib_components_private_Popover_Popover_css_cjs.triggerVars.right]: width === "full" || alignmentAnchor === "right" ? `${triggerPosition == null ? void 0 : triggerPosition.right}` : void 0,
+      [lib_components_private_Popover_Popover_css_cjs.triggerVars.left]: width === "full" || alignmentAnchor === "left" ? `${triggerPosition?.left}` : void 0,
+      [lib_components_private_Popover_Popover_css_cjs.triggerVars.right]: width === "full" || alignmentAnchor === "right" ? `${triggerPosition?.right}` : void 0,
       // Horizontal scroll offset
       [lib_components_private_Popover_Popover_css_cjs.horizontalOffset]: width !== "full" ? `${horizontalOffset}` : "0"
     };

package/dist/lib/components/private/Popover/Popover.mjs

@@ -56,9 +56,8 @@ const PopoverContent = forwardRef(
     const alignmentAnchor = align === "center" ? "left" : align;
     useEffect(() => {
       const handleKeydown = (event) => {
-        var _a;
         if (event.key === "Escape" || event.key === "Tab") {
-          (_a = triggerRef.current) == null ? void 0 : _a.focus();
+          triggerRef.current?.focus();
           if (process.env.NODE_ENV !== "production") {
             if (!triggerRef.current) {
               console.error(
@@ -84,11 +83,10 @@ const PopoverContent = forwardRef(
     }, [triggerRef]);
     useEffect(() => {
       setTimeout(() => {
-        var _a;
         if (!enterFocusRef) {
           return;
         }
-        (_a = enterFocusRef.current) == null ? void 0 : _a.focus();
+        enterFocusRef.current?.focus();
         if (process.env.NODE_ENV !== "production") {
           if (!enterFocusRef.current) {
             console.error(
@@ -114,8 +112,7 @@ const PopoverContent = forwardRef(
       };
     }, [triggerRef]);
     const handlePlacement = () => {
-      var _a;
-      const popoverBoundingRect = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.getBoundingClientRect();
+      const popoverBoundingRect = ref?.current?.getBoundingClientRect();
       if (!popoverBoundingRect) {
         return;
       }
@@ -128,11 +125,10 @@ const PopoverContent = forwardRef(
       }
     };
     const handleHorizontalShift = () => {
-      var _a;
       if (!triggerPosition) {
         return;
       }
-      const popoverBoundingRect = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.getBoundingClientRect();
+      const popoverBoundingRect = ref?.current?.getBoundingClientRect();
       if (!popoverBoundingRect) {
         return;
       }
@@ -175,8 +171,8 @@ const PopoverContent = forwardRef(
       // Vertical positioning
       [triggerVars[actualPlacement]]: `${triggerPosition[actualPlacement]}`,
       // Horizontal positioning
-      [triggerVars.left]: width === "full" || alignmentAnchor === "left" ? `${triggerPosition == null ? void 0 : triggerPosition.left}` : void 0,
-      [triggerVars.right]: width === "full" || alignmentAnchor === "right" ? `${triggerPosition == null ? void 0 : triggerPosition.right}` : void 0,
+      [triggerVars.left]: width === "full" || alignmentAnchor === "left" ? `${triggerPosition?.left}` : void 0,
+      [triggerVars.right]: width === "full" || alignmentAnchor === "right" ? `${triggerPosition?.right}` : void 0,
       // Horizontal scroll offset
       [horizontalOffset]: width !== "full" ? `${horizontalOffset$1}` : "0"
     };

package/dist/lib/hooks/useIcon/index.cjs

@@ -27,8 +27,8 @@ const defaultVerticalCorrection = {
 const useIcon = ({ size, tone, alignY, data, title, titleId, ...restProps }, { verticalCorrection = defaultVerticalCorrection } = {}) => {
   const textContext = react.useContext(lib_components_Text_TextContext_cjs.TextContext);
   const headingContext = react.useContext(lib_components_Heading_HeadingContext_cjs.HeadingContext);
-  const resolvedTone = lib_css_typography_css_cjs.tone[tone || (textContext == null ? void 0 : textContext.tone) || "neutral"];
-  const toneClass = tone || !headingContext && !(textContext == null ? void 0 : textContext.tone) ? resolvedTone : void 0;
+  const resolvedTone = lib_css_typography_css_cjs.tone[tone || textContext?.tone || "neutral"];
+  const toneClass = tone || !headingContext && !textContext?.tone ? resolvedTone : void 0;
   const isInline = Boolean(textContext || headingContext);
   const a11yProps = title ? { title, titleId, role: "img" } : { "aria-hidden": true };
   assert__default.default(

package/dist/lib/hooks/useIcon/index.mjs

@@ -23,8 +23,8 @@ const defaultVerticalCorrection = {
 const useIcon = ({ size: size2, tone: tone$1, alignY, data, title, titleId, ...restProps }, { verticalCorrection = defaultVerticalCorrection } = {}) => {
   const textContext = useContext(TextContext);
   const headingContext = useContext(HeadingContext);
-  const resolvedTone = tone[tone$1 || (textContext == null ? void 0 : textContext.tone) || "neutral"];
-  const toneClass = tone$1 || !headingContext && !(textContext == null ? void 0 : textContext.tone) ? resolvedTone : void 0;
+  const resolvedTone = tone[tone$1 || textContext?.tone || "neutral"];
+  const toneClass = tone$1 || !headingContext && !textContext?.tone ? resolvedTone : void 0;
   const isInline = Boolean(textContext || headingContext);
   const a11yProps = title ? { title, titleId, role: "img" } : { "aria-hidden": true };
   assert(

package/dist/lib/hooks/useIsomorphicLayoutEffect.cjs

@@ -1,6 +1,5 @@
 "use strict";
-var _a;
 const react = require("react");
-const isJSDom = typeof navigator !== "undefined" && ((_a = navigator == null ? void 0 : navigator.userAgent) == null ? void 0 : _a.includes("jsdom"));
+const isJSDom = typeof navigator !== "undefined" && navigator?.userAgent?.includes("jsdom");
 const useIsomorphicLayoutEffect = typeof document !== "undefined" && !isJSDom ? react.useLayoutEffect : react.useEffect;
 exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;

package/dist/lib/hooks/useIsomorphicLayoutEffect.mjs

@@ -1,6 +1,5 @@
-var _a;
 import { useLayoutEffect, useEffect } from "react";
-const isJSDom = typeof navigator !== "undefined" && ((_a = navigator == null ? void 0 : navigator.userAgent) == null ? void 0 : _a.includes("jsdom"));
+const isJSDom = typeof navigator !== "undefined" && navigator?.userAgent?.includes("jsdom");
 const useIsomorphicLayoutEffect = typeof document !== "undefined" && !isJSDom ? useLayoutEffect : useEffect;
 export {
   useIsomorphicLayoutEffect

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "braid-design-system",
-  "version": "33.11.4",
+  "version": "33.11.6-test-20251007010150",
   "description": "Themeable design system for the SEEK Group",
   "homepage": "https://seek-oss.github.io/braid-design-system/",
   "bugs": {
@@ -217,11 +217,11 @@
     "react-dom": "^19.1.0",
     "react-router": "^7.6.3",
     "sanitize-html": "^2.12.1",
-    "sku": "14.8.0",
+    "sku": "14.13.0",
     "storybook": "9.0.15",
     "svgo": "^2.8.0",
     "title-case": "^3.0.3",
-    "@braid-design-system/source.macro": "1.0.0"
+    "@braid-design-system/source.macro": "1.0.1-test-20251007010150"
   },
   "peerDependencies": {
     "react": "^18 || ^19",