kupos-ui-components-lib 9.7.6 → 9.7.8

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 (11) hide show
  1. package/dist/components/ServiceItem/PeruServiceItemDesktop.d.ts +1 -1
  2. package/dist/components/ServiceItem/PeruServiceItemDesktop.js +188 -134
  3. package/dist/components/ServiceItem/ServiceItemDesktop.js +1 -1
  4. package/dist/styles.css +0 -15
  5. package/dist/ui/FeaturServiceUiMobile/FeatureServiceUiMobile.d.ts +5 -1
  6. package/dist/ui/FeaturServiceUiMobile/FeatureServiceUiMobile.js +40 -92
  7. package/dist/ui/FeatureServiceUI/FeatureServiceUi.d.ts +5 -1
  8. package/dist/ui/FeatureServiceUI/FeatureServiceUi.js +40 -5
  9. package/package.json +1 -1
  10. package/src/components/ServiceItem/PeruServiceItemDesktop.tsx +345 -254
  11. package/src/components/ServiceItem/ServiceItemDesktop.tsx +6 -0
package/dist/ui/FeaturServiceUiMobile/FeatureServiceUiMobile.js CHANGED
@@ -27,13 +27,14 @@ const HARDCODED_OPERATORS = [
27
27
  seatsAvailable: "3 disponibles",
28
28
  },
29
29
  ];
30
- const FeatureServiceUiMobile = ({ serviceItem, showTopLabel, colors, isSoldOut, cityOrigin, cityDestination, renderIcon, viewersConfig, isFeatureDropDownExpand, onToggleExpand, ticketQuantity = 1, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onBookButtonPress, }) => {
31
- var _a, _b, _c, _d;
30
+ const FeatureServiceUiMobile = ({ serviceItem, showTopLabel, colors, isSoldOut, cityOrigin, cityDestination, renderIcon, viewersConfig, isFeatureDropDownExpand, onToggleExpand, ticketQuantity = 1, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onBookButtonPress, selectedTimeSlot = TIME_SLOTS[0], onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, }) => {
31
+ var _a, _b, _c, _d, _e;
32
32
  const operators = ((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operators) === null || _a === void 0 ? void 0 : _a.length) > 0
33
33
  ? serviceItem.operators
34
34
  : HARDCODED_OPERATORS;
35
35
  const isItemExpanded = serviceItem.id === isFeatureDropDownExpand ||
36
36
  isFeatureDropDownExpand === true;
37
+ const isThisTimeDropdownOpen = isTimeDropdownOpen === serviceItem.id;
37
38
  const canDecreaseTicketQuantity = ticketQuantity > 1;
38
39
  const HOW_IT_WORKS_STEPS = [
39
40
  {
@@ -120,94 +121,54 @@ const FeatureServiceUiMobile = ({ serviceItem, showTopLabel, colors, isSoldOut,
120
121
  } }),
121
122
  React.createElement("div", { className: "flex items-center gap-[6px]" },
122
123
  React.createElement("img", { src: (_c = serviceItem.icons) === null || _c === void 0 ? void 0 : _c.whiteDestination, alt: "destination", className: `w-[14px] h-[14px] shrink-0 ${isSoldOut ? "grayscale" : ""}`, style: { opacity: isSoldOut ? 0.5 : 1 } }),
123
- React.createElement("details", { className: "kupos-time-dd relative" },
124
- React.createElement("summary", { className: "flex items-center gap-[6px] bold-text text-[13px] text-white", style: { cursor: "pointer", userSelect: "none" } },
125
- React.createElement("span", { "data-time-label": "true" }, TIME_SLOTS[0]),
126
- React.createElement("svg", { className: "kupos-time-chevron", width: "10", height: "6", viewBox: "0 0 10 6", fill: "none" },
127
- React.createElement("path", { d: "M1 1l4 4 4-4", stroke: "#fff", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }))),
128
- React.createElement("div", { className: "absolute left-0 top-[calc(100%+10px)]", style: {
129
- zIndex: 20,
130
- backgroundColor: "#fff",
131
- borderRadius: "14px",
132
- minWidth: "248px",
133
- boxShadow: "0 8px 32px rgba(0,0,0,0.28)",
134
- overflow: "hidden",
135
- padding: "6px 0",
136
- } }, TIME_SLOTS.map((slot, index) => {
137
- const isFirst = index === 0;
138
- return (React.createElement("button", { key: slot, type: "button", "data-time-option": "true", "data-time-slot": slot, onClick: (e) => {
139
- const details = e.currentTarget.closest("details");
140
- if (details) {
141
- const label = details.querySelector("[data-time-label]");
142
- if (label)
143
- label.textContent = slot;
144
- details
145
- .querySelectorAll("[data-time-option]")
146
- .forEach((btn) => {
147
- const el = btn;
148
- const active = el.dataset.timeSlot === slot;
149
- el.style.background = active
150
- ? "#4169E1"
151
- : "transparent";
152
- el.style.color = active
153
- ? "#fff"
154
- : "#1a1a1a";
155
- const ck = el.querySelector("[data-checkmark]");
156
- if (ck)
157
- ck.style.display = active
158
- ? "flex"
159
- : "none";
160
- const lbl = el.querySelector("[data-slot-label]");
161
- if (lbl)
162
- lbl.style.fontWeight = active
163
- ? "bold"
164
- : "normal";
165
- });
166
- details.open = false;
167
- }
168
- }, className: "flex w-full items-center gap-[10px] px-[16px] py-[13px] text-[13px]", style: {
169
- background: isFirst ? "#4169E1" : "transparent",
170
- border: "none",
171
- cursor: "pointer",
172
- textAlign: "left",
173
- color: isFirst ? "#fff" : "#1a1a1a",
174
- } },
175
- React.createElement("div", { "data-checkmark": "true", style: {
176
- width: "16px",
177
- flexShrink: 0,
178
- display: isFirst ? "flex" : "none",
179
- alignItems: "center",
180
- justifyContent: "center",
181
- } },
182
- React.createElement("svg", { width: "14", height: "11", viewBox: "0 0 14 11", fill: "none" },
183
- React.createElement("path", { d: "M1 5.5l3.5 4L13 1", stroke: "#fff", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }))),
184
- React.createElement("span", { "data-slot-label": "true", style: {
185
- fontWeight: isFirst ? "bold" : "normal",
186
- } }, slot)));
187
- })))))),
124
+ React.createElement("div", { className: "kupos-time-dd relative", tabIndex: 0, onBlur: (e) => {
125
+ if (!e.currentTarget.contains(e.relatedTarget)) {
126
+ onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(null);
127
+ }
128
+ }, style: { outline: "none" } },
129
+ React.createElement("button", { type: "button", onClick: () => onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(isThisTimeDropdownOpen ? null : serviceItem.id), className: "flex cursor-pointer select-none items-center gap-[6px] border-none bg-transparent p-0 bold-text text-[13px] text-[white]" },
130
+ React.createElement("span", null, selectedTimeSlot),
131
+ React.createElement("img", { src: (_d = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _d === void 0 ? void 0 : _d.downArrow, alt: "down arrow", className: `kupos-time-chevron transition-transform duration-200 ${isThisTimeDropdownOpen ? "rotate-180" : "rotate-0"}`, style: {
132
+ width: "12px",
133
+ height: "8px",
134
+ filter: "brightness(0) invert(1)",
135
+ } })),
136
+ isThisTimeDropdownOpen && (React.createElement(React.Fragment, null,
137
+ React.createElement("div", { className: "absolute left-0 top-[calc(100%+10px)]", style: {
138
+ zIndex: 20,
139
+ backgroundColor: "#fff",
140
+ borderRadius: "14px",
141
+ minWidth: "248px",
142
+ boxShadow: "0 8px 32px rgba(0,0,0,0.28)",
143
+ overflow: "hidden",
144
+ padding: "6px 0",
145
+ } }, TIME_SLOTS.map((slot) => {
146
+ const isActive = slot === selectedTimeSlot;
147
+ return (React.createElement("button", { key: slot, type: "button", onClick: () => {
148
+ onTimeSlotChange === null || onTimeSlotChange === void 0 ? void 0 : onTimeSlotChange(slot);
149
+ onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(null);
150
+ }, className: `flex w-full cursor-pointer items-center gap-[10px] border-none px-[12px] py-[9px] text-left text-[13px] ${isActive ? "bg-[#FF5C60] font-bold text-[white]" : "bg-transparent font-normal text-[#1a1a1a]"}` },
151
+ React.createElement("span", null, slot)));
152
+ })))))))),
188
153
  React.createElement("div", { className: "border-t border-[#363c48] my-[8px]" }),
189
154
  React.createElement("div", null,
190
155
  React.createElement("span", { className: "text-[15px] bold-text text-[white] flex items-center justify-center mb-[10px]" }, "3 operadores compitiendo por tu compra"),
191
156
  React.createElement("div", { className: "flex gap-[8px] text-[white]" }, operators.map((op, idx) => (React.createElement("div", { key: idx, className: "flex min-w-0 flex-col items-center justify-center gap-[8px] rounded-[8px]", style: {
192
- // height: "80px",
157
+ height: "100px",
193
158
  border: "1px solid #363c48",
194
159
  backgroundColor: "#1a202e",
195
160
  padding: "14px 10px",
196
161
  } },
197
162
  React.createElement("img", { src: serviceItem.operator_details[0], alt: op.name, className: `h-[24px] max-w-full object-contain ${isSoldOut ? "grayscale" : ""}` }),
198
- React.createElement("span", { className: "text-[11px] truncate max-w-full text-center" }, serviceItem.operator_details[2]),
199
- React.createElement("div", { className: "bg-[#FF8F45] text-[12px] font-bold px-[10px] py-[4px] rounded-[4px] bold-text whitespace-nowrap" },
200
- React.createElement("span", null, op === null || op === void 0 ? void 0 : op.time)),
201
- React.createElement("span", { className: "text-[10px] mt-[6px]" }, op === null || op === void 0 ? void 0 : op.seatsAvailable))))),
163
+ React.createElement("span", { className: "text-[12px] truncate max-w-full text-center" }, serviceItem.operator_details[2]),
164
+ React.createElement("span", { className: "text-[11px] mt-[6px]" }, op === null || op === void 0 ? void 0 : op.seatsAvailable))))),
202
165
  React.createElement("div", { className: "flex w-full items-center justify-center gap-[6px] text-[12px] mt-[12px]", style: {
203
166
  border: "1px solid #363c48",
204
167
  backgroundColor: "#1a202e",
205
168
  padding: "4px 14px",
206
169
  borderRadius: "24px",
207
170
  } },
208
- React.createElement(LottiePlayer, { animationData: serviceItem.icons.personsAnim,
209
- // animationData={getAnimationIcon("usersAnimation")}
210
- width: "18px", height: "18px" }),
171
+ React.createElement(LottiePlayer, { animationData: serviceItem.icons.personsAnim, width: "18px", height: "18px" }),
211
172
  React.createElement("span", null,
212
173
  React.createElement("span", { className: "bold-text text-[white]" },
213
174
  " ",
@@ -227,7 +188,7 @@ const FeatureServiceUiMobile = ({ serviceItem, showTopLabel, colors, isSoldOut,
227
188
  React.createElement("div", { className: "flex w-[50%] items-center justify-between", style: {
228
189
  border: "1px solid #363c48",
229
190
  backgroundColor: "#1a202e",
230
- padding: "6px 14px",
191
+ padding: "4px 14px",
231
192
  borderRadius: "14px",
232
193
  } },
233
194
  React.createElement("button", { type: "button", "aria-label": "Disminuir pasajes", disabled: !canDecreaseTicketQuantity, onClick: () => onDecreaseTicketQuantity === null || onDecreaseTicketQuantity === void 0 ? void 0 : onDecreaseTicketQuantity(serviceItem), className: `flex h-[34px] w-[34px] items-center justify-center rounded-full border-none text-[25px] leading-none text-[white] ${canDecreaseTicketQuantity
@@ -267,8 +228,8 @@ const FeatureServiceUiMobile = ({ serviceItem, showTopLabel, colors, isSoldOut,
267
228
  } },
268
229
  React.createElement(LottiePlayer, { animationData: serviceItem.icons.thunderAnim, width: "18px", height: "18px" }),
269
230
  React.createElement("span", { className: "whitespace-nowrap" }, "\u00A1Lo quiero!")),
270
- React.createElement("div", { className: `flex justify-end mt-[10px] transition-transform duration-300 ease-in-out ${isItemExpanded ? "rotate-180" : ""}`, onClick: onToggleExpand },
271
- React.createElement("img", { src: (_d = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _d === void 0 ? void 0 : _d.downArrow, alt: "down arrow", style: {
231
+ React.createElement("div", { className: "flex justify-end mt-[10px]", onClick: onToggleExpand },
232
+ React.createElement("img", { src: (_e = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _e === void 0 ? void 0 : _e.downArrow, alt: "down arrow", className: `transition-transform duration-300 ease-in-out ${isItemExpanded ? "rotate-180" : ""}`, style: {
272
233
  width: "14px",
273
234
  height: "8px",
274
235
  filter: "brightness(0) invert(1)",
@@ -284,20 +245,7 @@ const FeatureServiceUiMobile = ({ serviceItem, showTopLabel, colors, isSoldOut,
284
245
  React.createElement(FeatureStepIcon, { icon: step.icon })),
285
246
  React.createElement("div", { className: "flex flex-col" },
286
247
  React.createElement("span", { className: "bold-text" }, step.name),
287
- React.createElement("span", null, step.text)))
288
- // <div
289
- // key={step.name}
290
- // className="flex flex-col items-center text-center text-[#272727]"
291
- // >
292
- // <FeatureStepIcon icon={step.icon} />
293
- // <span className="bold-text mt-[10px] text-[12px] leading-[14px]">
294
- // {step.name}
295
- // </span>
296
- // <span className="mt-[2px] max-w-[220px] text-[12px] leading-[14px] text-[#4a4a4a]">
297
- // {step.text}
298
- // </span>
299
- // </div>
300
- ))))))),
248
+ React.createElement("span", null, step.text)))))))))),
301
249
  React.createElement("div", { className: "absolute -top-[11px] left-0 w-full flex items-center justify-end gap-[12px] pr-[15px] z-10 " },
302
250
  React.createElement("div", { className: "flex items-center gap-[6px] py-[5px] px-[14px] rounded-[38px] text-[12.5px] bg-[#FF8F45] text-white whitespace-nowrap" },
303
251
  React.createElement("span", { className: "flex items-center" },
package/dist/ui/FeatureServiceUI/FeatureServiceUi.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
- declare const FeatureServiceUi: ({ serviceItem, showTopLabel, isSoldOut, getAnimationIcon, cityOrigin, cityDestination, renderIcon, viewersConfig, isFeatureDropDownExpand, onToggleExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onBookButtonPress, }: {
2
+ declare const FeatureServiceUi: ({ serviceItem, showTopLabel, isSoldOut, getAnimationIcon, cityOrigin, cityDestination, renderIcon, viewersConfig, isFeatureDropDownExpand, onToggleExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onBookButtonPress, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, }: {
3
3
  serviceItem: any;
4
4
  showTopLabel: any;
5
5
  isSoldOut: any;
@@ -14,5 +14,9 @@ declare const FeatureServiceUi: ({ serviceItem, showTopLabel, isSoldOut, getAnim
14
14
  onIncreaseTicketQuantity: any;
15
15
  onDecreaseTicketQuantity: any;
16
16
  onBookButtonPress: any;
17
+ selectedTimeSlot: any;
18
+ onTimeSlotChange: any;
19
+ isTimeDropdownOpen: any;
20
+ onTimeDropdownToggle: any;
17
21
  }) => React.JSX.Element;
18
22
  export default FeatureServiceUi;
package/dist/ui/FeatureServiceUI/FeatureServiceUi.js CHANGED
@@ -1,6 +1,12 @@
1
1
  import React from "react";
2
2
  import LottiePlayer from "../../assets/LottiePlayer";
3
3
  import commonService from "../../utils/CommonService";
4
+ const TIME_SLOTS = [
5
+ "Entre 07:00 AM y 10:00 AM",
6
+ "Entre 11:00 AM y 14:00 AM",
7
+ "Entre 15:00 PM y 18:00 PM",
8
+ "Entre 19:00 PM y 22:00 PM",
9
+ ];
4
10
  const HARDCODED_OPERATORS = [
5
11
  {
6
12
  logo: "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4e/Turbus_logo.svg/320px-Turbus_logo.svg.png",
@@ -21,13 +27,14 @@ const HARDCODED_OPERATORS = [
21
27
  seatsAvailable: "3 disponibles",
22
28
  },
23
29
  ];
24
- const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIcon, cityOrigin, cityDestination, renderIcon, viewersConfig, isFeatureDropDownExpand, onToggleExpand, ticketQuantity = 1, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onBookButtonPress, }) => {
25
- var _a, _b, _c, _d, _e;
30
+ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIcon, cityOrigin, cityDestination, renderIcon, viewersConfig, isFeatureDropDownExpand, onToggleExpand, ticketQuantity = 1, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onBookButtonPress, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, }) => {
31
+ var _a, _b, _c, _d, _e, _f;
26
32
  const operators = ((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operators) === null || _a === void 0 ? void 0 : _a.length) > 0
27
33
  ? serviceItem.operators
28
34
  : HARDCODED_OPERATORS;
29
35
  const isItemExpanded = serviceItem.id === isFeatureDropDownExpand ||
30
36
  isFeatureDropDownExpand === true;
37
+ const isThisTimeDropdownOpen = isTimeDropdownOpen === serviceItem.id;
31
38
  const canDecreaseTicketQuantity = ticketQuantity > 1;
32
39
  const HOW_IT_WORKS_STEPS = [
33
40
  {
@@ -102,7 +109,7 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
102
109
  minWidth: "40px",
103
110
  } }))),
104
111
  React.createElement("div", { id: `service-card-${serviceItem.id}`, className: "bg-[#0C1421] text-white mx-auto relative rounded-[14px] p-[14px] text-[13.33px]" },
105
- React.createElement("div", { className: "grid grid-cols-[23%_50%_27%] items-stretch" },
112
+ React.createElement("div", { className: "grid grid-cols-[25%_48%_27%] items-stretch" },
106
113
  React.createElement("div", { className: "flex flex-col justify-between gap-[20px] my-[14px] pr-[22px]" },
107
114
  React.createElement("div", { className: "flex flex-col gap-[8px]" },
108
115
  React.createElement("div", { className: "flex items-center gap-[8px]" },
@@ -112,7 +119,35 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
112
119
  React.createElement("img", { src: (_d = serviceItem.icons) === null || _d === void 0 ? void 0 : _d.whiteDestination, alt: "destination", className: `w-[14px] h-[14px] shrink-0 ${isSoldOut ? "grayscale" : ""}`, style: { opacity: isSoldOut ? 0.5 : 1 } }),
113
120
  React.createElement("span", { className: "text-[13px] bold-text" }, cityDestination === null || cityDestination === void 0 ? void 0 : cityDestination.label.split(",")[0]))),
114
121
  React.createElement("div", { className: "flex flex-col gap-[8px]" },
115
- React.createElement("div", { className: "text-[12px] bold-text whitespace-nowrap" }, "Entre 07:00 AM y 10:00 AM"),
122
+ React.createElement("div", { className: "kupos-time-dd relative", tabIndex: 0, onBlur: (e) => {
123
+ if (!e.currentTarget.contains(e.relatedTarget)) {
124
+ onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(null);
125
+ }
126
+ }, style: { outline: "none" } },
127
+ React.createElement("button", { type: "button", onClick: () => onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(isThisTimeDropdownOpen ? null : serviceItem.id), className: "flex whitespace-nowrap cursor-pointer select-none items-center gap-[6px] border-none bg-transparent p-0 bold-text text-[12px] text-[white]" },
128
+ React.createElement("span", null, selectedTimeSlot),
129
+ React.createElement("img", { src: (_e = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _e === void 0 ? void 0 : _e.downArrow, alt: "down arrow", className: `kupos-time-chevron transition-transform duration-200 ${isThisTimeDropdownOpen ? "rotate-180" : "rotate-0"}`, style: {
130
+ width: "12px",
131
+ height: "8px",
132
+ filter: "brightness(0) invert(1)",
133
+ } })),
134
+ isThisTimeDropdownOpen && (React.createElement(React.Fragment, null,
135
+ React.createElement("div", { className: "absolute left-0 top-[calc(100%+10px)]", style: {
136
+ zIndex: 20,
137
+ backgroundColor: "#fff",
138
+ borderRadius: "14px",
139
+ minWidth: "248px",
140
+ boxShadow: "0 8px 32px rgba(0,0,0,0.28)",
141
+ overflow: "hidden",
142
+ padding: "6px 0",
143
+ } }, TIME_SLOTS.map((slot) => {
144
+ const isActive = slot === selectedTimeSlot;
145
+ return (React.createElement("button", { key: slot, type: "button", onClick: () => {
146
+ onTimeSlotChange === null || onTimeSlotChange === void 0 ? void 0 : onTimeSlotChange(slot);
147
+ onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(null);
148
+ }, className: `flex w-full cursor-pointer items-center gap-[10px] border-none px-[12px] py-[9px] text-left text-[13px] ${isActive ? "bg-[#fef1ec] font-bold text-[#ff8f45]" : "bg-transparent font-normal text-[#464647] hover:bg-[#ff5c60] hover:text-white"}` },
149
+ React.createElement("span", null, slot)));
150
+ }))))),
116
151
  React.createElement("div", { className: "text-[11px] bold-text" }, "Viernes 23 de mayo")),
117
152
  React.createElement("div", { className: "flex flex-col items-start gap-[10px] text-[12px] " },
118
153
  React.createElement("div", { className: "flex items-justify gap-[8px]" },
@@ -210,7 +245,7 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
210
245
  animationData: getAnimationIcon("thunderAnimation"), width: "18px", height: "18px" }),
211
246
  React.createElement("span", { className: "whitespace-nowrap" }, "\u00A1Lo quiero!"))),
212
247
  React.createElement("div", { className: `absolute bottom-[11px] right-[18px] cursor-pointer transition-transform duration-300 ease-in-out ${isItemExpanded ? "rotate-180" : ""}`, onClick: onToggleExpand },
213
- React.createElement("img", { src: (_e = serviceItem.icons) === null || _e === void 0 ? void 0 : _e.downArrow, alt: "down arrow", style: {
248
+ React.createElement("img", { src: (_f = serviceItem.icons) === null || _f === void 0 ? void 0 : _f.downArrow, alt: "down arrow", style: {
214
249
  width: "14px",
215
250
  height: "8px",
216
251
  filter: "brightness(0) invert(1)",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "9.7.6",
3
+ "version": "9.7.8",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"