@salla.sa/twilight-components 3.0.18 → 3.0.20

package/dist/collection/components/salla-bullet-delivery/helpers.js

@@ -31,13 +31,153 @@ export const isBranchSelectable = (branch) => {
     const selectable = branch.pickup_readiness?.selectable;
     return typeof selectable === 'boolean' ? selectable : branch.is_open !== false;
 };
-/** Nearest available branch by distance; single pass O(n). */
+/** Backend readiness label ("استلمه غدًا", "جاهز {date}") when pickup is not today; null otherwise. */
+export const getBranchReadinessLabel = (branch) => {
+    const readiness = branch?.pickup_readiness;
+    return readiness?.label && ['tomorrow', 'later'].includes(readiness.state) ? readiness.label : null;
+};
+/** Branch-clock "HH:mm" a branch that is closed now becomes ready at later today; null otherwise. */
+export const getBranchReadyTodayTime = (branch) => {
+    const readiness = branch?.pickup_readiness;
+    if (readiness?.state !== 'same_day' || branch?.is_open !== false)
+        return null;
+    return readiness.ready_at?.match(/T(\d{2}:\d{2})/)?.[1] ?? null;
+};
+/** Busy branches (stock at the merchant's stop-orders threshold) stay listed but dimmed and unselectable. */
+export const isBranchBusy = (branch) => branch?.pickup_readiness?.state === 'orders_paused';
+/** Distinct cities of a branch list, in first-seen order (the API lists nearest first). */
+export const getBranchCities = (branches) => {
+    const seen = new Set();
+    const cities = [];
+    for (const { city } of branches) {
+        if (!city?.id || seen.has(String(city.id)))
+            continue;
+        seen.add(String(city.id));
+        cities.push({ id: city.id, name: city.name });
+    }
+    return cities;
+};
+/** "3.52" / "12" — at most two decimals, as the checkout picker shows it; '' when the distance is unknown. */
+export const formatBranchDistance = (km) => {
+    if (km == null || Number.isNaN(Number(km)))
+        return '';
+    return String(Math.round(Number(km) * 100) / 100);
+};
+/**
+ * Readiness states the picker hides outright instead of showing as a disabled card: closed and not
+ * taking pickup orders at all. Busy/out-of-stock stay visible-but-disabled so the shopper sees why
+ * (same rule as the checkout picker, INV-1414).
+ */
+const HIDDEN_READINESS_STATES = ['closed', 'unavailable'];
+export const isBranchVisible = (branch) => !!branch && !HIDDEN_READINESS_STATES.includes(branch.pickup_readiness?.state);
+/** The branch's pickup offer (INV-1416); null when it has none, or a zero one, so "خصم 0%" never shows. */
+export const getBranchDiscount = (branch) => {
+    const type = branch?.discount?.type;
+    const amount = Number(branch?.discount?.amount);
+    if ((type !== 'percentage' && type !== 'fixed_amount') || !(amount > 0))
+        return null;
+    return { type, amount };
+};
+/**
+ * Min–max pickup offer across the listed branches, for the pickup tab badge; null when none has one.
+ * Branches the picker hides are left out so the tab never advertises an offer the shopper can't pick.
+ * A percentage and a fixed amount can't share one range, so percentages win when both are set.
+ */
+export const getBranchDiscountRange = (branches) => {
+    const discounts = branches.filter(isBranchVisible).map(getBranchDiscount).filter((d) => !!d);
+    if (!discounts.length)
+        return null;
+    const type = discounts.some(d => d.type === 'percentage') ? 'percentage' : 'fixed_amount';
+    const amounts = discounts.filter(d => d.type === type).map(d => d.amount);
+    return { type, min: Math.min(...amounts), max: Math.max(...amounts) };
+};
+/** The storefront's working_hours and ready_at use 24h "HH:mm"; null for anything else. */
+export const parseBranchTime = (time) => {
+    const match = String(time ?? '').trim().match(/^(\d{1,2}):(\d{2})(?::\d{2})?$/);
+    if (!match || Number(match[1]) > 24)
+        return null;
+    return { hours: Number(match[1]) % 24, minutes: Number(match[2]) };
+};
+/** Date#getDay() keys for the day names the storefront API may send (Arabic or English). */
+const DAY_KEYS = {
+    sunday: 0, 'الاحد': 0,
+    monday: 1, 'الاثنين': 1,
+    tuesday: 2, 'الثلاثاء': 2,
+    wednesday: 3, 'الاربعاء': 3,
+    thursday: 4, 'الخميس': 4,
+    friday: 5, 'الجمعة': 5,
+    saturday: 6, 'السبت': 6,
+};
+const dayKeyFromName = (name) => DAY_KEYS[String(name ?? '').trim().toLowerCase().replace(/[أإآ]/g, 'ا')];
+/**
+ * The storefront's `working_hours` (`{ name, times: [{ from, to }] }`, 24h times) as weekly
+ * schedule rows for the hours dropdown.
+ */
+export const getBranchWeekSchedule = (branch) => (branch.working_hours || [])
+    .filter(day => day?.name)
+    .map(day => ({
+    day_key: dayKeyFromName(day.name),
+    day: day.name,
+    times: (day.times || []).map(t => ({ start: t.from, end: t.to })),
+}));
+export const isBranchAlwaysOpen = (branch) => !!branch.always_open;
+/**
+ * "11:00 م" / "11:00 PM". ar-SA's ICU pattern puts the day period first, which the bidi algorithm
+ * scrambles inside RTL text, so the parts are joined in a fixed "h:mm period" order instead.
+ */
+export const formatBranchClockTime = (time, locale) => {
+    const parsed = parseBranchTime(time);
+    if (!parsed)
+        return '';
+    const date = new Date(Date.UTC(2000, 0, 1, parsed.hours, parsed.minutes));
+    const parts = new Intl.DateTimeFormat(locale === 'ar' ? 'ar-SA-u-nu-latn' : 'en', {
+        timeZone: 'UTC',
+        hour: '2-digit',
+        minute: '2-digit',
+        hour12: true,
+    }).formatToParts(date);
+    const get = (type) => parts.find(p => p.type === type)?.value ?? '';
+    return `${get('hour')}:${get('minute')} ${get('dayPeriod')}`;
+};
+const sameTimes = (a, b) => a.length === b.length && a.every((t, i) => t.start === b[i].start && t.end === b[i].end);
+/** Consecutive days with identical hours collapse into one row; the largest groups come first. */
+export const groupBranchSchedule = (weekSchedule) => {
+    const groups = [];
+    const days = [...(weekSchedule || [])].filter(s => s.times?.length).sort((a, b) => (a.day_key ?? 0) - (b.day_key ?? 0));
+    for (const day of days) {
+        const last = groups[groups.length - 1];
+        if (last && day.day_key === last.lastDayKey + 1 && sameTimes(last.times, day.times)) {
+            last.days.push(day.day);
+            last.lastDayKey = day.day_key;
+        }
+        else {
+            groups.push({ days: [day.day], times: day.times, lastDayKey: day.day_key ?? 0 });
+        }
+    }
+    return groups.sort((a, b) => b.days.length - a.days.length).map(({ days, times }) => ({ days, times }));
+};
+/** Keeps the digits and a leading "+" the merchant typed; drops spaces, dashes and brackets. */
+const cleanPhone = (value) => String(value ?? '').trim().replace(/[^\d+]/g, '');
+export const getBranchPhoneHref = (branch) => {
+    const phone = cleanPhone(branch.contacts?.phone);
+    return phone ? `tel:${phone}` : null;
+};
+/** wa.me wants the international number as bare digits ("+966…" / "00966…" → "966…"). */
+export const getBranchWhatsappHref = (branch) => {
+    const digits = cleanPhone(branch.contacts?.whatsapp).replace(/^\+/, '').replace(/^00/, '').replace(/\D/g, '');
+    return digits ? `https://wa.me/${digits}` : null;
+};
+export const getBranchDirectionsHref = (branch) => branch.location?.lat != null && branch.location?.lng != null
+    ? `https://www.google.com/maps?q=${branch.location.lat},${branch.location.lng}`
+    : null;
+/** Nearest selectable branch by distance; single pass O(n). */
 export function findNearestBranch(branches, userLat, userLon) {
     let nearest = null;
     let minD = Number.POSITIVE_INFINITY;
     for (const b of branches) {
         const lat = b.location?.lat != null ? Number(b.location.lat) : Number.NaN;
         const lng = b.location?.lng != null ? Number(b.location.lng) : Number.NaN;
+        // Closed branches that still take orders are selectable too, so gate on selectability, not is_open.
         if (Number.isNaN(lat) || Number.isNaN(lng) || !isBranchSelectable(b))
             continue;
         const d = calculateDistance(userLat, userLon, lat, lng);
@@ -61,11 +201,12 @@ export function formatWorkingHoursDisplay(from, to, locale, untilLabel) {
     const t = String(to).trim();
     return !f || !t ? '' : f === '00:00' ? `${untilLabel} ${formatTimeTo12h(t, locale)}` : `${formatTimeTo12h(f, locale)} - ${formatTimeTo12h(t, locale)}`;
 }
+/** Matches the fields the branches API searches: branch, city and country names (either language). */
 export const filterBranches = (branches, searchQuery) => {
     if (!searchQuery)
         return branches;
     const q = searchQuery.toLowerCase();
-    return branches.filter((b) => b.name.toLowerCase().includes(q) || b.city?.name?.toLowerCase().includes(q));
+    return branches.filter((b) => [b.name, b.city?.name, b.city?.name_en, b.country?.name, b.country?.name_en].some((name) => name?.toLowerCase().includes(q)));
 };
 export const getIntentSubtitle = (intent, toAddress, fromBranch) => {
     if (intent.type === 'branch') {
@@ -85,10 +226,30 @@ export const getIntentRegionId = (i) => idFrom(i?.address_details?.region?.id);
 export const getIntentCityId = (i) => idFrom(i?.address_details?.city?.id);
 export const getIntentDistrictId = (i) => idFrom(i?.address_details?.district?.id);
 export const getIntentBranchId = (i) => i?.branch_details?.id;
-/** Intent coordinates (branch tab only; address flow no longer uses coordinates). */
-export const getIntentLatitude = (i) => i?.branch_details?.latitude;
-export const getIntentLongitude = (i) => i?.branch_details?.longitude;
 export const isMapOriginIntent = (i) => !!i && i.type === 'address' && i.address_details?.lat != null && i.address_details?.lng != null;
+/** Parse a coordinate to a finite number, treating null and blank/whitespace strings as missing. */
+export const toCoordinate = (value) => {
+    if (value == null || (typeof value === 'string' && value.trim() === ''))
+        return null;
+    const num = Number(value);
+    return Number.isFinite(num) ? num : null;
+};
+/**
+ * Address intent complete enough to order against: a national address code, or a district with a
+ * street or real coordinates. The district text may sit in `local` when the district object is empty.
+ */
+export const isIntentAddressComplete = (i) => {
+    if (!i || i.type !== 'address')
+        return false;
+    const d = i.address_details;
+    // Stored intents come from the API, so a field may not be a string.
+    const has = (value) => String(value ?? '').trim() !== '';
+    const lat = toCoordinate(d?.lat);
+    const lng = toCoordinate(d?.lng);
+    const hasCoordinates = lat != null && lng != null && !(lat === 0 && lng === 0);
+    const hasDistrict = has(d?.district?.name) || has(d?.local);
+    return has(d?.short_address) || (hasDistrict && (has(d?.street) || hasCoordinates));
+};
 export const hasSessionAddressIntent = (intent) => {
     if (!intent || intent.type !== 'address' || intent.address_id)
         return false;
@@ -120,13 +281,3 @@ export function buildAddressLocationPayloadFromSelection(options) {
         ...(shortAddress && { short_address: shortAddress }),
     };
 }
-// Geolocation error codes - fallback constants for non-browser environments
-const GEO_ERROR_PERMISSION_DENIED = typeof GeolocationPositionError !== 'undefined' ? GeolocationPositionError.PERMISSION_DENIED : 1;
-const GEO_ERROR_POSITION_UNAVAILABLE = typeof GeolocationPositionError !== 'undefined' ? GeolocationPositionError.POSITION_UNAVAILABLE : 2;
-const GEO_ERROR_TIMEOUT = typeof GeolocationPositionError !== 'undefined' ? GeolocationPositionError.TIMEOUT : 3;
-const GEO_ERROR_MESSAGES = {
-    [GEO_ERROR_PERMISSION_DENIED]: 'Location permission denied',
-    [GEO_ERROR_POSITION_UNAVAILABLE]: 'Location unavailable',
-    [GEO_ERROR_TIMEOUT]: 'Location timeout',
-};
-export const getGeolocationErrorMessage = (errorCode) => GEO_ERROR_MESSAGES[errorCode] ?? 'An error occurred while detecting location';

package/dist/collection/components/salla-bullet-delivery/icons.js

@@ -0,0 +1,17 @@
+/*!
+ * Crafted with ❤ by Salla
+ */
+/**
+ * Inline icons shared with the checkout pickup picker (Checkout-Module INV-1414), kept byte-identical
+ * so both surfaces render the same glyphs.
+ */
+/** Checkout `LightningIcon.vue` — the "save delivery fees" pickup-tab badge. */
+export const LightningIcon = `<svg width="7" height="10" viewBox="0 0 7 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.41015 0.036C5.73815 0.084 5.96415 0.222 6.08815 0.45C6.21215 0.678 6.21415 0.952 6.09415 1.272C6.03815 1.432 5.89415 1.72 5.66215 2.136L5.13415 3.108C5.03015 3.308 4.96215 3.44 4.93015 3.504C4.91415 3.544 4.90215 3.576 4.89415 3.6C4.89415 3.656 4.91815 3.7 4.96615 3.732C4.99015 3.74 5.02615 3.748 5.07415 3.756H5.51815C5.79815 3.756 5.99015 3.76 6.09415 3.768C6.30215 3.784 6.45815 3.832 6.56215 3.912C6.70615 4.008 6.81215 4.138 6.88015 4.302C6.94815 4.466 6.97015 4.636 6.94615 4.812C6.93015 4.948 6.85815 5.1 6.73015 5.268C6.66615 5.356 6.53815 5.508 6.34615 5.724L3.65815 8.82C3.35415 9.172 3.14815 9.398 3.04015 9.498C2.93215 9.598 2.83415 9.664 2.74615 9.696C2.58615 9.768 2.43415 9.766 2.29015 9.69C2.14615 9.614 2.05415 9.488 2.01415 9.312C1.99815 9.208 1.99615 9.08 2.00815 8.928C2.02015 8.776 2.07415 8.472 2.17015 8.016L2.50615 6.432C2.57815 6.104 2.61815 5.888 2.62615 5.784C2.63415 5.728 2.62215 5.686 2.59015 5.658C2.55815 5.63 2.52615 5.612 2.49415 5.604C2.39815 5.588 2.18615 5.58 1.85815 5.58H1.60615C1.19815 5.58 0.918154 5.568 0.766154 5.544C0.462154 5.504 0.246154 5.38 0.118154 5.172C-0.00984615 4.964 -0.0338462 4.704 0.0461538 4.392C0.0861538 4.24 0.190154 3.968 0.358154 3.576L1.25815 1.464C1.41015 1.112 1.51815 0.872 1.58215 0.744C1.71015 0.512 1.85815 0.34 2.02615 0.228C2.19415 0.116 2.40215 0.048 2.65015 0.024C2.79415 0.008 3.05415 0 3.43015 0H4.47415C4.93815 0 5.25015 0.012 5.41015 0.036Z" fill="white"/></svg>`;
+/** Pickup-instructions line on the branch card (design-provided). */
+export const NotesIcon = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.58709 4.67775L11.769 5.52554M7.90501 7.20895L9.49598 7.63284M7.98415 11.9777L8.62054 12.1472C10.4205 12.6268 11.3205 12.8666 12.0295 12.4595C12.7385 12.0525 12.9797 11.1576 13.462 9.36777L14.1441 6.83657C14.6264 5.04674 14.8675 4.15183 14.4582 3.44681C14.0488 2.7418 13.1488 2.50201 11.3489 2.02242L10.7125 1.85287C8.91249 1.37328 8.0125 1.13349 7.30349 1.54053C6.59447 1.94757 6.35332 2.84249 5.87102 4.63231L5.18894 7.16351C4.70664 8.95334 4.46549 9.84825 4.87484 10.5533C5.28419 11.2583 6.18418 11.4981 7.98415 11.9777Z" stroke="#555555" stroke-width="1.125" stroke-linecap="round"/><path d="M8.00016 13.964L7.36527 14.1369C5.56952 14.6259 4.67164 14.8704 3.96429 14.4554C3.25694 14.0404 3.01636 13.1279 2.53519 11.303L1.85471 8.72211C1.37354 6.89717 1.13295 5.98471 1.54134 5.26586C1.89461 4.64404 2.66683 4.66668 3.66683 4.66661" stroke="#555555" stroke-width="1.125" stroke-linecap="round"/></svg>`;
+/** Pickup-availability (preparation time) line on the branch card (design-provided). */
+export const PickupAvailabilityIcon = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="8.00016" cy="8.00004" r="6.66667" stroke="#555555" stroke-width="1.125"/><path d="M8 5.33337V8.00004L9.33333 9.33337" stroke="#555555" stroke-width="1.125" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
+/** Working-hours (open/closed status) line on the branch card (design-provided). */
+export const WorkingHoursIcon = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.00014 14.6667C4.31824 14.6667 1.3335 11.6819 1.3335 8.00004C1.3335 4.31814 4.31826 1.33337 8.00016 1.33337C10.9853 1.33337 13.484 3.2953 14.3335 6.00004H12.6668" stroke="#666666" stroke-width="1.125" stroke-linecap="round" stroke-linejoin="round"/><path d="M8 5.33337V8.00004L9.33333 9.33337" stroke="#666666" stroke-width="1.125" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.6367 8.66667C14.6565 8.44724 14.6667 8.22486 14.6667 8M10 14.6667C10.2277 14.5917 10.4502 14.5043 10.6667 14.4052M13.8604 11.3333C13.989 11.0856 14.1036 10.8288 14.2034 10.5641M12.1283 13.4862C12.358 13.2961 12.5754 13.0905 12.7792 12.871" stroke="#666666" stroke-width="1.125" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
+/** Location (country, city, district) line on the branch card (design-provided). */
+export const BranchLocationIcon = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="8.00016" cy="4.66667" r="2.66667" stroke="#555555" stroke-width="1.125"/><path d="M8 7.33337L8 12" stroke="#555555" stroke-width="1.125" stroke-linecap="round"/><path d="M11.3332 12.6666C11.3332 13.403 9.84079 14 7.99984 14C6.15889 14 4.6665 13.403 4.6665 12.6666" stroke="#555555" stroke-width="1.125" stroke-linecap="round"/></svg>`;