@eric-emg/symphiq-components 1.2.89 → 1.2.91

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.
Files changed (6) hide show
  1. package/fesm2022/symphiq-components.mjs +1171 -379
  2. package/fesm2022/symphiq-components.mjs.map +1 -1
  3. package/index.d.ts +134 -31
  4. package/index.d.ts.map +1 -1
  5. package/package.json +2 -2
  6. package/styles.css +58 -14
package/fesm2022/symphiq-components.mjs CHANGED
@@ -1720,12 +1720,15 @@ class CompetitiveScoreService {
1720
1720
  }]
1721
1721
  }], null, null); })();
1722
1722
 
1723
- const _forTrack0$6 = ($index, $item) => $item.category;
1723
+ const _forTrack0$8 = ($index, $item) => $item.category;
1724
1724
  function CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_12_Template(rf, ctx) { if (rf & 1) {
1725
- i0.ɵɵelementStart(0, "div", 12);
1726
- i0.ɵɵelement(1, "div", 33);
1727
- i0.ɵɵelementStart(2, "span", 34);
1725
+ i0.ɵɵelementStart(0, "div", 13);
1726
+ i0.ɵɵelement(1, "div", 35);
1727
+ i0.ɵɵelementStart(2, "span", 36);
1728
1728
  i0.ɵɵtext(3);
1729
+ i0.ɵɵelementEnd();
1730
+ i0.ɵɵelementStart(4, "span", 37);
1731
+ i0.ɵɵtext(5, "Leading");
1729
1732
  i0.ɵɵelementEnd()();
1730
1733
  } if (rf & 2) {
1731
1734
  const category_r3 = i0.ɵɵnextContext().$implicit;
@@ -1736,12 +1739,17 @@ function CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional
1736
1739
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-emerald-600" : "text-emerald-400");
1737
1740
  i0.ɵɵadvance();
1738
1741
  i0.ɵɵtextInterpolate(category_r3.leading);
1742
+ i0.ɵɵadvance();
1743
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-emerald-600" : "text-emerald-500");
1739
1744
  } }
1740
1745
  function CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_13_Template(rf, ctx) { if (rf & 1) {
1741
- i0.ɵɵelementStart(0, "div", 12);
1742
- i0.ɵɵelement(1, "div", 33);
1743
- i0.ɵɵelementStart(2, "span", 34);
1746
+ i0.ɵɵelementStart(0, "div", 13);
1747
+ i0.ɵɵelement(1, "div", 35);
1748
+ i0.ɵɵelementStart(2, "span", 36);
1744
1749
  i0.ɵɵtext(3);
1750
+ i0.ɵɵelementEnd();
1751
+ i0.ɵɵelementStart(4, "span", 37);
1752
+ i0.ɵɵtext(5, "Competitive");
1745
1753
  i0.ɵɵelementEnd()();
1746
1754
  } if (rf & 2) {
1747
1755
  const category_r3 = i0.ɵɵnextContext().$implicit;
@@ -1752,12 +1760,17 @@ function CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional
1752
1760
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-blue-600" : "text-blue-400");
1753
1761
  i0.ɵɵadvance();
1754
1762
  i0.ɵɵtextInterpolate(category_r3.competitive);
1763
+ i0.ɵɵadvance();
1764
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-blue-600" : "text-blue-500");
1755
1765
  } }
1756
1766
  function CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_14_Template(rf, ctx) { if (rf & 1) {
1757
- i0.ɵɵelementStart(0, "div", 12);
1767
+ i0.ɵɵelementStart(0, "div", 34);
1758
1768
  i0.ɵɵelement(1, "div", 35);
1759
1769
  i0.ɵɵelementStart(2, "span", 36);
1760
1770
  i0.ɵɵtext(3);
1771
+ i0.ɵɵelementEnd();
1772
+ i0.ɵɵelementStart(4, "span", 37);
1773
+ i0.ɵɵtext(5, "Lagging");
1761
1774
  i0.ɵɵelementEnd()();
1762
1775
  } if (rf & 2) {
1763
1776
  const category_r3 = i0.ɵɵnextContext().$implicit;
@@ -1768,28 +1781,30 @@ function CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional
1768
1781
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-orange-600" : "text-orange-400");
1769
1782
  i0.ɵɵadvance();
1770
1783
  i0.ɵɵtextInterpolate(category_r3.lagging);
1784
+ i0.ɵɵadvance();
1785
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-orange-600" : "text-orange-500");
1771
1786
  } }
1772
1787
  function CompetitivePositioningSummaryComponent_Conditional_1_For_43_Template(rf, ctx) { if (rf & 1) {
1773
- i0.ɵɵelementStart(0, "div", 24)(1, "div", 29)(2, "div", 4);
1774
- i0.ɵɵelement(3, "div", 30);
1775
- i0.ɵɵelementStart(4, "span", 31);
1788
+ i0.ɵɵelementStart(0, "div", 25)(1, "div", 30)(2, "div", 4);
1789
+ i0.ɵɵelement(3, "div", 31);
1790
+ i0.ɵɵelementStart(4, "span", 32);
1776
1791
  i0.ɵɵtext(5);
1777
1792
  i0.ɵɵelementEnd()();
1778
- i0.ɵɵelementStart(6, "div", 12)(7, "span", 32);
1793
+ i0.ɵɵelementStart(6, "div", 13)(7, "span", 33);
1779
1794
  i0.ɵɵtext(8);
1780
1795
  i0.ɵɵelementEnd();
1781
- i0.ɵɵelementStart(9, "span", 32);
1796
+ i0.ɵɵelementStart(9, "span", 33);
1782
1797
  i0.ɵɵtext(10, "metrics");
1783
1798
  i0.ɵɵelementEnd()()();
1784
1799
  i0.ɵɵelementStart(11, "div", 4);
1785
- i0.ɵɵconditionalCreate(12, CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_12_Template, 4, 3, "div", 12);
1786
- i0.ɵɵconditionalCreate(13, CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_13_Template, 4, 3, "div", 12);
1787
- i0.ɵɵconditionalCreate(14, CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_14_Template, 4, 3, "div", 12);
1800
+ i0.ɵɵconditionalCreate(12, CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_12_Template, 6, 4, "div", 13);
1801
+ i0.ɵɵconditionalCreate(13, CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_13_Template, 6, 4, "div", 13);
1802
+ i0.ɵɵconditionalCreate(14, CompetitivePositioningSummaryComponent_Conditional_1_For_43_Conditional_14_Template, 6, 4, "div", 34);
1788
1803
  i0.ɵɵelementEnd()();
1789
1804
  } if (rf & 2) {
1790
1805
  const category_r3 = ctx.$implicit;
1791
1806
  const ctx_r1 = i0.ɵɵnextContext(2);
1792
- i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-slate-50" : "bg-slate-800/50");
1807
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-slate-50 hover:bg-slate-100" : "bg-slate-800/50 hover:bg-slate-800")("libSymphiqTooltip", ctx_r1.getFunnelStageTooltip(category_r3.category))("tooltipPosition", "auto");
1793
1808
  i0.ɵɵadvance(3);
1794
1809
  i0.ɵɵproperty("innerHTML", category_r3.icon, i0.ɵɵsanitizeHtml);
1795
1810
  i0.ɵɵadvance();
@@ -1826,49 +1841,49 @@ function CompetitivePositioningSummaryComponent_Conditional_1_Template(rf, ctx)
1826
1841
  i0.ɵɵelementStart(9, "p", 9);
1827
1842
  i0.ɵɵtext(10);
1828
1843
  i0.ɵɵelementEnd();
1829
- i0.ɵɵelementStart(11, "div", 10)(12, "div", 4);
1830
- i0.ɵɵelement(13, "div", 11);
1831
- i0.ɵɵelementStart(14, "div", 12)(15, "span", 13);
1844
+ i0.ɵɵelementStart(11, "div", 10)(12, "div", 11);
1845
+ i0.ɵɵelement(13, "div", 12);
1846
+ i0.ɵɵelementStart(14, "div", 13)(15, "span", 14);
1832
1847
  i0.ɵɵtext(16);
1833
1848
  i0.ɵɵelementEnd();
1834
- i0.ɵɵelementStart(17, "span", 14);
1849
+ i0.ɵɵelementStart(17, "span", 15);
1835
1850
  i0.ɵɵtext(18, "Leading");
1836
1851
  i0.ɵɵelementEnd()()();
1837
- i0.ɵɵelementStart(19, "div", 4);
1838
- i0.ɵɵelement(20, "div", 11);
1839
- i0.ɵɵelementStart(21, "div", 12)(22, "span", 13);
1852
+ i0.ɵɵelementStart(19, "div", 11);
1853
+ i0.ɵɵelement(20, "div", 12);
1854
+ i0.ɵɵelementStart(21, "div", 13)(22, "span", 14);
1840
1855
  i0.ɵɵtext(23);
1841
1856
  i0.ɵɵelementEnd();
1842
- i0.ɵɵelementStart(24, "span", 14);
1857
+ i0.ɵɵelementStart(24, "span", 15);
1843
1858
  i0.ɵɵtext(25, "Competitive");
1844
1859
  i0.ɵɵelementEnd()()();
1845
- i0.ɵɵelementStart(26, "div", 4);
1846
- i0.ɵɵelement(27, "div", 15);
1847
- i0.ɵɵelementStart(28, "div", 12)(29, "span", 16);
1860
+ i0.ɵɵelementStart(26, "div", 11);
1861
+ i0.ɵɵelement(27, "div", 16);
1862
+ i0.ɵɵelementStart(28, "div", 13)(29, "span", 17);
1848
1863
  i0.ɵɵtext(30);
1849
1864
  i0.ɵɵelementEnd();
1850
- i0.ɵɵelementStart(31, "span", 14);
1865
+ i0.ɵɵelementStart(31, "span", 15);
1851
1866
  i0.ɵɵtext(32, "Lagging");
1852
1867
  i0.ɵɵelementEnd()()()();
1853
- i0.ɵɵelementStart(33, "div", 17)(34, "button", 18);
1868
+ i0.ɵɵelementStart(33, "div", 18)(34, "button", 19);
1854
1869
  i0.ɵɵlistener("click", function CompetitivePositioningSummaryComponent_Conditional_1_Template_button_click_34_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.isExpanded.set(!ctx_r1.isExpanded())); });
1855
1870
  i0.ɵɵelementStart(35, "span");
1856
1871
  i0.ɵɵtext(36, "By Funnel Stage");
1857
1872
  i0.ɵɵelementEnd();
1858
1873
  i0.ɵɵnamespaceSVG();
1859
- i0.ɵɵelementStart(37, "svg", 19);
1860
- i0.ɵɵelement(38, "path", 20);
1874
+ i0.ɵɵelementStart(37, "svg", 20);
1875
+ i0.ɵɵelement(38, "path", 21);
1861
1876
  i0.ɵɵelementEnd()();
1862
1877
  i0.ɵɵnamespaceHTML();
1863
- i0.ɵɵelementStart(39, "div", 21)(40, "div", 22)(41, "div", 23);
1864
- i0.ɵɵrepeaterCreate(42, CompetitivePositioningSummaryComponent_Conditional_1_For_43_Template, 15, 10, "div", 24, _forTrack0$6);
1878
+ i0.ɵɵelementStart(39, "div", 22)(40, "div", 23)(41, "div", 24);
1879
+ i0.ɵɵrepeaterCreate(42, CompetitivePositioningSummaryComponent_Conditional_1_For_43_Template, 15, 12, "div", 25, _forTrack0$8);
1865
1880
  i0.ɵɵelementEnd()()()();
1866
- i0.ɵɵelementStart(44, "div", 25)(45, "button", 26);
1881
+ i0.ɵɵelementStart(44, "div", 26)(45, "button", 27);
1867
1882
  i0.ɵɵlistener("click", function CompetitivePositioningSummaryComponent_Conditional_1_Template_button_click_45_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.scrollToCompetitive.emit()); });
1868
1883
  i0.ɵɵtext(46, " View More ");
1869
1884
  i0.ɵɵnamespaceSVG();
1870
- i0.ɵɵelementStart(47, "svg", 27);
1871
- i0.ɵɵelement(48, "path", 28);
1885
+ i0.ɵɵelementStart(47, "svg", 28);
1886
+ i0.ɵɵelement(48, "path", 29);
1872
1887
  i0.ɵɵelementEnd()()()();
1873
1888
  } if (rf & 2) {
1874
1889
  const ctx_r1 = i0.ɵɵnextContext();
@@ -1885,7 +1900,9 @@ function CompetitivePositioningSummaryComponent_Conditional_1_Template(rf, ctx)
1885
1900
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-slate-600" : "text-slate-400");
1886
1901
  i0.ɵɵadvance();
1887
1902
  i0.ɵɵtextInterpolate1(" ", ctx_r1.narrativeSummary(), " ");
1888
- i0.ɵɵadvance(3);
1903
+ i0.ɵɵadvance(2);
1904
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r1.leadingTooltip())("tooltipPosition", "bottom");
1905
+ i0.ɵɵadvance();
1889
1906
  i0.ɵɵproperty("ngClass", ctx_r1.getScoreDotClass("leading"));
1890
1907
  i0.ɵɵadvance(2);
1891
1908
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-emerald-700" : "text-emerald-400");
@@ -1893,7 +1910,9 @@ function CompetitivePositioningSummaryComponent_Conditional_1_Template(rf, ctx)
1893
1910
  i0.ɵɵtextInterpolate(ctx_r1.competitiveStats().leading);
1894
1911
  i0.ɵɵadvance();
1895
1912
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-emerald-600" : "text-emerald-500");
1896
- i0.ɵɵadvance(3);
1913
+ i0.ɵɵadvance(2);
1914
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r1.competitiveTooltip())("tooltipPosition", "bottom");
1915
+ i0.ɵɵadvance();
1897
1916
  i0.ɵɵproperty("ngClass", ctx_r1.getScoreDotClass("competitive"));
1898
1917
  i0.ɵɵadvance(2);
1899
1918
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-blue-700" : "text-blue-400");
@@ -1901,7 +1920,9 @@ function CompetitivePositioningSummaryComponent_Conditional_1_Template(rf, ctx)
1901
1920
  i0.ɵɵtextInterpolate(ctx_r1.competitiveStats().competitive);
1902
1921
  i0.ɵɵadvance();
1903
1922
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-blue-600" : "text-blue-500");
1904
- i0.ɵɵadvance(3);
1923
+ i0.ɵɵadvance(2);
1924
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r1.laggingTooltip())("tooltipPosition", "bottom");
1925
+ i0.ɵɵadvance();
1905
1926
  i0.ɵɵproperty("ngClass", ctx_r1.getScoreDotClass("lagging"));
1906
1927
  i0.ɵɵadvance(2);
1907
1928
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-orange-700" : "text-orange-400");
@@ -1923,10 +1944,13 @@ function CompetitivePositioningSummaryComponent_Conditional_1_Template(rf, ctx)
1923
1944
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-indigo-600 hover:text-indigo-700 hover:bg-indigo-50" : "text-indigo-400 hover:text-indigo-300 hover:bg-indigo-500/10");
1924
1945
  } }
1925
1946
  function CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_9_Template(rf, ctx) { if (rf & 1) {
1926
- i0.ɵɵelementStart(0, "div", 12);
1927
- i0.ɵɵelement(1, "div", 54);
1928
- i0.ɵɵelementStart(2, "span", 34);
1947
+ i0.ɵɵelementStart(0, "div", 13);
1948
+ i0.ɵɵelement(1, "div", 56);
1949
+ i0.ɵɵelementStart(2, "span", 36);
1929
1950
  i0.ɵɵtext(3);
1951
+ i0.ɵɵelementEnd();
1952
+ i0.ɵɵelementStart(4, "span", 57);
1953
+ i0.ɵɵtext(5, "Leading");
1930
1954
  i0.ɵɵelementEnd()();
1931
1955
  } if (rf & 2) {
1932
1956
  const category_r5 = i0.ɵɵnextContext().$implicit;
@@ -1937,12 +1961,17 @@ function CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional
1937
1961
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-emerald-600" : "text-emerald-400");
1938
1962
  i0.ɵɵadvance();
1939
1963
  i0.ɵɵtextInterpolate(category_r5.leading);
1964
+ i0.ɵɵadvance();
1965
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-emerald-600" : "text-emerald-500");
1940
1966
  } }
1941
1967
  function CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_10_Template(rf, ctx) { if (rf & 1) {
1942
- i0.ɵɵelementStart(0, "div", 12);
1943
- i0.ɵɵelement(1, "div", 54);
1944
- i0.ɵɵelementStart(2, "span", 34);
1968
+ i0.ɵɵelementStart(0, "div", 13);
1969
+ i0.ɵɵelement(1, "div", 56);
1970
+ i0.ɵɵelementStart(2, "span", 36);
1945
1971
  i0.ɵɵtext(3);
1972
+ i0.ɵɵelementEnd();
1973
+ i0.ɵɵelementStart(4, "span", 57);
1974
+ i0.ɵɵtext(5, "Competitive");
1946
1975
  i0.ɵɵelementEnd()();
1947
1976
  } if (rf & 2) {
1948
1977
  const category_r5 = i0.ɵɵnextContext().$implicit;
@@ -1953,12 +1982,17 @@ function CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional
1953
1982
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-blue-600" : "text-blue-400");
1954
1983
  i0.ɵɵadvance();
1955
1984
  i0.ɵɵtextInterpolate(category_r5.competitive);
1985
+ i0.ɵɵadvance();
1986
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-blue-600" : "text-blue-500");
1956
1987
  } }
1957
1988
  function CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_11_Template(rf, ctx) { if (rf & 1) {
1958
- i0.ɵɵelementStart(0, "div", 12);
1959
- i0.ɵɵelement(1, "div", 55);
1989
+ i0.ɵɵelementStart(0, "div", 34);
1990
+ i0.ɵɵelement(1, "div", 56);
1960
1991
  i0.ɵɵelementStart(2, "span", 36);
1961
1992
  i0.ɵɵtext(3);
1993
+ i0.ɵɵelementEnd();
1994
+ i0.ɵɵelementStart(4, "span", 57);
1995
+ i0.ɵɵtext(5, "Lagging");
1962
1996
  i0.ɵɵelementEnd()();
1963
1997
  } if (rf & 2) {
1964
1998
  const category_r5 = i0.ɵɵnextContext().$implicit;
@@ -1969,25 +2003,27 @@ function CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional
1969
2003
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-orange-600" : "text-orange-400");
1970
2004
  i0.ɵɵadvance();
1971
2005
  i0.ɵɵtextInterpolate(category_r5.lagging);
2006
+ i0.ɵɵadvance();
2007
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-orange-600" : "text-orange-500");
1972
2008
  } }
1973
2009
  function CompetitivePositioningSummaryComponent_Conditional_2_For_32_Template(rf, ctx) { if (rf & 1) {
1974
- i0.ɵɵelementStart(0, "div", 48)(1, "div", 51)(2, "div", 4);
1975
- i0.ɵɵelement(3, "div", 52);
1976
- i0.ɵɵelementStart(4, "span", 53);
2010
+ i0.ɵɵelementStart(0, "div", 49)(1, "div", 52)(2, "div", 4);
2011
+ i0.ɵɵelement(3, "div", 53);
2012
+ i0.ɵɵelementStart(4, "span", 54);
1977
2013
  i0.ɵɵtext(5);
1978
2014
  i0.ɵɵelementEnd()();
1979
- i0.ɵɵelementStart(6, "span", 32);
2015
+ i0.ɵɵelementStart(6, "span", 33);
1980
2016
  i0.ɵɵtext(7);
1981
2017
  i0.ɵɵelementEnd()();
1982
- i0.ɵɵelementStart(8, "div", 4);
1983
- i0.ɵɵconditionalCreate(9, CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_9_Template, 4, 3, "div", 12);
1984
- i0.ɵɵconditionalCreate(10, CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_10_Template, 4, 3, "div", 12);
1985
- i0.ɵɵconditionalCreate(11, CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_11_Template, 4, 3, "div", 12);
2018
+ i0.ɵɵelementStart(8, "div", 55);
2019
+ i0.ɵɵconditionalCreate(9, CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_9_Template, 6, 4, "div", 13);
2020
+ i0.ɵɵconditionalCreate(10, CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_10_Template, 6, 4, "div", 13);
2021
+ i0.ɵɵconditionalCreate(11, CompetitivePositioningSummaryComponent_Conditional_2_For_32_Conditional_11_Template, 6, 4, "div", 34);
1986
2022
  i0.ɵɵelementEnd()();
1987
2023
  } if (rf & 2) {
1988
2024
  const category_r5 = ctx.$implicit;
1989
2025
  const ctx_r1 = i0.ɵɵnextContext(2);
1990
- i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-slate-50 hover:bg-slate-100" : "bg-slate-800/50 hover:bg-slate-800");
2026
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-slate-50 hover:bg-slate-100" : "bg-slate-800/50 hover:bg-slate-800")("libSymphiqTooltip", ctx_r1.getFunnelStageTooltip(category_r5.category))("tooltipPosition", "right");
1991
2027
  i0.ɵɵadvance(3);
1992
2028
  i0.ɵɵproperty("innerHTML", category_r5.icon, i0.ɵɵsanitizeHtml);
1993
2029
  i0.ɵɵadvance();
@@ -2007,50 +2043,50 @@ function CompetitivePositioningSummaryComponent_Conditional_2_For_32_Template(rf
2007
2043
  } }
2008
2044
  function CompetitivePositioningSummaryComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
2009
2045
  const _r4 = i0.ɵɵgetCurrentView();
2010
- i0.ɵɵelementStart(0, "div", 2)(1, "div", 37)(2, "div")(3, "div", 38);
2046
+ i0.ɵɵelementStart(0, "div", 2)(1, "div", 38)(2, "div")(3, "div", 39);
2011
2047
  i0.ɵɵnamespaceSVG();
2012
- i0.ɵɵelementStart(4, "svg", 39);
2048
+ i0.ɵɵelementStart(4, "svg", 40);
2013
2049
  i0.ɵɵelement(5, "path", 6);
2014
2050
  i0.ɵɵelementEnd();
2015
2051
  i0.ɵɵnamespaceHTML();
2016
- i0.ɵɵelementStart(6, "h3", 40);
2052
+ i0.ɵɵelementStart(6, "h3", 41);
2017
2053
  i0.ɵɵtext(7, "Competitive Positioning");
2018
2054
  i0.ɵɵelementEnd()()();
2019
- i0.ɵɵelementStart(8, "div", 41);
2055
+ i0.ɵɵelementStart(8, "div", 42);
2020
2056
  i0.ɵɵtext(9);
2021
2057
  i0.ɵɵelementEnd()();
2022
2058
  i0.ɵɵelementStart(10, "p", 9);
2023
2059
  i0.ɵɵtext(11);
2024
2060
  i0.ɵɵelementEnd();
2025
- i0.ɵɵelementStart(12, "div", 42)(13, "div", 43)(14, "div", 44);
2061
+ i0.ɵɵelementStart(12, "div", 43)(13, "div", 44)(14, "div", 45);
2026
2062
  i0.ɵɵtext(15);
2027
2063
  i0.ɵɵelementEnd();
2028
- i0.ɵɵelementStart(16, "div", 45);
2064
+ i0.ɵɵelementStart(16, "div", 46);
2029
2065
  i0.ɵɵtext(17, "Leading");
2030
2066
  i0.ɵɵelementEnd()();
2031
- i0.ɵɵelementStart(18, "div", 43)(19, "div", 44);
2067
+ i0.ɵɵelementStart(18, "div", 44)(19, "div", 45);
2032
2068
  i0.ɵɵtext(20);
2033
2069
  i0.ɵɵelementEnd();
2034
- i0.ɵɵelementStart(21, "div", 45);
2070
+ i0.ɵɵelementStart(21, "div", 46);
2035
2071
  i0.ɵɵtext(22, "Competitive");
2036
2072
  i0.ɵɵelementEnd()();
2037
- i0.ɵɵelementStart(23, "div", 43)(24, "div", 44);
2073
+ i0.ɵɵelementStart(23, "div", 44)(24, "div", 45);
2038
2074
  i0.ɵɵtext(25);
2039
2075
  i0.ɵɵelementEnd();
2040
- i0.ɵɵelementStart(26, "div", 45);
2076
+ i0.ɵɵelementStart(26, "div", 46);
2041
2077
  i0.ɵɵtext(27, "Lagging");
2042
2078
  i0.ɵɵelementEnd()()();
2043
- i0.ɵɵelementStart(28, "div", 46)(29, "h4", 47);
2079
+ i0.ɵɵelementStart(28, "div", 47)(29, "h4", 48);
2044
2080
  i0.ɵɵtext(30, "By Funnel Stage");
2045
2081
  i0.ɵɵelementEnd();
2046
- i0.ɵɵrepeaterCreate(31, CompetitivePositioningSummaryComponent_Conditional_2_For_32_Template, 12, 9, "div", 48, _forTrack0$6);
2082
+ i0.ɵɵrepeaterCreate(31, CompetitivePositioningSummaryComponent_Conditional_2_For_32_Template, 12, 11, "div", 49, _forTrack0$8);
2047
2083
  i0.ɵɵelementEnd();
2048
- i0.ɵɵelementStart(33, "div", 25)(34, "button", 49);
2084
+ i0.ɵɵelementStart(33, "div", 26)(34, "button", 50);
2049
2085
  i0.ɵɵlistener("click", function CompetitivePositioningSummaryComponent_Conditional_2_Template_button_click_34_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.scrollToCompetitive.emit()); });
2050
2086
  i0.ɵɵtext(35, " View More ");
2051
2087
  i0.ɵɵnamespaceSVG();
2052
- i0.ɵɵelementStart(36, "svg", 50);
2053
- i0.ɵɵelement(37, "path", 28);
2088
+ i0.ɵɵelementStart(36, "svg", 51);
2089
+ i0.ɵɵelement(37, "path", 29);
2054
2090
  i0.ɵɵelementEnd()()()();
2055
2091
  } if (rf & 2) {
2056
2092
  const ctx_r1 = i0.ɵɵnextContext();
@@ -2068,7 +2104,7 @@ function CompetitivePositioningSummaryComponent_Conditional_2_Template(rf, ctx)
2068
2104
  i0.ɵɵadvance();
2069
2105
  i0.ɵɵtextInterpolate1(" ", ctx_r1.narrativeSummary(), " ");
2070
2106
  i0.ɵɵadvance(2);
2071
- i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-emerald-50 border-emerald-200" : "bg-emerald-500/10 border-emerald-500/20");
2107
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-emerald-50 border-emerald-200" : "bg-emerald-500/10 border-emerald-500/20")("libSymphiqTooltip", ctx_r1.leadingTooltip())("tooltipPosition", "bottom");
2072
2108
  i0.ɵɵadvance();
2073
2109
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-emerald-700" : "text-emerald-400");
2074
2110
  i0.ɵɵadvance();
@@ -2076,7 +2112,7 @@ function CompetitivePositioningSummaryComponent_Conditional_2_Template(rf, ctx)
2076
2112
  i0.ɵɵadvance();
2077
2113
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-emerald-600" : "text-emerald-500");
2078
2114
  i0.ɵɵadvance(2);
2079
- i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-blue-50 border-blue-200" : "bg-blue-500/10 border-blue-500/20");
2115
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-blue-50 border-blue-200" : "bg-blue-500/10 border-blue-500/20")("libSymphiqTooltip", ctx_r1.competitiveTooltip())("tooltipPosition", "bottom");
2080
2116
  i0.ɵɵadvance();
2081
2117
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-blue-700" : "text-blue-400");
2082
2118
  i0.ɵɵadvance();
@@ -2084,7 +2120,7 @@ function CompetitivePositioningSummaryComponent_Conditional_2_Template(rf, ctx)
2084
2120
  i0.ɵɵadvance();
2085
2121
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-blue-600" : "text-blue-500");
2086
2122
  i0.ɵɵadvance(2);
2087
- i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-orange-50 border-orange-200" : "bg-orange-500/10 border-orange-500/20");
2123
+ i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "bg-orange-50 border-orange-200" : "bg-orange-500/10 border-orange-500/20")("libSymphiqTooltip", ctx_r1.laggingTooltip())("tooltipPosition", "bottom");
2088
2124
  i0.ɵɵadvance();
2089
2125
  i0.ɵɵproperty("ngClass", ctx_r1.isLightMode() ? "text-orange-700" : "text-orange-400");
2090
2126
  i0.ɵɵadvance();
@@ -2245,6 +2281,30 @@ class CompetitivePositioningSummaryComponent {
2245
2281
  keyOpportunities
2246
2282
  };
2247
2283
  }, ...(ngDevMode ? [{ debugName: "competitiveScoreTooltip" }] : []));
2284
+ this.leadingTooltip = computed(() => {
2285
+ const metrics = this.getMetricsByStatus('LEADING');
2286
+ return {
2287
+ status: 'LEADING',
2288
+ statusDescription: 'Metrics where your performance exceeds industry benchmarks, indicating strong competitive advantage.',
2289
+ metrics: metrics.map(m => this.extractMetricTooltipData(m))
2290
+ };
2291
+ }, ...(ngDevMode ? [{ debugName: "leadingTooltip" }] : []));
2292
+ this.competitiveTooltip = computed(() => {
2293
+ const metrics = this.getMetricsByStatus('COMPETITIVE');
2294
+ return {
2295
+ status: 'COMPETITIVE',
2296
+ statusDescription: 'Metrics where your performance is within the industry benchmark range, showing competitive parity.',
2297
+ metrics: metrics.map(m => this.extractMetricTooltipData(m))
2298
+ };
2299
+ }, ...(ngDevMode ? [{ debugName: "competitiveTooltip" }] : []));
2300
+ this.laggingTooltip = computed(() => {
2301
+ const metrics = this.getMetricsByStatus('LAGGING');
2302
+ return {
2303
+ status: 'LAGGING',
2304
+ statusDescription: 'Metrics where your performance falls below industry benchmarks, representing opportunities for improvement.',
2305
+ metrics: metrics.map(m => this.extractMetricTooltipData(m))
2306
+ };
2307
+ }, ...(ngDevMode ? [{ debugName: "laggingTooltip" }] : []));
2248
2308
  }
2249
2309
  getHealthScoreBadgeClass() {
2250
2310
  const score = this.competitiveStats().healthScore;
@@ -2278,10 +2338,75 @@ class CompetitivePositioningSummaryComponent {
2278
2338
  formatCategoryName(category) {
2279
2339
  return category.replace(/_/g, ' ').toLowerCase().replace(/\b\w/g, l => l.toUpperCase());
2280
2340
  }
2341
+ getMetricsByStatus(status) {
2342
+ return this.metricsWithBenchmarks().filter(m => {
2343
+ const metric = m;
2344
+ return ('competitiveBenchmark' in m) && metric.competitiveBenchmark?.competitiveScore === status;
2345
+ });
2346
+ }
2347
+ getFunnelStageTooltip(funnelStage) {
2348
+ const categoryMetrics = this.funnelOrderService.getMetricsForFunnelStage(this.metricsWithBenchmarks(), funnelStage);
2349
+ // Group metrics by status
2350
+ const leadingMetrics = [];
2351
+ const competitiveMetrics = [];
2352
+ const laggingMetrics = [];
2353
+ categoryMetrics.forEach(m => {
2354
+ const metric = m;
2355
+ const score = ('competitiveBenchmark' in m) ? metric.competitiveBenchmark?.competitiveScore : undefined;
2356
+ if (score === 'LEADING')
2357
+ leadingMetrics.push(metric);
2358
+ else if (score === 'COMPETITIVE')
2359
+ competitiveMetrics.push(metric);
2360
+ else if (score === 'LAGGING')
2361
+ laggingMetrics.push(metric);
2362
+ });
2363
+ return {
2364
+ funnelStage: this.formatCategoryName(funnelStage),
2365
+ totalMetrics: categoryMetrics.length,
2366
+ leading: leadingMetrics.map(m => this.extractMetricTooltipData(m)),
2367
+ competitive: competitiveMetrics.map(m => this.extractMetricTooltipData(m)),
2368
+ lagging: laggingMetrics.map(m => this.extractMetricTooltipData(m))
2369
+ };
2370
+ }
2371
+ extractMetricTooltipData(metric) {
2372
+ // Format metric name from enum or description
2373
+ const metricName = metric.metric
2374
+ ? metric.metric.toString().replace(/_/g, ' ').toLowerCase().replace(/\b\w/g, l => l.toUpperCase())
2375
+ : (metric.description || 'Unknown Metric');
2376
+ // Determine unit based on metric type
2377
+ let unit = 'count';
2378
+ if (metric.metric) {
2379
+ const metricStr = metric.metric.toString();
2380
+ if (metricStr.includes('REVENUE') || metricStr.includes('AMOUNT')) {
2381
+ unit = 'currency';
2382
+ }
2383
+ else if (metricStr.includes('RATE') || metricStr.includes('PERCENT')) {
2384
+ unit = 'percentage';
2385
+ }
2386
+ }
2387
+ // Parse benchmark range from metricBenchmark string (e.g., "2.5% - 4.0%")
2388
+ let benchmarkRange = { min: 0, max: 0 };
2389
+ if (metric.competitiveBenchmark?.metricBenchmark) {
2390
+ const benchmarkStr = metric.competitiveBenchmark.metricBenchmark;
2391
+ const rangeMatch = benchmarkStr.match(/([\d.]+)\s*[-–]\s*([\d.]+)/);
2392
+ if (rangeMatch) {
2393
+ benchmarkRange = {
2394
+ min: parseFloat(rangeMatch[1]),
2395
+ max: parseFloat(rangeMatch[2])
2396
+ };
2397
+ }
2398
+ }
2399
+ return {
2400
+ name: metricName,
2401
+ projectedValue: metric.projectedValue || metric.currentValue || 0,
2402
+ benchmarkRange: benchmarkRange,
2403
+ unit: unit
2404
+ };
2405
+ }
2281
2406
  static { this.ɵfac = function CompetitivePositioningSummaryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CompetitivePositioningSummaryComponent)(); }; }
2282
- static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CompetitivePositioningSummaryComponent, selectors: [["symphiq-competitive-positioning-summary"]], inputs: { metrics: [1, "metrics"], isLightMode: [1, "isLightMode"], isCompactMode: [1, "isCompactMode"] }, outputs: { scrollToCompetitive: "scrollToCompetitive" }, decls: 3, vars: 3, consts: [[1, "rounded-xl", "border", "p-6", "transition-all", "duration-300", "hover:shadow-lg", "hover:scale-[1.02]"], [1, "space-y-4"], [1, "space-y-6"], [1, "flex", "items-center", "justify-between"], [1, "flex", "items-center", "gap-2"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"], [1, "text-base", "font-semibold", 3, "ngClass"], ["tooltipType", "competitive", 1, "px-3", "py-1", "rounded-full", "text-sm", "font-bold", "cursor-help", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "text-sm", "leading-relaxed", 3, "ngClass"], [1, "flex", "items-center", "gap-4"], [1, "w-2.5", "h-2.5", "rounded-full", 3, "ngClass"], [1, "flex", "items-center", "gap-1"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", 3, "ngClass"], [1, "w-2.5", "h-2.5", "rounded-full", "animate-pulse", 3, "ngClass"], [1, "text-xl", "font-bold", "animate-pulse", 3, "ngClass"], [1, "border", "rounded-lg", "p-3", 3, "ngClass"], [1, "w-full", "flex", "items-center", "justify-between", "text-xs", "font-semibold", "uppercase", "tracking-wide", "transition-colors", "cursor-pointer", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", "transition-transform", "duration-300"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 9l-7 7-7-7"], [1, "grid", "transition-[grid-template-rows]", "duration-300", "ease-in-out"], [1, "overflow-hidden"], [1, "space-y-2", "pt-3", "cursor-pointer"], [1, "rounded-lg", "p-2.5", 3, "ngClass"], [1, "flex", "justify-end"], [1, "flex", "items-center", "gap-1", "px-3", "py-1.5", "rounded-lg", "text-xs", "font-semibold", "transition-all", "cursor-pointer", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3.5", "h-3.5"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"], [1, "flex", "items-center", "justify-between", "mb-1.5"], [1, "flex-shrink-0", 3, "innerHTML"], [1, "text-xs", "font-medium", 3, "ngClass"], [1, "text-xs", 3, "ngClass"], [1, "w-1.5", "h-1.5", "rounded-full", 3, "ngClass"], [1, "text-xs", "font-semibold", 3, "ngClass"], [1, "w-1.5", "h-1.5", "rounded-full", "animate-pulse", 3, "ngClass"], [1, "text-xs", "font-semibold", "animate-pulse", 3, "ngClass"], [1, "flex", "items-start", "justify-between"], [1, "flex", "items-center", "gap-2", "mb-1"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", 3, "ngClass"], [1, "text-lg", "font-bold", 3, "ngClass"], ["tooltipType", "competitive", 1, "px-4", "py-2", "rounded-full", "text-lg", "font-bold", "cursor-help", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "grid", "grid-cols-3", "gap-4"], [1, "border", "rounded-lg", "p-4", "text-center", "transition-all", "hover:scale-105", 3, "ngClass"], [1, "text-3xl", "font-bold", "mb-1", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wide", 3, "ngClass"], [1, "space-y-2"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wide", "mb-3", 3, "ngClass"], [1, "rounded-lg", "p-3", "transition-all", 3, "ngClass"], [1, "flex", "items-center", "gap-1", "px-3", "py-1.5", "rounded-lg", "text-sm", "font-semibold", "transition-all", "cursor-pointer", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], [1, "flex", "items-center", "justify-between", "mb-2"], [3, "innerHTML"], [1, "text-sm", "font-medium", 3, "ngClass"], [1, "w-2", "h-2", "rounded-full", 3, "ngClass"], [1, "w-2", "h-2", "rounded-full", "animate-pulse", 3, "ngClass"]], template: function CompetitivePositioningSummaryComponent_Template(rf, ctx) { if (rf & 1) {
2407
+ static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CompetitivePositioningSummaryComponent, selectors: [["symphiq-competitive-positioning-summary"]], inputs: { metrics: [1, "metrics"], isLightMode: [1, "isLightMode"], isCompactMode: [1, "isCompactMode"] }, outputs: { scrollToCompetitive: "scrollToCompetitive" }, decls: 3, vars: 3, consts: [[1, "rounded-xl", "border", "p-6", "transition-all", "duration-300", "hover:shadow-lg", "hover:scale-[1.02]"], [1, "space-y-4"], [1, "space-y-6"], [1, "flex", "items-center", "justify-between"], [1, "flex", "items-center", "gap-2"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"], [1, "text-base", "font-semibold", 3, "ngClass"], ["tooltipType", "competitive", 1, "px-3", "py-1", "rounded-full", "text-sm", "font-bold", "cursor-help", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "text-sm", "leading-relaxed", 3, "ngClass"], [1, "flex", "items-center", "gap-4"], ["tooltipType", "competitiveStatus", 1, "flex", "items-center", "gap-2", "cursor-help", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "w-2.5", "h-2.5", "rounded-full", 3, "ngClass"], [1, "flex", "items-center", "gap-1"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", 3, "ngClass"], [1, "w-2.5", "h-2.5", "rounded-full", "animate-pulse", 3, "ngClass"], [1, "text-xl", "font-bold", "animate-pulse", 3, "ngClass"], [1, "border", "rounded-lg", "p-3", 3, "ngClass"], [1, "w-full", "flex", "items-center", "justify-between", "text-xs", "font-semibold", "uppercase", "tracking-wide", "transition-colors", "cursor-pointer", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", "transition-transform", "duration-300"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 9l-7 7-7-7"], [1, "grid", "transition-[grid-template-rows]", "duration-300", "ease-in-out"], [1, "overflow-hidden"], [1, "space-y-2", "pt-3"], ["tooltipType", "funnelStageCompetitive", 1, "rounded-lg", "p-2.5", "transition-all", "cursor-help", 3, "ngClass", "libSymphiqTooltip", "tooltipPosition"], [1, "flex", "justify-end"], [1, "flex", "items-center", "gap-1", "px-3", "py-1.5", "rounded-lg", "text-xs", "font-semibold", "transition-all", "cursor-pointer", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3.5", "h-3.5"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"], [1, "flex", "items-center", "justify-between", "mb-1.5"], [1, "flex-shrink-0", 3, "innerHTML"], [1, "text-xs", "font-medium", 3, "ngClass"], [1, "text-xs", 3, "ngClass"], [1, "flex", "items-center", "gap-1", "animate-pulse"], [1, "w-1.5", "h-1.5", "rounded-full", 3, "ngClass"], [1, "text-xs", "font-semibold", 3, "ngClass"], [1, "text-[10px]", "uppercase", 3, "ngClass"], [1, "flex", "items-start", "justify-between"], [1, "flex", "items-center", "gap-2", "mb-1"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", 3, "ngClass"], [1, "text-lg", "font-bold", 3, "ngClass"], ["tooltipType", "competitive", 1, "px-4", "py-2", "rounded-full", "text-lg", "font-bold", "cursor-help", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "grid", "grid-cols-3", "gap-4"], ["tooltipType", "competitiveStatus", 1, "border", "rounded-lg", "p-4", "text-center", "transition-all", "hover:scale-105", "cursor-help", 3, "ngClass", "libSymphiqTooltip", "tooltipPosition"], [1, "text-3xl", "font-bold", "mb-1", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wide", 3, "ngClass"], [1, "space-y-2"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wide", "mb-3", 3, "ngClass"], ["tooltipType", "funnelStageCompetitive", 1, "rounded-lg", "p-3", "transition-all", "cursor-help", 3, "ngClass", "libSymphiqTooltip", "tooltipPosition"], [1, "flex", "items-center", "gap-1", "px-3", "py-1.5", "rounded-lg", "text-sm", "font-semibold", "transition-all", "cursor-pointer", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], [1, "flex", "items-center", "justify-between", "mb-2"], [3, "innerHTML"], [1, "text-sm", "font-medium", 3, "ngClass"], [1, "flex", "items-center", "gap-3"], [1, "w-2", "h-2", "rounded-full", 3, "ngClass"], [1, "text-xs", "uppercase", 3, "ngClass"]], template: function CompetitivePositioningSummaryComponent_Template(rf, ctx) { if (rf & 1) {
2283
2408
  i0.ɵɵelementStart(0, "div", 0);
2284
- i0.ɵɵconditionalCreate(1, CompetitivePositioningSummaryComponent_Conditional_1_Template, 49, 28, "div", 1)(2, CompetitivePositioningSummaryComponent_Conditional_2_Template, 38, 23, "div", 2);
2409
+ i0.ɵɵconditionalCreate(1, CompetitivePositioningSummaryComponent_Conditional_1_Template, 49, 34, "div", 1)(2, CompetitivePositioningSummaryComponent_Conditional_2_Template, 38, 29, "div", 2);
2285
2410
  i0.ɵɵelementEnd();
2286
2411
  } if (rf & 2) {
2287
2412
  i0.ɵɵclassMap(ctx.containerClass());
@@ -2326,21 +2451,33 @@ class CompetitivePositioningSummaryComponent {
2326
2451
 
2327
2452
  <!-- Distribution Overview -->
2328
2453
  <div class="flex items-center gap-4">
2329
- <div class="flex items-center gap-2">
2454
+ <div
2455
+ class="flex items-center gap-2 cursor-help"
2456
+ [libSymphiqTooltip]="leadingTooltip()"
2457
+ tooltipType="competitiveStatus"
2458
+ [tooltipPosition]="'bottom'">
2330
2459
  <div [ngClass]="getScoreDotClass('leading')" class="w-2.5 h-2.5 rounded-full"></div>
2331
2460
  <div class="flex items-center gap-1">
2332
2461
  <span [ngClass]="isLightMode() ? 'text-emerald-700' : 'text-emerald-400'" class="text-xl font-bold">{{ competitiveStats().leading }}</span>
2333
2462
  <span [ngClass]="isLightMode() ? 'text-emerald-600' : 'text-emerald-500'" class="text-xs font-semibold uppercase">Leading</span>
2334
2463
  </div>
2335
2464
  </div>
2336
- <div class="flex items-center gap-2">
2465
+ <div
2466
+ class="flex items-center gap-2 cursor-help"
2467
+ [libSymphiqTooltip]="competitiveTooltip()"
2468
+ tooltipType="competitiveStatus"
2469
+ [tooltipPosition]="'bottom'">
2337
2470
  <div [ngClass]="getScoreDotClass('competitive')" class="w-2.5 h-2.5 rounded-full"></div>
2338
2471
  <div class="flex items-center gap-1">
2339
2472
  <span [ngClass]="isLightMode() ? 'text-blue-700' : 'text-blue-400'" class="text-xl font-bold">{{ competitiveStats().competitive }}</span>
2340
2473
  <span [ngClass]="isLightMode() ? 'text-blue-600' : 'text-blue-500'" class="text-xs font-semibold uppercase">Competitive</span>
2341
2474
  </div>
2342
2475
  </div>
2343
- <div class="flex items-center gap-2">
2476
+ <div
2477
+ class="flex items-center gap-2 cursor-help"
2478
+ [libSymphiqTooltip]="laggingTooltip()"
2479
+ tooltipType="competitiveStatus"
2480
+ [tooltipPosition]="'bottom'">
2344
2481
  <div [ngClass]="getScoreDotClass('lagging')" class="w-2.5 h-2.5 rounded-full animate-pulse"></div>
2345
2482
  <div class="flex items-center gap-1">
2346
2483
  <span [ngClass]="isLightMode() ? 'text-orange-700' : 'text-orange-400'" class="text-xl font-bold animate-pulse">{{ competitiveStats().lagging }}</span>
@@ -2363,9 +2500,14 @@ class CompetitivePositioningSummaryComponent {
2363
2500
 
2364
2501
  <div class="grid transition-[grid-template-rows] duration-300 ease-in-out" [style.grid-template-rows]="isExpanded() ? '1fr' : '0fr'">
2365
2502
  <div class="overflow-hidden">
2366
- <div class="space-y-2 pt-3 cursor-pointer">
2503
+ <div class="space-y-2 pt-3">
2367
2504
  @for (category of categoryStats(); track category.category) {
2368
- <div [ngClass]="isLightMode() ? 'bg-slate-50' : 'bg-slate-800/50'" class="rounded-lg p-2.5">
2505
+ <div
2506
+ [ngClass]="isLightMode() ? 'bg-slate-50 hover:bg-slate-100' : 'bg-slate-800/50 hover:bg-slate-800'"
2507
+ class="rounded-lg p-2.5 transition-all cursor-help"
2508
+ [libSymphiqTooltip]="getFunnelStageTooltip(category.category)"
2509
+ tooltipType="funnelStageCompetitive"
2510
+ [tooltipPosition]="'auto'">
2369
2511
  <div class="flex items-center justify-between mb-1.5">
2370
2512
  <div class="flex items-center gap-2">
2371
2513
  <div [innerHTML]="category.icon" class="flex-shrink-0"></div>
@@ -2381,18 +2523,21 @@ class CompetitivePositioningSummaryComponent {
2381
2523
  <div class="flex items-center gap-1">
2382
2524
  <div [ngClass]="getScoreDotClass('leading')" class="w-1.5 h-1.5 rounded-full"></div>
2383
2525
  <span [ngClass]="isLightMode() ? 'text-emerald-600' : 'text-emerald-400'" class="text-xs font-semibold">{{ category.leading }}</span>
2526
+ <span [ngClass]="isLightMode() ? 'text-emerald-600' : 'text-emerald-500'" class="text-[10px] uppercase">Leading</span>
2384
2527
  </div>
2385
2528
  }
2386
2529
  @if (category.competitive > 0) {
2387
2530
  <div class="flex items-center gap-1">
2388
2531
  <div [ngClass]="getScoreDotClass('competitive')" class="w-1.5 h-1.5 rounded-full"></div>
2389
2532
  <span [ngClass]="isLightMode() ? 'text-blue-600' : 'text-blue-400'" class="text-xs font-semibold">{{ category.competitive }}</span>
2533
+ <span [ngClass]="isLightMode() ? 'text-blue-600' : 'text-blue-500'" class="text-[10px] uppercase">Competitive</span>
2390
2534
  </div>
2391
2535
  }
2392
2536
  @if (category.lagging > 0) {
2393
- <div class="flex items-center gap-1">
2394
- <div [ngClass]="getScoreDotClass('lagging')" class="w-1.5 h-1.5 rounded-full animate-pulse"></div>
2395
- <span [ngClass]="isLightMode() ? 'text-orange-600' : 'text-orange-400'" class="text-xs font-semibold animate-pulse">{{ category.lagging }}</span>
2537
+ <div class="flex items-center gap-1 animate-pulse">
2538
+ <div [ngClass]="getScoreDotClass('lagging')" class="w-1.5 h-1.5 rounded-full"></div>
2539
+ <span [ngClass]="isLightMode() ? 'text-orange-600' : 'text-orange-400'" class="text-xs font-semibold">{{ category.lagging }}</span>
2540
+ <span [ngClass]="isLightMode() ? 'text-orange-600' : 'text-orange-500'" class="text-[10px] uppercase">Lagging</span>
2396
2541
  </div>
2397
2542
  }
2398
2543
  </div>
@@ -2445,15 +2590,30 @@ class CompetitivePositioningSummaryComponent {
2445
2590
 
2446
2591
  <!-- Distribution Overview -->
2447
2592
  <div class="grid grid-cols-3 gap-4">
2448
- <div [ngClass]="isLightMode() ? 'bg-emerald-50 border-emerald-200' : 'bg-emerald-500/10 border-emerald-500/20'" class="border rounded-lg p-4 text-center transition-all hover:scale-105">
2593
+ <div
2594
+ [ngClass]="isLightMode() ? 'bg-emerald-50 border-emerald-200' : 'bg-emerald-500/10 border-emerald-500/20'"
2595
+ class="border rounded-lg p-4 text-center transition-all hover:scale-105 cursor-help"
2596
+ [libSymphiqTooltip]="leadingTooltip()"
2597
+ tooltipType="competitiveStatus"
2598
+ [tooltipPosition]="'bottom'">
2449
2599
  <div [ngClass]="isLightMode() ? 'text-emerald-700' : 'text-emerald-400'" class="text-3xl font-bold mb-1">{{ competitiveStats().leading }}</div>
2450
2600
  <div [ngClass]="isLightMode() ? 'text-emerald-600' : 'text-emerald-500'" class="text-xs font-semibold uppercase tracking-wide">Leading</div>
2451
2601
  </div>
2452
- <div [ngClass]="isLightMode() ? 'bg-blue-50 border-blue-200' : 'bg-blue-500/10 border-blue-500/20'" class="border rounded-lg p-4 text-center transition-all hover:scale-105">
2602
+ <div
2603
+ [ngClass]="isLightMode() ? 'bg-blue-50 border-blue-200' : 'bg-blue-500/10 border-blue-500/20'"
2604
+ class="border rounded-lg p-4 text-center transition-all hover:scale-105 cursor-help"
2605
+ [libSymphiqTooltip]="competitiveTooltip()"
2606
+ tooltipType="competitiveStatus"
2607
+ [tooltipPosition]="'bottom'">
2453
2608
  <div [ngClass]="isLightMode() ? 'text-blue-700' : 'text-blue-400'" class="text-3xl font-bold mb-1">{{ competitiveStats().competitive }}</div>
2454
2609
  <div [ngClass]="isLightMode() ? 'text-blue-600' : 'text-blue-500'" class="text-xs font-semibold uppercase tracking-wide">Competitive</div>
2455
2610
  </div>
2456
- <div [ngClass]="isLightMode() ? 'bg-orange-50 border-orange-200' : 'bg-orange-500/10 border-orange-500/20'" class="border rounded-lg p-4 text-center transition-all hover:scale-105">
2611
+ <div
2612
+ [ngClass]="isLightMode() ? 'bg-orange-50 border-orange-200' : 'bg-orange-500/10 border-orange-500/20'"
2613
+ class="border rounded-lg p-4 text-center transition-all hover:scale-105 cursor-help"
2614
+ [libSymphiqTooltip]="laggingTooltip()"
2615
+ tooltipType="competitiveStatus"
2616
+ [tooltipPosition]="'bottom'">
2457
2617
  <div [ngClass]="isLightMode() ? 'text-orange-700' : 'text-orange-400'" class="text-3xl font-bold mb-1">{{ competitiveStats().lagging }}</div>
2458
2618
  <div [ngClass]="isLightMode() ? 'text-orange-600' : 'text-orange-500'" class="text-xs font-semibold uppercase tracking-wide">Lagging</div>
2459
2619
  </div>
@@ -2463,7 +2623,12 @@ class CompetitivePositioningSummaryComponent {
2463
2623
  <div class="space-y-2">
2464
2624
  <h4 [ngClass]="isLightMode() ? 'text-slate-700' : 'text-slate-300'" class="text-xs font-semibold uppercase tracking-wide mb-3">By Funnel Stage</h4>
2465
2625
  @for (category of categoryStats(); track category.category) {
2466
- <div [ngClass]="isLightMode() ? 'bg-slate-50 hover:bg-slate-100' : 'bg-slate-800/50 hover:bg-slate-800'" class="rounded-lg p-3 transition-all">
2626
+ <div
2627
+ [ngClass]="isLightMode() ? 'bg-slate-50 hover:bg-slate-100' : 'bg-slate-800/50 hover:bg-slate-800'"
2628
+ class="rounded-lg p-3 transition-all cursor-help"
2629
+ [libSymphiqTooltip]="getFunnelStageTooltip(category.category)"
2630
+ tooltipType="funnelStageCompetitive"
2631
+ [tooltipPosition]="'right'">
2467
2632
  <div class="flex items-center justify-between mb-2">
2468
2633
  <div class="flex items-center gap-2">
2469
2634
  <div [innerHTML]="category.icon"></div>
@@ -2471,23 +2636,26 @@ class CompetitivePositioningSummaryComponent {
2471
2636
  </div>
2472
2637
  <span [ngClass]="isLightMode() ? 'text-slate-500' : 'text-slate-400'" class="text-xs">{{ category.total }} metrics</span>
2473
2638
  </div>
2474
- <div class="flex items-center gap-2">
2639
+ <div class="flex items-center gap-3">
2475
2640
  @if (category.leading > 0) {
2476
2641
  <div class="flex items-center gap-1">
2477
2642
  <div [ngClass]="getScoreDotClass('leading')" class="w-2 h-2 rounded-full"></div>
2478
2643
  <span [ngClass]="isLightMode() ? 'text-emerald-600' : 'text-emerald-400'" class="text-xs font-semibold">{{ category.leading }}</span>
2644
+ <span [ngClass]="isLightMode() ? 'text-emerald-600' : 'text-emerald-500'" class="text-xs uppercase">Leading</span>
2479
2645
  </div>
2480
2646
  }
2481
2647
  @if (category.competitive > 0) {
2482
2648
  <div class="flex items-center gap-1">
2483
2649
  <div [ngClass]="getScoreDotClass('competitive')" class="w-2 h-2 rounded-full"></div>
2484
2650
  <span [ngClass]="isLightMode() ? 'text-blue-600' : 'text-blue-400'" class="text-xs font-semibold">{{ category.competitive }}</span>
2651
+ <span [ngClass]="isLightMode() ? 'text-blue-600' : 'text-blue-500'" class="text-xs uppercase">Competitive</span>
2485
2652
  </div>
2486
2653
  }
2487
2654
  @if (category.lagging > 0) {
2488
- <div class="flex items-center gap-1">
2489
- <div [ngClass]="getScoreDotClass('lagging')" class="w-2 h-2 rounded-full animate-pulse"></div>
2490
- <span [ngClass]="isLightMode() ? 'text-orange-600' : 'text-orange-400'" class="text-xs font-semibold animate-pulse">{{ category.lagging }}</span>
2655
+ <div class="flex items-center gap-1 animate-pulse">
2656
+ <div [ngClass]="getScoreDotClass('lagging')" class="w-2 h-2 rounded-full"></div>
2657
+ <span [ngClass]="isLightMode() ? 'text-orange-600' : 'text-orange-400'" class="text-xs font-semibold">{{ category.lagging }}</span>
2658
+ <span [ngClass]="isLightMode() ? 'text-orange-600' : 'text-orange-500'" class="text-xs uppercase">Lagging</span>
2491
2659
  </div>
2492
2660
  }
2493
2661
  </div>
@@ -2513,10 +2681,10 @@ class CompetitivePositioningSummaryComponent {
2513
2681
  `
2514
2682
  }]
2515
2683
  }], null, { metrics: [{ type: i0.Input, args: [{ isSignal: true, alias: "metrics", required: false }] }], isLightMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLightMode", required: false }] }], isCompactMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCompactMode", required: false }] }], scrollToCompetitive: [{ type: i0.Output, args: ["scrollToCompetitive"] }] }); })();
2516
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CompetitivePositioningSummaryComponent, { className: "CompetitivePositioningSummaryComponent", filePath: "lib/components/funnel-analysis-dashboard/competitive-positioning-summary.component.ts", lineNumber: 247 }); })();
2684
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CompetitivePositioningSummaryComponent, { className: "CompetitivePositioningSummaryComponent", filePath: "lib/components/funnel-analysis-dashboard/competitive-positioning-summary.component.ts", lineNumber: 290 }); })();
2517
2685
 
2518
2686
  const _c0$9 = () => [1, 2, 3, 4];
2519
- function OverallAssessmentComponent_Conditional_0_For_11_Template(rf, ctx) { if (rf & 1) {
2687
+ function OverallAssessmentComponent_Conditional_0_For_10_Template(rf, ctx) { if (rf & 1) {
2520
2688
  i0.ɵɵelementStart(0, "div", 9);
2521
2689
  i0.ɵɵelement(1, "symphiq-skeleton-loader", 6)(2, "symphiq-skeleton-loader", 6);
2522
2690
  i0.ɵɵelementEnd();
@@ -2532,12 +2700,12 @@ function OverallAssessmentComponent_Conditional_0_Template(rf, ctx) { if (rf & 1
2532
2700
  i0.ɵɵelement(4, "symphiq-skeleton-loader", 6)(5, "symphiq-skeleton-loader", 6);
2533
2701
  i0.ɵɵelementEnd();
2534
2702
  i0.ɵɵelementStart(6, "div", 7);
2535
- i0.ɵɵelement(7, "symphiq-skeleton-loader", 6)(8, "symphiq-skeleton-loader", 6);
2703
+ i0.ɵɵelement(7, "symphiq-skeleton-loader", 6);
2536
2704
  i0.ɵɵelementEnd()();
2537
- i0.ɵɵelementStart(9, "div", 8);
2538
- i0.ɵɵrepeaterCreate(10, OverallAssessmentComponent_Conditional_0_For_11_Template, 3, 6, "div", 9, i0.ɵɵrepeaterTrackByIdentity);
2705
+ i0.ɵɵelementStart(8, "div", 8);
2706
+ i0.ɵɵrepeaterCreate(9, OverallAssessmentComponent_Conditional_0_For_10_Template, 3, 6, "div", 9, i0.ɵɵrepeaterTrackByIdentity);
2539
2707
  i0.ɵɵelementEnd();
2540
- i0.ɵɵelement(12, "symphiq-skeleton-loader", 6);
2708
+ i0.ɵɵelement(11, "symphiq-skeleton-loader", 6);
2541
2709
  i0.ɵɵelementEnd()();
2542
2710
  } if (rf & 2) {
2543
2711
  const ctx_r0 = i0.ɵɵnextContext();
@@ -2548,22 +2716,21 @@ function OverallAssessmentComponent_Conditional_0_Template(rf, ctx) { if (rf & 1
2548
2716
  i0.ɵɵproperty("width", "80%")("height", "16px")("isLightMode", ctx_r0.isLightMode());
2549
2717
  i0.ɵɵadvance(2);
2550
2718
  i0.ɵɵproperty("width", "100px")("height", "70px")("isLightMode", ctx_r0.isLightMode());
2551
- i0.ɵɵadvance();
2552
- i0.ɵɵproperty("width", "100px")("height", "70px")("isLightMode", ctx_r0.isLightMode());
2553
2719
  i0.ɵɵadvance(2);
2554
- i0.ɵɵrepeater(i0.ɵɵpureFunction0(17, _c0$9));
2720
+ i0.ɵɵrepeater(i0.ɵɵpureFunction0(14, _c0$9));
2555
2721
  i0.ɵɵadvance(2);
2556
2722
  i0.ɵɵproperty("width", "100%")("height", "200px")("isLightMode", ctx_r0.isLightMode());
2557
2723
  } }
2558
- function OverallAssessmentComponent_Conditional_1_Conditional_21_Conditional_1_Conditional_25_Template(rf, ctx) { if (rf & 1) {
2559
- i0.ɵɵelementStart(0, "div", 48)(1, "span", 52);
2724
+ function OverallAssessmentComponent_Conditional_1_Conditional_13_Conditional_1_Conditional_25_Template(rf, ctx) { if (rf & 1) {
2725
+ i0.ɵɵelementStart(0, "div", 53)(1, "span", 49);
2560
2726
  i0.ɵɵtext(2, "2025 Pacing: ");
2561
2727
  i0.ɵɵelementEnd();
2562
- i0.ɵɵelementStart(3, "span", 54);
2728
+ i0.ɵɵelementStart(3, "span", 52);
2563
2729
  i0.ɵɵtext(4);
2564
2730
  i0.ɵɵelementEnd()();
2565
2731
  } if (rf & 2) {
2566
2732
  const ctx_r0 = i0.ɵɵnextContext(4);
2733
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.revenueStatusTooltip())("tooltipPosition", "top");
2567
2734
  i0.ɵɵadvance();
2568
2735
  i0.ɵɵclassMap(ctx_r0.badgeLabelClass());
2569
2736
  i0.ɵɵadvance(2);
@@ -2571,41 +2738,41 @@ function OverallAssessmentComponent_Conditional_1_Conditional_21_Conditional_1_C
2571
2738
  i0.ɵɵadvance();
2572
2739
  i0.ɵɵtextInterpolate(ctx_r0.formattedRevenuePacing());
2573
2740
  } }
2574
- function OverallAssessmentComponent_Conditional_1_Conditional_21_Conditional_1_Template(rf, ctx) { if (rf & 1) {
2575
- i0.ɵɵelementStart(0, "div", 39)(1, "div", 26)(2, "div", 40);
2741
+ function OverallAssessmentComponent_Conditional_1_Conditional_13_Conditional_1_Template(rf, ctx) { if (rf & 1) {
2742
+ i0.ɵɵelementStart(0, "div", 36)(1, "div", 23)(2, "div", 37);
2576
2743
  i0.ɵɵnamespaceSVG();
2577
- i0.ɵɵelementStart(3, "svg", 41);
2578
- i0.ɵɵelement(4, "path", 42);
2744
+ i0.ɵɵelementStart(3, "svg", 38);
2745
+ i0.ɵɵelement(4, "path", 39);
2579
2746
  i0.ɵɵelementEnd()();
2580
2747
  i0.ɵɵnamespaceHTML();
2581
- i0.ɵɵelementStart(5, "div", 43)(6, "h3", 44);
2748
+ i0.ɵɵelementStart(5, "div", 40)(6, "h3", 41);
2582
2749
  i0.ɵɵtext(7, "Your Revenue");
2583
2750
  i0.ɵɵelementEnd();
2584
- i0.ɵɵelementStart(8, "p", 45);
2751
+ i0.ɵɵelementStart(8, "p", 42);
2585
2752
  i0.ɵɵtext(9);
2586
2753
  i0.ɵɵelementEnd()()();
2587
- i0.ɵɵelementStart(10, "div", 46)(11, "div", 47)(12, "div", 48);
2754
+ i0.ɵɵelementStart(10, "div", 43)(11, "div", 44)(12, "div", 45);
2588
2755
  i0.ɵɵnamespaceSVG();
2589
- i0.ɵɵelementStart(13, "svg", 49);
2590
- i0.ɵɵelement(14, "path", 50);
2756
+ i0.ɵɵelementStart(13, "svg", 46);
2757
+ i0.ɵɵelement(14, "path", 47);
2591
2758
  i0.ɵɵelementEnd();
2592
2759
  i0.ɵɵnamespaceHTML();
2593
- i0.ɵɵelementStart(15, "span", 51);
2760
+ i0.ɵɵelementStart(15, "span", 48);
2594
2761
  i0.ɵɵtext(16);
2595
2762
  i0.ɵɵelementEnd();
2596
- i0.ɵɵelementStart(17, "span", 52);
2763
+ i0.ɵɵelementStart(17, "span", 49);
2597
2764
  i0.ɵɵtext(18, "vs last year");
2598
2765
  i0.ɵɵelementEnd()();
2599
- i0.ɵɵelement(19, "div", 53);
2600
- i0.ɵɵelementStart(20, "div")(21, "span", 52);
2766
+ i0.ɵɵelement(19, "div", 50);
2767
+ i0.ɵɵelementStart(20, "div", 51)(21, "span", 49);
2601
2768
  i0.ɵɵtext(22, "Target: ");
2602
2769
  i0.ɵɵelementEnd();
2603
- i0.ɵɵelementStart(23, "span", 54);
2770
+ i0.ɵɵelementStart(23, "span", 52);
2604
2771
  i0.ɵɵtext(24);
2605
2772
  i0.ɵɵelementEnd()()();
2606
- i0.ɵɵconditionalCreate(25, OverallAssessmentComponent_Conditional_1_Conditional_21_Conditional_1_Conditional_25_Template, 5, 5, "div", 48);
2773
+ i0.ɵɵconditionalCreate(25, OverallAssessmentComponent_Conditional_1_Conditional_13_Conditional_1_Conditional_25_Template, 5, 7, "div", 53);
2607
2774
  i0.ɵɵelementEnd();
2608
- i0.ɵɵelementStart(26, "div", 55)(27, "span", 19);
2775
+ i0.ɵɵelementStart(26, "div", 54)(27, "span", 55);
2609
2776
  i0.ɵɵtext(28);
2610
2777
  i0.ɵɵelementEnd();
2611
2778
  i0.ɵɵelementStart(29, "span");
@@ -2625,7 +2792,9 @@ function OverallAssessmentComponent_Conditional_1_Conditional_21_Conditional_1_T
2625
2792
  i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.revenueTooltip())("tooltipPosition", "bottom");
2626
2793
  i0.ɵɵadvance();
2627
2794
  i0.ɵɵtextInterpolate1(" ", ctx_r0.formattedRevenueValue(), " ");
2628
- i0.ɵɵadvance(4);
2795
+ i0.ɵɵadvance(3);
2796
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.revenueTrendTooltip())("tooltipPosition", "top");
2797
+ i0.ɵɵadvance();
2629
2798
  i0.ɵɵclassMap(ctx_r0.trendIconClass());
2630
2799
  i0.ɵɵadvance(2);
2631
2800
  i0.ɵɵclassMap(ctx_r0.trendValueClass());
@@ -2633,7 +2802,9 @@ function OverallAssessmentComponent_Conditional_1_Conditional_21_Conditional_1_T
2633
2802
  i0.ɵɵtextInterpolate1("", ctx_r0.formattedRevenueTrend(), "%");
2634
2803
  i0.ɵɵadvance();
2635
2804
  i0.ɵɵclassMap(ctx_r0.badgeLabelClass());
2636
- i0.ɵɵadvance(4);
2805
+ i0.ɵɵadvance(3);
2806
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.revenueStatusTooltip())("tooltipPosition", "top");
2807
+ i0.ɵɵadvance();
2637
2808
  i0.ɵɵclassMap(ctx_r0.badgeLabelClass());
2638
2809
  i0.ɵɵadvance(2);
2639
2810
  i0.ɵɵclassMap(ctx_r0.titleClass());
@@ -2649,10 +2820,10 @@ function OverallAssessmentComponent_Conditional_1_Conditional_21_Conditional_1_T
2649
2820
  i0.ɵɵadvance(2);
2650
2821
  i0.ɵɵtextInterpolate(ctx_r0.revenueStatusLabel());
2651
2822
  } }
2652
- function OverallAssessmentComponent_Conditional_1_Conditional_21_Template(rf, ctx) { if (rf & 1) {
2653
- i0.ɵɵelementStart(0, "div", 22);
2654
- i0.ɵɵconditionalCreate(1, OverallAssessmentComponent_Conditional_1_Conditional_21_Conditional_1_Template, 31, 33, "div", 36);
2655
- i0.ɵɵelementStart(2, "div", 37)(3, "p", 38);
2823
+ function OverallAssessmentComponent_Conditional_1_Conditional_13_Template(rf, ctx) { if (rf & 1) {
2824
+ i0.ɵɵelementStart(0, "div", 19);
2825
+ i0.ɵɵconditionalCreate(1, OverallAssessmentComponent_Conditional_1_Conditional_13_Conditional_1_Template, 31, 37, "div", 33);
2826
+ i0.ɵɵelementStart(2, "div", 34)(3, "p", 35);
2656
2827
  i0.ɵɵtext(4);
2657
2828
  i0.ɵɵelementEnd()()();
2658
2829
  } if (rf & 2) {
@@ -2666,8 +2837,8 @@ function OverallAssessmentComponent_Conditional_1_Conditional_21_Template(rf, ct
2666
2837
  i0.ɵɵadvance();
2667
2838
  i0.ɵɵtextInterpolate(ctx_r0.assessment().narrative);
2668
2839
  } }
2669
- function OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_Conditional_27_Template(rf, ctx) { if (rf & 1) {
2670
- i0.ɵɵelementStart(0, "div", 48)(1, "span", 64);
2840
+ function OverallAssessmentComponent_Conditional_1_Conditional_14_Conditional_0_Conditional_27_Template(rf, ctx) { if (rf & 1) {
2841
+ i0.ɵɵelementStart(0, "div", 53)(1, "span", 64);
2671
2842
  i0.ɵɵtext(2, "2025 Pacing: ");
2672
2843
  i0.ɵɵelementEnd();
2673
2844
  i0.ɵɵelementStart(3, "span", 65);
@@ -2675,6 +2846,7 @@ function OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_C
2675
2846
  i0.ɵɵelementEnd()();
2676
2847
  } if (rf & 2) {
2677
2848
  const ctx_r0 = i0.ɵɵnextContext(4);
2849
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.revenueStatusTooltip())("tooltipPosition", "top");
2678
2850
  i0.ɵɵadvance();
2679
2851
  i0.ɵɵclassMap(ctx_r0.badgeLabelClass());
2680
2852
  i0.ɵɵadvance(2);
@@ -2682,23 +2854,23 @@ function OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_C
2682
2854
  i0.ɵɵadvance();
2683
2855
  i0.ɵɵtextInterpolate(ctx_r0.formattedRevenuePacing());
2684
2856
  } }
2685
- function OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_Template(rf, ctx) { if (rf & 1) {
2686
- i0.ɵɵelementStart(0, "div", 58)(1, "div", 59)(2, "div", 60)(3, "div", 26)(4, "div", 40);
2857
+ function OverallAssessmentComponent_Conditional_1_Conditional_14_Conditional_0_Template(rf, ctx) { if (rf & 1) {
2858
+ i0.ɵɵelementStart(0, "div", 58)(1, "div", 59)(2, "div", 60)(3, "div", 23)(4, "div", 37);
2687
2859
  i0.ɵɵnamespaceSVG();
2688
- i0.ɵɵelementStart(5, "svg", 41);
2689
- i0.ɵɵelement(6, "path", 42);
2860
+ i0.ɵɵelementStart(5, "svg", 38);
2861
+ i0.ɵɵelement(6, "path", 39);
2690
2862
  i0.ɵɵelementEnd()();
2691
2863
  i0.ɵɵnamespaceHTML();
2692
- i0.ɵɵelementStart(7, "div", 43)(8, "h3", 44);
2864
+ i0.ɵɵelementStart(7, "div", 40)(8, "h3", 41);
2693
2865
  i0.ɵɵtext(9, "Your Revenue");
2694
2866
  i0.ɵɵelementEnd();
2695
- i0.ɵɵelementStart(10, "p", 45);
2867
+ i0.ɵɵelementStart(10, "p", 42);
2696
2868
  i0.ɵɵtext(11);
2697
2869
  i0.ɵɵelementEnd()()();
2698
- i0.ɵɵelementStart(12, "div", 61)(13, "div", 47)(14, "div", 48);
2870
+ i0.ɵɵelementStart(12, "div", 61)(13, "div", 44)(14, "div", 45);
2699
2871
  i0.ɵɵnamespaceSVG();
2700
2872
  i0.ɵɵelementStart(15, "svg", 62);
2701
- i0.ɵɵelement(16, "path", 50);
2873
+ i0.ɵɵelement(16, "path", 47);
2702
2874
  i0.ɵɵelementEnd();
2703
2875
  i0.ɵɵnamespaceHTML();
2704
2876
  i0.ɵɵelementStart(17, "span", 63);
@@ -2707,19 +2879,19 @@ function OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_T
2707
2879
  i0.ɵɵelementStart(19, "span", 64);
2708
2880
  i0.ɵɵtext(20, "vs last year");
2709
2881
  i0.ɵɵelementEnd()();
2710
- i0.ɵɵelement(21, "div", 53);
2711
- i0.ɵɵelementStart(22, "div")(23, "span", 64);
2882
+ i0.ɵɵelement(21, "div", 50);
2883
+ i0.ɵɵelementStart(22, "div", 51)(23, "span", 64);
2712
2884
  i0.ɵɵtext(24, "Target: ");
2713
2885
  i0.ɵɵelementEnd();
2714
2886
  i0.ɵɵelementStart(25, "span", 65);
2715
2887
  i0.ɵɵtext(26);
2716
2888
  i0.ɵɵelementEnd()()();
2717
- i0.ɵɵconditionalCreate(27, OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_Conditional_27_Template, 5, 5, "div", 48);
2889
+ i0.ɵɵconditionalCreate(27, OverallAssessmentComponent_Conditional_1_Conditional_14_Conditional_0_Conditional_27_Template, 5, 7, "div", 53);
2718
2890
  i0.ɵɵelementEnd()();
2719
2891
  i0.ɵɵelementStart(28, "div", 66)(29, "div", 17);
2720
2892
  i0.ɵɵtext(30, "Status");
2721
2893
  i0.ɵɵelementEnd();
2722
- i0.ɵɵelementStart(31, "div", 67)(32, "span", 19);
2894
+ i0.ɵɵelementStart(31, "div", 67)(32, "span", 55);
2723
2895
  i0.ɵɵtext(33);
2724
2896
  i0.ɵɵelementEnd();
2725
2897
  i0.ɵɵelementStart(34, "span");
@@ -2742,7 +2914,9 @@ function OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_T
2742
2914
  i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.revenueTooltip())("tooltipPosition", "bottom");
2743
2915
  i0.ɵɵadvance();
2744
2916
  i0.ɵɵtextInterpolate1(" ", ctx_r0.formattedRevenueValue(), " ");
2745
- i0.ɵɵadvance(4);
2917
+ i0.ɵɵadvance(3);
2918
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.revenueTrendTooltip())("tooltipPosition", "top");
2919
+ i0.ɵɵadvance();
2746
2920
  i0.ɵɵclassMap(ctx_r0.trendIconClass());
2747
2921
  i0.ɵɵadvance(2);
2748
2922
  i0.ɵɵclassMap(ctx_r0.trendValueClass());
@@ -2750,7 +2924,9 @@ function OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_T
2750
2924
  i0.ɵɵtextInterpolate1("", ctx_r0.formattedRevenueTrend(), "%");
2751
2925
  i0.ɵɵadvance();
2752
2926
  i0.ɵɵclassMap(ctx_r0.badgeLabelClass());
2753
- i0.ɵɵadvance(4);
2927
+ i0.ɵɵadvance(3);
2928
+ i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.revenueStatusTooltip())("tooltipPosition", "top");
2929
+ i0.ɵɵadvance();
2754
2930
  i0.ɵɵclassMap(ctx_r0.badgeLabelClass());
2755
2931
  i0.ɵɵadvance(2);
2756
2932
  i0.ɵɵclassMap(ctx_r0.titleClass());
@@ -2772,9 +2948,9 @@ function OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_T
2772
2948
  i0.ɵɵadvance();
2773
2949
  i0.ɵɵtextInterpolate(ctx_r0.revenueMetric().description);
2774
2950
  } }
2775
- function OverallAssessmentComponent_Conditional_1_Conditional_22_Template(rf, ctx) { if (rf & 1) {
2776
- i0.ɵɵconditionalCreate(0, OverallAssessmentComponent_Conditional_1_Conditional_22_Conditional_0_Template, 38, 36, "div", 56);
2777
- i0.ɵɵelementStart(1, "div", 57)(2, "p", 38);
2951
+ function OverallAssessmentComponent_Conditional_1_Conditional_14_Template(rf, ctx) { if (rf & 1) {
2952
+ i0.ɵɵconditionalCreate(0, OverallAssessmentComponent_Conditional_1_Conditional_14_Conditional_0_Template, 38, 40, "div", 56);
2953
+ i0.ɵɵelementStart(1, "div", 57)(2, "p", 35);
2778
2954
  i0.ɵɵtext(3);
2779
2955
  i0.ɵɵelementEnd()();
2780
2956
  } if (rf & 2) {
@@ -2787,29 +2963,29 @@ function OverallAssessmentComponent_Conditional_1_Conditional_22_Template(rf, ct
2787
2963
  i0.ɵɵadvance();
2788
2964
  i0.ɵɵtextInterpolate(ctx_r0.assessment().narrative);
2789
2965
  } }
2790
- function OverallAssessmentComponent_Conditional_1_Conditional_23_For_3_Template(rf, ctx) { if (rf & 1) {
2966
+ function OverallAssessmentComponent_Conditional_1_Conditional_15_For_3_Template(rf, ctx) { if (rf & 1) {
2791
2967
  const _r2 = i0.ɵɵgetCurrentView();
2792
2968
  i0.ɵɵelementStart(0, "symphiq-chart-container", 71);
2793
- i0.ɵɵlistener("chartClick", function OverallAssessmentComponent_Conditional_1_Conditional_23_For_3_Template_symphiq_chart_container_chartClick_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.openChartModal($event)); });
2969
+ i0.ɵɵlistener("chartClick", function OverallAssessmentComponent_Conditional_1_Conditional_15_For_3_Template_symphiq_chart_container_chartClick_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.openChartModal($event)); });
2794
2970
  i0.ɵɵelementEnd();
2795
2971
  } if (rf & 2) {
2796
2972
  const chart_r3 = ctx.$implicit;
2797
2973
  const ctx_r0 = i0.ɵɵnextContext(3);
2798
2974
  i0.ɵɵproperty("chart", chart_r3)("isLightMode", ctx_r0.isLightMode())("isCompactMode", ctx_r0.isCompactMode())("collapsibleIn", "compact")("isLoading", ctx_r0.isChartsLoading());
2799
2975
  } }
2800
- function OverallAssessmentComponent_Conditional_1_Conditional_23_Template(rf, ctx) { if (rf & 1) {
2801
- i0.ɵɵelementStart(0, "div", 23)(1, "div", 69);
2802
- i0.ɵɵrepeaterCreate(2, OverallAssessmentComponent_Conditional_1_Conditional_23_For_3_Template, 1, 5, "symphiq-chart-container", 70, i0.ɵɵrepeaterTrackByIndex);
2976
+ function OverallAssessmentComponent_Conditional_1_Conditional_15_Template(rf, ctx) { if (rf & 1) {
2977
+ i0.ɵɵelementStart(0, "div", 20)(1, "div", 69);
2978
+ i0.ɵɵrepeaterCreate(2, OverallAssessmentComponent_Conditional_1_Conditional_15_For_3_Template, 1, 5, "symphiq-chart-container", 70, i0.ɵɵrepeaterTrackByIndex);
2803
2979
  i0.ɵɵelementEnd()();
2804
2980
  } if (rf & 2) {
2805
2981
  const ctx_r0 = i0.ɵɵnextContext(2);
2806
2982
  i0.ɵɵadvance(2);
2807
2983
  i0.ɵɵrepeater(ctx_r0.charts());
2808
2984
  } }
2809
- function OverallAssessmentComponent_Conditional_1_Conditional_61_Template(rf, ctx) { if (rf & 1) {
2985
+ function OverallAssessmentComponent_Conditional_1_Conditional_53_Template(rf, ctx) { if (rf & 1) {
2810
2986
  const _r4 = i0.ɵɵgetCurrentView();
2811
- i0.ɵɵelementStart(0, "div", 35)(1, "symphiq-competitive-positioning-summary", 72);
2812
- i0.ɵɵlistener("scrollToCompetitive", function OverallAssessmentComponent_Conditional_1_Conditional_61_Template_symphiq_competitive_positioning_summary_scrollToCompetitive_1_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.scrollToCompetitiveSection()); });
2987
+ i0.ɵɵelementStart(0, "div", 32)(1, "symphiq-competitive-positioning-summary", 72);
2988
+ i0.ɵɵlistener("scrollToCompetitive", function OverallAssessmentComponent_Conditional_1_Conditional_53_Template_symphiq_competitive_positioning_summary_scrollToCompetitive_1_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.scrollToCompetitiveSection()); });
2813
2989
  i0.ɵɵelementEnd()();
2814
2990
  } if (rf & 2) {
2815
2991
  const ctx_r0 = i0.ɵɵnextContext(2);
@@ -2824,71 +3000,62 @@ function OverallAssessmentComponent_Conditional_1_Template(rf, ctx) { if (rf & 1
2824
3000
  i0.ɵɵtext(6);
2825
3001
  i0.ɵɵelementEnd()();
2826
3002
  i0.ɵɵelementStart(7, "div", 15)(8, "div", 16)(9, "div", 17);
2827
- i0.ɵɵtext(10, "Status");
2828
- i0.ɵɵelementEnd();
2829
- i0.ɵɵelementStart(11, "div", 18)(12, "span", 19);
2830
- i0.ɵɵtext(13);
2831
- i0.ɵɵelementEnd();
2832
- i0.ɵɵelementStart(14, "span");
2833
- i0.ɵɵtext(15);
2834
- i0.ɵɵelementEnd()()();
2835
- i0.ɵɵelementStart(16, "div", 20)(17, "div", 17);
2836
- i0.ɵɵtext(18, "Grade");
3003
+ i0.ɵɵtext(10, "Grade");
2837
3004
  i0.ɵɵelementEnd();
2838
- i0.ɵɵelementStart(19, "div", 21);
2839
- i0.ɵɵtext(20);
3005
+ i0.ɵɵelementStart(11, "div", 18);
3006
+ i0.ɵɵtext(12);
2840
3007
  i0.ɵɵelementEnd()()()();
2841
- i0.ɵɵconditionalCreate(21, OverallAssessmentComponent_Conditional_1_Conditional_21_Template, 5, 6, "div", 22)(22, OverallAssessmentComponent_Conditional_1_Conditional_22_Template, 4, 6);
2842
- i0.ɵɵconditionalCreate(23, OverallAssessmentComponent_Conditional_1_Conditional_23_Template, 4, 0, "div", 23);
2843
- i0.ɵɵelementStart(24, "div", 24)(25, "div", 25)(26, "div", 26)(27, "div", 27);
3008
+ i0.ɵɵconditionalCreate(13, OverallAssessmentComponent_Conditional_1_Conditional_13_Template, 5, 6, "div", 19)(14, OverallAssessmentComponent_Conditional_1_Conditional_14_Template, 4, 6);
3009
+ i0.ɵɵconditionalCreate(15, OverallAssessmentComponent_Conditional_1_Conditional_15_Template, 4, 0, "div", 20);
3010
+ i0.ɵɵelementStart(16, "div", 21)(17, "div", 22)(18, "div", 23)(19, "div", 24);
2844
3011
  i0.ɵɵnamespaceSVG();
2845
- i0.ɵɵelementStart(28, "svg", 28);
2846
- i0.ɵɵelement(29, "path", 29);
3012
+ i0.ɵɵelementStart(20, "svg", 25);
3013
+ i0.ɵɵelement(21, "path", 26);
2847
3014
  i0.ɵɵelementEnd()();
2848
3015
  i0.ɵɵnamespaceHTML();
2849
- i0.ɵɵelementStart(30, "h3", 30);
2850
- i0.ɵɵtext(31, "Key Strengths");
3016
+ i0.ɵɵelementStart(22, "h3", 27);
3017
+ i0.ɵɵtext(23, "Key Strengths");
2851
3018
  i0.ɵɵelementEnd()();
2852
- i0.ɵɵelementStart(32, "p", 31);
2853
- i0.ɵɵtext(33);
3019
+ i0.ɵɵelementStart(24, "p", 28);
3020
+ i0.ɵɵtext(25);
2854
3021
  i0.ɵɵelementEnd()();
2855
- i0.ɵɵelementStart(34, "div", 25)(35, "div", 26)(36, "div", 27);
3022
+ i0.ɵɵelementStart(26, "div", 22)(27, "div", 23)(28, "div", 24);
2856
3023
  i0.ɵɵnamespaceSVG();
2857
- i0.ɵɵelementStart(37, "svg", 28);
2858
- i0.ɵɵelement(38, "path", 32);
3024
+ i0.ɵɵelementStart(29, "svg", 25);
3025
+ i0.ɵɵelement(30, "path", 29);
2859
3026
  i0.ɵɵelementEnd()();
2860
3027
  i0.ɵɵnamespaceHTML();
2861
- i0.ɵɵelementStart(39, "h3", 30);
2862
- i0.ɵɵtext(40, "Areas for Improvement");
3028
+ i0.ɵɵelementStart(31, "h3", 27);
3029
+ i0.ɵɵtext(32, "Areas for Improvement");
2863
3030
  i0.ɵɵelementEnd()();
2864
- i0.ɵɵelementStart(41, "p", 31);
2865
- i0.ɵɵtext(42);
3031
+ i0.ɵɵelementStart(33, "p", 28);
3032
+ i0.ɵɵtext(34);
2866
3033
  i0.ɵɵelementEnd()();
2867
- i0.ɵɵelementStart(43, "div", 25)(44, "div", 26)(45, "div", 27);
3034
+ i0.ɵɵelementStart(35, "div", 22)(36, "div", 23)(37, "div", 24);
2868
3035
  i0.ɵɵnamespaceSVG();
2869
- i0.ɵɵelementStart(46, "svg", 28);
2870
- i0.ɵɵelement(47, "path", 33);
3036
+ i0.ɵɵelementStart(38, "svg", 25);
3037
+ i0.ɵɵelement(39, "path", 30);
2871
3038
  i0.ɵɵelementEnd()();
2872
3039
  i0.ɵɵnamespaceHTML();
2873
- i0.ɵɵelementStart(48, "h3", 30);
2874
- i0.ɵɵtext(49, "Prior Year Trend");
3040
+ i0.ɵɵelementStart(40, "h3", 27);
3041
+ i0.ɵɵtext(41, "Prior Year Trend");
2875
3042
  i0.ɵɵelementEnd()();
2876
- i0.ɵɵelementStart(50, "p", 31);
2877
- i0.ɵɵtext(51);
3043
+ i0.ɵɵelementStart(42, "p", 28);
3044
+ i0.ɵɵtext(43);
2878
3045
  i0.ɵɵelementEnd()();
2879
- i0.ɵɵelementStart(52, "div", 25)(53, "div", 26)(54, "div", 27);
3046
+ i0.ɵɵelementStart(44, "div", 22)(45, "div", 23)(46, "div", 24);
2880
3047
  i0.ɵɵnamespaceSVG();
2881
- i0.ɵɵelementStart(55, "svg", 28);
2882
- i0.ɵɵelement(56, "path", 34);
3048
+ i0.ɵɵelementStart(47, "svg", 25);
3049
+ i0.ɵɵelement(48, "path", 31);
2883
3050
  i0.ɵɵelementEnd()();
2884
3051
  i0.ɵɵnamespaceHTML();
2885
- i0.ɵɵelementStart(57, "h3", 30);
2886
- i0.ɵɵtext(58, "Recommended Actions");
3052
+ i0.ɵɵelementStart(49, "h3", 27);
3053
+ i0.ɵɵtext(50, "Recommended Actions");
2887
3054
  i0.ɵɵelementEnd()();
2888
- i0.ɵɵelementStart(59, "p", 31);
2889
- i0.ɵɵtext(60);
3055
+ i0.ɵɵelementStart(51, "p", 28);
3056
+ i0.ɵɵtext(52);
2890
3057
  i0.ɵɵelementEnd()()();
2891
- i0.ɵɵconditionalCreate(61, OverallAssessmentComponent_Conditional_1_Conditional_61_Template, 2, 3, "div", 35);
3058
+ i0.ɵɵconditionalCreate(53, OverallAssessmentComponent_Conditional_1_Conditional_53_Template, 2, 3, "div", 32);
2892
3059
  i0.ɵɵelementEnd();
2893
3060
  } if (rf & 2) {
2894
3061
  const ctx_r0 = i0.ɵɵnextContext();
@@ -2900,15 +3067,6 @@ function OverallAssessmentComponent_Conditional_1_Template(rf, ctx) { if (rf & 1
2900
3067
  i0.ɵɵadvance();
2901
3068
  i0.ɵɵtextInterpolate(ctx_r0.assessment().targetPacingStatus);
2902
3069
  i0.ɵɵadvance(2);
2903
- i0.ɵɵclassMap(ctx_r0.statusBadgeClass());
2904
- i0.ɵɵproperty("ngStyle", ctx_r0.getStatusBadgeStyle())("libSymphiqTooltip", ctx_r0.statusBadgeTooltip())("tooltipPosition", "bottom");
2905
- i0.ɵɵadvance();
2906
- i0.ɵɵclassMap(ctx_r0.badgeLabelClass());
2907
- i0.ɵɵadvance(4);
2908
- i0.ɵɵtextInterpolate(ctx_r0.getStatusIcon());
2909
- i0.ɵɵadvance(2);
2910
- i0.ɵɵtextInterpolate(ctx_r0.statusLabel());
2911
- i0.ɵɵadvance();
2912
3070
  i0.ɵɵclassMap(ctx_r0.gradeBadgeClass());
2913
3071
  i0.ɵɵclassProp("animate-pulse", ctx_r0.shouldPulseGrade());
2914
3072
  i0.ɵɵproperty("libSymphiqTooltip", ctx_r0.gradeTooltip())("tooltipPosition", "bottom");
@@ -2917,9 +3075,9 @@ function OverallAssessmentComponent_Conditional_1_Template(rf, ctx) { if (rf & 1
2917
3075
  i0.ɵɵadvance(3);
2918
3076
  i0.ɵɵtextInterpolate(ctx_r0.assessment().grade);
2919
3077
  i0.ɵɵadvance();
2920
- i0.ɵɵconditional(ctx_r0.isCompactMode() ? 21 : 22);
3078
+ i0.ɵɵconditional(ctx_r0.isCompactMode() ? 13 : 14);
2921
3079
  i0.ɵɵadvance(2);
2922
- i0.ɵɵconditional(ctx_r0.charts() && ctx_r0.charts().length > 0 ? 23 : -1);
3080
+ i0.ɵɵconditional(ctx_r0.charts() && ctx_r0.charts().length > 0 ? 15 : -1);
2923
3081
  i0.ɵɵadvance(2);
2924
3082
  i0.ɵɵclassMap(ctx_r0.strengthsCardClass());
2925
3083
  i0.ɵɵadvance(2);
@@ -2969,7 +3127,7 @@ function OverallAssessmentComponent_Conditional_1_Template(rf, ctx) { if (rf & 1
2969
3127
  i0.ɵɵadvance();
2970
3128
  i0.ɵɵtextInterpolate(ctx_r0.assessment().recommendedActions);
2971
3129
  i0.ɵɵadvance();
2972
- i0.ɵɵconditional(ctx_r0.hasCompetitiveData() ? 61 : -1);
3130
+ i0.ɵɵconditional(ctx_r0.hasCompetitiveData() ? 53 : -1);
2973
3131
  } }
2974
3132
  class OverallAssessmentComponent {
2975
3133
  constructor() {
@@ -3009,8 +3167,6 @@ class OverallAssessmentComponent {
3009
3167
  this.lightModeBadgeLabelClass = computed(() => 'text-slate-600', ...(ngDevMode ? [{ debugName: "lightModeBadgeLabelClass" }] : []));
3010
3168
  this.darkModeBadgeLabelClass = computed(() => 'text-slate-400', ...(ngDevMode ? [{ debugName: "darkModeBadgeLabelClass" }] : []));
3011
3169
  this.badgeLabelClass = computed(() => this.isLightMode() ? this.lightModeBadgeLabelClass() : this.darkModeBadgeLabelClass(), ...(ngDevMode ? [{ debugName: "badgeLabelClass" }] : []));
3012
- this.statusBadgeClass = computed(() => this.getStatusBadgeClass(), ...(ngDevMode ? [{ debugName: "statusBadgeClass" }] : []));
3013
- this.statusLabel = computed(() => this.getStatusLabel(), ...(ngDevMode ? [{ debugName: "statusLabel" }] : []));
3014
3170
  this.gradeBadgeClass = computed(() => this.getGradeBadgeClass(), ...(ngDevMode ? [{ debugName: "gradeBadgeClass" }] : []));
3015
3171
  this.shouldPulseGrade = computed(() => {
3016
3172
  const grade = this.assessment().grade || 'B';
@@ -3140,22 +3296,22 @@ class OverallAssessmentComponent {
3140
3296
  }, ...(ngDevMode ? [{ debugName: "revenueTooltip" }] : []));
3141
3297
  this.revenueStatusTooltip = computed(() => {
3142
3298
  const metric = this.revenueMetric();
3143
- return {
3144
- title: 'STATUS',
3145
- status: metric?.status || 'ON_TRACK',
3146
- description: metric?.description || ''
3147
- };
3299
+ if (!metric)
3300
+ return undefined;
3301
+ return this.tooltipDataService.extractStatusTooltipData(metric);
3148
3302
  }, ...(ngDevMode ? [{ debugName: "revenueStatusTooltip" }] : []));
3149
- this.statusBadgeTooltip = computed(() => ({
3150
- status: this.assessment().overallStatus || 'ON_TRACK',
3151
- pacingPercentage: this.calculateOverallPacing(),
3152
- progressPercent: this.calculateOverallPacing()
3153
- }), ...(ngDevMode ? [{ debugName: "statusBadgeTooltip" }] : []));
3154
3303
  this.gradeTooltip = computed(() => ({
3155
3304
  title: 'Performance Grade',
3156
3305
  grade: this.assessment().grade || 'B',
3157
- explanation: this.getGradeExplanation()
3306
+ explanation: this.assessment().gradeDescription || this.getGradeExplanation()
3158
3307
  }), ...(ngDevMode ? [{ debugName: "gradeTooltip" }] : []));
3308
+ this.revenueTrendTooltip = computed(() => {
3309
+ const metric = this.revenueMetric();
3310
+ if (!metric)
3311
+ return undefined;
3312
+ const chart = this.charts().find(c => c.title?.includes('Revenue'));
3313
+ return this.tooltipDataService.extractTrendTooltipData(metric, chart);
3314
+ }, ...(ngDevMode ? [{ debugName: "revenueTrendTooltip" }] : []));
3159
3315
  }
3160
3316
  openChartModal(chart) {
3161
3317
  this.modalService.openChartModal(chart);
@@ -3219,64 +3375,6 @@ class OverallAssessmentComponent {
3219
3375
  }
3220
3376
  return {};
3221
3377
  }
3222
- // Memoized status badge light mode classes
3223
- getStatusBadgeClassLight() {
3224
- const baseClass = 'px-4 py-2 rounded-xl border transition-all duration-300 backdrop-blur-md';
3225
- const status = this.assessment().overallStatus || 'ON_TRACK';
3226
- switch (status) {
3227
- case 'ON_TRACK':
3228
- return `${baseClass} bg-gradient-to-br from-blue-100/90 to-blue-50/90 text-blue-700 border-blue-200/50 shadow-[3px_3px_6px_rgba(163,163,163,0.25),-3px_-3px_6px_rgba(255,255,255,0.75)]`;
3229
- case 'OVERACHIEVING':
3230
- return `${baseClass} bg-gradient-to-br from-emerald-100/90 to-emerald-50/90 text-emerald-700 border-emerald-200/50 shadow-[3px_3px_6px_rgba(163,163,163,0.25),-3px_-3px_6px_rgba(255,255,255,0.75)]`;
3231
- case 'AT_RISK':
3232
- return `${baseClass} bg-gradient-to-br from-amber-100/90 to-amber-50/90 text-amber-700 border-amber-200/50 shadow-[3px_3px_6px_rgba(163,163,163,0.25),-3px_-3px_6px_rgba(255,255,255,0.75)]`;
3233
- default:
3234
- return `${baseClass} bg-gradient-to-br from-slate-100/90 to-slate-50/90 text-slate-700 border-slate-200/50 shadow-[3px_3px_6px_rgba(163,163,163,0.25),-3px_-3px_6px_rgba(255,255,255,0.75)]`;
3235
- }
3236
- }
3237
- // Memoized status badge dark mode classes
3238
- getStatusBadgeClassDark() {
3239
- const baseClass = 'px-4 py-2 rounded-xl border transition-all duration-300 backdrop-blur-md';
3240
- const status = this.assessment().overallStatus || 'ON_TRACK';
3241
- switch (status) {
3242
- case 'ON_TRACK':
3243
- return `${baseClass} bg-gradient-to-r from-blue-500/20 to-blue-500/10 text-blue-400 border-blue-500/30 shadow-lg shadow-blue-500/20`;
3244
- case 'OVERACHIEVING':
3245
- return `${baseClass} bg-gradient-to-r from-emerald-500/20 to-emerald-500/10 text-emerald-400 border-emerald-500/30 shadow-lg shadow-emerald-500/20`;
3246
- case 'AT_RISK':
3247
- return `${baseClass} bg-gradient-to-r from-amber-500/20 to-amber-500/10 text-amber-400 border-amber-500/30 shadow-lg shadow-amber-500/20`;
3248
- default:
3249
- return `${baseClass} bg-gradient-to-r from-slate-500/20 to-slate-500/10 text-slate-400 border-slate-500/30 shadow-lg shadow-slate-500/20`;
3250
- }
3251
- }
3252
- getStatusBadgeClass() {
3253
- return this.isLightMode() ? this.getStatusBadgeClassLight() : this.getStatusBadgeClassDark();
3254
- }
3255
- getStatusBadgeStyle() {
3256
- const status = this.assessment().overallStatus || 'ON_TRACK';
3257
- if (status === 'AT_RISK') {
3258
- return {
3259
- animation: 'pulseSubtle 2s ease-in-out infinite'
3260
- };
3261
- }
3262
- return {};
3263
- }
3264
- getStatusLabel() {
3265
- return (this.assessment().overallStatus || '').replace(/_/g, ' ');
3266
- }
3267
- getStatusIcon() {
3268
- const status = this.assessment().overallStatus || 'ON_TRACK';
3269
- switch (status) {
3270
- case 'OVERACHIEVING':
3271
- return '↑';
3272
- case 'ON_TRACK':
3273
- return '→';
3274
- case 'AT_RISK':
3275
- return '⚠';
3276
- default:
3277
- return '•';
3278
- }
3279
- }
3280
3378
  getRevenueStatusIcon() {
3281
3379
  const metric = this.revenueMetric();
3282
3380
  const status = metric?.status || 'ON_TRACK';
@@ -3352,8 +3450,8 @@ class OverallAssessmentComponent {
3352
3450
  }
3353
3451
  }
3354
3452
  static { this.ɵfac = function OverallAssessmentComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || OverallAssessmentComponent)(); }; }
3355
- static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OverallAssessmentComponent, selectors: [["symphiq-funnel-analysis-overall-assessment"]], inputs: { assessment: [1, "assessment"], revenueMetric: [1, "revenueMetric"], charts: [1, "charts"], metrics: [1, "metrics"], isLightMode: [1, "isLightMode"], isLoading: [1, "isLoading"], isCompactMode: [1, "isCompactMode"], isChartsLoading: [1, "isChartsLoading"] }, outputs: { scrollToSection: "scrollToSection" }, decls: 2, vars: 1, consts: [[1, "rounded-2xl", "p-4", "sm:p-6", "lg:p-8", "border", "shadow-xl", "backdrop-blur-lg", 3, "class"], [1, "rounded-2xl", "p-4", "sm:p-6", "lg:p-8", "border", "shadow-xl", "transition-all", "duration-500", "hover:shadow-2xl", "group", "backdrop-blur-lg", 3, "class"], [1, "rounded-2xl", "p-4", "sm:p-6", "lg:p-8", "border", "shadow-xl", "backdrop-blur-lg"], [1, "space-y-6"], [1, "flex", "items-start", "justify-between", "gap-4"], [1, "flex-1", "space-y-3"], [3, "width", "height", "isLightMode"], [1, "flex", "gap-3"], [1, "grid", "grid-cols-2", "gap-4"], [1, "space-y-2"], [1, "rounded-2xl", "p-4", "sm:p-6", "lg:p-8", "border", "shadow-xl", "transition-all", "duration-500", "hover:shadow-2xl", "group", "backdrop-blur-lg"], [1, "flex", "flex-col", "sm:flex-row", "items-start", "justify-between", "gap-4", "mb-4", "sm:mb-6"], [1, "flex-1"], [1, "text-2xl", "sm:text-3xl", "font-bold", "mb-2"], [1, "text-sm", "sm:text-base"], [1, "flex", "items-center", "gap-3", "sm:gap-4", "w-full", "sm:w-auto"], ["tooltipType", "status", 1, "text-center", "flex-1", "sm:flex-initial", "transition-all", "duration-300", "hover:scale-105", 3, "ngStyle", "libSymphiqTooltip", "tooltipPosition"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wider", "mb-1"], [1, "text-base", "sm:text-lg", "font-bold", "flex", "items-center", "justify-center", "gap-2"], [1, "text-lg"], ["tooltipType", "badge", 1, "flex-1", "sm:flex-initial", "transition-all", "duration-300", "hover:scale-110", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "text-3xl", "sm:text-4xl", "font-bold"], [1, "flex", "flex-wrap", "gap-4", "mb-6", "sm:mb-8"], [1, "mb-4", "sm:mb-6"], [1, "grid", "grid-cols-1", "md:grid-cols-2", "gap-4", "sm:gap-6"], [1, "rounded-xl", "p-4", "sm:p-6", "border", "transition-all", "duration-300", "hover:scale-105", "hover:shadow-xl"], [1, "flex", "items-center", "gap-3", "mb-3"], [1, "w-8", "h-8", "sm:w-10", "sm:h-10", "rounded-lg", "flex", "items-center", "justify-center", "flex-shrink-0"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", "sm:w-6", "sm:h-6"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "text-base", "sm:text-lg", "font-semibold"], [1, "text-xs", "sm:text-sm", "leading-relaxed"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"], [1, "mt-6", "sm:mt-8"], [1, "flex-shrink-0", "rounded-xl", "p-6", "sm:p-8", "border-2", "transition-all", "duration-500", "hover:scale-[1.01]", 3, "class"], [1, "flex-1", "min-w-[300px]", "rounded-xl", "p-4", "sm:p-6", "border", "transition-all", "duration-300", "hover:shadow-xl", "hover:scale-[1.01]", "group"], [1, "text-sm", "sm:text-base", "leading-relaxed"], [1, "flex-shrink-0", "rounded-xl", "p-6", "sm:p-8", "border-2", "transition-all", "duration-500", "hover:scale-[1.01]"], [1, "w-10", "h-10", "sm:w-12", "sm:h-12", "rounded-lg", "flex", "items-center", "justify-center", "flex-shrink-0"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "sm:w-7", "sm:h-7"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "min-w-0", "flex-1"], [1, "text-xs", "sm:text-sm", "font-semibold", "uppercase", "tracking-wider"], ["tooltipType", "metric", 1, "text-2xl", "sm:text-3xl", "lg:text-4xl", "font-bold", "truncate", "transition-all", "duration-300", "hover:scale-105", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "flex", "flex-col", "gap-2", "mb-3"], [1, "flex", "flex-col", "sm:flex-row", "sm:items-center", "gap-2", "sm:gap-4"], [1, "flex", "items-center", "gap-2"], ["fill", "currentColor", "viewBox", "0 0 20 20", 1, "w-4", "h-4", "flex-shrink-0"], ["fill-rule", "evenodd", "d", "M5.293 9.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 7.414V15a1 1 0 11-2 0V7.414L6.707 9.707a1 1 0 01-1.414 0z", "clip-rule", "evenodd"], [1, "font-semibold", "text-base"], [1, "text-xs"], [1, "hidden", "sm:block", "h-6", "w-px", "bg-slate-600"], [1, "font-semibold", "text-sm"], ["tooltipType", "status", 1, "inline-flex", "items-center", "gap-2", "px-3", "sm:px-4", "py-1.5", "sm:py-2", "rounded-lg", "font-bold", "text-base", "sm:text-lg", "transition-all", "duration-300", 3, "ngStyle", "libSymphiqTooltip", "tooltipPosition"], [1, "rounded-xl", "p-6", "sm:p-8", "mb-6", "sm:mb-8", "border-2", "transition-all", "duration-500", "hover:scale-[1.01]", 3, "class"], [1, "rounded-xl", "p-4", "sm:p-6", "mb-4", "sm:mb-6", "border", "transition-all", "duration-300", "hover:shadow-xl", "hover:scale-[1.01]", "group"], [1, "rounded-xl", "p-6", "sm:p-8", "mb-6", "sm:mb-8", "border-2", "transition-all", "duration-500", "hover:scale-[1.01]"], [1, "flex", "flex-col", "md:flex-row", "items-start", "md:items-center", "gap-4", "md:gap-0"], [1, "flex-1", "w-full"], [1, "flex", "flex-col", "gap-2", "mt-4"], ["fill", "currentColor", "viewBox", "0 0 20 20", 1, "w-4", "h-4", "sm:w-5", "sm:h-5", "flex-shrink-0"], [1, "font-semibold", "text-base", "sm:text-lg"], [1, "text-xs", "sm:text-sm"], [1, "font-semibold", "text-sm", "sm:text-base"], [1, "w-full", "md:w-auto", "md:text-right", "md:ml-4"], [1, "inline-flex", "items-center", "gap-2", "px-3", "sm:px-4", "py-1.5", "sm:py-2", "rounded-lg", "font-bold", "text-base", "sm:text-lg", "transition-all", "duration-300", 3, "ngStyle"], [1, "mt-2", "text-xs", "sm:text-sm"], [1, "grid", "grid-cols-1", "lg:grid-cols-2", "gap-4"], [3, "chart", "isLightMode", "isCompactMode", "collapsibleIn", "isLoading"], [3, "chartClick", "chart", "isLightMode", "isCompactMode", "collapsibleIn", "isLoading"], [3, "scrollToCompetitive", "metrics", "isLightMode", "isCompactMode"]], template: function OverallAssessmentComponent_Template(rf, ctx) { if (rf & 1) {
3356
- i0.ɵɵconditionalCreate(0, OverallAssessmentComponent_Conditional_0_Template, 13, 18, "div", 0)(1, OverallAssessmentComponent_Conditional_1_Template, 62, 72, "div", 1);
3453
+ static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OverallAssessmentComponent, selectors: [["symphiq-funnel-analysis-overall-assessment"]], inputs: { assessment: [1, "assessment"], revenueMetric: [1, "revenueMetric"], charts: [1, "charts"], metrics: [1, "metrics"], isLightMode: [1, "isLightMode"], isLoading: [1, "isLoading"], isCompactMode: [1, "isCompactMode"], isChartsLoading: [1, "isChartsLoading"] }, outputs: { scrollToSection: "scrollToSection" }, decls: 2, vars: 1, consts: [[1, "rounded-2xl", "p-4", "sm:p-6", "lg:p-8", "border", "shadow-xl", "backdrop-blur-lg", 3, "class"], [1, "rounded-2xl", "p-4", "sm:p-6", "lg:p-8", "border", "shadow-xl", "transition-all", "duration-500", "hover:shadow-2xl", "group", "backdrop-blur-lg", 3, "class"], [1, "rounded-2xl", "p-4", "sm:p-6", "lg:p-8", "border", "shadow-xl", "backdrop-blur-lg"], [1, "space-y-6"], [1, "flex", "items-start", "justify-between", "gap-4"], [1, "flex-1", "space-y-3"], [3, "width", "height", "isLightMode"], [1, "flex", "gap-3", "justify-end"], [1, "grid", "grid-cols-2", "gap-4"], [1, "space-y-2"], [1, "rounded-2xl", "p-4", "sm:p-6", "lg:p-8", "border", "shadow-xl", "transition-all", "duration-500", "hover:shadow-2xl", "group", "backdrop-blur-lg"], [1, "flex", "flex-col", "sm:flex-row", "items-start", "justify-between", "gap-4", "mb-4", "sm:mb-6"], [1, "flex-1"], [1, "text-2xl", "sm:text-3xl", "font-bold", "mb-2"], [1, "text-sm", "sm:text-base"], [1, "flex", "items-center", "gap-3", "sm:gap-4", "w-full", "sm:w-auto", "justify-end"], ["tooltipType", "badge", 1, "flex-1", "sm:flex-initial", "transition-all", "duration-300", "hover:scale-110", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wider", "mb-1"], [1, "text-3xl", "sm:text-4xl", "font-bold"], [1, "flex", "flex-wrap", "gap-4", "mb-6", "sm:mb-8"], [1, "mb-4", "sm:mb-6"], [1, "grid", "grid-cols-1", "md:grid-cols-2", "gap-4", "sm:gap-6"], [1, "rounded-xl", "p-4", "sm:p-6", "border", "transition-all", "duration-300", "hover:scale-105", "hover:shadow-xl"], [1, "flex", "items-center", "gap-3", "mb-3"], [1, "w-8", "h-8", "sm:w-10", "sm:h-10", "rounded-lg", "flex", "items-center", "justify-center", "flex-shrink-0"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", "sm:w-6", "sm:h-6"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "text-base", "sm:text-lg", "font-semibold"], [1, "text-xs", "sm:text-sm", "leading-relaxed"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"], [1, "mt-6", "sm:mt-8"], [1, "flex-shrink-0", "rounded-xl", "p-6", "sm:p-8", "border-2", "transition-all", "duration-500", "hover:scale-[1.01]", 3, "class"], [1, "flex-1", "min-w-[300px]", "rounded-xl", "p-4", "sm:p-6", "border", "transition-all", "duration-300", "hover:shadow-xl", "hover:scale-[1.01]", "group"], [1, "text-sm", "sm:text-base", "leading-relaxed"], [1, "flex-shrink-0", "rounded-xl", "p-6", "sm:p-8", "border-2", "transition-all", "duration-500", "hover:scale-[1.01]"], [1, "w-10", "h-10", "sm:w-12", "sm:h-12", "rounded-lg", "flex", "items-center", "justify-center", "flex-shrink-0"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "sm:w-7", "sm:h-7"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "min-w-0", "flex-1"], [1, "text-xs", "sm:text-sm", "font-semibold", "uppercase", "tracking-wider"], ["tooltipType", "metric", 1, "text-2xl", "sm:text-3xl", "lg:text-4xl", "font-bold", "truncate", "transition-all", "duration-300", "hover:scale-105", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "flex", "flex-col", "gap-2", "mb-3"], [1, "flex", "flex-col", "sm:flex-row", "sm:items-center", "gap-2", "sm:gap-4"], ["tooltipType", "trend", 1, "flex", "items-center", "gap-2", 3, "libSymphiqTooltip", "tooltipPosition"], ["fill", "currentColor", "viewBox", "0 0 20 20", 1, "w-4", "h-4", "flex-shrink-0"], ["fill-rule", "evenodd", "d", "M5.293 9.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 7.414V15a1 1 0 11-2 0V7.414L6.707 9.707a1 1 0 01-1.414 0z", "clip-rule", "evenodd"], [1, "font-semibold", "text-base"], [1, "text-xs"], [1, "hidden", "sm:block", "h-6", "w-px", "bg-slate-600"], ["tooltipType", "status", 3, "libSymphiqTooltip", "tooltipPosition"], [1, "font-semibold", "text-sm"], ["tooltipType", "status", 1, "flex", "items-center", "gap-2", 3, "libSymphiqTooltip", "tooltipPosition"], ["tooltipType", "status", 1, "inline-flex", "items-center", "gap-2", "px-3", "sm:px-4", "py-1.5", "sm:py-2", "rounded-lg", "font-bold", "text-base", "sm:text-lg", "transition-all", "duration-300", 3, "ngStyle", "libSymphiqTooltip", "tooltipPosition"], [1, "text-lg"], [1, "rounded-xl", "p-6", "sm:p-8", "mb-6", "sm:mb-8", "border-2", "transition-all", "duration-500", "hover:scale-[1.01]", 3, "class"], [1, "rounded-xl", "p-4", "sm:p-6", "mb-4", "sm:mb-6", "border", "transition-all", "duration-300", "hover:shadow-xl", "hover:scale-[1.01]", "group"], [1, "rounded-xl", "p-6", "sm:p-8", "mb-6", "sm:mb-8", "border-2", "transition-all", "duration-500", "hover:scale-[1.01]"], [1, "flex", "flex-col", "md:flex-row", "items-start", "md:items-center", "gap-4", "md:gap-0"], [1, "flex-1", "w-full"], [1, "flex", "flex-col", "gap-2", "mt-4"], ["fill", "currentColor", "viewBox", "0 0 20 20", 1, "w-4", "h-4", "sm:w-5", "sm:h-5", "flex-shrink-0"], [1, "font-semibold", "text-base", "sm:text-lg"], [1, "text-xs", "sm:text-sm"], [1, "font-semibold", "text-sm", "sm:text-base"], [1, "w-full", "md:w-auto", "md:text-right", "md:ml-4"], [1, "inline-flex", "items-center", "gap-2", "px-3", "sm:px-4", "py-1.5", "sm:py-2", "rounded-lg", "font-bold", "text-base", "sm:text-lg", "transition-all", "duration-300", 3, "ngStyle"], [1, "mt-2", "text-xs", "sm:text-sm"], [1, "grid", "grid-cols-1", "lg:grid-cols-2", "gap-4"], [3, "chart", "isLightMode", "isCompactMode", "collapsibleIn", "isLoading"], [3, "chartClick", "chart", "isLightMode", "isCompactMode", "collapsibleIn", "isLoading"], [3, "scrollToCompetitive", "metrics", "isLightMode", "isCompactMode"]], template: function OverallAssessmentComponent_Template(rf, ctx) { if (rf & 1) {
3454
+ i0.ɵɵconditionalCreate(0, OverallAssessmentComponent_Conditional_0_Template, 12, 15, "div", 0)(1, OverallAssessmentComponent_Conditional_1_Template, 54, 63, "div", 1);
3357
3455
  } if (rf & 2) {
3358
3456
  i0.ɵɵconditional(ctx.isLoading() ? 0 : 1);
3359
3457
  } }, dependencies: [CommonModule, i1.NgStyle, ChartContainerComponent, TooltipDirective, SkeletonLoaderComponent, CompetitivePositioningSummaryComponent], encapsulation: 2, changeDetection: 0 }); }
@@ -3374,8 +3472,7 @@ class OverallAssessmentComponent {
3374
3472
  <symphiq-skeleton-loader [width]="'60%'" [height]="'32px'" [isLightMode]="isLightMode()"></symphiq-skeleton-loader>
3375
3473
  <symphiq-skeleton-loader [width]="'80%'" [height]="'16px'" [isLightMode]="isLightMode()"></symphiq-skeleton-loader>
3376
3474
  </div>
3377
- <div class="flex gap-3">
3378
- <symphiq-skeleton-loader [width]="'100px'" [height]="'70px'" [isLightMode]="isLightMode()"></symphiq-skeleton-loader>
3475
+ <div class="flex gap-3 justify-end">
3379
3476
  <symphiq-skeleton-loader [width]="'100px'" [height]="'70px'" [isLightMode]="isLightMode()"></symphiq-skeleton-loader>
3380
3477
  </div>
3381
3478
  </div>
@@ -3397,20 +3494,7 @@ class OverallAssessmentComponent {
3397
3494
  <h2 [class]="titleClass()" class="text-2xl sm:text-3xl font-bold mb-2">Overall Performance</h2>
3398
3495
  <p [class]="subtitleClass()" class="text-sm sm:text-base">{{ assessment().targetPacingStatus }}</p>
3399
3496
  </div>
3400
- <div class="flex items-center gap-3 sm:gap-4 w-full sm:w-auto">
3401
- <div
3402
- [class]="statusBadgeClass()"
3403
- [ngStyle]="getStatusBadgeStyle()"
3404
- class="text-center flex-1 sm:flex-initial transition-all duration-300 hover:scale-105"
3405
- [libSymphiqTooltip]="statusBadgeTooltip()"
3406
- tooltipType="status"
3407
- [tooltipPosition]="'bottom'">
3408
- <div [class]="badgeLabelClass()" class="text-xs font-semibold uppercase tracking-wider mb-1">Status</div>
3409
- <div class="text-base sm:text-lg font-bold flex items-center justify-center gap-2">
3410
- <span class="text-lg">{{ getStatusIcon() }}</span>
3411
- <span>{{ statusLabel() }}</span>
3412
- </div>
3413
- </div>
3497
+ <div class="flex items-center gap-3 sm:gap-4 w-full sm:w-auto justify-end">
3414
3498
  <div
3415
3499
  [class]="gradeBadgeClass()"
3416
3500
  [class.animate-pulse]="shouldPulseGrade()"
@@ -3448,7 +3532,11 @@ class OverallAssessmentComponent {
3448
3532
  </div>
3449
3533
  <div class="flex flex-col gap-2 mb-3">
3450
3534
  <div class="flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-4">
3451
- <div class="flex items-center gap-2">
3535
+ <div
3536
+ class="flex items-center gap-2"
3537
+ [libSymphiqTooltip]="revenueTrendTooltip()"
3538
+ tooltipType="trend"
3539
+ [tooltipPosition]="'top'">
3452
3540
  <svg [class]="trendIconClass()" class="w-4 h-4 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
3453
3541
  <path fill-rule="evenodd" d="M5.293 9.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 7.414V15a1 1 0 11-2 0V7.414L6.707 9.707a1 1 0 01-1.414 0z" clip-rule="evenodd" />
3454
3542
  </svg>
@@ -3456,13 +3544,20 @@ class OverallAssessmentComponent {
3456
3544
  <span [class]="badgeLabelClass()" class="text-xs">vs last year</span>
3457
3545
  </div>
3458
3546
  <div class="hidden sm:block h-6 w-px bg-slate-600"></div>
3459
- <div>
3547
+ <div
3548
+ [libSymphiqTooltip]="revenueStatusTooltip()"
3549
+ tooltipType="status"
3550
+ [tooltipPosition]="'top'">
3460
3551
  <span [class]="badgeLabelClass()" class="text-xs">Target: </span>
3461
3552
  <span [class]="titleClass()" class="font-semibold text-sm">{{ formattedRevenueTarget() }}</span>
3462
3553
  </div>
3463
3554
  </div>
3464
3555
  @if (hasRevenuePacing()) {
3465
- <div class="flex items-center gap-2">
3556
+ <div
3557
+ class="flex items-center gap-2"
3558
+ [libSymphiqTooltip]="revenueStatusTooltip()"
3559
+ tooltipType="status"
3560
+ [tooltipPosition]="'top'">
3466
3561
  <span [class]="badgeLabelClass()" class="text-xs">2025 Pacing: </span>
3467
3562
  <span [class]="titleClass()" class="font-semibold text-sm">{{ formattedRevenuePacing() }}</span>
3468
3563
  </div>
@@ -3511,7 +3606,11 @@ class OverallAssessmentComponent {
3511
3606
  </div>
3512
3607
  <div class="flex flex-col gap-2 mt-4">
3513
3608
  <div class="flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-4">
3514
- <div class="flex items-center gap-2">
3609
+ <div
3610
+ class="flex items-center gap-2"
3611
+ [libSymphiqTooltip]="revenueTrendTooltip()"
3612
+ tooltipType="trend"
3613
+ [tooltipPosition]="'top'">
3515
3614
  <svg [class]="trendIconClass()" class="w-4 h-4 sm:w-5 sm:h-5 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
3516
3615
  <path fill-rule="evenodd" d="M5.293 9.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 7.414V15a1 1 0 11-2 0V7.414L6.707 9.707a1 1 0 01-1.414 0z" clip-rule="evenodd" />
3517
3616
  </svg>
@@ -3519,13 +3618,20 @@ class OverallAssessmentComponent {
3519
3618
  <span [class]="badgeLabelClass()" class="text-xs sm:text-sm">vs last year</span>
3520
3619
  </div>
3521
3620
  <div class="hidden sm:block h-6 w-px bg-slate-600"></div>
3522
- <div>
3621
+ <div
3622
+ [libSymphiqTooltip]="revenueStatusTooltip()"
3623
+ tooltipType="status"
3624
+ [tooltipPosition]="'top'">
3523
3625
  <span [class]="badgeLabelClass()" class="text-xs sm:text-sm">Target: </span>
3524
3626
  <span [class]="titleClass()" class="font-semibold text-sm sm:text-base">{{ formattedRevenueTarget() }}</span>
3525
3627
  </div>
3526
3628
  </div>
3527
3629
  @if (hasRevenuePacing()) {
3528
- <div class="flex items-center gap-2">
3630
+ <div
3631
+ class="flex items-center gap-2"
3632
+ [libSymphiqTooltip]="revenueStatusTooltip()"
3633
+ tooltipType="status"
3634
+ [tooltipPosition]="'top'">
3529
3635
  <span [class]="badgeLabelClass()" class="text-xs sm:text-sm">2025 Pacing: </span>
3530
3636
  <span [class]="titleClass()" class="font-semibold text-sm sm:text-base">{{ formattedRevenuePacing() }}</span>
3531
3637
  </div>
@@ -3624,7 +3730,7 @@ class OverallAssessmentComponent {
3624
3730
  `,
3625
3731
  }]
3626
3732
  }], null, { assessment: [{ type: i0.Input, args: [{ isSignal: true, alias: "assessment", required: false }] }], revenueMetric: [{ type: i0.Input, args: [{ isSignal: true, alias: "revenueMetric", required: false }] }], charts: [{ type: i0.Input, args: [{ isSignal: true, alias: "charts", required: false }] }], metrics: [{ type: i0.Input, args: [{ isSignal: true, alias: "metrics", required: false }] }], isLightMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLightMode", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], isCompactMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCompactMode", required: false }] }], isChartsLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isChartsLoading", required: false }] }], scrollToSection: [{ type: i0.Output, args: ["scrollToSection"] }] }); })();
3627
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OverallAssessmentComponent, { className: "OverallAssessmentComponent", filePath: "lib/components/funnel-analysis-dashboard/overall-assessment.component.ts", lineNumber: 274 }); })();
3733
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OverallAssessmentComponent, { className: "OverallAssessmentComponent", filePath: "lib/components/funnel-analysis-dashboard/overall-assessment.component.ts", lineNumber: 282 }); })();
3628
3734
 
3629
3735
  const _c0$8 = () => [1, 2, 3];
3630
3736
  const _c1$2 = () => [1, 2, 3, 4];
@@ -6206,7 +6312,7 @@ class MetricCardComponent {
6206
6312
  const _c0$7 = () => [1, 2, 3];
6207
6313
  const _c1$1 = (a0, a1, a2) => [a0, a1, a2];
6208
6314
  const _c2$1 = (a0, a1) => [a0, a1];
6209
- const _forTrack0$5 = ($index, $item) => $item.metric;
6315
+ const _forTrack0$7 = ($index, $item) => $item.metric;
6210
6316
  const _forTrack1$1 = ($index, $item) => $item.dimensionValue;
6211
6317
  function BreakdownSectionComponent_Conditional_0_For_7_For_4_Template(rf, ctx) { if (rf & 1) {
6212
6318
  i0.ɵɵelementStart(0, "div", 7);
@@ -6529,7 +6635,7 @@ function BreakdownSectionComponent_Conditional_1_Template(rf, ctx) { if (rf & 1)
6529
6635
  i0.ɵɵelementEnd()();
6530
6636
  i0.ɵɵconditionalCreate(6, BreakdownSectionComponent_Conditional_1_Conditional_6_Template, 3, 0, "div", 11);
6531
6637
  i0.ɵɵelementStart(7, "div", 12);
6532
- i0.ɵɵrepeaterCreate(8, BreakdownSectionComponent_Conditional_1_For_9_Template, 28, 18, "div", 13, _forTrack0$5);
6638
+ i0.ɵɵrepeaterCreate(8, BreakdownSectionComponent_Conditional_1_For_9_Template, 28, 18, "div", 13, _forTrack0$7);
6533
6639
  i0.ɵɵelementEnd()();
6534
6640
  } if (rf & 2) {
6535
6641
  const ctx_r0 = i0.ɵɵnextContext();
@@ -10857,63 +10963,697 @@ class NarrativeTooltipComponent {
10857
10963
  }], null, { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: true }] }], isLightMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLightMode", required: false }] }] }); })();
10858
10964
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NarrativeTooltipComponent, { className: "NarrativeTooltipComponent", filePath: "lib/components/funnel-analysis-dashboard/tooltip/narrative-tooltip.component.ts", lineNumber: 25 }); })();
10859
10965
 
10860
- const _c0$6 = () => [];
10861
- function TooltipContainerComponent_Conditional_0_Case_3_Conditional_0_Template(rf, ctx) { if (rf & 1) {
10862
- i0.ɵɵelement(0, "symphiq-metric-value-tooltip", 6);
10863
- } if (rf & 2) {
10864
- const ctx_r1 = i0.ɵɵnextContext(3);
10865
- i0.ɵɵproperty("content", ctx_r1.metricContent())("isLightMode", ctx_r1.isLightMode());
10866
- } }
10867
- function TooltipContainerComponent_Conditional_0_Case_3_Template(rf, ctx) { if (rf & 1) {
10868
- i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_3_Conditional_0_Template, 1, 2, "symphiq-metric-value-tooltip", 6);
10869
- } if (rf & 2) {
10870
- const ctx_r1 = i0.ɵɵnextContext(2);
10871
- i0.ɵɵconditional(ctx_r1.metricContent() ? 0 : -1);
10872
- } }
10873
- function TooltipContainerComponent_Conditional_0_Case_4_Conditional_0_Template(rf, ctx) { if (rf & 1) {
10874
- i0.ɵɵelement(0, "symphiq-status-badge-tooltip", 6);
10875
- } if (rf & 2) {
10876
- const ctx_r1 = i0.ɵɵnextContext(3);
10877
- i0.ɵɵproperty("content", ctx_r1.statusContent())("isLightMode", ctx_r1.isLightMode());
10878
- } }
10879
- function TooltipContainerComponent_Conditional_0_Case_4_Template(rf, ctx) { if (rf & 1) {
10880
- i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_4_Conditional_0_Template, 1, 2, "symphiq-status-badge-tooltip", 6);
10881
- } if (rf & 2) {
10882
- const ctx_r1 = i0.ɵɵnextContext(2);
10883
- i0.ɵɵconditional(ctx_r1.statusContent() ? 0 : -1);
10884
- } }
10885
- function TooltipContainerComponent_Conditional_0_Case_5_Conditional_0_Template(rf, ctx) { if (rf & 1) {
10886
- i0.ɵɵelement(0, "symphiq-trend-indicator-tooltip", 6);
10887
- } if (rf & 2) {
10888
- const ctx_r1 = i0.ɵɵnextContext(3);
10889
- i0.ɵɵproperty("content", ctx_r1.trendContent())("isLightMode", ctx_r1.isLightMode());
10890
- } }
10891
- function TooltipContainerComponent_Conditional_0_Case_5_Template(rf, ctx) { if (rf & 1) {
10892
- i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_5_Conditional_0_Template, 1, 2, "symphiq-trend-indicator-tooltip", 6);
10893
- } if (rf & 2) {
10894
- const ctx_r1 = i0.ɵɵnextContext(2);
10895
- i0.ɵɵconditional(ctx_r1.trendContent() ? 0 : -1);
10896
- } }
10897
- function TooltipContainerComponent_Conditional_0_Case_6_Conditional_0_Template(rf, ctx) { if (rf & 1) {
10898
- i0.ɵɵelement(0, "symphiq-priority-badge-tooltip", 6);
10899
- } if (rf & 2) {
10900
- const ctx_r1 = i0.ɵɵnextContext(3);
10901
- i0.ɵɵproperty("content", ctx_r1.priorityContent())("isLightMode", ctx_r1.isLightMode());
10902
- } }
10903
- function TooltipContainerComponent_Conditional_0_Case_6_Template(rf, ctx) { if (rf & 1) {
10904
- i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_6_Conditional_0_Template, 1, 2, "symphiq-priority-badge-tooltip", 6);
10966
+ const _forTrack0$6 = ($index, $item) => $item.name;
10967
+ function CompetitiveStatusTooltipComponent_Conditional_6_For_6_Template(rf, ctx) { if (rf & 1) {
10968
+ i0.ɵɵelementStart(0, "div", 7)(1, "div", 8)(2, "div", 9);
10969
+ i0.ɵɵelement(3, "div", 10);
10970
+ i0.ɵɵelementStart(4, "span", 11);
10971
+ i0.ɵɵtext(5);
10972
+ i0.ɵɵelementEnd()();
10973
+ i0.ɵɵelementStart(6, "span", 12);
10974
+ i0.ɵɵtext(7);
10975
+ i0.ɵɵelementEnd()();
10976
+ i0.ɵɵelementStart(8, "div", 13)(9, "span", 14);
10977
+ i0.ɵɵtext(10, "Benchmark:");
10978
+ i0.ɵɵelementEnd();
10979
+ i0.ɵɵelementStart(11, "span", 15);
10980
+ i0.ɵɵtext(12);
10981
+ i0.ɵɵelementEnd()()();
10905
10982
  } if (rf & 2) {
10983
+ const metric_r1 = ctx.$implicit;
10906
10984
  const ctx_r1 = i0.ɵɵnextContext(2);
10907
- i0.ɵɵconditional(ctx_r1.priorityContent() ? 0 : -1);
10985
+ i0.ɵɵclassProp("animate-pulse", metric_r1.status === "LAGGING");
10986
+ i0.ɵɵproperty("ngClass", ctx_r1.getMetricCardClass(metric_r1.status));
10987
+ i0.ɵɵadvance(3);
10988
+ i0.ɵɵproperty("ngClass", ctx_r1.getStatusDotClass(metric_r1.status));
10989
+ i0.ɵɵadvance();
10990
+ i0.ɵɵproperty("ngClass", ctx_r1.getMetricNameClass(metric_r1.status));
10991
+ i0.ɵɵadvance();
10992
+ i0.ɵɵtextInterpolate1(" ", metric_r1.name, " ");
10993
+ i0.ɵɵadvance();
10994
+ i0.ɵɵproperty("ngClass", ctx_r1.getValueClass(metric_r1.status));
10995
+ i0.ɵɵadvance();
10996
+ i0.ɵɵtextInterpolate1(" ", ctx_r1.formatValue(metric_r1.projectedValue, metric_r1.unit), " ");
10997
+ i0.ɵɵadvance(2);
10998
+ i0.ɵɵproperty("ngClass", ctx_r1.labelClass());
10999
+ i0.ɵɵadvance(2);
11000
+ i0.ɵɵproperty("ngClass", ctx_r1.subValueClass());
11001
+ i0.ɵɵadvance();
11002
+ i0.ɵɵtextInterpolate2(" ", ctx_r1.formatValue(metric_r1.benchmarkRange.min, metric_r1.unit), " - ", ctx_r1.formatValue(metric_r1.benchmarkRange.max, metric_r1.unit), " ");
10908
11003
  } }
10909
- function TooltipContainerComponent_Conditional_0_Case_7_Conditional_0_Template(rf, ctx) { if (rf & 1) {
10910
- i0.ɵɵelement(0, "symphiq-badge-tooltip", 6);
11004
+ function CompetitiveStatusTooltipComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
11005
+ i0.ɵɵelement(0, "div", 3);
11006
+ i0.ɵɵelementStart(1, "div")(2, "div", 4);
11007
+ i0.ɵɵtext(3);
11008
+ i0.ɵɵelementEnd();
11009
+ i0.ɵɵelementStart(4, "div", 5);
11010
+ i0.ɵɵrepeaterCreate(5, CompetitiveStatusTooltipComponent_Conditional_6_For_6_Template, 13, 12, "div", 6, _forTrack0$6);
11011
+ i0.ɵɵelementEnd()();
10911
11012
  } if (rf & 2) {
10912
- const ctx_r1 = i0.ɵɵnextContext(3);
10913
- i0.ɵɵproperty("content", ctx_r1.badgeContent())("isLightMode", ctx_r1.isLightMode());
11013
+ const ctx_r1 = i0.ɵɵnextContext();
11014
+ i0.ɵɵproperty("ngClass", ctx_r1.separatorClass());
11015
+ i0.ɵɵadvance(2);
11016
+ i0.ɵɵproperty("ngClass", ctx_r1.labelClass());
11017
+ i0.ɵɵadvance();
11018
+ i0.ɵɵtextInterpolate2(" ", ctx_r1.content().metrics.length, " Metric", ctx_r1.content().metrics.length > 1 ? "s" : "", " ");
11019
+ i0.ɵɵadvance(2);
11020
+ i0.ɵɵrepeater(ctx_r1.content().metrics);
10914
11021
  } }
10915
- function TooltipContainerComponent_Conditional_0_Case_7_Template(rf, ctx) { if (rf & 1) {
10916
- i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_7_Conditional_0_Template, 1, 2, "symphiq-badge-tooltip", 6);
11022
+ class CompetitiveStatusTooltipComponent {
11023
+ constructor() {
11024
+ this.content = input.required(...(ngDevMode ? [{ debugName: "content" }] : []));
11025
+ this.isLightMode = input(false, ...(ngDevMode ? [{ debugName: "isLightMode" }] : []));
11026
+ this.titleClass = computed(() => this.isLightMode() ? 'text-slate-700' : 'text-slate-200', ...(ngDevMode ? [{ debugName: "titleClass" }] : []));
11027
+ this.labelClass = computed(() => this.isLightMode() ? 'text-slate-500' : 'text-slate-400', ...(ngDevMode ? [{ debugName: "labelClass" }] : []));
11028
+ this.textClass = computed(() => this.isLightMode() ? 'text-slate-600' : 'text-slate-300', ...(ngDevMode ? [{ debugName: "textClass" }] : []));
11029
+ this.valueClass = computed(() => this.isLightMode() ? 'text-slate-900' : 'text-white', ...(ngDevMode ? [{ debugName: "valueClass" }] : []));
11030
+ this.subValueClass = computed(() => this.isLightMode() ? 'text-slate-700' : 'text-slate-200', ...(ngDevMode ? [{ debugName: "subValueClass" }] : []));
11031
+ this.metricNameClass = computed(() => this.isLightMode() ? 'text-slate-800' : 'text-slate-100', ...(ngDevMode ? [{ debugName: "metricNameClass" }] : []));
11032
+ this.metricCardClass = computed(() => this.isLightMode() ? 'bg-slate-50 border border-slate-200' : 'bg-slate-700/50 border border-slate-600', ...(ngDevMode ? [{ debugName: "metricCardClass" }] : []));
11033
+ this.separatorClass = computed(() => this.isLightMode() ? 'bg-slate-200' : 'bg-slate-600', ...(ngDevMode ? [{ debugName: "separatorClass" }] : []));
11034
+ this.statusLabel = computed(() => {
11035
+ const status = this.content().status;
11036
+ switch (status) {
11037
+ case 'LEADING':
11038
+ return 'Leading';
11039
+ case 'COMPETITIVE':
11040
+ return 'Competitive';
11041
+ case 'LAGGING':
11042
+ return 'Lagging';
11043
+ default:
11044
+ return status;
11045
+ }
11046
+ }, ...(ngDevMode ? [{ debugName: "statusLabel" }] : []));
11047
+ }
11048
+ getStatusDotClass(status) {
11049
+ if (!status)
11050
+ return this.isLightMode() ? 'bg-slate-400' : 'bg-slate-500';
11051
+ switch (status) {
11052
+ case 'LEADING':
11053
+ return this.isLightMode() ? 'bg-emerald-500' : 'bg-emerald-400';
11054
+ case 'COMPETITIVE':
11055
+ return this.isLightMode() ? 'bg-blue-500' : 'bg-blue-400';
11056
+ case 'LAGGING':
11057
+ return this.isLightMode() ? 'bg-orange-500' : 'bg-orange-400';
11058
+ default:
11059
+ return this.isLightMode() ? 'bg-slate-400' : 'bg-slate-500';
11060
+ }
11061
+ }
11062
+ getMetricCardClass(status) {
11063
+ if (!status)
11064
+ return this.metricCardClass();
11065
+ if (this.isLightMode()) {
11066
+ switch (status) {
11067
+ case 'LEADING':
11068
+ return 'bg-emerald-50/50 border border-emerald-200/50';
11069
+ case 'COMPETITIVE':
11070
+ return 'bg-blue-50/50 border border-blue-200/50';
11071
+ case 'LAGGING':
11072
+ return 'bg-orange-50/50 border border-orange-200/50';
11073
+ default:
11074
+ return 'bg-slate-50 border border-slate-200';
11075
+ }
11076
+ }
11077
+ else {
11078
+ switch (status) {
11079
+ case 'LEADING':
11080
+ return 'bg-emerald-500/10 border border-emerald-500/20';
11081
+ case 'COMPETITIVE':
11082
+ return 'bg-blue-500/10 border border-blue-500/20';
11083
+ case 'LAGGING':
11084
+ return 'bg-orange-500/10 border border-orange-500/20';
11085
+ default:
11086
+ return 'bg-slate-700/50 border border-slate-600';
11087
+ }
11088
+ }
11089
+ }
11090
+ getMetricNameClass(status) {
11091
+ if (!status)
11092
+ return this.metricNameClass();
11093
+ if (this.isLightMode()) {
11094
+ switch (status) {
11095
+ case 'LEADING':
11096
+ return 'text-emerald-800';
11097
+ case 'COMPETITIVE':
11098
+ return 'text-blue-800';
11099
+ case 'LAGGING':
11100
+ return 'text-orange-800';
11101
+ default:
11102
+ return 'text-slate-800';
11103
+ }
11104
+ }
11105
+ else {
11106
+ switch (status) {
11107
+ case 'LEADING':
11108
+ return 'text-emerald-100';
11109
+ case 'COMPETITIVE':
11110
+ return 'text-blue-100';
11111
+ case 'LAGGING':
11112
+ return 'text-orange-100';
11113
+ default:
11114
+ return 'text-slate-100';
11115
+ }
11116
+ }
11117
+ }
11118
+ getValueClass(status) {
11119
+ if (!status)
11120
+ return this.valueClass();
11121
+ if (this.isLightMode()) {
11122
+ switch (status) {
11123
+ case 'LEADING':
11124
+ return 'text-emerald-900';
11125
+ case 'COMPETITIVE':
11126
+ return 'text-blue-900';
11127
+ case 'LAGGING':
11128
+ return 'text-orange-900';
11129
+ default:
11130
+ return 'text-slate-900';
11131
+ }
11132
+ }
11133
+ else {
11134
+ switch (status) {
11135
+ case 'LEADING':
11136
+ return 'text-emerald-50';
11137
+ case 'COMPETITIVE':
11138
+ return 'text-blue-50';
11139
+ case 'LAGGING':
11140
+ return 'text-orange-50';
11141
+ default:
11142
+ return 'text-white';
11143
+ }
11144
+ }
11145
+ }
11146
+ formatValue(value, unit) {
11147
+ // Handle currency
11148
+ if (unit === 'currency') {
11149
+ if (value >= 1000000) {
11150
+ return `$${(value / 1000000).toFixed(1)}M`;
11151
+ }
11152
+ else if (value >= 1000) {
11153
+ return `$${(value / 1000).toFixed(1)}K`;
11154
+ }
11155
+ return `$${value.toLocaleString('en-US', { maximumFractionDigits: 0 })}`;
11156
+ }
11157
+ // Handle percentage
11158
+ if (unit === 'percentage') {
11159
+ if (value < 1) {
11160
+ return `${(value * 100).toFixed(2)}%`;
11161
+ }
11162
+ return `${value.toFixed(2)}%`;
11163
+ }
11164
+ // Handle count (default)
11165
+ if (value >= 1000000) {
11166
+ return `${(value / 1000000).toFixed(1)}M`;
11167
+ }
11168
+ else if (value >= 1000) {
11169
+ return `${(value / 1000).toFixed(1)}K`;
11170
+ }
11171
+ return value.toLocaleString();
11172
+ }
11173
+ static { this.ɵfac = function CompetitiveStatusTooltipComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CompetitiveStatusTooltipComponent)(); }; }
11174
+ static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CompetitiveStatusTooltipComponent, selectors: [["symphiq-competitive-status-tooltip"]], inputs: { content: [1, "content"], isLightMode: [1, "isLightMode"] }, decls: 7, vars: 5, consts: [[1, "space-y-2"], [1, "font-semibold", "text-xs", "uppercase", "tracking-wide", "mb-0.5", 3, "ngClass"], [1, "text-xs", "leading-snug", 3, "ngClass"], [1, "h-px", 3, "ngClass"], [1, "text-xs", "font-semibold", "mb-1.5", 3, "ngClass"], [1, "space-y-1", "max-h-48", "overflow-y-auto"], [1, "rounded", "px-2", "py-1", 3, "ngClass", "animate-pulse"], [1, "rounded", "px-2", "py-1", 3, "ngClass"], [1, "flex", "items-baseline", "justify-between", "gap-2", "mb-0.5"], [1, "flex", "items-center", "gap-1", "flex-1", "min-w-0"], [1, "w-1.5", "h-1.5", "rounded-full", "flex-shrink-0", 3, "ngClass"], [1, "text-xs", "font-medium", "truncate", 3, "ngClass"], [1, "text-xs", "font-semibold", "whitespace-nowrap", 3, "ngClass"], [1, "flex", "items-baseline", "justify-between", "gap-2", "ml-3.5"], [1, "text-[10px]", 3, "ngClass"], [1, "text-[10px]", "whitespace-nowrap", 3, "ngClass"]], template: function CompetitiveStatusTooltipComponent_Template(rf, ctx) { if (rf & 1) {
11175
+ i0.ɵɵelementStart(0, "div", 0)(1, "div")(2, "div", 1);
11176
+ i0.ɵɵtext(3);
11177
+ i0.ɵɵelementEnd();
11178
+ i0.ɵɵelementStart(4, "div", 2);
11179
+ i0.ɵɵtext(5);
11180
+ i0.ɵɵelementEnd()();
11181
+ i0.ɵɵconditionalCreate(6, CompetitiveStatusTooltipComponent_Conditional_6_Template, 7, 4);
11182
+ i0.ɵɵelementEnd();
11183
+ } if (rf & 2) {
11184
+ i0.ɵɵadvance(2);
11185
+ i0.ɵɵproperty("ngClass", ctx.titleClass());
11186
+ i0.ɵɵadvance();
11187
+ i0.ɵɵtextInterpolate1(" ", ctx.statusLabel(), " ");
11188
+ i0.ɵɵadvance();
11189
+ i0.ɵɵproperty("ngClass", ctx.textClass());
11190
+ i0.ɵɵadvance();
11191
+ i0.ɵɵtextInterpolate1(" ", ctx.content().statusDescription, " ");
11192
+ i0.ɵɵadvance();
11193
+ i0.ɵɵconditional(ctx.content().metrics.length > 0 ? 6 : -1);
11194
+ } }, dependencies: [CommonModule, i1.NgClass], encapsulation: 2, changeDetection: 0 }); }
11195
+ }
11196
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CompetitiveStatusTooltipComponent, [{
11197
+ type: Component,
11198
+ args: [{
11199
+ selector: 'symphiq-competitive-status-tooltip',
11200
+ standalone: true,
11201
+ changeDetection: ChangeDetectionStrategy.OnPush,
11202
+ imports: [CommonModule],
11203
+ template: `
11204
+ <div class="space-y-2">
11205
+ <div>
11206
+ <div [ngClass]="titleClass()" class="font-semibold text-xs uppercase tracking-wide mb-0.5">
11207
+ {{ statusLabel() }}
11208
+ </div>
11209
+ <div [ngClass]="textClass()" class="text-xs leading-snug">
11210
+ {{ content().statusDescription }}
11211
+ </div>
11212
+ </div>
11213
+
11214
+ @if (content().metrics.length > 0) {
11215
+ <div [ngClass]="separatorClass()" class="h-px"></div>
11216
+
11217
+ <div>
11218
+ <div [ngClass]="labelClass()" class="text-xs font-semibold mb-1.5">
11219
+ {{ content().metrics.length }} Metric{{ content().metrics.length > 1 ? 's' : '' }}
11220
+ </div>
11221
+ <div class="space-y-1 max-h-48 overflow-y-auto">
11222
+ @for (metric of content().metrics; track metric.name) {
11223
+ <div
11224
+ [ngClass]="getMetricCardClass(metric.status)"
11225
+ [class.animate-pulse]="metric.status === 'LAGGING'"
11226
+ class="rounded px-2 py-1">
11227
+ <div class="flex items-baseline justify-between gap-2 mb-0.5">
11228
+ <div class="flex items-center gap-1 flex-1 min-w-0">
11229
+ <div [ngClass]="getStatusDotClass(metric.status)" class="w-1.5 h-1.5 rounded-full flex-shrink-0"></div>
11230
+ <span [ngClass]="getMetricNameClass(metric.status)" class="text-xs font-medium truncate">
11231
+ {{ metric.name }}
11232
+ </span>
11233
+ </div>
11234
+ <span [ngClass]="getValueClass(metric.status)" class="text-xs font-semibold whitespace-nowrap">
11235
+ {{ formatValue(metric.projectedValue, metric.unit) }}
11236
+ </span>
11237
+ </div>
11238
+ <div class="flex items-baseline justify-between gap-2 ml-3.5">
11239
+ <span [ngClass]="labelClass()" class="text-[10px]">Benchmark:</span>
11240
+ <span [ngClass]="subValueClass()" class="text-[10px] whitespace-nowrap">
11241
+ {{ formatValue(metric.benchmarkRange.min, metric.unit) }} - {{ formatValue(metric.benchmarkRange.max, metric.unit) }}
11242
+ </span>
11243
+ </div>
11244
+ </div>
11245
+ }
11246
+ </div>
11247
+ </div>
11248
+ }
11249
+ </div>
11250
+ `
11251
+ }]
11252
+ }], null, { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: true }] }], isLightMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLightMode", required: false }] }] }); })();
11253
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CompetitiveStatusTooltipComponent, { className: "CompetitiveStatusTooltipComponent", filePath: "lib/components/funnel-analysis-dashboard/tooltip/competitive-status-tooltip.component.ts", lineNumber: 59 }); })();
11254
+
11255
+ const _forTrack0$5 = ($index, $item) => $item.name;
11256
+ function FunnelStageCompetitiveTooltipComponent_Conditional_8_For_7_Template(rf, ctx) { if (rf & 1) {
11257
+ i0.ɵɵelementStart(0, "div", 9)(1, "div", 10)(2, "span", 11);
11258
+ i0.ɵɵtext(3);
11259
+ i0.ɵɵelementEnd();
11260
+ i0.ɵɵelementStart(4, "span", 12);
11261
+ i0.ɵɵtext(5);
11262
+ i0.ɵɵelementEnd()();
11263
+ i0.ɵɵelementStart(6, "div", 13)(7, "span", 14);
11264
+ i0.ɵɵtext(8, "Benchmark:");
11265
+ i0.ɵɵelementEnd();
11266
+ i0.ɵɵelementStart(9, "span", 15);
11267
+ i0.ɵɵtext(10);
11268
+ i0.ɵɵelementEnd()()();
11269
+ } if (rf & 2) {
11270
+ const metric_r1 = ctx.$implicit;
11271
+ const ctx_r1 = i0.ɵɵnextContext(2);
11272
+ i0.ɵɵproperty("ngClass", ctx_r1.leadingCardClass());
11273
+ i0.ɵɵadvance(2);
11274
+ i0.ɵɵproperty("ngClass", ctx_r1.metricNameClass());
11275
+ i0.ɵɵadvance();
11276
+ i0.ɵɵtextInterpolate1(" ", metric_r1.name, " ");
11277
+ i0.ɵɵadvance();
11278
+ i0.ɵɵproperty("ngClass", ctx_r1.valueClass());
11279
+ i0.ɵɵadvance();
11280
+ i0.ɵɵtextInterpolate1(" ", ctx_r1.formatValue(metric_r1.projectedValue, metric_r1.unit), " ");
11281
+ i0.ɵɵadvance(2);
11282
+ i0.ɵɵproperty("ngClass", ctx_r1.labelClass());
11283
+ i0.ɵɵadvance(2);
11284
+ i0.ɵɵproperty("ngClass", ctx_r1.subValueClass());
11285
+ i0.ɵɵadvance();
11286
+ i0.ɵɵtextInterpolate2(" ", ctx_r1.formatValue(metric_r1.benchmarkRange.min, metric_r1.unit), " - ", ctx_r1.formatValue(metric_r1.benchmarkRange.max, metric_r1.unit), " ");
11287
+ } }
11288
+ function FunnelStageCompetitiveTooltipComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
11289
+ i0.ɵɵelementStart(0, "div")(1, "div", 5);
11290
+ i0.ɵɵelement(2, "div", 6);
11291
+ i0.ɵɵelementStart(3, "span", 7);
11292
+ i0.ɵɵtext(4);
11293
+ i0.ɵɵelementEnd()();
11294
+ i0.ɵɵelementStart(5, "div", 8);
11295
+ i0.ɵɵrepeaterCreate(6, FunnelStageCompetitiveTooltipComponent_Conditional_8_For_7_Template, 11, 9, "div", 9, _forTrack0$5);
11296
+ i0.ɵɵelementEnd()();
11297
+ } if (rf & 2) {
11298
+ const ctx_r1 = i0.ɵɵnextContext();
11299
+ i0.ɵɵadvance(3);
11300
+ i0.ɵɵproperty("ngClass", ctx_r1.leadingTitleClass());
11301
+ i0.ɵɵadvance();
11302
+ i0.ɵɵtextInterpolate1(" Leading (", ctx_r1.content().leading.length, ") ");
11303
+ i0.ɵɵadvance(2);
11304
+ i0.ɵɵrepeater(ctx_r1.content().leading);
11305
+ } }
11306
+ function FunnelStageCompetitiveTooltipComponent_Conditional_9_For_7_Template(rf, ctx) { if (rf & 1) {
11307
+ i0.ɵɵelementStart(0, "div", 9)(1, "div", 10)(2, "span", 11);
11308
+ i0.ɵɵtext(3);
11309
+ i0.ɵɵelementEnd();
11310
+ i0.ɵɵelementStart(4, "span", 12);
11311
+ i0.ɵɵtext(5);
11312
+ i0.ɵɵelementEnd()();
11313
+ i0.ɵɵelementStart(6, "div", 13)(7, "span", 14);
11314
+ i0.ɵɵtext(8, "Benchmark:");
11315
+ i0.ɵɵelementEnd();
11316
+ i0.ɵɵelementStart(9, "span", 15);
11317
+ i0.ɵɵtext(10);
11318
+ i0.ɵɵelementEnd()()();
11319
+ } if (rf & 2) {
11320
+ const metric_r3 = ctx.$implicit;
11321
+ const ctx_r1 = i0.ɵɵnextContext(2);
11322
+ i0.ɵɵproperty("ngClass", ctx_r1.competitiveCardClass());
11323
+ i0.ɵɵadvance(2);
11324
+ i0.ɵɵproperty("ngClass", ctx_r1.metricNameClass());
11325
+ i0.ɵɵadvance();
11326
+ i0.ɵɵtextInterpolate1(" ", metric_r3.name, " ");
11327
+ i0.ɵɵadvance();
11328
+ i0.ɵɵproperty("ngClass", ctx_r1.valueClass());
11329
+ i0.ɵɵadvance();
11330
+ i0.ɵɵtextInterpolate1(" ", ctx_r1.formatValue(metric_r3.projectedValue, metric_r3.unit), " ");
11331
+ i0.ɵɵadvance(2);
11332
+ i0.ɵɵproperty("ngClass", ctx_r1.labelClass());
11333
+ i0.ɵɵadvance(2);
11334
+ i0.ɵɵproperty("ngClass", ctx_r1.subValueClass());
11335
+ i0.ɵɵadvance();
11336
+ i0.ɵɵtextInterpolate2(" ", ctx_r1.formatValue(metric_r3.benchmarkRange.min, metric_r3.unit), " - ", ctx_r1.formatValue(metric_r3.benchmarkRange.max, metric_r3.unit), " ");
11337
+ } }
11338
+ function FunnelStageCompetitiveTooltipComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
11339
+ i0.ɵɵelementStart(0, "div")(1, "div", 5);
11340
+ i0.ɵɵelement(2, "div", 16);
11341
+ i0.ɵɵelementStart(3, "span", 7);
11342
+ i0.ɵɵtext(4);
11343
+ i0.ɵɵelementEnd()();
11344
+ i0.ɵɵelementStart(5, "div", 8);
11345
+ i0.ɵɵrepeaterCreate(6, FunnelStageCompetitiveTooltipComponent_Conditional_9_For_7_Template, 11, 9, "div", 9, _forTrack0$5);
11346
+ i0.ɵɵelementEnd()();
11347
+ } if (rf & 2) {
11348
+ const ctx_r1 = i0.ɵɵnextContext();
11349
+ i0.ɵɵadvance(3);
11350
+ i0.ɵɵproperty("ngClass", ctx_r1.competitiveTitleClass());
11351
+ i0.ɵɵadvance();
11352
+ i0.ɵɵtextInterpolate1(" Competitive (", ctx_r1.content().competitive.length, ") ");
11353
+ i0.ɵɵadvance(2);
11354
+ i0.ɵɵrepeater(ctx_r1.content().competitive);
11355
+ } }
11356
+ function FunnelStageCompetitiveTooltipComponent_Conditional_10_For_7_Template(rf, ctx) { if (rf & 1) {
11357
+ i0.ɵɵelementStart(0, "div", 9)(1, "div", 10)(2, "span", 11);
11358
+ i0.ɵɵtext(3);
11359
+ i0.ɵɵelementEnd();
11360
+ i0.ɵɵelementStart(4, "span", 12);
11361
+ i0.ɵɵtext(5);
11362
+ i0.ɵɵelementEnd()();
11363
+ i0.ɵɵelementStart(6, "div", 13)(7, "span", 14);
11364
+ i0.ɵɵtext(8, "Benchmark:");
11365
+ i0.ɵɵelementEnd();
11366
+ i0.ɵɵelementStart(9, "span", 15);
11367
+ i0.ɵɵtext(10);
11368
+ i0.ɵɵelementEnd()()();
11369
+ } if (rf & 2) {
11370
+ const metric_r4 = ctx.$implicit;
11371
+ const ctx_r1 = i0.ɵɵnextContext(2);
11372
+ i0.ɵɵproperty("ngClass", ctx_r1.laggingCardClass());
11373
+ i0.ɵɵadvance(2);
11374
+ i0.ɵɵproperty("ngClass", ctx_r1.metricNameClass());
11375
+ i0.ɵɵadvance();
11376
+ i0.ɵɵtextInterpolate1(" ", metric_r4.name, " ");
11377
+ i0.ɵɵadvance();
11378
+ i0.ɵɵproperty("ngClass", ctx_r1.valueClass());
11379
+ i0.ɵɵadvance();
11380
+ i0.ɵɵtextInterpolate1(" ", ctx_r1.formatValue(metric_r4.projectedValue, metric_r4.unit), " ");
11381
+ i0.ɵɵadvance(2);
11382
+ i0.ɵɵproperty("ngClass", ctx_r1.labelClass());
11383
+ i0.ɵɵadvance(2);
11384
+ i0.ɵɵproperty("ngClass", ctx_r1.subValueClass());
11385
+ i0.ɵɵadvance();
11386
+ i0.ɵɵtextInterpolate2(" ", ctx_r1.formatValue(metric_r4.benchmarkRange.min, metric_r4.unit), " - ", ctx_r1.formatValue(metric_r4.benchmarkRange.max, metric_r4.unit), " ");
11387
+ } }
11388
+ function FunnelStageCompetitiveTooltipComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
11389
+ i0.ɵɵelementStart(0, "div")(1, "div", 5);
11390
+ i0.ɵɵelement(2, "div", 17);
11391
+ i0.ɵɵelementStart(3, "span", 7);
11392
+ i0.ɵɵtext(4);
11393
+ i0.ɵɵelementEnd()();
11394
+ i0.ɵɵelementStart(5, "div", 8);
11395
+ i0.ɵɵrepeaterCreate(6, FunnelStageCompetitiveTooltipComponent_Conditional_10_For_7_Template, 11, 9, "div", 9, _forTrack0$5);
11396
+ i0.ɵɵelementEnd()();
11397
+ } if (rf & 2) {
11398
+ const ctx_r1 = i0.ɵɵnextContext();
11399
+ i0.ɵɵadvance(3);
11400
+ i0.ɵɵproperty("ngClass", ctx_r1.laggingTitleClass());
11401
+ i0.ɵɵadvance();
11402
+ i0.ɵɵtextInterpolate1(" Lagging (", ctx_r1.content().lagging.length, ") ");
11403
+ i0.ɵɵadvance(2);
11404
+ i0.ɵɵrepeater(ctx_r1.content().lagging);
11405
+ } }
11406
+ class FunnelStageCompetitiveTooltipComponent {
11407
+ constructor() {
11408
+ this.content = input.required(...(ngDevMode ? [{ debugName: "content" }] : []));
11409
+ this.isLightMode = input(false, ...(ngDevMode ? [{ debugName: "isLightMode" }] : []));
11410
+ this.titleClass = computed(() => this.isLightMode() ? 'text-slate-800' : 'text-white', ...(ngDevMode ? [{ debugName: "titleClass" }] : []));
11411
+ this.labelClass = computed(() => this.isLightMode() ? 'text-slate-500' : 'text-slate-400', ...(ngDevMode ? [{ debugName: "labelClass" }] : []));
11412
+ this.valueClass = computed(() => this.isLightMode() ? 'text-slate-900' : 'text-white', ...(ngDevMode ? [{ debugName: "valueClass" }] : []));
11413
+ this.subValueClass = computed(() => this.isLightMode() ? 'text-slate-700' : 'text-slate-200', ...(ngDevMode ? [{ debugName: "subValueClass" }] : []));
11414
+ this.metricNameClass = computed(() => this.isLightMode() ? 'text-slate-800' : 'text-slate-100', ...(ngDevMode ? [{ debugName: "metricNameClass" }] : []));
11415
+ this.separatorClass = computed(() => this.isLightMode() ? 'bg-slate-200' : 'bg-slate-600', ...(ngDevMode ? [{ debugName: "separatorClass" }] : []));
11416
+ this.leadingTitleClass = computed(() => this.isLightMode() ? 'text-emerald-700' : 'text-emerald-400', ...(ngDevMode ? [{ debugName: "leadingTitleClass" }] : []));
11417
+ this.leadingCardClass = computed(() => this.isLightMode() ? 'bg-emerald-50 border border-emerald-200' : 'bg-emerald-500/10 border border-emerald-500/30', ...(ngDevMode ? [{ debugName: "leadingCardClass" }] : []));
11418
+ this.competitiveTitleClass = computed(() => this.isLightMode() ? 'text-blue-700' : 'text-blue-400', ...(ngDevMode ? [{ debugName: "competitiveTitleClass" }] : []));
11419
+ this.competitiveCardClass = computed(() => this.isLightMode() ? 'bg-blue-50 border border-blue-200' : 'bg-blue-500/10 border border-blue-500/30', ...(ngDevMode ? [{ debugName: "competitiveCardClass" }] : []));
11420
+ this.laggingTitleClass = computed(() => this.isLightMode() ? 'text-orange-700' : 'text-orange-400', ...(ngDevMode ? [{ debugName: "laggingTitleClass" }] : []));
11421
+ this.laggingCardClass = computed(() => this.isLightMode() ? 'bg-orange-50 border border-orange-200' : 'bg-orange-500/10 border border-orange-500/30', ...(ngDevMode ? [{ debugName: "laggingCardClass" }] : []));
11422
+ }
11423
+ formatValue(value, unit) {
11424
+ if (unit === 'currency') {
11425
+ if (value >= 1000000) {
11426
+ return `$${(value / 1000000).toFixed(1)}M`;
11427
+ }
11428
+ else if (value >= 1000) {
11429
+ return `$${(value / 1000).toFixed(1)}K`;
11430
+ }
11431
+ return `$${value.toLocaleString('en-US', { maximumFractionDigits: 0 })}`;
11432
+ }
11433
+ if (unit === 'percentage') {
11434
+ if (value < 1) {
11435
+ return `${(value * 100).toFixed(2)}%`;
11436
+ }
11437
+ return `${value.toFixed(2)}%`;
11438
+ }
11439
+ if (value >= 1000000) {
11440
+ return `${(value / 1000000).toFixed(1)}M`;
11441
+ }
11442
+ else if (value >= 1000) {
11443
+ return `${(value / 1000).toFixed(1)}K`;
11444
+ }
11445
+ return value.toLocaleString();
11446
+ }
11447
+ static { this.ɵfac = function FunnelStageCompetitiveTooltipComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FunnelStageCompetitiveTooltipComponent)(); }; }
11448
+ static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FunnelStageCompetitiveTooltipComponent, selectors: [["symphiq-funnel-stage-competitive-tooltip"]], inputs: { content: [1, "content"], isLightMode: [1, "isLightMode"] }, decls: 11, vars: 9, consts: [[1, "space-y-2"], [1, "font-semibold", "text-sm", "mb-0.5", 3, "ngClass"], [1, "text-xs", 3, "ngClass"], [1, "h-px", 3, "ngClass"], [1, "space-y-2", "max-h-64", "overflow-y-auto"], [1, "flex", "items-center", "gap-1.5", "mb-1.5"], [1, "w-2", "h-2", "rounded-full", "bg-emerald-500"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wide", 3, "ngClass"], [1, "space-y-1"], [1, "rounded", "px-2", "py-1", 3, "ngClass"], [1, "flex", "items-baseline", "justify-between", "gap-2", "mb-0.5"], [1, "text-xs", "font-medium", "truncate", "flex-1", 3, "ngClass"], [1, "text-xs", "font-semibold", "whitespace-nowrap", 3, "ngClass"], [1, "flex", "items-baseline", "justify-between", "gap-2"], [1, "text-[10px]", 3, "ngClass"], [1, "text-[10px]", "whitespace-nowrap", 3, "ngClass"], [1, "w-2", "h-2", "rounded-full", "bg-blue-500"], [1, "w-2", "h-2", "rounded-full", "bg-orange-500"]], template: function FunnelStageCompetitiveTooltipComponent_Template(rf, ctx) { if (rf & 1) {
11449
+ i0.ɵɵelementStart(0, "div", 0)(1, "div")(2, "div", 1);
11450
+ i0.ɵɵtext(3);
11451
+ i0.ɵɵelementEnd();
11452
+ i0.ɵɵelementStart(4, "div", 2);
11453
+ i0.ɵɵtext(5);
11454
+ i0.ɵɵelementEnd()();
11455
+ i0.ɵɵelement(6, "div", 3);
11456
+ i0.ɵɵelementStart(7, "div", 4);
11457
+ i0.ɵɵconditionalCreate(8, FunnelStageCompetitiveTooltipComponent_Conditional_8_Template, 8, 2, "div");
11458
+ i0.ɵɵconditionalCreate(9, FunnelStageCompetitiveTooltipComponent_Conditional_9_Template, 8, 2, "div");
11459
+ i0.ɵɵconditionalCreate(10, FunnelStageCompetitiveTooltipComponent_Conditional_10_Template, 8, 2, "div");
11460
+ i0.ɵɵelementEnd()();
11461
+ } if (rf & 2) {
11462
+ i0.ɵɵadvance(2);
11463
+ i0.ɵɵproperty("ngClass", ctx.titleClass());
11464
+ i0.ɵɵadvance();
11465
+ i0.ɵɵtextInterpolate1(" ", ctx.content().funnelStage, " ");
11466
+ i0.ɵɵadvance();
11467
+ i0.ɵɵproperty("ngClass", ctx.labelClass());
11468
+ i0.ɵɵadvance();
11469
+ i0.ɵɵtextInterpolate2(" ", ctx.content().totalMetrics, " Total Metric", ctx.content().totalMetrics > 1 ? "s" : "", " ");
11470
+ i0.ɵɵadvance();
11471
+ i0.ɵɵproperty("ngClass", ctx.separatorClass());
11472
+ i0.ɵɵadvance(2);
11473
+ i0.ɵɵconditional(ctx.content().leading.length > 0 ? 8 : -1);
11474
+ i0.ɵɵadvance();
11475
+ i0.ɵɵconditional(ctx.content().competitive.length > 0 ? 9 : -1);
11476
+ i0.ɵɵadvance();
11477
+ i0.ɵɵconditional(ctx.content().lagging.length > 0 ? 10 : -1);
11478
+ } }, dependencies: [CommonModule, i1.NgClass], encapsulation: 2, changeDetection: 0 }); }
11479
+ }
11480
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FunnelStageCompetitiveTooltipComponent, [{
11481
+ type: Component,
11482
+ args: [{
11483
+ selector: 'symphiq-funnel-stage-competitive-tooltip',
11484
+ standalone: true,
11485
+ changeDetection: ChangeDetectionStrategy.OnPush,
11486
+ imports: [CommonModule],
11487
+ template: `
11488
+ <div class="space-y-2">
11489
+ <div>
11490
+ <div [ngClass]="titleClass()" class="font-semibold text-sm mb-0.5">
11491
+ {{ content().funnelStage }}
11492
+ </div>
11493
+ <div [ngClass]="labelClass()" class="text-xs">
11494
+ {{ content().totalMetrics }} Total Metric{{ content().totalMetrics > 1 ? 's' : '' }}
11495
+ </div>
11496
+ </div>
11497
+
11498
+ <div [ngClass]="separatorClass()" class="h-px"></div>
11499
+
11500
+ <div class="space-y-2 max-h-64 overflow-y-auto">
11501
+ @if (content().leading.length > 0) {
11502
+ <div>
11503
+ <div class="flex items-center gap-1.5 mb-1.5">
11504
+ <div class="w-2 h-2 rounded-full bg-emerald-500"></div>
11505
+ <span [ngClass]="leadingTitleClass()" class="text-xs font-semibold uppercase tracking-wide">
11506
+ Leading ({{ content().leading.length }})
11507
+ </span>
11508
+ </div>
11509
+ <div class="space-y-1">
11510
+ @for (metric of content().leading; track metric.name) {
11511
+ <div [ngClass]="leadingCardClass()" class="rounded px-2 py-1">
11512
+ <div class="flex items-baseline justify-between gap-2 mb-0.5">
11513
+ <span [ngClass]="metricNameClass()" class="text-xs font-medium truncate flex-1">
11514
+ {{ metric.name }}
11515
+ </span>
11516
+ <span [ngClass]="valueClass()" class="text-xs font-semibold whitespace-nowrap">
11517
+ {{ formatValue(metric.projectedValue, metric.unit) }}
11518
+ </span>
11519
+ </div>
11520
+ <div class="flex items-baseline justify-between gap-2">
11521
+ <span [ngClass]="labelClass()" class="text-[10px]">Benchmark:</span>
11522
+ <span [ngClass]="subValueClass()" class="text-[10px] whitespace-nowrap">
11523
+ {{ formatValue(metric.benchmarkRange.min, metric.unit) }} - {{ formatValue(metric.benchmarkRange.max, metric.unit) }}
11524
+ </span>
11525
+ </div>
11526
+ </div>
11527
+ }
11528
+ </div>
11529
+ </div>
11530
+ }
11531
+
11532
+ @if (content().competitive.length > 0) {
11533
+ <div>
11534
+ <div class="flex items-center gap-1.5 mb-1.5">
11535
+ <div class="w-2 h-2 rounded-full bg-blue-500"></div>
11536
+ <span [ngClass]="competitiveTitleClass()" class="text-xs font-semibold uppercase tracking-wide">
11537
+ Competitive ({{ content().competitive.length }})
11538
+ </span>
11539
+ </div>
11540
+ <div class="space-y-1">
11541
+ @for (metric of content().competitive; track metric.name) {
11542
+ <div [ngClass]="competitiveCardClass()" class="rounded px-2 py-1">
11543
+ <div class="flex items-baseline justify-between gap-2 mb-0.5">
11544
+ <span [ngClass]="metricNameClass()" class="text-xs font-medium truncate flex-1">
11545
+ {{ metric.name }}
11546
+ </span>
11547
+ <span [ngClass]="valueClass()" class="text-xs font-semibold whitespace-nowrap">
11548
+ {{ formatValue(metric.projectedValue, metric.unit) }}
11549
+ </span>
11550
+ </div>
11551
+ <div class="flex items-baseline justify-between gap-2">
11552
+ <span [ngClass]="labelClass()" class="text-[10px]">Benchmark:</span>
11553
+ <span [ngClass]="subValueClass()" class="text-[10px] whitespace-nowrap">
11554
+ {{ formatValue(metric.benchmarkRange.min, metric.unit) }} - {{ formatValue(metric.benchmarkRange.max, metric.unit) }}
11555
+ </span>
11556
+ </div>
11557
+ </div>
11558
+ }
11559
+ </div>
11560
+ </div>
11561
+ }
11562
+
11563
+ @if (content().lagging.length > 0) {
11564
+ <div>
11565
+ <div class="flex items-center gap-1.5 mb-1.5">
11566
+ <div class="w-2 h-2 rounded-full bg-orange-500"></div>
11567
+ <span [ngClass]="laggingTitleClass()" class="text-xs font-semibold uppercase tracking-wide">
11568
+ Lagging ({{ content().lagging.length }})
11569
+ </span>
11570
+ </div>
11571
+ <div class="space-y-1">
11572
+ @for (metric of content().lagging; track metric.name) {
11573
+ <div [ngClass]="laggingCardClass()" class="rounded px-2 py-1">
11574
+ <div class="flex items-baseline justify-between gap-2 mb-0.5">
11575
+ <span [ngClass]="metricNameClass()" class="text-xs font-medium truncate flex-1">
11576
+ {{ metric.name }}
11577
+ </span>
11578
+ <span [ngClass]="valueClass()" class="text-xs font-semibold whitespace-nowrap">
11579
+ {{ formatValue(metric.projectedValue, metric.unit) }}
11580
+ </span>
11581
+ </div>
11582
+ <div class="flex items-baseline justify-between gap-2">
11583
+ <span [ngClass]="labelClass()" class="text-[10px]">Benchmark:</span>
11584
+ <span [ngClass]="subValueClass()" class="text-[10px] whitespace-nowrap">
11585
+ {{ formatValue(metric.benchmarkRange.min, metric.unit) }} - {{ formatValue(metric.benchmarkRange.max, metric.unit) }}
11586
+ </span>
11587
+ </div>
11588
+ </div>
11589
+ }
11590
+ </div>
11591
+ </div>
11592
+ }
11593
+ </div>
11594
+ </div>
11595
+ `
11596
+ }]
11597
+ }], null, { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: true }] }], isLightMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLightMode", required: false }] }] }); })();
11598
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FunnelStageCompetitiveTooltipComponent, { className: "FunnelStageCompetitiveTooltipComponent", filePath: "lib/components/funnel-analysis-dashboard/tooltip/funnel-stage-competitive-tooltip.component.ts", lineNumber: 120 }); })();
11599
+
11600
+ const _c0$6 = () => [];
11601
+ function TooltipContainerComponent_Conditional_0_Case_3_Conditional_0_Template(rf, ctx) { if (rf & 1) {
11602
+ i0.ɵɵelement(0, "symphiq-metric-value-tooltip", 6);
11603
+ } if (rf & 2) {
11604
+ const ctx_r1 = i0.ɵɵnextContext(3);
11605
+ i0.ɵɵproperty("content", ctx_r1.metricContent())("isLightMode", ctx_r1.isLightMode());
11606
+ } }
11607
+ function TooltipContainerComponent_Conditional_0_Case_3_Template(rf, ctx) { if (rf & 1) {
11608
+ i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_3_Conditional_0_Template, 1, 2, "symphiq-metric-value-tooltip", 6);
11609
+ } if (rf & 2) {
11610
+ const ctx_r1 = i0.ɵɵnextContext(2);
11611
+ i0.ɵɵconditional(ctx_r1.metricContent() ? 0 : -1);
11612
+ } }
11613
+ function TooltipContainerComponent_Conditional_0_Case_4_Conditional_0_Template(rf, ctx) { if (rf & 1) {
11614
+ i0.ɵɵelement(0, "symphiq-status-badge-tooltip", 6);
11615
+ } if (rf & 2) {
11616
+ const ctx_r1 = i0.ɵɵnextContext(3);
11617
+ i0.ɵɵproperty("content", ctx_r1.statusContent())("isLightMode", ctx_r1.isLightMode());
11618
+ } }
11619
+ function TooltipContainerComponent_Conditional_0_Case_4_Template(rf, ctx) { if (rf & 1) {
11620
+ i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_4_Conditional_0_Template, 1, 2, "symphiq-status-badge-tooltip", 6);
11621
+ } if (rf & 2) {
11622
+ const ctx_r1 = i0.ɵɵnextContext(2);
11623
+ i0.ɵɵconditional(ctx_r1.statusContent() ? 0 : -1);
11624
+ } }
11625
+ function TooltipContainerComponent_Conditional_0_Case_5_Conditional_0_Template(rf, ctx) { if (rf & 1) {
11626
+ i0.ɵɵelement(0, "symphiq-trend-indicator-tooltip", 6);
11627
+ } if (rf & 2) {
11628
+ const ctx_r1 = i0.ɵɵnextContext(3);
11629
+ i0.ɵɵproperty("content", ctx_r1.trendContent())("isLightMode", ctx_r1.isLightMode());
11630
+ } }
11631
+ function TooltipContainerComponent_Conditional_0_Case_5_Template(rf, ctx) { if (rf & 1) {
11632
+ i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_5_Conditional_0_Template, 1, 2, "symphiq-trend-indicator-tooltip", 6);
11633
+ } if (rf & 2) {
11634
+ const ctx_r1 = i0.ɵɵnextContext(2);
11635
+ i0.ɵɵconditional(ctx_r1.trendContent() ? 0 : -1);
11636
+ } }
11637
+ function TooltipContainerComponent_Conditional_0_Case_6_Conditional_0_Template(rf, ctx) { if (rf & 1) {
11638
+ i0.ɵɵelement(0, "symphiq-priority-badge-tooltip", 6);
11639
+ } if (rf & 2) {
11640
+ const ctx_r1 = i0.ɵɵnextContext(3);
11641
+ i0.ɵɵproperty("content", ctx_r1.priorityContent())("isLightMode", ctx_r1.isLightMode());
11642
+ } }
11643
+ function TooltipContainerComponent_Conditional_0_Case_6_Template(rf, ctx) { if (rf & 1) {
11644
+ i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_6_Conditional_0_Template, 1, 2, "symphiq-priority-badge-tooltip", 6);
11645
+ } if (rf & 2) {
11646
+ const ctx_r1 = i0.ɵɵnextContext(2);
11647
+ i0.ɵɵconditional(ctx_r1.priorityContent() ? 0 : -1);
11648
+ } }
11649
+ function TooltipContainerComponent_Conditional_0_Case_7_Conditional_0_Template(rf, ctx) { if (rf & 1) {
11650
+ i0.ɵɵelement(0, "symphiq-badge-tooltip", 6);
11651
+ } if (rf & 2) {
11652
+ const ctx_r1 = i0.ɵɵnextContext(3);
11653
+ i0.ɵɵproperty("content", ctx_r1.badgeContent())("isLightMode", ctx_r1.isLightMode());
11654
+ } }
11655
+ function TooltipContainerComponent_Conditional_0_Case_7_Template(rf, ctx) { if (rf & 1) {
11656
+ i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_7_Conditional_0_Template, 1, 2, "symphiq-badge-tooltip", 6);
10917
11657
  } if (rf & 2) {
10918
11658
  const ctx_r1 = i0.ɵɵnextContext(2);
10919
11659
  i0.ɵɵconditional(ctx_r1.badgeContent() ? 0 : -1);
@@ -10966,7 +11706,31 @@ function TooltipContainerComponent_Conditional_0_Case_11_Template(rf, ctx) { if
10966
11706
  const ctx_r1 = i0.ɵɵnextContext(2);
10967
11707
  i0.ɵɵconditional(ctx_r1.narrativeContent() ? 0 : -1);
10968
11708
  } }
10969
- function TooltipContainerComponent_Conditional_0_Case_12_Conditional_1_For_1_Template(rf, ctx) { if (rf & 1) {
11709
+ function TooltipContainerComponent_Conditional_0_Case_12_Conditional_0_Template(rf, ctx) { if (rf & 1) {
11710
+ i0.ɵɵelement(0, "symphiq-competitive-status-tooltip", 6);
11711
+ } if (rf & 2) {
11712
+ const ctx_r1 = i0.ɵɵnextContext(3);
11713
+ i0.ɵɵproperty("content", ctx_r1.competitiveStatusContent())("isLightMode", ctx_r1.isLightMode());
11714
+ } }
11715
+ function TooltipContainerComponent_Conditional_0_Case_12_Template(rf, ctx) { if (rf & 1) {
11716
+ i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_12_Conditional_0_Template, 1, 2, "symphiq-competitive-status-tooltip", 6);
11717
+ } if (rf & 2) {
11718
+ const ctx_r1 = i0.ɵɵnextContext(2);
11719
+ i0.ɵɵconditional(ctx_r1.competitiveStatusContent() ? 0 : -1);
11720
+ } }
11721
+ function TooltipContainerComponent_Conditional_0_Case_13_Conditional_0_Template(rf, ctx) { if (rf & 1) {
11722
+ i0.ɵɵelement(0, "symphiq-funnel-stage-competitive-tooltip", 6);
11723
+ } if (rf & 2) {
11724
+ const ctx_r1 = i0.ɵɵnextContext(3);
11725
+ i0.ɵɵproperty("content", ctx_r1.funnelStageCompetitiveContent())("isLightMode", ctx_r1.isLightMode());
11726
+ } }
11727
+ function TooltipContainerComponent_Conditional_0_Case_13_Template(rf, ctx) { if (rf & 1) {
11728
+ i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Case_13_Conditional_0_Template, 1, 2, "symphiq-funnel-stage-competitive-tooltip", 6);
11729
+ } if (rf & 2) {
11730
+ const ctx_r1 = i0.ɵɵnextContext(2);
11731
+ i0.ɵɵconditional(ctx_r1.funnelStageCompetitiveContent() ? 0 : -1);
11732
+ } }
11733
+ function TooltipContainerComponent_Conditional_0_Case_14_Conditional_1_For_1_Template(rf, ctx) { if (rf & 1) {
10970
11734
  i0.ɵɵelementStart(0, "div", 7)(1, "div", 8);
10971
11735
  i0.ɵɵtext(2);
10972
11736
  i0.ɵɵelementEnd();
@@ -10980,16 +11744,16 @@ function TooltipContainerComponent_Conditional_0_Case_12_Conditional_1_For_1_Tem
10980
11744
  i0.ɵɵadvance(2);
10981
11745
  i0.ɵɵtextInterpolate(section_r3.content);
10982
11746
  } }
10983
- function TooltipContainerComponent_Conditional_0_Case_12_Conditional_1_Template(rf, ctx) { if (rf & 1) {
10984
- i0.ɵɵrepeaterCreate(0, TooltipContainerComponent_Conditional_0_Case_12_Conditional_1_For_1_Template, 5, 2, "div", 7, i0.ɵɵrepeaterTrackByIndex);
11747
+ function TooltipContainerComponent_Conditional_0_Case_14_Conditional_1_Template(rf, ctx) { if (rf & 1) {
11748
+ i0.ɵɵrepeaterCreate(0, TooltipContainerComponent_Conditional_0_Case_14_Conditional_1_For_1_Template, 5, 2, "div", 7, i0.ɵɵrepeaterTrackByIndex);
10985
11749
  } if (rf & 2) {
10986
11750
  i0.ɵɵnextContext(2);
10987
11751
  const content_r4 = i0.ɵɵreadContextLet(2);
10988
11752
  i0.ɵɵrepeater(content_r4["sections"] || i0.ɵɵpureFunction0(0, _c0$6));
10989
11753
  } }
10990
- function TooltipContainerComponent_Conditional_0_Case_12_Template(rf, ctx) { if (rf & 1) {
11754
+ function TooltipContainerComponent_Conditional_0_Case_14_Template(rf, ctx) { if (rf & 1) {
10991
11755
  i0.ɵɵelementStart(0, "div", 3);
10992
- i0.ɵɵconditionalCreate(1, TooltipContainerComponent_Conditional_0_Case_12_Conditional_1_Template, 2, 1);
11756
+ i0.ɵɵconditionalCreate(1, TooltipContainerComponent_Conditional_0_Case_14_Conditional_1_Template, 2, 1);
10993
11757
  i0.ɵɵelementEnd();
10994
11758
  } if (rf & 2) {
10995
11759
  i0.ɵɵnextContext();
@@ -10999,23 +11763,23 @@ function TooltipContainerComponent_Conditional_0_Case_12_Template(rf, ctx) { if
10999
11763
  i0.ɵɵadvance();
11000
11764
  i0.ɵɵconditional(content_r4 && typeof content_r4 === "object" && "sections" in content_r4 ? 1 : -1);
11001
11765
  } }
11002
- function TooltipContainerComponent_Conditional_0_Case_13_Conditional_1_Template(rf, ctx) { if (rf & 1) {
11766
+ function TooltipContainerComponent_Conditional_0_Case_15_Conditional_1_Template(rf, ctx) { if (rf & 1) {
11003
11767
  i0.ɵɵtext(0);
11004
11768
  } if (rf & 2) {
11005
11769
  i0.ɵɵnextContext(2);
11006
11770
  const content_r4 = i0.ɵɵreadContextLet(2);
11007
11771
  i0.ɵɵtextInterpolate1(" ", content_r4["text"], " ");
11008
11772
  } }
11009
- function TooltipContainerComponent_Conditional_0_Case_13_Conditional_2_Template(rf, ctx) { if (rf & 1) {
11773
+ function TooltipContainerComponent_Conditional_0_Case_15_Conditional_2_Template(rf, ctx) { if (rf & 1) {
11010
11774
  i0.ɵɵtext(0);
11011
11775
  } if (rf & 2) {
11012
11776
  i0.ɵɵnextContext(2);
11013
11777
  const content_r4 = i0.ɵɵreadContextLet(2);
11014
11778
  i0.ɵɵtextInterpolate1(" ", content_r4, " ");
11015
11779
  } }
11016
- function TooltipContainerComponent_Conditional_0_Case_13_Template(rf, ctx) { if (rf & 1) {
11780
+ function TooltipContainerComponent_Conditional_0_Case_15_Template(rf, ctx) { if (rf & 1) {
11017
11781
  i0.ɵɵelementStart(0, "div", 4);
11018
- i0.ɵɵconditionalCreate(1, TooltipContainerComponent_Conditional_0_Case_13_Conditional_1_Template, 1, 1)(2, TooltipContainerComponent_Conditional_0_Case_13_Conditional_2_Template, 1, 1);
11782
+ i0.ɵɵconditionalCreate(1, TooltipContainerComponent_Conditional_0_Case_15_Conditional_1_Template, 1, 1)(2, TooltipContainerComponent_Conditional_0_Case_15_Conditional_2_Template, 1, 1);
11019
11783
  i0.ɵɵelementEnd();
11020
11784
  } if (rf & 2) {
11021
11785
  i0.ɵɵnextContext();
@@ -11025,7 +11789,7 @@ function TooltipContainerComponent_Conditional_0_Case_13_Template(rf, ctx) { if
11025
11789
  i0.ɵɵadvance();
11026
11790
  i0.ɵɵconditional(content_r4 && typeof content_r4 === "object" && "text" in content_r4 ? 1 : 2);
11027
11791
  } }
11028
- function TooltipContainerComponent_Conditional_0_Case_14_Template(rf, ctx) { if (rf & 1) {
11792
+ function TooltipContainerComponent_Conditional_0_Case_16_Template(rf, ctx) { if (rf & 1) {
11029
11793
  i0.ɵɵelementStart(0, "div", 5);
11030
11794
  i0.ɵɵtext(1);
11031
11795
  i0.ɵɵelementEnd();
@@ -11042,7 +11806,7 @@ function TooltipContainerComponent_Conditional_0_Template(rf, ctx) { if (rf & 1)
11042
11806
  i0.ɵɵelementStart(0, "div", 1)(1, "div", 2);
11043
11807
  i0.ɵɵlistener("mouseenter", function TooltipContainerComponent_Conditional_0_Template_div_mouseenter_1_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onTooltipMouseEnter()); })("mouseleave", function TooltipContainerComponent_Conditional_0_Template_div_mouseleave_1_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onTooltipMouseLeave()); });
11044
11808
  i0.ɵɵdeclareLet(2);
11045
- i0.ɵɵconditionalCreate(3, TooltipContainerComponent_Conditional_0_Case_3_Template, 1, 1)(4, TooltipContainerComponent_Conditional_0_Case_4_Template, 1, 1)(5, TooltipContainerComponent_Conditional_0_Case_5_Template, 1, 1)(6, TooltipContainerComponent_Conditional_0_Case_6_Template, 1, 1)(7, TooltipContainerComponent_Conditional_0_Case_7_Template, 1, 1)(8, TooltipContainerComponent_Conditional_0_Case_8_Template, 1, 1)(9, TooltipContainerComponent_Conditional_0_Case_9_Template, 1, 1)(10, TooltipContainerComponent_Conditional_0_Case_10_Template, 1, 1)(11, TooltipContainerComponent_Conditional_0_Case_11_Template, 1, 1)(12, TooltipContainerComponent_Conditional_0_Case_12_Template, 2, 2, "div", 3)(13, TooltipContainerComponent_Conditional_0_Case_13_Template, 3, 2, "div", 4)(14, TooltipContainerComponent_Conditional_0_Case_14_Template, 2, 2, "div", 5);
11809
+ i0.ɵɵconditionalCreate(3, TooltipContainerComponent_Conditional_0_Case_3_Template, 1, 1)(4, TooltipContainerComponent_Conditional_0_Case_4_Template, 1, 1)(5, TooltipContainerComponent_Conditional_0_Case_5_Template, 1, 1)(6, TooltipContainerComponent_Conditional_0_Case_6_Template, 1, 1)(7, TooltipContainerComponent_Conditional_0_Case_7_Template, 1, 1)(8, TooltipContainerComponent_Conditional_0_Case_8_Template, 1, 1)(9, TooltipContainerComponent_Conditional_0_Case_9_Template, 1, 1)(10, TooltipContainerComponent_Conditional_0_Case_10_Template, 1, 1)(11, TooltipContainerComponent_Conditional_0_Case_11_Template, 1, 1)(12, TooltipContainerComponent_Conditional_0_Case_12_Template, 1, 1)(13, TooltipContainerComponent_Conditional_0_Case_13_Template, 1, 1)(14, TooltipContainerComponent_Conditional_0_Case_14_Template, 2, 2, "div", 3)(15, TooltipContainerComponent_Conditional_0_Case_15_Template, 3, 2, "div", 4)(16, TooltipContainerComponent_Conditional_0_Case_16_Template, 2, 2, "div", 5);
11046
11810
  i0.ɵɵelementEnd()();
11047
11811
  } if (rf & 2) {
11048
11812
  let tmp_6_0;
@@ -11055,7 +11819,7 @@ function TooltipContainerComponent_Conditional_0_Template(rf, ctx) { if (rf & 1)
11055
11819
  i0.ɵɵadvance();
11056
11820
  i0.ɵɵstoreLet(ctx_r1.tooltipContent());
11057
11821
  i0.ɵɵadvance();
11058
- i0.ɵɵconditional((tmp_6_0 = ctx_r1.tooltipType()) === "metric" ? 3 : tmp_6_0 === "status" ? 4 : tmp_6_0 === "trend" ? 5 : tmp_6_0 === "priority" ? 6 : tmp_6_0 === "badge" ? 7 : tmp_6_0 === "breakdown" ? 8 : tmp_6_0 === "competitive" ? 9 : tmp_6_0 === "insightsList" ? 10 : tmp_6_0 === "narrative" ? 11 : tmp_6_0 === "insight" ? 12 : tmp_6_0 === "text" ? 13 : 14);
11822
+ i0.ɵɵconditional((tmp_6_0 = ctx_r1.tooltipType()) === "metric" ? 3 : tmp_6_0 === "status" ? 4 : tmp_6_0 === "trend" ? 5 : tmp_6_0 === "priority" ? 6 : tmp_6_0 === "badge" ? 7 : tmp_6_0 === "breakdown" ? 8 : tmp_6_0 === "competitive" ? 9 : tmp_6_0 === "insightsList" ? 10 : tmp_6_0 === "narrative" ? 11 : tmp_6_0 === "competitiveStatus" ? 12 : tmp_6_0 === "funnelStageCompetitive" ? 13 : tmp_6_0 === "insight" ? 14 : tmp_6_0 === "text" ? 15 : 16);
11059
11823
  } }
11060
11824
  class TooltipContainerComponent {
11061
11825
  constructor() {
@@ -11118,6 +11882,14 @@ class TooltipContainerComponent {
11118
11882
  const content = this.tooltipContent();
11119
11883
  return this.tooltipType() === 'narrative' ? content : null;
11120
11884
  }, ...(ngDevMode ? [{ debugName: "narrativeContent" }] : []));
11885
+ this.competitiveStatusContent = computed(() => {
11886
+ const content = this.tooltipContent();
11887
+ return this.tooltipType() === 'competitiveStatus' ? content : null;
11888
+ }, ...(ngDevMode ? [{ debugName: "competitiveStatusContent" }] : []));
11889
+ this.funnelStageCompetitiveContent = computed(() => {
11890
+ const content = this.tooltipContent();
11891
+ return this.tooltipType() === 'funnelStageCompetitive' ? content : null;
11892
+ }, ...(ngDevMode ? [{ debugName: "funnelStageCompetitiveContent" }] : []));
11121
11893
  this.tooltipLeft = computed(() => {
11122
11894
  return this.calculateLeft();
11123
11895
  }, ...(ngDevMode ? [{ debugName: "tooltipLeft" }] : []));
@@ -11375,7 +12147,7 @@ class TooltipContainerComponent {
11375
12147
  static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TooltipContainerComponent, selectors: [["symphiq-tooltip-container"]], hostVars: 2, hostBindings: function TooltipContainerComponent_HostBindings(rf, ctx) { if (rf & 2) {
11376
12148
  i0.ɵɵstyleProp("display", "contents");
11377
12149
  } }, decls: 1, vars: 1, consts: [[1, "z-[100]", "pointer-events-none", 3, "style"], [1, "z-[100]", "pointer-events-none"], [1, "rounded-lg", "shadow-2xl", "border", "backdrop-blur-xl", "px-4", "py-3", "pointer-events-auto", 3, "mouseenter", "mouseleave", "ngClass"], [1, "text-sm", "space-y-3", 3, "ngClass"], [1, "text-sm", "whitespace-pre-line", "leading-relaxed", 3, "ngClass"], [1, "text-sm", "whitespace-pre-line", 3, "ngClass"], [3, "content", "isLightMode"], [1, "space-y-2"], [1, "font-semibold"], [1, "whitespace-pre-line", "leading-relaxed"]], template: function TooltipContainerComponent_Template(rf, ctx) { if (rf & 1) {
11378
- i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Template, 15, 8, "div", 0);
12150
+ i0.ɵɵconditionalCreate(0, TooltipContainerComponent_Conditional_0_Template, 17, 8, "div", 0);
11379
12151
  } if (rf & 2) {
11380
12152
  i0.ɵɵconditional(ctx.isVisible() ? 0 : -1);
11381
12153
  } }, dependencies: [CommonModule, i1.NgClass, MetricValueTooltipComponent,
@@ -11386,7 +12158,9 @@ class TooltipContainerComponent {
11386
12158
  BreakdownRowTooltipComponent,
11387
12159
  CompetitiveBenchmarkTooltipComponent,
11388
12160
  InsightsListTooltipComponent,
11389
- NarrativeTooltipComponent], encapsulation: 2, data: { animation: [
12161
+ NarrativeTooltipComponent,
12162
+ CompetitiveStatusTooltipComponent,
12163
+ FunnelStageCompetitiveTooltipComponent], encapsulation: 2, data: { animation: [
11390
12164
  trigger('fadeInScale', [
11391
12165
  transition(':enter', [
11392
12166
  style({ opacity: 0 }),
@@ -11417,7 +12191,9 @@ class TooltipContainerComponent {
11417
12191
  BreakdownRowTooltipComponent,
11418
12192
  CompetitiveBenchmarkTooltipComponent,
11419
12193
  InsightsListTooltipComponent,
11420
- NarrativeTooltipComponent
12194
+ NarrativeTooltipComponent,
12195
+ CompetitiveStatusTooltipComponent,
12196
+ FunnelStageCompetitiveTooltipComponent
11421
12197
  ],
11422
12198
  animations: [
11423
12199
  trigger('fadeInScale', [
@@ -11507,6 +12283,20 @@ class TooltipContainerComponent {
11507
12283
  [isLightMode]="isLightMode()" />
11508
12284
  }
11509
12285
  }
12286
+ @case ('competitiveStatus') {
12287
+ @if (competitiveStatusContent()) {
12288
+ <symphiq-competitive-status-tooltip
12289
+ [content]="competitiveStatusContent()!"
12290
+ [isLightMode]="isLightMode()" />
12291
+ }
12292
+ }
12293
+ @case ('funnelStageCompetitive') {
12294
+ @if (funnelStageCompetitiveContent()) {
12295
+ <symphiq-funnel-stage-competitive-tooltip
12296
+ [content]="funnelStageCompetitiveContent()!"
12297
+ [isLightMode]="isLightMode()" />
12298
+ }
12299
+ }
11510
12300
  @case ('insight') {
11511
12301
  <div [ngClass]="textClass()" class="text-sm space-y-3">
11512
12302
  @if (content && typeof content === 'object' && 'sections' in content) {
@@ -11540,7 +12330,7 @@ class TooltipContainerComponent {
11540
12330
  `
11541
12331
  }]
11542
12332
  }], () => [], null); })();
11543
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TooltipContainerComponent, { className: "TooltipContainerComponent", filePath: "lib/components/funnel-analysis-dashboard/tooltip/tooltip-container.component.ts", lineNumber: 175 }); })();
12333
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TooltipContainerComponent, { className: "TooltipContainerComponent", filePath: "lib/components/funnel-analysis-dashboard/tooltip/tooltip-container.component.ts", lineNumber: 195 }); })();
11544
12334
 
11545
12335
  function MobileFABComponent_Conditional_1_Conditional_5_Template(rf, ctx) { if (rf & 1) {
11546
12336
  i0.ɵɵnamespaceSVG();
@@ -11777,7 +12567,9 @@ const FUNNEL_ANALYSIS = ({
11777
12567
  "overallAssessment": {
11778
12568
  "performanceItemId": "OVERALL_ASSESSMENT",
11779
12569
  "grade": "C",
12570
+ "gradeDescription": "This is an example grade description",
11780
12571
  "overallStatus": "AT_RISK",
12572
+ "overallStatusDescription": "This is an example overall description",
11781
12573
  "narrative": "The business is experiencing robust growth in traffic and revenue, with desktop and organic channels leading performance. However, conversion rates have declined, and the funnel is leaking at multiple stages, particularly on mobile. Addressing conversion bottlenecks and optimizing the mobile experience are critical to unlocking further revenue growth.",
11782
12574
  "priorYearTrend": "Strong growth in traffic and revenue compared to prior year, but conversion rates have declined.",
11783
12575
  "targetPacingStatus": "Falling behind target pace for purchases and conversion rates, but overachieving in traffic and average order value. Immediate action needed to address conversion bottlenecks and mobile performance.",
@@ -23836,7 +24628,7 @@ class SymphiqFunnelAnalysisPreviewComponent {
23836
24628
  this.gradeTooltip = computed(() => ({
23837
24629
  title: 'Performance Grade',
23838
24630
  grade: this.overallAssessment().grade || 'B',
23839
- explanation: this.getGradeExplanation()
24631
+ explanation: this.overallAssessment().gradeDescription || this.getGradeExplanation()
23840
24632
  }), ...(ngDevMode ? [{ debugName: "gradeTooltip" }] : []));
23841
24633
  this.revenueTooltip = computed(() => {
23842
24634
  const metric = this.revenueMetric();
@@ -24657,8 +25449,8 @@ class LineChartComponent {
24657
25449
  const valueX = dataItem.get('valueX');
24658
25450
  if (valueX) {
24659
25451
  const date = new Date(valueX);
24660
- const month = date.toLocaleString('default', { month: 'long' });
24661
- const year = date.getFullYear();
25452
+ const month = date.toLocaleString('default', { month: 'long', timeZone: 'UTC' });
25453
+ const year = date.toLocaleString('default', { year: 'numeric', timeZone: 'UTC' });
24662
25454
  monthText = `${month} ${year}`;
24663
25455
  }
24664
25456
  }
@@ -24701,7 +25493,7 @@ class LineChartComponent {
24701
25493
  }
24702
25494
  chartData.series?.forEach((seriesData, index) => {
24703
25495
  const parsedData = (seriesData.data || []).map(d => ({
24704
- date: new Date(d.date || '').getTime(),
25496
+ date: new Date(`${d.date}T00:00:00Z`).getTime(),
24705
25497
  value: d.value
24706
25498
  }));
24707
25499
  // Get the Y-axis for this series, or use the first one as default