@procore/ai-translations 0.6.0 → 0.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -22,10 +22,16 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
22
22
  // src/index.ts
23
23
  var index_exports = {};
24
24
  __export(index_exports, {
25
+ ACTION: () => ACTION,
25
26
  AITranslateText: () => AITranslateText,
26
27
  AITranslationProvider: () => AITranslationProvider,
27
28
  AI_TRANSLATION_FEATURE_FLAG_KEY: () => AI_TRANSLATION_FEATURE_FLAG_KEY,
29
+ BUTTON_TYPE: () => BUTTON_TYPE,
30
+ buildAnalyticEvent: () => buildAnalyticEvent,
31
+ buildEventKey: () => buildEventKey,
32
+ buildObject: () => buildObject,
28
33
  getAITranslationLDId: () => getAITranslationLDId,
34
+ useAIAnalytics: () => useAIAnalytics,
29
35
  useAITranslation: () => useAITranslation,
30
36
  useConfig: () => useConfig
31
37
  });
@@ -1472,7 +1478,12 @@ function AITranslationInnerProvider(props) {
1472
1478
  companyId,
1473
1479
  userId,
1474
1480
  projectId,
1475
- enableAIT = true
1481
+ enableAIT = true,
1482
+ companyLocale,
1483
+ projectLocale,
1484
+ onTrackAnalyticsEvent,
1485
+ page,
1486
+ scope
1476
1487
  } = props;
1477
1488
  const [translationProgress, setTranslationProgress] = (0, import_react.useState)(null);
1478
1489
  const [modelDownloadProgress, setModelDownloadProgress] = (0, import_react.useState)(null);
@@ -1549,10 +1560,15 @@ function AITranslationInnerProvider(props) {
1549
1560
  const contextValue = {
1550
1561
  ait,
1551
1562
  locale,
1563
+ companyLocale,
1564
+ projectLocale,
1552
1565
  renderVersion: renderVersionManager.getVersion(),
1553
1566
  translationProgress,
1554
1567
  modelDownloadProgress,
1555
- tool
1568
+ tool,
1569
+ onTrackAnalyticsEvent,
1570
+ page,
1571
+ scope
1556
1572
  };
1557
1573
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AITranslationContext.Provider, { value: contextValue, children });
1558
1574
  }
@@ -1572,15 +1588,143 @@ function useAITranslation() {
1572
1588
  return ctx;
1573
1589
  }
1574
1590
 
1591
+ // src/hooks/useAIAnalytics.ts
1592
+ var import_react3 = require("react");
1593
+
1594
+ // src/analytics/events.ts
1595
+ var BUTTON_TYPE = {
1596
+ TRANSLATE: "translate",
1597
+ HIGHLIGHT: "highlight"
1598
+ };
1599
+ var ACTION = {
1600
+ CLICKED: "clicked"
1601
+ };
1602
+ function buildObject(pageContext, buttonType) {
1603
+ return `${pageContext}_${buttonType}_button`;
1604
+ }
1605
+ function buildEventKey(parts) {
1606
+ const { scope, tool, object, action } = parts;
1607
+ return `ux.web.feature.${scope}.${tool}.${object}.${action}`;
1608
+ }
1609
+ function buildAnalyticEvent(params) {
1610
+ const {
1611
+ scope,
1612
+ tool,
1613
+ pageContext,
1614
+ buttonType,
1615
+ baseProperties,
1616
+ action,
1617
+ additionalProperties
1618
+ } = params;
1619
+ const resolvedAction = action ?? ACTION.CLICKED;
1620
+ const object = buildObject(pageContext, buttonType);
1621
+ const key = buildEventKey({
1622
+ scope,
1623
+ tool,
1624
+ object,
1625
+ action: resolvedAction
1626
+ });
1627
+ const properties = {
1628
+ ...baseProperties,
1629
+ ...additionalProperties
1630
+ };
1631
+ return { key, properties };
1632
+ }
1633
+
1634
+ // src/hooks/useAIAnalytics.ts
1635
+ function useAIAnalytics() {
1636
+ const ctx = (0, import_react3.useContext)(AITranslationContext);
1637
+ if (!ctx) {
1638
+ throw new Error(
1639
+ "useAIAnalytics must be used inside an AITranslationProvider"
1640
+ );
1641
+ }
1642
+ const {
1643
+ locale,
1644
+ companyLocale,
1645
+ projectLocale,
1646
+ tool,
1647
+ page,
1648
+ scope,
1649
+ onTrackAnalyticsEvent
1650
+ } = ctx;
1651
+ const isTrackingEnabled = Boolean(onTrackAnalyticsEvent);
1652
+ const buildBaseProperties = (0, import_react3.useCallback)(() => {
1653
+ const props = {
1654
+ user_locale: locale,
1655
+ tool,
1656
+ page: page ?? ""
1657
+ };
1658
+ if (companyLocale) props.company_locale = companyLocale;
1659
+ if (projectLocale) props.project_locale = projectLocale;
1660
+ return props;
1661
+ }, [locale, tool, page, companyLocale, projectLocale]);
1662
+ const trackTranslateButtonClicked = (0, import_react3.useCallback)(
1663
+ (additionalProperties) => {
1664
+ if (!onTrackAnalyticsEvent || !page || !scope) return;
1665
+ onTrackAnalyticsEvent(
1666
+ buildAnalyticEvent({
1667
+ scope,
1668
+ tool,
1669
+ pageContext: page,
1670
+ buttonType: BUTTON_TYPE.TRANSLATE,
1671
+ baseProperties: buildBaseProperties(),
1672
+ additionalProperties
1673
+ })
1674
+ );
1675
+ },
1676
+ [onTrackAnalyticsEvent, tool, page, scope, buildBaseProperties]
1677
+ );
1678
+ const trackHighlightButtonClicked = (0, import_react3.useCallback)(
1679
+ (additionalProperties) => {
1680
+ if (!onTrackAnalyticsEvent || !page || !scope) return;
1681
+ onTrackAnalyticsEvent(
1682
+ buildAnalyticEvent({
1683
+ scope,
1684
+ tool,
1685
+ pageContext: page,
1686
+ buttonType: BUTTON_TYPE.HIGHLIGHT,
1687
+ baseProperties: buildBaseProperties(),
1688
+ additionalProperties
1689
+ })
1690
+ );
1691
+ },
1692
+ [onTrackAnalyticsEvent, tool, page, scope, buildBaseProperties]
1693
+ );
1694
+ const trackCustomEvent = (0, import_react3.useCallback)(
1695
+ (buttonType, action, additionalProperties) => {
1696
+ if (!onTrackAnalyticsEvent || !page || !scope) return;
1697
+ onTrackAnalyticsEvent(
1698
+ buildAnalyticEvent({
1699
+ scope,
1700
+ tool,
1701
+ pageContext: page,
1702
+ buttonType,
1703
+ baseProperties: buildBaseProperties(),
1704
+ action,
1705
+ additionalProperties
1706
+ })
1707
+ );
1708
+ },
1709
+ [onTrackAnalyticsEvent, tool, page, scope, buildBaseProperties]
1710
+ );
1711
+ return {
1712
+ trackTranslateButtonClicked,
1713
+ trackHighlightButtonClicked,
1714
+ trackCustomEvent,
1715
+ isTrackingEnabled
1716
+ };
1717
+ }
1718
+
1575
1719
  // src/components/AITranslateText.tsx
1576
- var import_react4 = require("react");
1720
+ var import_react5 = require("react");
1577
1721
 
1578
1722
  // src/components/TranslatedIcon.tsx
1579
- var import_react3 = require("react");
1723
+ var import_react4 = require("react");
1580
1724
  var import_jsx_runtime2 = require("react/jsx-runtime");
1581
1725
  var TranslatedIcon = ({
1582
- width = 14,
1583
- height = 14,
1726
+ width = 24,
1727
+ height = 24,
1584
1728
  className,
1585
1729
  color = "#000000"
1586
1730
  }) => {
@@ -1598,7 +1742,7 @@ var TranslatedIcon = ({
1598
1742
  "path",
1599
1743
  {
1600
1744
  fill: color,
1601
- d: "M12.87,15.07l-2.54,-2.51 0.03,-0.03c1.74,-1.94 2.98,-4.17 3.71,-6.53L17,6L17,4h-7L10,2L8,2v2L1,4v1.99h11.17C11.5,7.92 10.44,9.75 9,11.35 8.07,10.32 7.3,9.19 6.69,8h-2c0.73,1.63 1.73,3.17 2.98,4.56l-5.09,5.02L4,19l5,-5 3.11,3.11 0.76,-2.04zM18.5,10h-2L12,22h2l1.12,-3h4.75L21,22h2l-4.5,-12zM15.88,17l1.62,-4.33L19.12,17h-3.24z"
1745
+ d: "M11.99 2C6.47 2 2 6.48 2 12C2 17.52 6.47 22 11.99 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 11.99 2ZM18.92 8H15.97C15.65 6.75 15.19 5.55 14.59 4.44C16.43 5.07 17.96 6.35 18.92 8ZM12 4.04C12.83 5.24 13.48 6.57 13.91 8H10.09C10.52 6.57 11.17 5.24 12 4.04ZM4.26 14C4.1 13.36 4 12.69 4 12C4 11.31 4.1 10.64 4.26 10H7.64C7.56 10.66 7.5 11.32 7.5 12C7.5 12.68 7.56 13.34 7.64 14H4.26ZM5.08 16H8.03C8.35 17.25 8.81 18.45 9.41 19.56C7.57 18.93 6.04 17.66 5.08 16ZM8.03 8H5.08C6.04 6.34 7.57 5.07 9.41 4.44C8.81 5.55 8.35 6.75 8.03 8ZM12 19.96C11.17 18.76 10.52 17.43 10.09 16H13.91C13.48 17.43 12.83 18.76 12 19.96ZM14.34 14H9.66C9.57 13.34 9.5 12.68 9.5 12C9.5 11.32 9.57 10.65 9.66 10H14.34C14.43 10.65 14.5 11.32 14.5 12C14.5 12.68 14.43 13.34 14.34 14ZM14.59 19.56C15.19 18.45 15.65 17.25 15.97 16H18.92C17.96 17.65 16.43 18.93 14.59 19.56ZM16.36 14C16.44 13.34 16.5 12.68 16.5 12C16.5 11.32 16.44 10.66 16.36 10H19.74C19.9 10.64 20 11.31 20 12C20 12.69 19.9 13.36 19.74 14H16.36Z"
1602
1746
  }
1603
1747
  )
1604
1748
  }
@@ -1613,11 +1757,11 @@ var AITranslateText = ({
1613
1757
  showHighlight = false,
1614
1758
  translatedIconProps
1615
1759
  }) => {
1616
- const context = (0, import_react4.useContext)(AITranslationContext);
1617
- const [displayText, setDisplayText] = (0, import_react4.useState)(text ?? "");
1618
- const [showHighlightState, setShowHighlightState] = (0, import_react4.useState)(showHighlight);
1619
- const eventHandlerRef = (0, import_react4.useRef)(null);
1620
- (0, import_react4.useEffect)(() => {
1760
+ const context = (0, import_react5.useContext)(AITranslationContext);
1761
+ const [displayText, setDisplayText] = (0, import_react5.useState)(text ?? "");
1762
+ const [showHighlightState, setShowHighlightState] = (0, import_react5.useState)(showHighlight);
1763
+ const eventHandlerRef = (0, import_react5.useRef)(null);
1764
+ (0, import_react5.useEffect)(() => {
1621
1765
  if (!context) return;
1622
1766
  if (!eventHandlerRef.current) {
1623
1767
  eventHandlerRef.current = new EventHandler(context.tool);
@@ -1636,14 +1780,14 @@ var AITranslateText = ({
1636
1780
  );
1637
1781
  return () => unsubscribe();
1638
1782
  }, [context, text, showHighlight]);
1639
- const reset = (0, import_react4.useCallback)(
1783
+ const reset = (0, import_react5.useCallback)(
1640
1784
  (displayValue = text) => {
1641
1785
  setDisplayText(displayValue);
1642
1786
  setShowHighlightState(false);
1643
1787
  },
1644
1788
  [text]
1645
1789
  );
1646
- (0, import_react4.useEffect)(() => {
1790
+ (0, import_react5.useEffect)(() => {
1647
1791
  if (text == null || text === "") {
1648
1792
  reset(text ?? "");
1649
1793
  return;
@@ -1695,10 +1839,16 @@ var getAITranslationLDId = (domain) => {
1695
1839
  };
1696
1840
  // Annotate the CommonJS export names for ESM import in node:
1697
1841
  0 && (module.exports = {
1842
+ ACTION,
1698
1843
  AITranslateText,
1699
1844
  AITranslationProvider,
1700
1845
  AI_TRANSLATION_FEATURE_FLAG_KEY,
1846
+ BUTTON_TYPE,
1847
+ buildAnalyticEvent,
1848
+ buildEventKey,
1849
+ buildObject,
1701
1850
  getAITranslationLDId,
1851
+ useAIAnalytics,
1702
1852
  useAITranslation,
1703
1853
  useConfig
1704
1854
  });
@@ -1449,7 +1449,12 @@ function AITranslationInnerProvider(props) {
1449
1449
  companyId,
1450
1450
  userId,
1451
1451
  projectId,
1452
- enableAIT = true
1452
+ enableAIT = true,
1453
+ companyLocale,
1454
+ projectLocale,
1455
+ onTrackAnalyticsEvent,
1456
+ page,
1457
+ scope
1453
1458
  } = props;
1454
1459
  const [translationProgress, setTranslationProgress] = useState(null);
1455
1460
  const [modelDownloadProgress, setModelDownloadProgress] = useState(null);
@@ -1526,10 +1531,15 @@ function AITranslationInnerProvider(props) {
1526
1531
  const contextValue = {
1527
1532
  ait,
1528
1533
  locale,
1534
+ companyLocale,
1535
+ projectLocale,
1529
1536
  renderVersion: renderVersionManager.getVersion(),
1530
1537
  translationProgress,
1531
1538
  modelDownloadProgress,
1532
- tool
1539
+ tool,
1540
+ onTrackAnalyticsEvent,
1541
+ page,
1542
+ scope
1533
1543
  };
1534
1544
  return /* @__PURE__ */ jsx(AITranslationContext.Provider, { value: contextValue, children });
1535
1545
  }
@@ -1549,12 +1559,140 @@ function useAITranslation() {
1549
1559
  return ctx;
1550
1560
  }
1551
1561
 
1562
+ // src/hooks/useAIAnalytics.ts
1563
+ import { useContext as useContext2, useCallback as useCallback2 } from "react";
1564
+
1565
+ // src/analytics/events.ts
1566
+ var BUTTON_TYPE = {
1567
+ TRANSLATE: "translate",
1568
+ HIGHLIGHT: "highlight"
1569
+ };
1570
+ var ACTION = {
1571
+ CLICKED: "clicked"
1572
+ };
1573
+ function buildObject(pageContext, buttonType) {
1574
+ return `${pageContext}_${buttonType}_button`;
1575
+ }
1576
+ function buildEventKey(parts) {
1577
+ const { scope, tool, object, action } = parts;
1578
+ return `ux.web.feature.${scope}.${tool}.${object}.${action}`;
1579
+ }
1580
+ function buildAnalyticEvent(params) {
1581
+ const {
1582
+ scope,
1583
+ tool,
1584
+ pageContext,
1585
+ buttonType,
1586
+ baseProperties,
1587
+ action,
1588
+ additionalProperties
1589
+ } = params;
1590
+ const resolvedAction = action ?? ACTION.CLICKED;
1591
+ const object = buildObject(pageContext, buttonType);
1592
+ const key = buildEventKey({
1593
+ scope,
1594
+ tool,
1595
+ object,
1596
+ action: resolvedAction
1597
+ });
1598
+ const properties = {
1599
+ ...baseProperties,
1600
+ ...additionalProperties
1601
+ };
1602
+ return { key, properties };
1603
+ }
1604
+
1605
+ // src/hooks/useAIAnalytics.ts
1606
+ function useAIAnalytics() {
1607
+ const ctx = useContext2(AITranslationContext);
1608
+ if (!ctx) {
1609
+ throw new Error(
1610
+ "useAIAnalytics must be used inside an AITranslationProvider"
1611
+ );
1612
+ }
1613
+ const {
1614
+ locale,
1615
+ companyLocale,
1616
+ projectLocale,
1617
+ tool,
1618
+ page,
1619
+ scope,
1620
+ onTrackAnalyticsEvent
1621
+ } = ctx;
1622
+ const isTrackingEnabled = Boolean(onTrackAnalyticsEvent);
1623
+ const buildBaseProperties = useCallback2(() => {
1624
+ const props = {
1625
+ user_locale: locale,
1626
+ tool,
1627
+ page: page ?? ""
1628
+ };
1629
+ if (companyLocale) props.company_locale = companyLocale;
1630
+ if (projectLocale) props.project_locale = projectLocale;
1631
+ return props;
1632
+ }, [locale, tool, page, companyLocale, projectLocale]);
1633
+ const trackTranslateButtonClicked = useCallback2(
1634
+ (additionalProperties) => {
1635
+ if (!onTrackAnalyticsEvent || !page || !scope) return;
1636
+ onTrackAnalyticsEvent(
1637
+ buildAnalyticEvent({
1638
+ scope,
1639
+ tool,
1640
+ pageContext: page,
1641
+ buttonType: BUTTON_TYPE.TRANSLATE,
1642
+ baseProperties: buildBaseProperties(),
1643
+ additionalProperties
1644
+ })
1645
+ );
1646
+ },
1647
+ [onTrackAnalyticsEvent, tool, page, scope, buildBaseProperties]
1648
+ );
1649
+ const trackHighlightButtonClicked = useCallback2(
1650
+ (additionalProperties) => {
1651
+ if (!onTrackAnalyticsEvent || !page || !scope) return;
1652
+ onTrackAnalyticsEvent(
1653
+ buildAnalyticEvent({
1654
+ scope,
1655
+ tool,
1656
+ pageContext: page,
1657
+ buttonType: BUTTON_TYPE.HIGHLIGHT,
1658
+ baseProperties: buildBaseProperties(),
1659
+ additionalProperties
1660
+ })
1661
+ );
1662
+ },
1663
+ [onTrackAnalyticsEvent, tool, page, scope, buildBaseProperties]
1664
+ );
1665
+ const trackCustomEvent = useCallback2(
1666
+ (buttonType, action, additionalProperties) => {
1667
+ if (!onTrackAnalyticsEvent || !page || !scope) return;
1668
+ onTrackAnalyticsEvent(
1669
+ buildAnalyticEvent({
1670
+ scope,
1671
+ tool,
1672
+ pageContext: page,
1673
+ buttonType,
1674
+ baseProperties: buildBaseProperties(),
1675
+ action,
1676
+ additionalProperties
1677
+ })
1678
+ );
1679
+ },
1680
+ [onTrackAnalyticsEvent, tool, page, scope, buildBaseProperties]
1681
+ );
1682
+ return {
1683
+ trackTranslateButtonClicked,
1684
+ trackHighlightButtonClicked,
1685
+ trackCustomEvent,
1686
+ isTrackingEnabled
1687
+ };
1688
+ }
1689
+
1552
1690
  // src/components/AITranslateText.tsx
1553
1691
  import {
1554
1692
  useState as useState2,
1555
1693
  useEffect as useEffect2,
1556
- useContext as useContext2,
1557
- useCallback as useCallback2,
1694
+ useContext as useContext3,
1695
+ useCallback as useCallback3,
1558
1696
  useRef as useRef2
1559
1697
  } from "react";
1560
1698
 
@@ -1562,8 +1700,8 @@ import {
1562
1700
  import "react";
1563
1701
  import { jsx as jsx2 } from "react/jsx-runtime";
1564
1702
  var TranslatedIcon = ({
1565
- width = 14,
1566
- height = 14,
1703
+ width = 24,
1704
+ height = 24,
1567
1705
  className,
1568
1706
  color = "#000000"
1569
1707
  }) => {
@@ -1581,7 +1719,7 @@ var TranslatedIcon = ({
1581
1719
  "path",
1582
1720
  {
1583
1721
  fill: color,
1584
- d: "M12.87,15.07l-2.54,-2.51 0.03,-0.03c1.74,-1.94 2.98,-4.17 3.71,-6.53L17,6L17,4h-7L10,2L8,2v2L1,4v1.99h11.17C11.5,7.92 10.44,9.75 9,11.35 8.07,10.32 7.3,9.19 6.69,8h-2c0.73,1.63 1.73,3.17 2.98,4.56l-5.09,5.02L4,19l5,-5 3.11,3.11 0.76,-2.04zM18.5,10h-2L12,22h2l1.12,-3h4.75L21,22h2l-4.5,-12zM15.88,17l1.62,-4.33L19.12,17h-3.24z"
1722
+ d: "M11.99 2C6.47 2 2 6.48 2 12C2 17.52 6.47 22 11.99 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 11.99 2ZM18.92 8H15.97C15.65 6.75 15.19 5.55 14.59 4.44C16.43 5.07 17.96 6.35 18.92 8ZM12 4.04C12.83 5.24 13.48 6.57 13.91 8H10.09C10.52 6.57 11.17 5.24 12 4.04ZM4.26 14C4.1 13.36 4 12.69 4 12C4 11.31 4.1 10.64 4.26 10H7.64C7.56 10.66 7.5 11.32 7.5 12C7.5 12.68 7.56 13.34 7.64 14H4.26ZM5.08 16H8.03C8.35 17.25 8.81 18.45 9.41 19.56C7.57 18.93 6.04 17.66 5.08 16ZM8.03 8H5.08C6.04 6.34 7.57 5.07 9.41 4.44C8.81 5.55 8.35 6.75 8.03 8ZM12 19.96C11.17 18.76 10.52 17.43 10.09 16H13.91C13.48 17.43 12.83 18.76 12 19.96ZM14.34 14H9.66C9.57 13.34 9.5 12.68 9.5 12C9.5 11.32 9.57 10.65 9.66 10H14.34C14.43 10.65 14.5 11.32 14.5 12C14.5 12.68 14.43 13.34 14.34 14ZM14.59 19.56C15.19 18.45 15.65 17.25 15.97 16H18.92C17.96 17.65 16.43 18.93 14.59 19.56ZM16.36 14C16.44 13.34 16.5 12.68 16.5 12C16.5 11.32 16.44 10.66 16.36 10H19.74C19.9 10.64 20 11.31 20 12C20 12.69 19.9 13.36 19.74 14H16.36Z"
1585
1723
  }
1586
1724
  )
1587
1725
  }
@@ -1596,7 +1734,7 @@ var AITranslateText = ({
1596
1734
  showHighlight = false,
1597
1735
  translatedIconProps
1598
1736
  }) => {
1599
- const context = useContext2(AITranslationContext);
1737
+ const context = useContext3(AITranslationContext);
1600
1738
  const [displayText, setDisplayText] = useState2(text ?? "");
1601
1739
  const [showHighlightState, setShowHighlightState] = useState2(showHighlight);
1602
1740
  const eventHandlerRef = useRef2(null);
@@ -1619,7 +1757,7 @@ var AITranslateText = ({
1619
1757
  );
1620
1758
  return () => unsubscribe();
1621
1759
  }, [context, text, showHighlight]);
1622
- const reset = useCallback2(
1760
+ const reset = useCallback3(
1623
1761
  (displayValue = text) => {
1624
1762
  setDisplayText(displayValue);
1625
1763
  setShowHighlightState(false);
@@ -1677,10 +1815,16 @@ var getAITranslationLDId = (domain) => {
1677
1815
  }
1678
1816
  };
1679
1817
  export {
1818
+ ACTION,
1680
1819
  AITranslateText,
1681
1820
  AITranslationProvider,
1682
1821
  AI_TRANSLATION_FEATURE_FLAG_KEY,
1822
+ BUTTON_TYPE,
1823
+ buildAnalyticEvent,
1824
+ buildEventKey,
1825
+ buildObject,
1683
1826
  getAITranslationLDId,
1827
+ useAIAnalytics,
1684
1828
  useAITranslation,
1685
1829
  useConfig
1686
1830
  };
@@ -2,6 +2,35 @@ import * as _tanstack_react_query from '@tanstack/react-query';
2
2
  import * as react_jsx_runtime from 'react/jsx-runtime';
3
3
  import React, { ReactNode } from 'react';
4
4
 
5
+ /** Shape of an analytic event passed to the MFE's `onTrackAnalyticsEvent` callback. */
6
+ interface AnalyticEvent {
7
+ key: string;
8
+ properties: Record<string, unknown>;
9
+ }
10
+ /** Function provided by the MFE that sends the event to the analytics destination. */
11
+ type AIAnalyticsTracker = (event: AnalyticEvent) => void;
12
+ /** Feature scope: `'project'` for project-level tools, `'company'` for company-level tools. */
13
+ type Scope = 'project' | 'company';
14
+ /**
15
+ * Parts needed to build an event key following the pattern:
16
+ * `ux.web.feature.{scope}.{tool}.{object}.{action}`
17
+ */
18
+ interface EventKeyParts {
19
+ scope: Scope;
20
+ tool: string;
21
+ object: string;
22
+ action: string;
23
+ }
24
+ /** Standard properties included in every AI analytics event. */
25
+ interface AIAnalyticsEventProperties {
26
+ user_locale: string;
27
+ project_locale?: string;
28
+ company_locale?: string;
29
+ tool: string;
30
+ page: string;
31
+ [key: string]: unknown;
32
+ }
33
+
5
34
  interface TranslationProgress {
6
35
  /**
7
36
  * Progress percentage (0-100)
@@ -39,12 +68,22 @@ interface ModelDownloadProgress {
39
68
  interface AITranslationContextValue {
40
69
  ait: (text: string) => Promise<string>;
41
70
  locale: string;
71
+ /** Company-level locale from environment metadata (e.g. `"de-DE"`). */
72
+ companyLocale?: string;
73
+ /** Project-level locale from environment metadata (e.g. `"fr-CA"`). */
74
+ projectLocale?: string;
42
75
  renderVersion?: number;
43
76
  /** Batch-translation progress; `null` while the queue is idle. */
44
77
  translationProgress: TranslationProgress | null;
45
78
  /** Chrome AI model download progress; `null` until a download begins. */
46
79
  modelDownloadProgress: ModelDownloadProgress | null;
47
80
  tool: string;
81
+ /** Called by `useAIAnalytics` with a fully assembled event. The MFE is responsible for sending it. */
82
+ onTrackAnalyticsEvent?: AIAnalyticsTracker;
83
+ /** Page context used to build the event key object segment (e.g. `'view'`, `'list_column_description'`). */
84
+ page?: string;
85
+ /** Feature scope: `'project'` or `'company'`. */
86
+ scope?: Scope;
48
87
  }
49
88
 
50
89
  interface ConfigurationResponse {
@@ -117,6 +156,59 @@ declare function useConfig(toolName: string, options?: UseConfigOptions): _tanst
117
156
  */
118
157
  declare function useAITranslation(): AITranslationContextValue;
119
158
 
159
+ /** Button type identifiers for the event key `object` segment. */
160
+ declare const BUTTON_TYPE: {
161
+ readonly TRANSLATE: "translate";
162
+ readonly HIGHLIGHT: "highlight";
163
+ };
164
+ type ButtonType = (typeof BUTTON_TYPE)[keyof typeof BUTTON_TYPE];
165
+ /** Action identifiers for the event key `action` segment. */
166
+ declare const ACTION: {
167
+ readonly CLICKED: "clicked";
168
+ };
169
+ type Action = (typeof ACTION)[keyof typeof ACTION];
170
+ /**
171
+ * Builds the `object` segment: `{pageContext}_{buttonType}_button`
172
+ * e.g. `buildObject('view', 'translate')` → `'view_translate_button'`
173
+ */
174
+ declare function buildObject(pageContext: string, buttonType: ButtonType): string;
175
+ /**
176
+ * Builds a fully-qualified event key:
177
+ * `ux.web.feature.{scope}.{tool}.{object}.{action}`
178
+ */
179
+ declare function buildEventKey(parts: EventKeyParts): string;
180
+ interface BuildAnalyticEventParams {
181
+ scope: Scope;
182
+ tool: string;
183
+ /** Prefix for the object segment, matches the Provider `page` prop (e.g. `'view'`). */
184
+ pageContext: string;
185
+ buttonType: ButtonType;
186
+ baseProperties: AIAnalyticsEventProperties;
187
+ /** Defaults to `'clicked'` if omitted. */
188
+ action?: Action;
189
+ additionalProperties?: Record<string, unknown>;
190
+ }
191
+ /** Assembles a complete `AnalyticEvent` (key + merged properties) ready for `onTrackAnalyticsEvent`. */
192
+ declare function buildAnalyticEvent(params: BuildAnalyticEventParams): AnalyticEvent;
193
+
194
+ interface UseAIAnalyticsReturn {
195
+ /** Fires `ux.web.feature.{scope}.{tool}.{page}_translate_button.clicked`. */
196
+ trackTranslateButtonClicked: (additionalProperties?: Record<string, unknown>) => void;
197
+ /** Fires `ux.web.feature.{scope}.{tool}.{page}_highlight_button.clicked`. */
198
+ trackHighlightButtonClicked: (additionalProperties?: Record<string, unknown>) => void;
199
+ /** Generic tracking for custom button types or actions. */
200
+ trackCustomEvent: (buttonType: ButtonType | string, action?: Action | string, additionalProperties?: Record<string, unknown>) => void;
201
+ /** `true` when `onTrackAnalyticsEvent` was provided to `AITranslationProvider`. */
202
+ isTrackingEnabled: boolean;
203
+ }
204
+ /**
205
+ * Returns analytics tracking helpers pre-wired to the Provider context.
206
+ * All functions no-op if `onTrackAnalyticsEvent` was not supplied.
207
+ *
208
+ * @throws if called outside of an `AITranslationProvider`.
209
+ */
210
+ declare function useAIAnalytics(): UseAIAnalyticsReturn;
211
+
120
212
  interface AITranslationProviderProps {
121
213
  children: ReactNode;
122
214
  locale: string;
@@ -125,6 +217,16 @@ interface AITranslationProviderProps {
125
217
  userId: number;
126
218
  projectId: number;
127
219
  enableAIT?: boolean;
220
+ /** Company-level locale from environment metadata (e.g. `"de-DE"`). Passed through to context for downstream consumers such as Amplitude. */
221
+ companyLocale?: string;
222
+ /** Project-level locale from environment metadata (e.g. `"fr-CA"`). Passed through to context for downstream consumers such as Amplitude. */
223
+ projectLocale?: string;
224
+ /** Called by `useAIAnalytics` with a pre-assembled event. The MFE sends it to the analytics API. */
225
+ onTrackAnalyticsEvent?: AIAnalyticsTracker;
226
+ /** Page context for the event key object segment (e.g. `'view'`, `'list_column_description'`). */
227
+ page?: string;
228
+ /** Feature scope: `'project'` or `'company'`. */
229
+ scope?: Scope;
128
230
  }
129
231
  declare function AITranslationProvider(props: AITranslationProviderProps): react_jsx_runtime.JSX.Element;
130
232
 
@@ -177,4 +279,4 @@ declare global {
177
279
  var _BACKEND_AI_TRANSLATION_IN_PROGRESS_: boolean;
178
280
  }
179
281
 
180
- export { AITranslateText, type AITranslateTextProps, AITranslationProvider, AI_TRANSLATION_FEATURE_FLAG_KEY, type TranslatedIconProps, type UseConfigOptions, getAITranslationLDId, useAITranslation, useConfig };
282
+ export { ACTION, type AIAnalyticsEventProperties, type AIAnalyticsTracker, AITranslateText, type AITranslateTextProps, AITranslationProvider, AI_TRANSLATION_FEATURE_FLAG_KEY, type Action, type AnalyticEvent, BUTTON_TYPE, type BuildAnalyticEventParams, type ButtonType, type EventKeyParts, type Scope, type TranslatedIconProps, type UseAIAnalyticsReturn, type UseConfigOptions, buildAnalyticEvent, buildEventKey, buildObject, getAITranslationLDId, useAIAnalytics, useAITranslation, useConfig };