@loafmarkets/ui 0.1.230 → 0.1.231

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.
package/dist/index.mjs CHANGED
@@ -8710,61 +8710,87 @@ function PropertyOverview({
8710
8710
  /* @__PURE__ */ jsxs(CompAssetsPanel, { children: [
8711
8711
  /* @__PURE__ */ jsx(StatsColumnHeader, { children: "Comparable Assets" }),
8712
8712
  /* @__PURE__ */ jsxs(CompAssetsGrid, { children: [
8713
- /* @__PURE__ */ jsxs(CompAssetMini, { children: [
8714
- /* @__PURE__ */ jsxs(CompAssetMiniTop, { children: [
8713
+ /* @__PURE__ */ jsxs(CompAssetRow, { children: [
8714
+ /* @__PURE__ */ jsxs(CompAssetThumbWrap, { children: [
8715
8715
  /* @__PURE__ */ jsx(CompAssetThumb, { children: /* @__PURE__ */ jsx("img", { src: "/boondabah.jpg", alt: "Boondabah", onError: (e) => {
8716
8716
  e.target.style.display = "none";
8717
8717
  } }) }),
8718
- /* @__PURE__ */ jsxs(CompAssetInfo, { children: [
8719
- /* @__PURE__ */ jsxs(CompAssetName, { children: [
8718
+ /* @__PURE__ */ jsxs(CompAssetTooltip, { children: [
8719
+ /* @__PURE__ */ jsx(CompAssetTooltipArrow, {}),
8720
+ /* @__PURE__ */ jsx(CompAssetTooltipImg, { children: /* @__PURE__ */ jsx("img", { src: "/boondabah.jpg", alt: "Boondabah", onError: (e) => {
8721
+ e.target.style.display = "none";
8722
+ } }) }),
8723
+ /* @__PURE__ */ jsxs(CompAssetTooltipTitle, { children: [
8720
8724
  "Boondabah ",
8721
8725
  /* @__PURE__ */ jsx(CompAssetBadge, { children: "HERITAGE" })
8722
8726
  ] }),
8723
- /* @__PURE__ */ jsx(CompAssetAddr, { children: "200A Raglan St, Mosman" })
8727
+ /* @__PURE__ */ jsx(CompAssetTooltipAddr, { children: "200A Raglan St, Mosman" }),
8728
+ /* @__PURE__ */ jsxs(CompAssetTooltipStats, { children: [
8729
+ /* @__PURE__ */ jsxs(CompAssetTooltipRow, { children: [
8730
+ /* @__PURE__ */ jsx("span", { children: "Land" }),
8731
+ /* @__PURE__ */ jsx("span", { children: "2,066 sqm" })
8732
+ ] }),
8733
+ /* @__PURE__ */ jsxs(CompAssetTooltipRow, { children: [
8734
+ /* @__PURE__ */ jsx("span", { children: "Era" }),
8735
+ /* @__PURE__ */ jsx("span", { children: "c.1905" })
8736
+ ] }),
8737
+ /* @__PURE__ */ jsxs(CompAssetTooltipRow, { children: [
8738
+ /* @__PURE__ */ jsx("span", { children: "Growth" }),
8739
+ /* @__PURE__ */ jsx("span", { style: { color: "#4ade80" }, children: "+119%" })
8740
+ ] }),
8741
+ /* @__PURE__ */ jsxs(CompAssetTooltipRow, { children: [
8742
+ /* @__PURE__ */ jsx("span", { children: "$/sqm" }),
8743
+ /* @__PURE__ */ jsx("span", { children: "$7,780" })
8744
+ ] })
8745
+ ] })
8724
8746
  ] })
8725
8747
  ] }),
8726
- /* @__PURE__ */ jsxs(CompAssetMiniBottom, { children: [
8727
- /* @__PURE__ */ jsxs(CompAssetMiniStat, { children: [
8728
- /* @__PURE__ */ jsx(CompAssetStatLabel, { children: "Sale" }),
8729
- /* @__PURE__ */ jsx(CompAssetStatVal, { children: "$16.07M" })
8730
- ] }),
8731
- /* @__PURE__ */ jsxs(CompAssetMiniStat, { children: [
8732
- /* @__PURE__ */ jsx(CompAssetStatLabel, { children: "Land" }),
8733
- /* @__PURE__ */ jsx(CompAssetStatVal, { children: "2,066 sqm" })
8734
- ] }),
8735
- /* @__PURE__ */ jsxs(CompAssetMiniStat, { children: [
8736
- /* @__PURE__ */ jsx(CompAssetStatLabel, { children: "Growth" }),
8737
- /* @__PURE__ */ jsx(CompAssetStatVal, { style: { color: "#4ade80" }, children: "+119%" })
8738
- ] })
8739
- ] })
8748
+ /* @__PURE__ */ jsxs(CompAssetInfo, { children: [
8749
+ /* @__PURE__ */ jsx(CompAssetName, { children: "Boondabah" }),
8750
+ /* @__PURE__ */ jsx(CompAssetAddr, { children: "200A Raglan St" })
8751
+ ] }),
8752
+ /* @__PURE__ */ jsx(CompAssetPrice, { children: "$16.07M" })
8740
8753
  ] }),
8741
- /* @__PURE__ */ jsxs(CompAssetMini, { children: [
8742
- /* @__PURE__ */ jsxs(CompAssetMiniTop, { children: [
8754
+ /* @__PURE__ */ jsxs(CompAssetRow, { children: [
8755
+ /* @__PURE__ */ jsxs(CompAssetThumbWrap, { children: [
8743
8756
  /* @__PURE__ */ jsx(CompAssetThumb, { children: /* @__PURE__ */ jsx("img", { src: "/bradleys.jpg", alt: "Bradleys Head", onError: (e) => {
8744
8757
  e.target.style.display = "none";
8745
8758
  } }) }),
8746
- /* @__PURE__ */ jsxs(CompAssetInfo, { children: [
8747
- /* @__PURE__ */ jsxs(CompAssetName, { children: [
8759
+ /* @__PURE__ */ jsxs(CompAssetTooltip, { children: [
8760
+ /* @__PURE__ */ jsx(CompAssetTooltipArrow, {}),
8761
+ /* @__PURE__ */ jsx(CompAssetTooltipImg, { children: /* @__PURE__ */ jsx("img", { src: "/bradleys.jpg", alt: "Dobroyd", onError: (e) => {
8762
+ e.target.style.display = "none";
8763
+ } }) }),
8764
+ /* @__PURE__ */ jsxs(CompAssetTooltipTitle, { children: [
8748
8765
  "Dobroyd ",
8749
8766
  /* @__PURE__ */ jsx(CompAssetBadge, { children: "HERITAGE" })
8750
8767
  ] }),
8751
- /* @__PURE__ */ jsx(CompAssetAddr, { children: "7 Bradleys Head Rd" })
8768
+ /* @__PURE__ */ jsx(CompAssetTooltipAddr, { children: "7 Bradleys Head Rd, Mosman" }),
8769
+ /* @__PURE__ */ jsxs(CompAssetTooltipStats, { children: [
8770
+ /* @__PURE__ */ jsxs(CompAssetTooltipRow, { children: [
8771
+ /* @__PURE__ */ jsx("span", { children: "Land" }),
8772
+ /* @__PURE__ */ jsx("span", { children: "2,592 sqm" })
8773
+ ] }),
8774
+ /* @__PURE__ */ jsxs(CompAssetTooltipRow, { children: [
8775
+ /* @__PURE__ */ jsx("span", { children: "Era" }),
8776
+ /* @__PURE__ */ jsx("span", { children: "c.1905" })
8777
+ ] }),
8778
+ /* @__PURE__ */ jsxs(CompAssetTooltipRow, { children: [
8779
+ /* @__PURE__ */ jsx("span", { children: "Growth" }),
8780
+ /* @__PURE__ */ jsx("span", { style: { color: "#4ade80" }, children: "+617%" })
8781
+ ] }),
8782
+ /* @__PURE__ */ jsxs(CompAssetTooltipRow, { children: [
8783
+ /* @__PURE__ */ jsx("span", { children: "$/sqm" }),
8784
+ /* @__PURE__ */ jsx("span", { children: "$10,787" })
8785
+ ] })
8786
+ ] })
8752
8787
  ] })
8753
8788
  ] }),
8754
- /* @__PURE__ */ jsxs(CompAssetMiniBottom, { children: [
8755
- /* @__PURE__ */ jsxs(CompAssetMiniStat, { children: [
8756
- /* @__PURE__ */ jsx(CompAssetStatLabel, { children: "Sale" }),
8757
- /* @__PURE__ */ jsx(CompAssetStatVal, { children: "$27.96M" })
8758
- ] }),
8759
- /* @__PURE__ */ jsxs(CompAssetMiniStat, { children: [
8760
- /* @__PURE__ */ jsx(CompAssetStatLabel, { children: "Land" }),
8761
- /* @__PURE__ */ jsx(CompAssetStatVal, { children: "2,592 sqm" })
8762
- ] }),
8763
- /* @__PURE__ */ jsxs(CompAssetMiniStat, { children: [
8764
- /* @__PURE__ */ jsx(CompAssetStatLabel, { children: "Growth" }),
8765
- /* @__PURE__ */ jsx(CompAssetStatVal, { style: { color: "#4ade80" }, children: "+617%" })
8766
- ] })
8767
- ] })
8789
+ /* @__PURE__ */ jsxs(CompAssetInfo, { children: [
8790
+ /* @__PURE__ */ jsx(CompAssetName, { children: "Dobroyd" }),
8791
+ /* @__PURE__ */ jsx(CompAssetAddr, { children: "7 Bradleys Head Rd" })
8792
+ ] }),
8793
+ /* @__PURE__ */ jsx(CompAssetPrice, { children: "$27.96M" })
8768
8794
  ] })
8769
8795
  ] })
8770
8796
  ] })
@@ -9734,56 +9760,120 @@ var CompAssetsPanel = styled9.div`
9734
9760
  padding: 1rem 1.25rem;
9735
9761
  display: flex;
9736
9762
  flex-direction: column;
9737
- gap: 0.5rem;
9763
+ gap: 0.35rem;
9738
9764
  `;
9739
9765
  var CompAssetsGrid = styled9.div`
9740
- display: grid;
9741
- grid-template-columns: repeat(2, 1fr);
9742
- gap: 0.5rem;
9743
- `;
9744
- var CompAssetMini = styled9.div`
9745
- background: rgba(255,255,255,0.02);
9746
- border: 1px solid rgba(255,255,255,0.06);
9747
- border-radius: 8px;
9748
- padding: 0.6rem;
9749
9766
  display: flex;
9750
9767
  flex-direction: column;
9751
- gap: 0.4rem;
9752
- transition: border-color 0.2s;
9753
- &:hover { border-color: rgba(212,175,55,0.3); }
9754
- `;
9755
- var CompAssetMiniTop = styled9.div`
9756
- display: flex;
9757
- align-items: center;
9758
- gap: 0.5rem;
9759
- `;
9760
- var CompAssetMiniBottom = styled9.div`
9761
- display: flex;
9762
9768
  gap: 0;
9763
- border-top: 1px solid rgba(255,255,255,0.04);
9764
- padding-top: 0.35rem;
9765
9769
  `;
9766
- var CompAssetMiniStat = styled9.div`
9767
- flex: 1;
9770
+ var CompAssetRow = styled9.div`
9768
9771
  display: flex;
9769
- flex-direction: column;
9770
9772
  align-items: center;
9771
- gap: 1px;
9772
- &:not(:last-child) { border-right: 1px solid rgba(255,255,255,0.04); }
9773
+ gap: 0.6rem;
9774
+ padding: 0.5rem 0;
9775
+ &:not(:last-child) { border-bottom: 1px solid rgba(255,255,255,0.04); }
9776
+ `;
9777
+ var CompAssetThumbWrap = styled9.div`
9778
+ position: relative;
9779
+ flex-shrink: 0;
9780
+ &:hover > div:last-child {
9781
+ display: block;
9782
+ }
9773
9783
  `;
9774
9784
  var CompAssetThumb = styled9.div`
9775
- width: 36px;
9776
- height: 36px;
9777
- border-radius: 8px;
9785
+ width: 32px;
9786
+ height: 32px;
9787
+ border-radius: 6px;
9778
9788
  overflow: hidden;
9779
9789
  flex-shrink: 0;
9780
9790
  background: rgba(255,255,255,0.05);
9791
+ cursor: pointer;
9792
+ transition: border-color 0.2s;
9793
+ border: 1px solid rgba(255,255,255,0.06);
9794
+ &:hover { border-color: rgba(212,175,55,0.4); }
9781
9795
  img {
9782
9796
  width: 100%;
9783
9797
  height: 100%;
9784
9798
  object-fit: cover;
9785
9799
  }
9786
9800
  `;
9801
+ var CompAssetTooltip = styled9.div`
9802
+ display: none;
9803
+ position: absolute;
9804
+ top: calc(100% + 10px);
9805
+ left: 50%;
9806
+ transform: translateX(-50%);
9807
+ width: 260px;
9808
+ background: #1a1d24;
9809
+ border: 1px solid rgba(255,255,255,0.1);
9810
+ border-radius: 8px;
9811
+ padding: 0.75rem;
9812
+ z-index: 100;
9813
+ box-shadow: 0 8px 24px rgba(0,0,0,0.5);
9814
+ pointer-events: none;
9815
+ `;
9816
+ var CompAssetTooltipArrow = styled9.div`
9817
+ position: absolute;
9818
+ top: -5px;
9819
+ left: 50%;
9820
+ transform: translateX(-50%) rotate(45deg);
9821
+ width: 8px;
9822
+ height: 8px;
9823
+ background: #1a1d24;
9824
+ border-left: 1px solid rgba(255,255,255,0.1);
9825
+ border-top: 1px solid rgba(255,255,255,0.1);
9826
+ `;
9827
+ var CompAssetTooltipImg = styled9.div`
9828
+ width: 100%;
9829
+ height: 110px;
9830
+ border-radius: 6px;
9831
+ overflow: hidden;
9832
+ margin-bottom: 0.6rem;
9833
+ background: rgba(255,255,255,0.03);
9834
+ img {
9835
+ width: 100%;
9836
+ height: 100%;
9837
+ object-fit: cover;
9838
+ }
9839
+ `;
9840
+ var CompAssetTooltipTitle = styled9.div`
9841
+ font-size: 0.8rem;
9842
+ font-weight: 600;
9843
+ color: #fff;
9844
+ display: flex;
9845
+ align-items: center;
9846
+ gap: 0.4rem;
9847
+ margin-bottom: 2px;
9848
+ `;
9849
+ var CompAssetTooltipAddr = styled9.div`
9850
+ font-size: 0.65rem;
9851
+ color: rgba(255,255,255,0.4);
9852
+ margin-bottom: 0.5rem;
9853
+ `;
9854
+ var CompAssetTooltipStats = styled9.div`
9855
+ display: flex;
9856
+ flex-direction: column;
9857
+ gap: 0;
9858
+ `;
9859
+ var CompAssetTooltipRow = styled9.div`
9860
+ display: flex;
9861
+ justify-content: space-between;
9862
+ align-items: center;
9863
+ padding: 0.3rem 0;
9864
+ border-bottom: 1px solid rgba(255,255,255,0.04);
9865
+ &:last-child { border-bottom: none; }
9866
+ span:first-child {
9867
+ font-size: 0.7rem;
9868
+ color: rgba(255,255,255,0.4);
9869
+ }
9870
+ span:last-child {
9871
+ font-size: 0.75rem;
9872
+ font-weight: 500;
9873
+ color: #fff;
9874
+ font-variant-numeric: tabular-nums;
9875
+ }
9876
+ `;
9787
9877
  var CompAssetInfo = styled9.div`
9788
9878
  flex: 1;
9789
9879
  min-width: 0;
@@ -9792,41 +9882,37 @@ var CompAssetName = styled9.div`
9792
9882
  font-size: 0.78rem;
9793
9883
  font-weight: 600;
9794
9884
  color: #fff;
9795
- display: flex;
9796
- align-items: center;
9797
- gap: 0.35rem;
9885
+ white-space: nowrap;
9798
9886
  `;
9799
9887
  var CompAssetBadge = styled9.span`
9800
- font-size: 0.58rem;
9888
+ font-size: 0.5rem;
9801
9889
  font-weight: 600;
9802
9890
  text-transform: uppercase;
9803
9891
  letter-spacing: 0.06em;
9804
9892
  color: #4ade80;
9805
9893
  background: rgba(74,222,128,0.1);
9806
9894
  border: 1px solid rgba(74,222,128,0.2);
9807
- padding: 1px 6px;
9808
- border-radius: 4px;
9895
+ padding: 1px 5px;
9896
+ border-radius: 3px;
9809
9897
  white-space: nowrap;
9898
+ vertical-align: middle;
9899
+ margin-left: 0.3rem;
9810
9900
  `;
9811
9901
  var CompAssetAddr = styled9.div`
9812
- font-size: 0.65rem;
9813
- color: rgba(255,255,255,0.4);
9902
+ font-size: 0.62rem;
9903
+ color: rgba(255,255,255,0.35);
9814
9904
  margin-top: 1px;
9815
9905
  white-space: nowrap;
9816
9906
  overflow: hidden;
9817
9907
  text-overflow: ellipsis;
9818
9908
  `;
9819
- var CompAssetStatLabel = styled9.span`
9820
- font-size: 0.6rem;
9821
- color: rgba(255,255,255,0.35);
9822
- text-transform: uppercase;
9823
- letter-spacing: 0.06em;
9824
- `;
9825
- var CompAssetStatVal = styled9.span`
9826
- font-size: 0.72rem;
9827
- font-weight: 500;
9909
+ var CompAssetPrice = styled9.div`
9910
+ font-size: 0.8rem;
9911
+ font-weight: 600;
9828
9912
  color: #fff;
9829
9913
  font-variant-numeric: tabular-nums;
9914
+ white-space: nowrap;
9915
+ flex-shrink: 0;
9830
9916
  `;
9831
9917
  styled9.div`
9832
9918
  font-size: 0.65rem;