@loafmarkets/ui 0.1.230 → 0.1.232

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.js CHANGED
@@ -8736,59 +8736,101 @@ function PropertyOverview({
8736
8736
  /* @__PURE__ */ jsxRuntime.jsxs(CompAssetsPanel, { children: [
8737
8737
  /* @__PURE__ */ jsxRuntime.jsx(StatsColumnHeader, { children: "Comparable Assets" }),
8738
8738
  /* @__PURE__ */ jsxRuntime.jsxs(CompAssetsGrid, { children: [
8739
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMini, { children: [
8740
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniTop, { children: [
8741
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetThumb, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/boondabah.jpg", alt: "Boondabah", onError: (e) => {
8739
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetStrip, { children: [
8740
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetStripImg, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/boondabah.jpg", alt: "Boondabah", onError: (e) => {
8741
+ e.target.style.display = "none";
8742
+ } }) }),
8743
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetStripInfo, { children: [
8744
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetStripName, { children: [
8745
+ "Boondabah ",
8746
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetBadge, { children: "HERITAGE" })
8747
+ ] }),
8748
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetStripAddr, { children: "200A Raglan St, Mosman" })
8749
+ ] }),
8750
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetStripRight, { children: [
8751
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetStripPrice, { children: "$16.07M" }),
8752
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetStripGrowth, { style: { color: "#4ade80" }, children: "+119%" })
8753
+ ] }),
8754
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltip, { children: [
8755
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetTooltipArrow, {}),
8756
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetTooltipImg, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/boondabah.jpg", alt: "Boondabah", onError: (e) => {
8742
8757
  e.target.style.display = "none";
8743
8758
  } }) }),
8744
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetInfo, { children: [
8745
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetName, { children: [
8746
- "Boondabah ",
8747
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetBadge, { children: "HERITAGE" })
8748
- ] }),
8749
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetAddr, { children: "200A Raglan St, Mosman" })
8750
- ] })
8751
- ] }),
8752
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniBottom, { children: [
8753
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniStat, { children: [
8754
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatLabel, { children: "Sale" }),
8755
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatVal, { children: "$16.07M" })
8756
- ] }),
8757
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniStat, { children: [
8758
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatLabel, { children: "Land" }),
8759
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatVal, { children: "2,066 sqm" })
8759
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipTitle, { children: [
8760
+ "Boondabah ",
8761
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetBadge, { children: "HERITAGE" })
8760
8762
  ] }),
8761
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniStat, { children: [
8762
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatLabel, { children: "Growth" }),
8763
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatVal, { style: { color: "#4ade80" }, children: "+119%" })
8763
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetTooltipAddr, { children: "200A Raglan St, Mosman" }),
8764
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipStats, { children: [
8765
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8766
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Sale Price" }),
8767
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "$16.07M" })
8768
+ ] }),
8769
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8770
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Land" }),
8771
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "2,066 sqm" })
8772
+ ] }),
8773
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8774
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Era" }),
8775
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "c.1905" })
8776
+ ] }),
8777
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8778
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Growth" }),
8779
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#4ade80" }, children: "+119%" })
8780
+ ] }),
8781
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8782
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "$/sqm" }),
8783
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "$7,780" })
8784
+ ] })
8764
8785
  ] })
8765
8786
  ] })
8766
8787
  ] }),
8767
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMini, { children: [
8768
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniTop, { children: [
8769
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetThumb, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/bradleys.jpg", alt: "Bradleys Head", onError: (e) => {
8788
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetStrip, { children: [
8789
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetStripImg, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/bradleys.jpg", alt: "Dobroyd", onError: (e) => {
8790
+ e.target.style.display = "none";
8791
+ } }) }),
8792
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetStripInfo, { children: [
8793
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetStripName, { children: [
8794
+ "Dobroyd ",
8795
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetBadge, { children: "HERITAGE" })
8796
+ ] }),
8797
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetStripAddr, { children: "7 Bradleys Head Rd, Mosman" })
8798
+ ] }),
8799
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetStripRight, { children: [
8800
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetStripPrice, { children: "$27.96M" }),
8801
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetStripGrowth, { style: { color: "#4ade80" }, children: "+617%" })
8802
+ ] }),
8803
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltip, { children: [
8804
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetTooltipArrow, {}),
8805
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetTooltipImg, { children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: "/bradleys.jpg", alt: "Dobroyd", onError: (e) => {
8770
8806
  e.target.style.display = "none";
8771
8807
  } }) }),
8772
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetInfo, { children: [
8773
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetName, { children: [
8774
- "Dobroyd ",
8775
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetBadge, { children: "HERITAGE" })
8776
- ] }),
8777
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetAddr, { children: "7 Bradleys Head Rd" })
8778
- ] })
8779
- ] }),
8780
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniBottom, { children: [
8781
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniStat, { children: [
8782
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatLabel, { children: "Sale" }),
8783
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatVal, { children: "$27.96M" })
8784
- ] }),
8785
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniStat, { children: [
8786
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatLabel, { children: "Land" }),
8787
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatVal, { children: "2,592 sqm" })
8808
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipTitle, { children: [
8809
+ "Dobroyd ",
8810
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetBadge, { children: "HERITAGE" })
8788
8811
  ] }),
8789
- /* @__PURE__ */ jsxRuntime.jsxs(CompAssetMiniStat, { children: [
8790
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatLabel, { children: "Growth" }),
8791
- /* @__PURE__ */ jsxRuntime.jsx(CompAssetStatVal, { style: { color: "#4ade80" }, children: "+617%" })
8812
+ /* @__PURE__ */ jsxRuntime.jsx(CompAssetTooltipAddr, { children: "7 Bradleys Head Rd, Mosman" }),
8813
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipStats, { children: [
8814
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8815
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Sale Price" }),
8816
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "$27.96M" })
8817
+ ] }),
8818
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8819
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Land" }),
8820
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "2,592 sqm" })
8821
+ ] }),
8822
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8823
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Era" }),
8824
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "c.1905" })
8825
+ ] }),
8826
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8827
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Growth" }),
8828
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#4ade80" }, children: "+617%" })
8829
+ ] }),
8830
+ /* @__PURE__ */ jsxRuntime.jsxs(CompAssetTooltipRow, { children: [
8831
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "$/sqm" }),
8832
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "$10,787" })
8833
+ ] })
8792
8834
  ] })
8793
8835
  ] })
8794
8836
  ] })
@@ -9757,49 +9799,38 @@ var CompAssetsPanel = styled9__default.default.div`
9757
9799
  background: #111111;
9758
9800
  border: 1px solid rgba(255,255,255,0.1);
9759
9801
  border-radius: 12px;
9760
- padding: 1rem 1.25rem;
9802
+ padding: 0.75rem 1rem;
9761
9803
  display: flex;
9762
9804
  flex-direction: column;
9763
- gap: 0.5rem;
9805
+ gap: 0.35rem;
9764
9806
  `;
9765
9807
  var CompAssetsGrid = styled9__default.default.div`
9766
- display: grid;
9767
- grid-template-columns: repeat(2, 1fr);
9768
- gap: 0.5rem;
9769
- `;
9770
- var CompAssetMini = styled9__default.default.div`
9771
- background: rgba(255,255,255,0.02);
9772
- border: 1px solid rgba(255,255,255,0.06);
9773
- border-radius: 8px;
9774
- padding: 0.6rem;
9775
9808
  display: flex;
9776
9809
  flex-direction: column;
9777
- gap: 0.4rem;
9778
- transition: border-color 0.2s;
9779
- &:hover { border-color: rgba(212,175,55,0.3); }
9780
- `;
9781
- var CompAssetMiniTop = styled9__default.default.div`
9782
- display: flex;
9783
- align-items: center;
9784
9810
  gap: 0.5rem;
9785
9811
  `;
9786
- var CompAssetMiniBottom = styled9__default.default.div`
9787
- display: flex;
9788
- gap: 0;
9789
- border-top: 1px solid rgba(255,255,255,0.04);
9790
- padding-top: 0.35rem;
9791
- `;
9792
- var CompAssetMiniStat = styled9__default.default.div`
9793
- flex: 1;
9812
+ var CompAssetStrip = styled9__default.default.div`
9813
+ position: relative;
9794
9814
  display: flex;
9795
- flex-direction: column;
9796
9815
  align-items: center;
9797
- gap: 1px;
9798
- &:not(:last-child) { border-right: 1px solid rgba(255,255,255,0.04); }
9816
+ gap: 0.75rem;
9817
+ background: rgba(255,255,255,0.02);
9818
+ border: 1px solid rgba(255,255,255,0.06);
9819
+ border-radius: 10px;
9820
+ padding: 0.6rem 1rem 0.6rem 0.6rem;
9821
+ transition: border-color 0.2s, background 0.2s;
9822
+ cursor: pointer;
9823
+ &:hover {
9824
+ border-color: rgba(212,175,55,0.3);
9825
+ background: rgba(255,255,255,0.03);
9826
+ }
9827
+ &:hover > div:last-child {
9828
+ display: block;
9829
+ }
9799
9830
  `;
9800
- var CompAssetThumb = styled9__default.default.div`
9801
- width: 36px;
9802
- height: 36px;
9831
+ var CompAssetStripImg = styled9__default.default.div`
9832
+ width: 52px;
9833
+ height: 52px;
9803
9834
  border-radius: 8px;
9804
9835
  overflow: hidden;
9805
9836
  flex-shrink: 0;
@@ -9810,20 +9841,47 @@ var CompAssetThumb = styled9__default.default.div`
9810
9841
  object-fit: cover;
9811
9842
  }
9812
9843
  `;
9813
- var CompAssetInfo = styled9__default.default.div`
9844
+ var CompAssetStripInfo = styled9__default.default.div`
9814
9845
  flex: 1;
9815
9846
  min-width: 0;
9847
+ display: flex;
9848
+ flex-direction: column;
9849
+ gap: 2px;
9816
9850
  `;
9817
- var CompAssetName = styled9__default.default.div`
9818
- font-size: 0.78rem;
9851
+ var CompAssetStripName = styled9__default.default.div`
9852
+ font-size: 0.9rem;
9819
9853
  font-weight: 600;
9820
9854
  color: #fff;
9821
9855
  display: flex;
9822
9856
  align-items: center;
9823
- gap: 0.35rem;
9857
+ gap: 0.4rem;
9858
+ `;
9859
+ var CompAssetStripAddr = styled9__default.default.div`
9860
+ font-size: 0.72rem;
9861
+ color: rgba(255,255,255,0.4);
9862
+ `;
9863
+ var CompAssetStripRight = styled9__default.default.div`
9864
+ flex-shrink: 0;
9865
+ text-align: right;
9866
+ display: flex;
9867
+ flex-direction: column;
9868
+ align-items: flex-end;
9869
+ gap: 2px;
9870
+ `;
9871
+ var CompAssetStripPrice = styled9__default.default.div`
9872
+ font-size: 1rem;
9873
+ font-weight: 700;
9874
+ color: #fff;
9875
+ font-variant-numeric: tabular-nums;
9876
+ white-space: nowrap;
9877
+ `;
9878
+ var CompAssetStripGrowth = styled9__default.default.div`
9879
+ font-size: 0.72rem;
9880
+ font-weight: 500;
9881
+ font-variant-numeric: tabular-nums;
9824
9882
  `;
9825
9883
  var CompAssetBadge = styled9__default.default.span`
9826
- font-size: 0.58rem;
9884
+ font-size: 0.52rem;
9827
9885
  font-weight: 600;
9828
9886
  text-transform: uppercase;
9829
9887
  letter-spacing: 0.06em;
@@ -9834,25 +9892,81 @@ var CompAssetBadge = styled9__default.default.span`
9834
9892
  border-radius: 4px;
9835
9893
  white-space: nowrap;
9836
9894
  `;
9837
- var CompAssetAddr = styled9__default.default.div`
9895
+ var CompAssetTooltip = styled9__default.default.div`
9896
+ display: none;
9897
+ position: absolute;
9898
+ bottom: calc(100% + 10px);
9899
+ left: 50%;
9900
+ transform: translateX(-50%);
9901
+ width: 280px;
9902
+ background: #1a1d24;
9903
+ border: 1px solid rgba(255,255,255,0.1);
9904
+ border-radius: 8px;
9905
+ padding: 0.75rem;
9906
+ z-index: 100;
9907
+ box-shadow: 0 8px 24px rgba(0,0,0,0.5);
9908
+ pointer-events: none;
9909
+ `;
9910
+ var CompAssetTooltipArrow = styled9__default.default.div`
9911
+ position: absolute;
9912
+ bottom: -5px;
9913
+ left: 50%;
9914
+ transform: translateX(-50%) rotate(45deg);
9915
+ width: 8px;
9916
+ height: 8px;
9917
+ background: #1a1d24;
9918
+ border-right: 1px solid rgba(255,255,255,0.1);
9919
+ border-bottom: 1px solid rgba(255,255,255,0.1);
9920
+ `;
9921
+ var CompAssetTooltipImg = styled9__default.default.div`
9922
+ width: 100%;
9923
+ height: 120px;
9924
+ border-radius: 6px;
9925
+ overflow: hidden;
9926
+ margin-bottom: 0.6rem;
9927
+ background: rgba(255,255,255,0.03);
9928
+ img {
9929
+ width: 100%;
9930
+ height: 100%;
9931
+ object-fit: cover;
9932
+ }
9933
+ `;
9934
+ var CompAssetTooltipTitle = styled9__default.default.div`
9935
+ font-size: 0.8rem;
9936
+ font-weight: 600;
9937
+ color: #fff;
9938
+ display: flex;
9939
+ align-items: center;
9940
+ gap: 0.4rem;
9941
+ margin-bottom: 2px;
9942
+ `;
9943
+ var CompAssetTooltipAddr = styled9__default.default.div`
9838
9944
  font-size: 0.65rem;
9839
9945
  color: rgba(255,255,255,0.4);
9840
- margin-top: 1px;
9841
- white-space: nowrap;
9842
- overflow: hidden;
9843
- text-overflow: ellipsis;
9946
+ margin-bottom: 0.5rem;
9844
9947
  `;
9845
- var CompAssetStatLabel = styled9__default.default.span`
9846
- font-size: 0.6rem;
9847
- color: rgba(255,255,255,0.35);
9848
- text-transform: uppercase;
9849
- letter-spacing: 0.06em;
9948
+ var CompAssetTooltipStats = styled9__default.default.div`
9949
+ display: flex;
9950
+ flex-direction: column;
9951
+ gap: 0;
9850
9952
  `;
9851
- var CompAssetStatVal = styled9__default.default.span`
9852
- font-size: 0.72rem;
9853
- font-weight: 500;
9854
- color: #fff;
9855
- font-variant-numeric: tabular-nums;
9953
+ var CompAssetTooltipRow = styled9__default.default.div`
9954
+ display: flex;
9955
+ justify-content: space-between;
9956
+ align-items: center;
9957
+ padding: 0.3rem 0;
9958
+ border-bottom: 1px solid rgba(255,255,255,0.04);
9959
+ &:last-child { border-bottom: none; }
9960
+ span:first-child {
9961
+ font-size: 0.7rem;
9962
+ color: rgba(255,255,255,0.4);
9963
+ }
9964
+ span:last-child {
9965
+ font-size: 0.75rem;
9966
+ font-weight: 500;
9967
+ color: #fff;
9968
+ font-variant-numeric: tabular-nums;
9969
+ }
9856
9970
  `;
9857
9971
  styled9__default.default.div`
9858
9972
  font-size: 0.65rem;