departureselection
Version:
A reusable departure selection component for travel booking applications
1,315 lines (1,312 loc) • 46.1 kB
JavaScript
import Ke, { useState as U, useEffect as Ve } from "react";
import { motion as $, AnimatePresence as Ge } from "framer-motion";
import { AlertCircle as Rt, AlertTriangle as St, Check as Tt, ChevronDown as He, ChevronLeft as Et, Calendar as Nt, ChevronRight as Ot, Loader2 as Ct } from "lucide-react";
import { clsx as Dt } from "clsx";
import { twMerge as kt } from "tailwind-merge";
import { format as Ee, subDays as Pt, addDays as Xe } from "date-fns";
import { create as It } from "zustand";
var Ne = { exports: {} }, se = {};
/**
* @license React
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var Be;
function Ft() {
if (Be) return se;
Be = 1;
var n = Ke, i = Symbol.for("react.element"), l = Symbol.for("react.fragment"), s = Object.prototype.hasOwnProperty, o = n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, u = { key: !0, ref: !0, __self: !0, __source: !0 };
function v(x, b, O) {
var j, T = {}, I = null, W = null;
O !== void 0 && (I = "" + O), b.key !== void 0 && (I = "" + b.key), b.ref !== void 0 && (W = b.ref);
for (j in b) s.call(b, j) && !u.hasOwnProperty(j) && (T[j] = b[j]);
if (x && x.defaultProps) for (j in b = x.defaultProps, b) T[j] === void 0 && (T[j] = b[j]);
return { $$typeof: i, type: x, key: I, ref: W, props: T, _owner: o.current };
}
return se.Fragment = l, se.jsx = v, se.jsxs = v, se;
}
var ie = {};
/**
* @license React
* react-jsx-runtime.development.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var Je;
function At() {
return Je || (Je = 1, process.env.NODE_ENV !== "production" && function() {
var n = Ke, i = Symbol.for("react.element"), l = Symbol.for("react.portal"), s = Symbol.for("react.fragment"), o = Symbol.for("react.strict_mode"), u = Symbol.for("react.profiler"), v = Symbol.for("react.provider"), x = Symbol.for("react.context"), b = Symbol.for("react.forward_ref"), O = Symbol.for("react.suspense"), j = Symbol.for("react.suspense_list"), T = Symbol.for("react.memo"), I = Symbol.for("react.lazy"), W = Symbol.for("react.offscreen"), le = Symbol.iterator, ue = "@@iterator";
function ce(e) {
if (e === null || typeof e != "object")
return null;
var r = le && e[le] || e[ue];
return typeof r == "function" ? r : null;
}
var S = n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
function w(e) {
{
for (var r = arguments.length, a = new Array(r > 1 ? r - 1 : 0), c = 1; c < r; c++)
a[c - 1] = arguments[c];
A("error", e, a);
}
}
function A(e, r, a) {
{
var c = S.ReactDebugCurrentFrame, m = c.getStackAddendum();
m !== "" && (r += "%s", a = a.concat([m]));
var h = a.map(function(f) {
return String(f);
});
h.unshift("Warning: " + r), Function.prototype.apply.call(console[e], console, h);
}
}
var de = !1, D = !1, ee = !1, te = !1, be = !1, F;
F = Symbol.for("react.module.reference");
function re(e) {
return !!(typeof e == "string" || typeof e == "function" || e === s || e === u || be || e === o || e === O || e === j || te || e === W || de || D || ee || typeof e == "object" && e !== null && (e.$$typeof === I || e.$$typeof === T || e.$$typeof === v || e.$$typeof === x || e.$$typeof === b || // This needs to include all possible module reference object
// types supported by any Flight configuration anywhere since
// we don't know which Flight build this will end up being used
// with.
e.$$typeof === F || e.getModuleId !== void 0));
}
function ne(e, r, a) {
var c = e.displayName;
if (c)
return c;
var m = r.displayName || r.name || "";
return m !== "" ? a + "(" + m + ")" : a;
}
function ae(e) {
return e.displayName || "Context";
}
function C(e) {
if (e == null)
return null;
if (typeof e.tag == "number" && w("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
return e.displayName || e.name || null;
if (typeof e == "string")
return e;
switch (e) {
case s:
return "Fragment";
case l:
return "Portal";
case u:
return "Profiler";
case o:
return "StrictMode";
case O:
return "Suspense";
case j:
return "SuspenseList";
}
if (typeof e == "object")
switch (e.$$typeof) {
case x:
var r = e;
return ae(r) + ".Consumer";
case v:
var a = e;
return ae(a._context) + ".Provider";
case b:
return ne(e, e.render, "ForwardRef");
case T:
var c = e.displayName || null;
return c !== null ? c : C(e.type) || "Memo";
case I: {
var m = e, h = m._payload, f = m._init;
try {
return C(f(h));
} catch {
return null;
}
}
}
return null;
}
var L = Object.assign, M = 0, z, R, K, V, fe, pe, me;
function ve() {
}
ve.__reactDisabledLog = !0;
function ye() {
{
if (M === 0) {
z = console.log, R = console.info, K = console.warn, V = console.error, fe = console.group, pe = console.groupCollapsed, me = console.groupEnd;
var e = {
configurable: !0,
enumerable: !0,
value: ve,
writable: !0
};
Object.defineProperties(console, {
info: e,
log: e,
warn: e,
error: e,
group: e,
groupCollapsed: e,
groupEnd: e
});
}
M++;
}
}
function _e() {
{
if (M--, M === 0) {
var e = {
configurable: !0,
enumerable: !0,
writable: !0
};
Object.defineProperties(console, {
log: L({}, e, {
value: z
}),
info: L({}, e, {
value: R
}),
warn: L({}, e, {
value: K
}),
error: L({}, e, {
value: V
}),
group: L({}, e, {
value: fe
}),
groupCollapsed: L({}, e, {
value: pe
}),
groupEnd: L({}, e, {
value: me
})
});
}
M < 0 && w("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
}
}
var G = S.ReactCurrentDispatcher, H;
function B(e, r, a) {
{
if (H === void 0)
try {
throw Error();
} catch (m) {
var c = m.stack.trim().match(/\n( *(at )?)/);
H = c && c[1] || "";
}
return `
` + H + e;
}
}
var X = !1, J;
{
var p = typeof WeakMap == "function" ? WeakMap : Map;
J = new p();
}
function _(e, r) {
if (!e || X)
return "";
{
var a = J.get(e);
if (a !== void 0)
return a;
}
var c;
X = !0;
var m = Error.prepareStackTrace;
Error.prepareStackTrace = void 0;
var h;
h = G.current, G.current = null, ye();
try {
if (r) {
var f = function() {
throw Error();
};
if (Object.defineProperty(f.prototype, "props", {
set: function() {
throw Error();
}
}), typeof Reflect == "object" && Reflect.construct) {
try {
Reflect.construct(f, []);
} catch (N) {
c = N;
}
Reflect.construct(e, [], f);
} else {
try {
f.call();
} catch (N) {
c = N;
}
e.call(f.prototype);
}
} else {
try {
throw Error();
} catch (N) {
c = N;
}
e();
}
} catch (N) {
if (N && c && typeof N.stack == "string") {
for (var d = N.stack.split(`
`), E = c.stack.split(`
`), g = d.length - 1, y = E.length - 1; g >= 1 && y >= 0 && d[g] !== E[y]; )
y--;
for (; g >= 1 && y >= 0; g--, y--)
if (d[g] !== E[y]) {
if (g !== 1 || y !== 1)
do
if (g--, y--, y < 0 || d[g] !== E[y]) {
var P = `
` + d[g].replace(" at new ", " at ");
return e.displayName && P.includes("<anonymous>") && (P = P.replace("<anonymous>", e.displayName)), typeof e == "function" && J.set(e, P), P;
}
while (g >= 1 && y >= 0);
break;
}
}
} finally {
X = !1, G.current = h, _e(), Error.prepareStackTrace = m;
}
var Q = e ? e.displayName || e.name : "", q = Q ? B(Q) : "";
return typeof e == "function" && J.set(e, q), q;
}
function k(e, r, a) {
return _(e, !1);
}
function tt(e) {
var r = e.prototype;
return !!(r && r.isReactComponent);
}
function he(e, r, a) {
if (e == null)
return "";
if (typeof e == "function")
return _(e, tt(e));
if (typeof e == "string")
return B(e);
switch (e) {
case O:
return B("Suspense");
case j:
return B("SuspenseList");
}
if (typeof e == "object")
switch (e.$$typeof) {
case b:
return k(e.render);
case T:
return he(e.type, r, a);
case I: {
var c = e, m = c._payload, h = c._init;
try {
return he(h(m), r, a);
} catch {
}
}
}
return "";
}
var oe = Object.prototype.hasOwnProperty, Oe = {}, Ce = S.ReactDebugCurrentFrame;
function xe(e) {
if (e) {
var r = e._owner, a = he(e.type, e._source, r ? r.type : null);
Ce.setExtraStackFrame(a);
} else
Ce.setExtraStackFrame(null);
}
function rt(e, r, a, c, m) {
{
var h = Function.call.bind(oe);
for (var f in e)
if (h(e, f)) {
var d = void 0;
try {
if (typeof e[f] != "function") {
var E = Error((c || "React class") + ": " + a + " type `" + f + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[f] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
throw E.name = "Invariant Violation", E;
}
d = e[f](r, f, c, a, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
} catch (g) {
d = g;
}
d && !(d instanceof Error) && (xe(m), w("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", c || "React class", a, f, typeof d), xe(null)), d instanceof Error && !(d.message in Oe) && (Oe[d.message] = !0, xe(m), w("Failed %s type: %s", a, d.message), xe(null));
}
}
}
var nt = Array.isArray;
function je(e) {
return nt(e);
}
function at(e) {
{
var r = typeof Symbol == "function" && Symbol.toStringTag, a = r && e[Symbol.toStringTag] || e.constructor.name || "Object";
return a;
}
}
function ot(e) {
try {
return De(e), !1;
} catch {
return !0;
}
}
function De(e) {
return "" + e;
}
function ke(e) {
if (ot(e))
return w("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", at(e)), De(e);
}
var Pe = S.ReactCurrentOwner, st = {
key: !0,
ref: !0,
__self: !0,
__source: !0
}, Ie, Fe;
function it(e) {
if (oe.call(e, "ref")) {
var r = Object.getOwnPropertyDescriptor(e, "ref").get;
if (r && r.isReactWarning)
return !1;
}
return e.ref !== void 0;
}
function lt(e) {
if (oe.call(e, "key")) {
var r = Object.getOwnPropertyDescriptor(e, "key").get;
if (r && r.isReactWarning)
return !1;
}
return e.key !== void 0;
}
function ut(e, r) {
typeof e.ref == "string" && Pe.current;
}
function ct(e, r) {
{
var a = function() {
Ie || (Ie = !0, w("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
};
a.isReactWarning = !0, Object.defineProperty(e, "key", {
get: a,
configurable: !0
});
}
}
function dt(e, r) {
{
var a = function() {
Fe || (Fe = !0, w("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
};
a.isReactWarning = !0, Object.defineProperty(e, "ref", {
get: a,
configurable: !0
});
}
}
var ft = function(e, r, a, c, m, h, f) {
var d = {
// This tag allows us to uniquely identify this as a React Element
$$typeof: i,
// Built-in properties that belong on the element
type: e,
key: r,
ref: a,
props: f,
// Record the component responsible for creating this element.
_owner: h
};
return d._store = {}, Object.defineProperty(d._store, "validated", {
configurable: !1,
enumerable: !1,
writable: !0,
value: !1
}), Object.defineProperty(d, "_self", {
configurable: !1,
enumerable: !1,
writable: !1,
value: c
}), Object.defineProperty(d, "_source", {
configurable: !1,
enumerable: !1,
writable: !1,
value: m
}), Object.freeze && (Object.freeze(d.props), Object.freeze(d)), d;
};
function pt(e, r, a, c, m) {
{
var h, f = {}, d = null, E = null;
a !== void 0 && (ke(a), d = "" + a), lt(r) && (ke(r.key), d = "" + r.key), it(r) && (E = r.ref, ut(r, m));
for (h in r)
oe.call(r, h) && !st.hasOwnProperty(h) && (f[h] = r[h]);
if (e && e.defaultProps) {
var g = e.defaultProps;
for (h in g)
f[h] === void 0 && (f[h] = g[h]);
}
if (d || E) {
var y = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
d && ct(f, y), E && dt(f, y);
}
return ft(e, d, E, m, c, Pe.current, f);
}
}
var we = S.ReactCurrentOwner, Ae = S.ReactDebugCurrentFrame;
function Z(e) {
if (e) {
var r = e._owner, a = he(e.type, e._source, r ? r.type : null);
Ae.setExtraStackFrame(a);
} else
Ae.setExtraStackFrame(null);
}
var Re;
Re = !1;
function Se(e) {
return typeof e == "object" && e !== null && e.$$typeof === i;
}
function $e() {
{
if (we.current) {
var e = C(we.current.type);
if (e)
return `
Check the render method of \`` + e + "`.";
}
return "";
}
}
function mt(e) {
return "";
}
var We = {};
function vt(e) {
{
var r = $e();
if (!r) {
var a = typeof e == "string" ? e : e.displayName || e.name;
a && (r = `
Check the top-level render call using <` + a + ">.");
}
return r;
}
}
function Le(e, r) {
{
if (!e._store || e._store.validated || e.key != null)
return;
e._store.validated = !0;
var a = vt(r);
if (We[a])
return;
We[a] = !0;
var c = "";
e && e._owner && e._owner !== we.current && (c = " It was passed a child from " + C(e._owner.type) + "."), Z(e), w('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', a, c), Z(null);
}
}
function Ye(e, r) {
{
if (typeof e != "object")
return;
if (je(e))
for (var a = 0; a < e.length; a++) {
var c = e[a];
Se(c) && Le(c, r);
}
else if (Se(e))
e._store && (e._store.validated = !0);
else if (e) {
var m = ce(e);
if (typeof m == "function" && m !== e.entries)
for (var h = m.call(e), f; !(f = h.next()).done; )
Se(f.value) && Le(f.value, r);
}
}
}
function ht(e) {
{
var r = e.type;
if (r == null || typeof r == "string")
return;
var a;
if (typeof r == "function")
a = r.propTypes;
else if (typeof r == "object" && (r.$$typeof === b || // Note: Memo only checks outer props here.
// Inner props are checked in the reconciler.
r.$$typeof === T))
a = r.propTypes;
else
return;
if (a) {
var c = C(r);
rt(a, e.props, "prop", c, e);
} else if (r.PropTypes !== void 0 && !Re) {
Re = !0;
var m = C(r);
w("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", m || "Unknown");
}
typeof r.getDefaultProps == "function" && !r.getDefaultProps.isReactClassApproved && w("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
}
}
function xt(e) {
{
for (var r = Object.keys(e.props), a = 0; a < r.length; a++) {
var c = r[a];
if (c !== "children" && c !== "key") {
Z(e), w("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", c), Z(null);
break;
}
}
e.ref !== null && (Z(e), w("Invalid attribute `ref` supplied to `React.Fragment`."), Z(null));
}
}
var Me = {};
function Ue(e, r, a, c, m, h) {
{
var f = re(e);
if (!f) {
var d = "";
(e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (d += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
var E = mt();
E ? d += E : d += $e();
var g;
e === null ? g = "null" : je(e) ? g = "array" : e !== void 0 && e.$$typeof === i ? (g = "<" + (C(e.type) || "Unknown") + " />", d = " Did you accidentally export a JSX literal instead of a component?") : g = typeof e, w("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", g, d);
}
var y = pt(e, r, a, m, h);
if (y == null)
return y;
if (f) {
var P = r.children;
if (P !== void 0)
if (c)
if (je(P)) {
for (var Q = 0; Q < P.length; Q++)
Ye(P[Q], e);
Object.freeze && Object.freeze(P);
} else
w("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
else
Ye(P, e);
}
if (oe.call(r, "key")) {
var q = C(e), N = Object.keys(r).filter(function(wt) {
return wt !== "key";
}), Te = N.length > 0 ? "{key: someKey, " + N.join(": ..., ") + ": ...}" : "{key: someKey}";
if (!Me[q + Te]) {
var jt = N.length > 0 ? "{" + N.join(": ..., ") + ": ...}" : "{}";
w(`A props object containing a "key" prop is being spread into JSX:
let props = %s;
<%s {...props} />
React keys must be passed directly to JSX without using spread:
let props = %s;
<%s key={someKey} {...props} />`, Te, q, jt, q), Me[q + Te] = !0;
}
}
return e === s ? xt(y) : ht(y), y;
}
}
function gt(e, r, a) {
return Ue(e, r, a, !0);
}
function bt(e, r, a) {
return Ue(e, r, a, !1);
}
var yt = bt, _t = gt;
ie.Fragment = s, ie.jsx = yt, ie.jsxs = _t;
}()), ie;
}
process.env.NODE_ENV === "production" ? Ne.exports = Ft() : Ne.exports = At();
var t = Ne.exports;
function Y(...n) {
return kt(Dt(n));
}
function Ze({
departureTime: n,
arrivalTime: i,
departureLocation: l,
arrivalLocation: s
}) {
const o = Ee(/* @__PURE__ */ new Date(`2000-01-01T${n}`), "h:mm a"), u = Ee(/* @__PURE__ */ new Date(`2000-01-01T${i}`), "h:mm a");
return /* @__PURE__ */ t.jsxs("div", { className: "relative flex items-stretch gap-3", children: [
/* @__PURE__ */ t.jsxs("div", { className: "flex flex-col items-center", children: [
/* @__PURE__ */ t.jsx("div", { className: "relative top-[0.6rem]", children: /* @__PURE__ */ t.jsx("div", { className: "w-2.5 h-2.5 rounded-full bg-blue-500" }) }),
/* @__PURE__ */ t.jsx("div", { className: "w-0.5 bg-blue-200 flex-1 my-1.5" }),
/* @__PURE__ */ t.jsx("div", { className: "relative bottom-[0.6rem]", children: /* @__PURE__ */ t.jsx("div", { className: "w-2.5 h-2.5 rounded-full border-2 border-blue-500" }) })
] }),
/* @__PURE__ */ t.jsxs("div", { className: "flex-1 py-0.5", children: [
/* @__PURE__ */ t.jsxs("div", { className: "mb-4", children: [
/* @__PURE__ */ t.jsx("div", { className: "text-lg font-semibold leading-tight", children: o }),
/* @__PURE__ */ t.jsx("div", { className: "text-sm text-gray-600", children: l })
] }),
/* @__PURE__ */ t.jsxs("div", { children: [
/* @__PURE__ */ t.jsx("div", { className: "text-lg font-semibold leading-tight", children: u }),
/* @__PURE__ */ t.jsx("div", { className: "text-sm text-gray-600", children: s })
] })
] })
] });
}
function Qe({ flags: n }) {
return n.length === 0 ? null : /* @__PURE__ */ t.jsx("div", { className: "mt-4 flex flex-wrap gap-2", children: n.map((i, l) => /* @__PURE__ */ t.jsxs(
"span",
{
className: "inline-flex items-center gap-1 px-2 py-1 bg-amber-50 text-amber-700 rounded-full text-xs font-medium",
children: [
/* @__PURE__ */ t.jsx(Rt, { className: "h-3 w-3" }),
i.flag_name
]
},
l
)) });
}
function $t({ pats: n, totalCost: i, isExpanded: l }) {
if (!l) return null;
const s = n.reduce((o, u) => {
const v = `${u.pat_type_name}-${u.pat_sub_type_name}`;
return o[v] || (o[v] = {
type: u.pat_type_name,
subType: u.pat_sub_type_name,
plural: u.pat_sub_type_plural,
count: 0,
price: 0
}), o[v].count += u.count, o[v].price += u.price, o;
}, {});
return /* @__PURE__ */ t.jsx(
$.div,
{
initial: { height: 0, opacity: 0 },
animate: { height: "auto", opacity: 1 },
className: "border-t border-gray-100 bg-gray-50",
children: /* @__PURE__ */ t.jsxs("div", { className: "p-4 space-y-3", children: [
/* @__PURE__ */ t.jsx("h4", { className: "font-medium text-gray-900", children: "Fare Breakdown" }),
/* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
Object.values(s).map((o, u) => /* @__PURE__ */ t.jsxs("div", { className: "flex justify-between text-sm", children: [
/* @__PURE__ */ t.jsxs("span", { className: "text-gray-600", children: [
o.count,
" x ",
o.count === 1 ? o.subType : o.plural
] }),
/* @__PURE__ */ t.jsxs("span", { className: "font-medium", children: [
"$",
o.price.toFixed(2)
] })
] }, u)),
/* @__PURE__ */ t.jsxs("div", { className: "pt-2 border-t border-gray-200 flex justify-between font-medium", children: [
/* @__PURE__ */ t.jsx("span", { children: "Total" }),
/* @__PURE__ */ t.jsxs("span", { className: "text-blue-600", children: [
"$",
i.toFixed(2)
] })
] })
] })
] })
}
);
}
function Wt({
service: n,
isSelected: i,
isExpanded: l,
onSelect: s,
onToggleExpand: o,
disabled: u
}) {
const v = n.can_accept !== "yes";
return /* @__PURE__ */ t.jsxs(
$.div,
{
className: Y(
"bg-white rounded-lg border transition-all duration-200 overflow-hidden",
i ? "border-green-500 shadow-lg" : "border-gray-200",
v && "opacity-75",
u && "opacity-50 cursor-not-allowed"
),
layout: !0,
children: [
/* @__PURE__ */ t.jsx("div", { className: "p-4", children: /* @__PURE__ */ t.jsxs(
"div",
{
className: Y(
"flex items-start justify-between gap-4",
!v && !u && "cursor-pointer"
),
onClick: () => !v && !u && s(),
children: [
/* @__PURE__ */ t.jsxs("div", { className: "flex-1", children: [
/* @__PURE__ */ t.jsx(
Ze,
{
departureTime: n.departure_time,
arrivalTime: n.arrival_time,
departureLocation: n.departing_from,
arrivalLocation: n.travelling_to
}
),
/* @__PURE__ */ t.jsxs("div", { className: "flex flex-wrap gap-2 mt-4", children: [
v && /* @__PURE__ */ t.jsxs("span", { className: "inline-flex items-center gap-1 px-2 py-1 bg-red-50 text-red-700 rounded-full text-xs font-medium", children: [
/* @__PURE__ */ t.jsx(St, { className: "h-3 w-3" }),
"Unavailable"
] }),
/* @__PURE__ */ t.jsx(Qe, { flags: n.flags })
] })
] }),
/* @__PURE__ */ t.jsxs("div", { className: "text-right", children: [
/* @__PURE__ */ t.jsxs("div", { className: Y(
"flex items-center gap-2 text-2xl font-bold",
i ? "text-green-600" : "text-blue-600",
v && "text-gray-400"
), children: [
i && /* @__PURE__ */ t.jsx(Tt, { className: "h-5 w-5" }),
"$",
n.total_cost.toFixed(2)
] }),
/* @__PURE__ */ t.jsxs(
"button",
{
onClick: (x) => {
x.stopPropagation(), o();
},
className: "mt-2 text-sm font-medium text-gray-500 hover:text-gray-700 flex items-center gap-1 ml-auto",
children: [
l ? "Hide" : "Show",
" details",
/* @__PURE__ */ t.jsx(He, { className: Y(
"h-4 w-4 transition-transform",
l && "rotate-180"
) })
]
}
)
] })
]
}
) }),
/* @__PURE__ */ t.jsx(
$t,
{
pats: n.pats,
totalCost: n.total_cost,
isExpanded: l
}
)
]
}
);
}
function qe({ services: n, selectedId: i, onSelect: l, title: s, isLoading: o }) {
const [u, v] = U(null);
return n.length === 0 ? null : /* @__PURE__ */ t.jsxs(
$.div,
{
className: "space-y-4",
animate: { opacity: o ? 0.5 : 1 },
transition: { duration: 0.2 },
children: [
/* @__PURE__ */ t.jsx("h3", { className: "text-xl font-semibold text-gray-900", children: s }),
/* @__PURE__ */ t.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ t.jsx(Ge, { mode: "wait", children: n.map((x) => /* @__PURE__ */ t.jsx(
Wt,
{
service: x,
isSelected: x.service_id === i,
isExpanded: x.service_id === u,
onSelect: () => !o && l(x.service_id),
onToggleExpand: () => {
v(
x.service_id === u ? null : x.service_id
);
},
disabled: o
},
x.service_id
)) }) })
]
}
);
}
function Lt({ dates: n, selectedDate: i, onSelect: l, onNavigate: s }) {
return /* @__PURE__ */ t.jsx("div", { className: "flex flex-col items-center gap-4 mb-8", children: /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-4", children: [
/* @__PURE__ */ t.jsx(
"button",
{
onClick: () => s("backward"),
className: "p-2 hover:bg-gray-100 rounded-full transition-colors",
children: /* @__PURE__ */ t.jsx(Et, { className: "h-5 w-5 text-gray-600" })
}
),
/* @__PURE__ */ t.jsx("div", { className: "flex items-center gap-4 no-scrollbar", children: n.map((o) => /* @__PURE__ */ t.jsxs(
$.button,
{
whileHover: { scale: 1.02 },
whileTap: { scale: 0.98 },
onClick: () => l(o),
className: Y(
"flex flex-col items-center min-w-[140px] px-4 py-3 rounded-lg transition-all",
i === o ? "bg-blue-500 text-white shadow-lg shadow-blue-500/20" : "bg-white border border-gray-200 hover:border-blue-200 text-gray-900"
),
children: [
/* @__PURE__ */ t.jsx(Nt, { className: Y(
"h-5 w-5 mb-1",
i === o ? "text-white" : "text-blue-500"
) }),
/* @__PURE__ */ t.jsx("span", { className: "text-sm font-medium whitespace-nowrap", children: Ee(new Date(o), "EEE, d MMM") })
]
},
o
)) }),
/* @__PURE__ */ t.jsx(
"button",
{
onClick: () => s("forward"),
className: "p-2 hover:bg-gray-100 rounded-full transition-colors",
children: /* @__PURE__ */ t.jsx(Ot, { className: "h-5 w-5 text-gray-600" })
}
)
] }) });
}
function Yt({
sortBy: n,
onSortChange: i,
showUnavailable: l,
onToggleUnavailable: s
}) {
return /* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between px-6 py-4 bg-white border border-gray-200 rounded-lg mb-6", children: [
/* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-3", children: [
/* @__PURE__ */ t.jsx("label", { className: "text-sm font-medium text-gray-700", children: "Sort by:" }),
/* @__PURE__ */ t.jsxs("div", { className: "relative", children: [
/* @__PURE__ */ t.jsxs(
"select",
{
value: n,
onChange: (o) => i(o.target.value),
className: "appearance-none bg-white border border-gray-200 rounded-lg pl-4 pr-10 py-2 text-sm font-medium text-gray-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500",
children: [
/* @__PURE__ */ t.jsx("option", { value: "departure", children: "Departure time" }),
/* @__PURE__ */ t.jsx("option", { value: "price", children: "Price" })
]
}
),
/* @__PURE__ */ t.jsx(He, { className: "absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400 pointer-events-none" })
] })
] }),
/* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-3", children: [
/* @__PURE__ */ t.jsx("span", { className: "text-sm text-gray-600", children: "Show unavailable ferries" }),
/* @__PURE__ */ t.jsx(
"button",
{
onClick: s,
className: Y(
"w-12 h-6 rounded-full transition-colors relative",
l ? "bg-blue-500" : "bg-gray-200"
),
children: /* @__PURE__ */ t.jsx("div", { className: Y(
"absolute top-1 w-4 h-4 rounded-full bg-white transition-all",
l ? "right-1" : "left-1"
) })
}
)
] })
] });
}
function Mt({ service: n, title: i }) {
return /* @__PURE__ */ t.jsxs(
$.div,
{
initial: { opacity: 0, height: 0 },
animate: { opacity: 1, height: "auto" },
exit: { opacity: 0, height: 0 },
className: "bg-blue-50 rounded-lg border border-blue-100 p-4 mb-6",
children: [
/* @__PURE__ */ t.jsx("h4", { className: "text-sm font-medium text-blue-700 mb-3", children: i }),
/* @__PURE__ */ t.jsxs("div", { className: "bg-white rounded-lg p-4 border border-blue-100", children: [
/* @__PURE__ */ t.jsx(
Ze,
{
departureTime: n.departure_time,
arrivalTime: n.arrival_time,
departureLocation: n.departing_from,
arrivalLocation: n.travelling_to
}
),
/* @__PURE__ */ t.jsx(Qe, { flags: n.flags }),
/* @__PURE__ */ t.jsx("div", { className: "mt-3 text-right", children: /* @__PURE__ */ t.jsxs("span", { className: "text-lg font-semibold text-blue-600", children: [
"$",
n.total_cost.toFixed(2)
] }) })
] })
]
}
);
}
function Ut(n) {
if (console.log("getDefaultDate input:", {
servicesCount: n == null ? void 0 : n.length,
firstService: n == null ? void 0 : n[0],
allDates: n == null ? void 0 : n.map((u) => u.departure_date)
}), !n || !Array.isArray(n) || n.length === 0)
return console.warn("No valid departure services provided, using current date"), (/* @__PURE__ */ new Date()).toISOString().split("T")[0];
const i = n.filter((u) => {
const v = (u == null ? void 0 : u.departure_date) && !isNaN(new Date(u.departure_date).getTime());
return v || console.warn("Invalid departure_date found:", u == null ? void 0 : u.departure_date), v;
});
if (i.length === 0)
return console.warn("No services with valid dates found, using current date"), (/* @__PURE__ */ new Date()).toISOString().split("T")[0];
const s = [...i].sort((u, v) => new Date(u.departure_date).getTime() - new Date(v.departure_date).getTime())[0], o = s.departure_date;
return console.log("Date selection:", {
validDatesCount: i.length,
allValidDates: i.map((u) => u.departure_date),
selectedDate: o,
firstDepartureService: s
}), o;
}
function Vt(n, i = 1) {
const l = [], s = new Date(n);
for (let o = i; o > 0; o--) {
const u = Pt(s, o);
l.push(u.toISOString().split("T")[0]);
}
l.push(n);
for (let o = 1; o <= i; o++) {
const u = Xe(s, o);
l.push(u.toISOString().split("T")[0]);
}
return l;
}
function Bt(n, i) {
const l = i === "forward" ? 1 : -1;
return n.map((s) => Xe(new Date(s), l).toISOString().split("T")[0]);
}
function ge(n) {
return (/* @__PURE__ */ new Date(`1970-01-01T${n}`)).getTime();
}
function ze(n, i) {
return [...n].sort((l, s) => {
switch (i) {
case "departure":
return ge(l.departure_time) - ge(s.departure_time);
case "price":
const o = l.total_cost - s.total_cost;
return o === 0 ? ge(l.departure_time) - ge(s.departure_time) : o;
default:
return 0;
}
});
}
function et(n, i) {
return i ? n : n.filter((l) => l.can_accept === "yes");
}
function Jt(n, i, l) {
let s = et(n, i);
if (l) {
const o = (/* @__PURE__ */ new Date(`1970-01-01T${l}`)).getTime();
s = s.filter((u) => (/* @__PURE__ */ new Date(`1970-01-01T${u.departure_time}`)).getTime() > o);
}
return s;
}
const qt = {
selectedDepartureId: null,
selectedReturnId: null,
departureService: null,
returnService: null,
date: (/* @__PURE__ */ new Date()).toISOString().split("T")[0],
totalCost: 0
}, zt = It((n, i) => ({
selections: {},
setSelections: (l, s) => n((o) => ({
selections: {
...o.selections,
[l]: s
}
})),
getSelections: (l) => i().selections[l] || { ...qt },
clearSelections: (l) => n((s) => {
const { [l]: o, ...u } = s.selections;
return { selections: u };
})
}));
function Kt({ context: n, showReturnSelection: i }) {
return !(n === "both" || n === "outbound" && !i) && !(n === "both" || n === "return" && i) ? null : /* @__PURE__ */ t.jsx(
$.div,
{
initial: { opacity: 0 },
animate: { opacity: 1 },
exit: { opacity: 0 },
className: Y(
"absolute inset-0 bg-white/80 backdrop-blur-sm z-50",
"flex items-center justify-center"
),
children: /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col items-center gap-4", children: [
/* @__PURE__ */ t.jsx(Ct, { className: "w-8 h-8 text-blue-500 animate-spin" }),
/* @__PURE__ */ t.jsx("p", { className: "text-gray-600 font-medium", children: "Updating journey options..." })
] })
}
);
}
function rr({
initialData: n,
onComplete: i,
onBack: l,
uiConfig: s,
selectedOutboundId: o,
selectedReturnId: u,
currentContext: v,
onDateSelect: x,
onServiceSelect: b,
onContextChange: O,
isLoading: j = !1,
loadingContext: T = "both"
}) {
var H, B, X, J;
if (console.log("DepartureSelection - Component rendering with initialData:", {
departureCount: (H = n == null ? void 0 : n.departure) == null ? void 0 : H.length,
returnCount: (B = n == null ? void 0 : n.return) == null ? void 0 : B.length,
firstDeparture: (X = n == null ? void 0 : n.departure) == null ? void 0 : X[0],
firstReturn: (J = n == null ? void 0 : n.return) == null ? void 0 : J[0]
}), !n)
return console.error("DepartureSelection - No initial data available"), null;
const { departure: I, return: W } = n, { getSelections: le, setSelections: ue } = zt(), ce = le("departure-selection-1"), [S, w] = U(
o ?? ce.selectedDepartureId
), [A, de] = U(
u ?? ce.selectedReturnId
), [D, ee] = U(
v === "return"
), [te, be] = U("departure"), [F, re] = U(""), [ne, ae] = U([]), [C, L] = U(!1);
Ve(() => {
const p = D ? W : I;
if (console.log("DepartureSelection - Date initialization effect running:", {
context: D ? "return" : "outbound",
servicesCount: p == null ? void 0 : p.length,
firstService: p == null ? void 0 : p[0],
currentSelectedDate: F,
currentDates: ne
}), p && p.length > 0) {
const _ = Ut(p);
console.log("DepartureSelection - Calculated default date:", {
defaultDate: _,
fromServices: p.map((k) => ({
id: k.service_id,
date: k.departure_date,
time: k.departure_time
}))
}), re(_), ae(Vt(_));
}
}, [I, W, D]);
const M = W.length > 0, z = et(ze(I, te), C), R = z.find((p) => p.service_id === S), K = Jt(
ze(W, te),
C,
R == null ? void 0 : R.departure_time
), V = K.find((p) => p.service_id === A);
Ve(() => {
O && O({
previousContext: v,
nextContext: D ? "return" : "outbound",
selectedOutboundId: S,
selectedReturnId: A
});
}, [D, S, A]);
const fe = (p) => {
const _ = Bt(ne, p);
ae(_);
const k = _[1];
re(k), x && x({
date: k,
previousDate: F,
context: D ? "return" : "outbound"
});
}, pe = (p) => {
x && x({
date: p,
previousDate: F,
context: D ? "return" : "outbound"
}), re(p);
}, me = (p) => {
const _ = z.find((k) => k.service_id === p);
_ && (w(p), de(null), ee(!1), b && b({
serviceId: p,
context: "outbound",
service: _
}), ue("departure-selection-1", {
selectedDepartureId: p,
selectedReturnId: null,
departureService: _,
returnService: null,
date: F,
totalCost: _.total_cost
}));
}, ve = (p) => {
const _ = K.find((k) => k.service_id === p);
!_ || !R || (de(p), b && b({
serviceId: p,
context: "return",
service: _
}), ue("departure-selection-1", {
selectedDepartureId: R.service_id,
selectedReturnId: p,
departureService: R,
returnService: _,
date: F,
totalCost: R.total_cost + _.total_cost
}));
}, ye = () => {
O && O({
previousContext: "outbound",
nextContext: "return",
selectedOutboundId: S,
selectedReturnId: A
}), ee(!0);
}, _e = () => {
O && O({
previousContext: "return",
nextContext: "outbound",
selectedOutboundId: S,
selectedReturnId: A
}), ee(!1);
}, G = () => {
if (!R) return;
const p = {
selectedDepartureId: S,
selectedReturnId: A,
departureService: R,
returnService: V || null,
date: F,
totalCost: ((R == null ? void 0 : R.total_cost) || 0) + ((V == null ? void 0 : V.total_cost) || 0)
};
i(p);
};
return F ? /* @__PURE__ */ t.jsx("div", { className: "container max-w-3xl mx-auto py-12 px-4", children: /* @__PURE__ */ t.jsxs(
$.div,
{
initial: { opacity: 0, y: 20 },
animate: { opacity: 1, y: 0 },
className: "space-y-8 relative",
children: [
j && /* @__PURE__ */ t.jsx(
Kt,
{
context: T,
showReturnSelection: D
}
),
/* @__PURE__ */ t.jsxs("div", { className: "text-center", children: [
/* @__PURE__ */ t.jsx("h2", { className: "text-3xl font-bold text-gray-900", children: s.pageTitle }),
/* @__PURE__ */ t.jsx("p", { className: "text-gray-600 mt-2", children: s.pageSubtitle })
] }),
/* @__PURE__ */ t.jsx(
Lt,
{
dates: ne,
selectedDate: F,
onSelect: pe,
onNavigate: fe
}
),
/* @__PURE__ */ t.jsxs("div", { className: "bg-gray-50 rounded-xl p-6 space-y-6", children: [
/* @__PURE__ */ t.jsx(
Yt,
{
sortBy: te,
onSortChange: be,
showUnavailable: C,
onToggleUnavailable: () => L(!C)
}
),
/* @__PURE__ */ t.jsx(Ge, { mode: "wait", children: D && R ? /* @__PURE__ */ t.jsxs(
$.div,
{
initial: { opacity: 0, y: 20 },
animate: { opacity: 1, y: 0 },
exit: { opacity: 0, y: -20 },
children: [
/* @__PURE__ */ t.jsx("div", { onClick: _e, className: "cursor-pointer", children: /* @__PURE__ */ t.jsx(
Mt,
{
service: R,
title: "Selected Outbound Journey (click to change)"
}
) }),
/* @__PURE__ */ t.jsx(
qe,
{
services: K,
selectedId: A,
onSelect: ve,
title: s.returnTitle,
isLoading: j && (T === "return" || T === "both")
}
)
]
},
"return-selection"
) : /* @__PURE__ */ t.jsxs(
$.div,
{
initial: { opacity: 0, y: 20 },
animate: { opacity: 1, y: 0 },
exit: { opacity: 0, y: -20 },
children: [
/* @__PURE__ */ t.jsx(
qe,
{
services: z,
selectedId: S,
onSelect: me,
title: s.outboundTitle,
isLoading: j && (T === "outbound" || T === "both")
}
),
S && /* @__PURE__ */ t.jsx(
$.div,
{
initial: { opacity: 0 },
animate: { opacity: 1 },
className: "mt-6",
children: /* @__PURE__ */ t.jsx(
"button",
{
onClick: s.outboundButtonMode === "continue" ? ye : G,
className: "w-full py-3 bg-blue-500 text-white rounded-lg font-medium hover:bg-blue-600 transition-colors",
children: s.outboundButtonMode === "continue" ? s.continueToReturnText : s.finalContinueText
}
)
}
)
]
},
"departure-selection"
) })
] }),
/* @__PURE__ */ t.jsxs("div", { className: "flex justify-between items-center", children: [
l && /* @__PURE__ */ t.jsx(
"button",
{
onClick: l,
className: "px-6 py-3 text-gray-600 font-medium hover:bg-gray-50 rounded-lg transition-colors",
children: D ? s.backToOutboundText : s.backText
}
),
(S && !M || M && A) && /* @__PURE__ */ t.jsx(
"button",
{
onClick: G,
className: "px-8 py-3 bg-blue-500 text-white font-medium rounded-lg hover:bg-blue-600 transition-colors",
children: s.finalContinueText
}
)
] })
]
}
) }) : (console.log("DepartureSelection - Waiting for date initialization..."), null);
}
export {
rr as DepartureSelection
};