braid-design-system 33.12.4 → 33.13.0

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # braid-design-system
 
+## 33.13.0
+
+### Minor Changes
+
+- **Autosuggest:** Add support for data attributes on individual suggestions ([#1938](https://github.com/seek-oss/braid-design-system/pull/1938))
+
+  The data attributes are applied to each rendered list item.
+
+  **EXAMPLE USAGE:**
+
+  ```jsx
+  <Autosuggest
+    suggestions={[
+      {
+        text: 'Apples',
+        data: { testid: 'suggestion-apples' },
+      },
+    ]}
+  />
+  ```
+
+### Patch Changes
+
+- **ButtonIcon, TooltipRenderer:** Close tooltips after clicking the trigger on desktop devices ([#1932](https://github.com/seek-oss/braid-design-system/pull/1932))
+
 ## 33.12.4
 
 ### Patch Changes

package/dist/index.d.mts

@@ -3034,6 +3034,7 @@ interface Suggestion<Value = any> extends AutosuggestValue<Value> {
     highlights?: SuggestionMatch;
     onClear?: (value: AutosuggestValue<Value>) => void;
     clearLabel?: string;
+    data?: DataAttributeMap;
 }
 interface GroupedSuggestions<Value> {
     label: string;

package/dist/index.d.ts

@@ -3034,6 +3034,7 @@ interface Suggestion<Value = any> extends AutosuggestValue<Value> {
     highlights?: SuggestionMatch;
     onClear?: (value: AutosuggestValue<Value>) => void;
     clearLabel?: string;
+    data?: DataAttributeMap;
 }
 interface GroupedSuggestions<Value> {
     label: string;

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

@@ -17,6 +17,7 @@ const lib_components_private_Announcement_Announcement_cjs = require("../private
 const lib_components_private_Field_ClearField_cjs = require("../private/Field/ClearField.cjs");
 const lib_components_private_Field_Field_cjs = require("../private/Field/Field.cjs");
 const lib_components_private_Popover_Popover_cjs = require("../private/Popover/Popover.cjs");
+const lib_components_private_buildDataAttributes_cjs = require("../private/buildDataAttributes.cjs");
 const lib_components_private_getNextIndex_cjs = require("../private/getNextIndex.cjs");
 const lib_components_private_normalizeKey_cjs = require("../private/normalizeKey.cjs");
 const lib_components_private_smoothScroll_cjs = require("../private/smoothScroll.cjs");
@@ -48,7 +49,7 @@ function SuggestionItem({
   id,
   ...restProps
 }) {
-  const { highlights = [], onClear, clearLabel } = suggestion;
+  const { highlights = [], onClear, clearLabel, data } = suggestion;
   const label = suggestion.label ?? suggestion.text;
   const suggestionParts = parseHighlights__default.default(
     label,
@@ -65,6 +66,7 @@ function SuggestionItem({
       onMouseMove: onHover,
       onTouchStart: onHover,
       id,
+      ...lib_components_private_buildDataAttributes_cjs.buildDataAttributes({ data, validateRestProps: false }),
       ...restProps,
       children: /* @__PURE__ */ jsxRuntime.jsxs(
         lib_components_Box_Box_cjs.Box,

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

@@ -16,6 +16,7 @@ import { Announcement } from "../private/Announcement/Announcement.mjs";
 import { ClearField } from "../private/Field/ClearField.mjs";
 import { Field } from "../private/Field/Field.mjs";
 import { Popover } from "../private/Popover/Popover.mjs";
+import { buildDataAttributes } from "../private/buildDataAttributes.mjs";
 import { getNextIndex } from "../private/getNextIndex.mjs";
 import { normalizeKey } from "../private/normalizeKey.mjs";
 import { smoothScroll } from "../private/smoothScroll.mjs";
@@ -43,7 +44,7 @@ function SuggestionItem({
   id,
   ...restProps
 }) {
-  const { highlights = [], onClear, clearLabel } = suggestion;
+  const { highlights = [], onClear, clearLabel, data } = suggestion;
   const label = suggestion.label ?? suggestion.text;
   const suggestionParts = parseHighlights(
     label,
@@ -60,6 +61,7 @@ function SuggestionItem({
       onMouseMove: onHover,
       onTouchStart: onHover,
       id,
+      ...buildDataAttributes({ data, validateRestProps: false }),
       ...restProps,
       children: /* @__PURE__ */ jsxs(
         Box,

package/dist/lib/components/TooltipRenderer/TooltipRenderer.cjs

@@ -139,6 +139,7 @@ const TooltipRenderer = ({
         triggerRef.current.addEventListener("focus", openTooltip);
         triggerRef.current.addEventListener("mouseenter", openTooltip);
         triggerRef.current.addEventListener("mouseleave", closeTooltip);
+        triggerRef.current.addEventListener("click", closeTooltip);
       }
     }
     return () => {
@@ -150,6 +151,7 @@ const TooltipRenderer = ({
           triggerRef.current.removeEventListener("focus", openTooltip);
           triggerRef.current.removeEventListener("mouseenter", openTooltip);
           triggerRef.current.removeEventListener("mouseleave", closeTooltip);
+          triggerRef.current.removeEventListener("click", closeTooltip);
         }
       }
     };

package/dist/lib/components/TooltipRenderer/TooltipRenderer.mjs

@@ -136,6 +136,7 @@ const TooltipRenderer = ({
         triggerRef.current.addEventListener("focus", openTooltip);
         triggerRef.current.addEventListener("mouseenter", openTooltip);
         triggerRef.current.addEventListener("mouseleave", closeTooltip);
+        triggerRef.current.addEventListener("click", closeTooltip);
       }
     }
     return () => {
@@ -147,6 +148,7 @@ const TooltipRenderer = ({
           triggerRef.current.removeEventListener("focus", openTooltip);
           triggerRef.current.removeEventListener("mouseenter", openTooltip);
           triggerRef.current.removeEventListener("mouseleave", closeTooltip);
+          triggerRef.current.removeEventListener("click", closeTooltip);
         }
       }
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "braid-design-system",
-  "version": "33.12.4",
+  "version": "33.13.0",
   "description": "Themeable design system for the SEEK Group",
   "homepage": "https://seek-oss.github.io/braid-design-system/",
   "bugs": {