@paubox/ui 3.3.0 → 3.4.0

package/index.esm.js

@@ -22851,6 +22851,10 @@ var DatePicker = function(_param) {
                 style: {
                     width: rangeSelect ? 200 : 107
                 },
+                // Analytics autocapture hooks (@paubox/tracking). The trigger is a native
+                // button; tag it so the captured click is identifiable as a date picker.
+                "data-pb-component": "DatePicker",
+                "data-pb-name": rangeSelect ? 'date_range' : 'date',
                 children: [
                     dateString,
                     /*#__PURE__*/ jsx("div", {
@@ -24376,6 +24380,10 @@ var OptionWrapper = styled.div(_templateObject5$5());
                 "aria-activedescendant": open ? activeOptionId : undefined,
                 "aria-haspopup": "listbox",
                 "aria-label": ariaLabel,
+                // Analytics autocapture hooks (@paubox/tracking). The input is native, so
+                // field_interaction works out of the box; tag the component for clarity.
+                "data-pb-component": "AutoComplete",
+                "data-pb-name": ariaLabel || inputProps.name || undefined,
                 onChange: handleInputChange,
                 onFocus: function() {
                     return setIsFocused(true);
@@ -25017,6 +25025,10 @@ var MultiSelect = function(_param) {
                 return !prev;
             });
         },
+        // Analytics autocapture hooks (@paubox/tracking). The interactive node is
+        // this wrapper div (the inner <select> is inert), so identify it here.
+        "data-pb-component": "MultiSelect",
+        "data-pb-name": props['aria-label'] || props.name || label || undefined,
         children: [
             /*#__PURE__*/ jsxs(InputWrapper$2, {
                 children: [
@@ -25722,6 +25734,10 @@ var Select = function(_param) {
                 return !prev;
             });
         },
+        // Analytics autocapture hooks (@paubox/tracking). The interactive node is
+        // this wrapper div (the inner <select> is inert), so identify it here.
+        "data-pb-component": "Select",
+        "data-pb-name": props['aria-label'] || props.name || undefined,
         children: [
             /*#__PURE__*/ jsxs(InputWrapper, {
                 children: [

package/package.json

@@ -2,7 +2,7 @@
   "name": "@paubox/ui",
   "author": "Paubox, Inc.",
   "description": "Paubox Component Library",
-  "version": "3.3.0",
+  "version": "3.4.0",
   "type": "module",
   "private": false,
   "publishConfig": {