@anker-in/ui 0.1.11 → 0.1.13
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/demo-room.js +119 -101
- package/dist/demo-room.js.map +1 -1
- package/dist/demo-room.mjs +119 -101
- package/dist/demo-room.mjs.map +1 -1
- package/dist/index.d.mts +5 -1
- package/dist/index.d.ts +5 -1
- package/dist/index.js +299 -262
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +299 -262
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -4
package/dist/demo-room.mjs
CHANGED
|
@@ -327,12 +327,14 @@ var StudioMap = ({
|
|
|
327
327
|
const lng = Number(location.lng);
|
|
328
328
|
const svgIcon = {
|
|
329
329
|
url: `data:image/svg+xml;charset=UTF-8,${encodeURIComponent(`
|
|
330
|
-
<svg
|
|
331
|
-
<
|
|
330
|
+
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
331
|
+
<circle cx="24" cy="24" r="22" fill="#00000010"/>
|
|
332
|
+
<circle cx="24" cy="24" r="10" fill="#000000"/>
|
|
333
|
+
<circle cx="24" cy="24" r="5" fill="#3ADB67"/>
|
|
332
334
|
</svg>
|
|
333
335
|
`)}`,
|
|
334
|
-
scaledSize: { width:
|
|
335
|
-
anchor: { x:
|
|
336
|
+
scaledSize: { width: 48, height: 48 },
|
|
337
|
+
anchor: { x: 24, y: 24 }
|
|
336
338
|
};
|
|
337
339
|
const marker = new google.maps.Marker({
|
|
338
340
|
position: { lat, lng },
|
|
@@ -520,7 +522,7 @@ var StudioMap = ({
|
|
|
520
522
|
"div",
|
|
521
523
|
{
|
|
522
524
|
className: cn(
|
|
523
|
-
"flex items-center justify-center bg-gray-100 rounded-
|
|
525
|
+
"flex items-center overflow-hidden justify-center bg-gray-100 rounded-[16px]",
|
|
524
526
|
className
|
|
525
527
|
),
|
|
526
528
|
style: { height: mapHeight },
|
|
@@ -532,7 +534,7 @@ var StudioMap = ({
|
|
|
532
534
|
return /* @__PURE__ */ jsxs(
|
|
533
535
|
"div",
|
|
534
536
|
{
|
|
535
|
-
className: cn("relative w-full rounded-
|
|
537
|
+
className: cn("relative w-full rounded-[16px] overflow-hidden", className),
|
|
536
538
|
...props,
|
|
537
539
|
children: [
|
|
538
540
|
/* @__PURE__ */ jsx("div", { ref: mapRef, style: { height: mapHeight } }),
|
|
@@ -741,6 +743,29 @@ var LocationFilter = ({
|
|
|
741
743
|
);
|
|
742
744
|
const showIndexBar = filteredItems.length >= 10;
|
|
743
745
|
const handleItemClick = (item) => {
|
|
746
|
+
if (item.code === "__all__") {
|
|
747
|
+
if (currentLevel === "country") {
|
|
748
|
+
onSelect?.({
|
|
749
|
+
level: "country"
|
|
750
|
+
});
|
|
751
|
+
onClose?.();
|
|
752
|
+
} else if (currentLevel === "state") {
|
|
753
|
+
onSelect?.({
|
|
754
|
+
level: "state",
|
|
755
|
+
country: selectedCountry
|
|
756
|
+
});
|
|
757
|
+
onClose?.();
|
|
758
|
+
} else if (currentLevel === "city") {
|
|
759
|
+
const parts = selectedState?.split("/") || [];
|
|
760
|
+
onSelect?.({
|
|
761
|
+
level: "city",
|
|
762
|
+
country: parts[0],
|
|
763
|
+
state: parts[1]
|
|
764
|
+
});
|
|
765
|
+
onClose?.();
|
|
766
|
+
}
|
|
767
|
+
return;
|
|
768
|
+
}
|
|
744
769
|
if (currentLevel === "country") {
|
|
745
770
|
setSelectedCountry(item.code);
|
|
746
771
|
setCurrentLevel("state");
|
|
@@ -771,87 +796,94 @@ var LocationFilter = ({
|
|
|
771
796
|
return /* @__PURE__ */ jsxs(
|
|
772
797
|
"div",
|
|
773
798
|
{
|
|
774
|
-
style: { height: "
|
|
799
|
+
style: { height: "724px" },
|
|
775
800
|
className: cn(
|
|
776
|
-
"w-full rounded-[12px] absolute z-10
|
|
801
|
+
"w-full rounded-b-[12px] absolute z-10 bottom-[-2px] left-0 bg-white border border-[#E4E5E6]",
|
|
777
802
|
RoomsList_default.antdMobileScope
|
|
778
803
|
),
|
|
779
804
|
children: [
|
|
780
|
-
/* @__PURE__ */
|
|
805
|
+
/* @__PURE__ */ jsx(
|
|
781
806
|
"div",
|
|
782
807
|
{
|
|
783
808
|
style: { background: "#F8F8F8" },
|
|
784
|
-
className: "
|
|
785
|
-
children: [
|
|
786
|
-
/* @__PURE__ */ jsx(
|
|
809
|
+
className: "h-[76px] font-bold text-[14px] flex flex-col",
|
|
810
|
+
children: /* @__PURE__ */ jsxs("div", { className: "flex items-center text-[16px] px-[20px] gap-[16px] py-[24px]", children: [
|
|
811
|
+
/* @__PURE__ */ jsx(
|
|
787
812
|
"button",
|
|
788
813
|
{
|
|
789
|
-
onClick:
|
|
790
|
-
className:
|
|
791
|
-
|
|
792
|
-
"
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
width: "24",
|
|
796
|
-
height: "24",
|
|
797
|
-
viewBox: "0 0 24 24",
|
|
798
|
-
fill: "none",
|
|
799
|
-
children: /* @__PURE__ */ jsx(
|
|
800
|
-
"path",
|
|
801
|
-
{
|
|
802
|
-
d: "M6.4 19L5 17.6L10.6 12L5 6.4L6.4 5L12 10.6L17.6 5L19 6.4L13.4 12L19 17.6L17.6 19L12 13.4L6.4 19Z",
|
|
803
|
-
fill: "#1D1D1F"
|
|
804
|
-
}
|
|
805
|
-
)
|
|
806
|
-
}
|
|
807
|
-
)
|
|
814
|
+
onClick: () => handleTabClick("country"),
|
|
815
|
+
className: cn(
|
|
816
|
+
"pb-[4px] transition-colors",
|
|
817
|
+
currentLevel === "country" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]"
|
|
818
|
+
),
|
|
819
|
+
children: pageData.country
|
|
808
820
|
}
|
|
809
|
-
)
|
|
810
|
-
/* @__PURE__ */
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
{
|
|
838
|
-
onClick: () => handleTabClick("city"),
|
|
839
|
-
disabled: !selectedState,
|
|
840
|
-
className: cn(
|
|
841
|
-
"pb-[4px] transition-colors",
|
|
842
|
-
currentLevel === "city" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
|
|
843
|
-
!selectedState && "opacity-50 cursor-not-allowed"
|
|
844
|
-
),
|
|
845
|
-
children: pageData.city
|
|
846
|
-
}
|
|
847
|
-
)
|
|
848
|
-
] })
|
|
849
|
-
]
|
|
821
|
+
),
|
|
822
|
+
/* @__PURE__ */ jsx(
|
|
823
|
+
"button",
|
|
824
|
+
{
|
|
825
|
+
onClick: () => handleTabClick("state"),
|
|
826
|
+
disabled: !selectedCountry,
|
|
827
|
+
className: cn(
|
|
828
|
+
"pb-[4px] transition-colors",
|
|
829
|
+
currentLevel === "state" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
|
|
830
|
+
!selectedCountry && "opacity-50 cursor-not-allowed"
|
|
831
|
+
),
|
|
832
|
+
children: pageData.state
|
|
833
|
+
}
|
|
834
|
+
),
|
|
835
|
+
/* @__PURE__ */ jsx(
|
|
836
|
+
"button",
|
|
837
|
+
{
|
|
838
|
+
onClick: () => handleTabClick("city"),
|
|
839
|
+
disabled: !selectedState,
|
|
840
|
+
className: cn(
|
|
841
|
+
"pb-[4px] transition-colors",
|
|
842
|
+
currentLevel === "city" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
|
|
843
|
+
!selectedState && "opacity-50 cursor-not-allowed"
|
|
844
|
+
),
|
|
845
|
+
children: pageData.city
|
|
846
|
+
}
|
|
847
|
+
)
|
|
848
|
+
] })
|
|
850
849
|
}
|
|
851
850
|
),
|
|
852
|
-
/* @__PURE__ */ jsx(AntdMobileIsolated, { style: { height: "calc(100% -
|
|
853
|
-
|
|
854
|
-
|
|
851
|
+
/* @__PURE__ */ jsx(AntdMobileIsolated, { style: { height: "calc(100% - 76px)" }, children: showIndexBar ? /* @__PURE__ */ jsxs("div", { style: { height: "100%", display: "flex", flexDirection: "column" }, children: [
|
|
852
|
+
/* @__PURE__ */ jsx(List, { children: /* @__PURE__ */ jsx(
|
|
853
|
+
List.Item,
|
|
854
|
+
{
|
|
855
|
+
onClick: () => handleItemClick({ code: "__all__", name: pageData.allLocations || "All", count: filteredItems.length }),
|
|
856
|
+
className: "text-[16px] !pl-[24px] font-bold",
|
|
857
|
+
style: { cursor: "pointer", borderBottom: "1px solid #E4E5E6" },
|
|
858
|
+
children: pageData.allLocations
|
|
859
|
+
},
|
|
860
|
+
"__all__"
|
|
861
|
+
) }),
|
|
862
|
+
/* @__PURE__ */ jsx(IndexBar, { style: { flex: 1 }, children: groupedItems.map((group) => {
|
|
863
|
+
const { title, items } = group;
|
|
864
|
+
return /* @__PURE__ */ jsx(IndexBar.Panel, { index: title, title, children: /* @__PURE__ */ jsx(List, { children: items.map((item) => /* @__PURE__ */ jsx(
|
|
865
|
+
List.Item,
|
|
866
|
+
{
|
|
867
|
+
onClick: () => handleItemClick(item),
|
|
868
|
+
className: "text-[16px] !pl-[24px]",
|
|
869
|
+
style: { cursor: "pointer" },
|
|
870
|
+
children: item.name
|
|
871
|
+
},
|
|
872
|
+
item.code
|
|
873
|
+
)) }) }, title);
|
|
874
|
+
}) })
|
|
875
|
+
] }) : /* @__PURE__ */ jsx("div", { style: { height: "100%", overflow: "auto" }, children: /* @__PURE__ */ jsxs(List, { children: [
|
|
876
|
+
/* @__PURE__ */ jsx(
|
|
877
|
+
List.Item,
|
|
878
|
+
{
|
|
879
|
+
onClick: () => handleItemClick({ code: "__all__", name: pageData.allLocations || "All", count: filteredItems.length }),
|
|
880
|
+
className: "text-[16px] !pl-[24px] font-bold",
|
|
881
|
+
style: { cursor: "pointer", borderBottom: "1px solid #E4E5E6" },
|
|
882
|
+
children: pageData.allLocations
|
|
883
|
+
},
|
|
884
|
+
"__all__"
|
|
885
|
+
),
|
|
886
|
+
filteredItems.map((item) => /* @__PURE__ */ jsx(
|
|
855
887
|
List.Item,
|
|
856
888
|
{
|
|
857
889
|
onClick: () => handleItemClick(item),
|
|
@@ -860,17 +892,8 @@ var LocationFilter = ({
|
|
|
860
892
|
children: item.name
|
|
861
893
|
},
|
|
862
894
|
item.code
|
|
863
|
-
))
|
|
864
|
-
}) })
|
|
865
|
-
List.Item,
|
|
866
|
-
{
|
|
867
|
-
onClick: () => handleItemClick(item),
|
|
868
|
-
className: "text-[16px] !pl-[24px]",
|
|
869
|
-
style: { cursor: "pointer" },
|
|
870
|
-
children: item.name
|
|
871
|
-
},
|
|
872
|
-
item.code
|
|
873
|
-
)) }) }) })
|
|
895
|
+
))
|
|
896
|
+
] }) }) })
|
|
874
897
|
]
|
|
875
898
|
}
|
|
876
899
|
);
|
|
@@ -1096,10 +1119,6 @@ var RoomsList = ({
|
|
|
1096
1119
|
setSelectedLocation(selection);
|
|
1097
1120
|
setShowLocationFilter(false);
|
|
1098
1121
|
};
|
|
1099
|
-
const handleClearFilter = () => {
|
|
1100
|
-
setSelectedLocation(void 0);
|
|
1101
|
-
};
|
|
1102
|
-
console.log(filteredStudioLocations);
|
|
1103
1122
|
return /* @__PURE__ */ jsxs("div", { className, ...props, children: [
|
|
1104
1123
|
/* @__PURE__ */ jsx(Title, { title: mergedPageData.title }),
|
|
1105
1124
|
loading && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center h-[794px]", children: /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx("div", { className: "text-lg font-medium", children: mergedPageData.loadingText }) }) }),
|
|
@@ -1114,12 +1133,15 @@ var RoomsList = ({
|
|
|
1114
1133
|
className: "flex-none relative w-[420px] l:!w-full",
|
|
1115
1134
|
style: { height: "794px" },
|
|
1116
1135
|
children: [
|
|
1117
|
-
/* @__PURE__ */ jsx("div", { className:
|
|
1136
|
+
/* @__PURE__ */ jsx("div", { className: cn(
|
|
1137
|
+
"mb-4 bg-white border border-[#E4E5E6] px-[20px] py-[16px]",
|
|
1138
|
+
showLocationFilter ? "rounded-t-[12px] rounded-b-none" : "rounded-[12px]"
|
|
1139
|
+
), children: /* @__PURE__ */ jsxs("div", { className: "h-[40px] font-bold text-[16px] l:text-[14px] gap-10 l:gap-4 flex items-center", children: [
|
|
1118
1140
|
/* @__PURE__ */ jsxs(
|
|
1119
1141
|
"button",
|
|
1120
1142
|
{
|
|
1121
1143
|
className: "flex cursor-pointer items-center hover:text-[#3ADB67] transition-colors",
|
|
1122
|
-
onClick: () => setShowLocationFilter(
|
|
1144
|
+
onClick: () => setShowLocationFilter(!showLocationFilter),
|
|
1123
1145
|
children: [
|
|
1124
1146
|
/* @__PURE__ */ jsx("span", { className: "mr-1", children: getSelectedLocationName() }),
|
|
1125
1147
|
/* @__PURE__ */ jsx(
|
|
@@ -1130,6 +1152,10 @@ var RoomsList = ({
|
|
|
1130
1152
|
height: "24",
|
|
1131
1153
|
viewBox: "0 0 24 24",
|
|
1132
1154
|
fill: "none",
|
|
1155
|
+
className: cn(
|
|
1156
|
+
"transition-transform duration-300",
|
|
1157
|
+
showLocationFilter && "rotate-180"
|
|
1158
|
+
),
|
|
1133
1159
|
children: /* @__PURE__ */ jsx(
|
|
1134
1160
|
"path",
|
|
1135
1161
|
{
|
|
@@ -1142,14 +1168,7 @@ var RoomsList = ({
|
|
|
1142
1168
|
]
|
|
1143
1169
|
}
|
|
1144
1170
|
),
|
|
1145
|
-
selectedLocation &&
|
|
1146
|
-
"button",
|
|
1147
|
-
{
|
|
1148
|
-
onClick: handleClearFilter,
|
|
1149
|
-
className: "ml-auto text-[14px] text-[#2E8B57] hover:underline",
|
|
1150
|
-
children: mergedPageData.locationFilter.clear
|
|
1151
|
-
}
|
|
1152
|
-
),
|
|
1171
|
+
selectedLocation && false,
|
|
1153
1172
|
/* @__PURE__ */ jsxs("div", { className: "flex text-[#767880] cursor-not-allowed", children: [
|
|
1154
1173
|
mergedPageData.machine,
|
|
1155
1174
|
/* @__PURE__ */ jsx(
|
|
@@ -1190,7 +1209,6 @@ var RoomsList = ({
|
|
|
1190
1209
|
euifyMakeModel: item?.euifyMakeModel || "",
|
|
1191
1210
|
onSchedule,
|
|
1192
1211
|
onMouseEnter: () => setHoveredRoomId(item.id),
|
|
1193
|
-
onMouseLeave: () => setHoveredRoomId(null),
|
|
1194
1212
|
pageData: {
|
|
1195
1213
|
...mergedPageData.studioCard,
|
|
1196
1214
|
noAvailableTime: mergedPageData?.noAvailableTime
|