@artaio/arta-browser 2.19.1 → 2.20.0
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/bundle.js +1 -1
- package/dist/components/DeliveryDelay/index.d.ts +8 -0
- package/dist/components/DeliveryDelay/index.js +27 -0
- package/dist/components/TrackingDrawer/index.css +18 -0
- package/dist/components/TrackingDrawer/index.css.js +1 -1
- package/dist/components/TrackingDrawer/index.d.ts +1 -1
- package/dist/components/TrackingShipment/index.js +7 -6
- package/dist/trackingConfig.d.ts +4 -0
- package/dist/trackingConfig.js +16 -0
- package/package.json +1 -1
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { TrackingConfig } from '../../trackingConfig';
|
|
2
|
+
import type { Shipment } from '../TrackingDrawer';
|
|
3
|
+
interface DeliveryDelayProps {
|
|
4
|
+
config: TrackingConfig;
|
|
5
|
+
shipment: Shipment;
|
|
6
|
+
}
|
|
7
|
+
export declare const DeliveryDelay: ({ config, shipment }: DeliveryDelayProps) => import("preact").JSX.Element | null;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('preact/jsx-runtime');
|
|
4
|
+
var HexagonAlertBase = require('../ShipmentException/icons/HexagonAlertBase.js');
|
|
5
|
+
|
|
6
|
+
const isDeliveryDelayed = (shipment) => {
|
|
7
|
+
if (shipment.delivery_end == null) {
|
|
8
|
+
return false;
|
|
9
|
+
}
|
|
10
|
+
const end = new Date(shipment.delivery_end);
|
|
11
|
+
if (Number.isNaN(end.getTime())) {
|
|
12
|
+
return false;
|
|
13
|
+
}
|
|
14
|
+
end.setHours(23, 59, 59, 999);
|
|
15
|
+
return Date.now() > end.getTime();
|
|
16
|
+
};
|
|
17
|
+
const DeliveryDelay = ({ config, shipment }) => {
|
|
18
|
+
if (shipment.status === 'completed' ||
|
|
19
|
+
shipment.status === 'cancelled' ||
|
|
20
|
+
shipment.quote_type === 'track' ||
|
|
21
|
+
!isDeliveryDelayed(shipment)) {
|
|
22
|
+
return null;
|
|
23
|
+
}
|
|
24
|
+
return (jsxRuntime.jsxs("div", { class: "artajs__tracking__delay__wrapper", children: [jsxRuntime.jsx(HexagonAlertBase.HexagonAlertBase, { config: config }), jsxRuntime.jsx("div", { class: "artajs__tracking__delay__text", children: config.text.deliveryDelayedLabel })] }));
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
exports.DeliveryDelay = DeliveryDelay;
|
|
@@ -912,6 +912,24 @@
|
|
|
912
912
|
cursor: pointer;
|
|
913
913
|
}
|
|
914
914
|
|
|
915
|
+
.artajs__drawer .artajs__tracking__delay__wrapper {
|
|
916
|
+
display: flex;
|
|
917
|
+
align-items: flex-start;
|
|
918
|
+
justify-content: center;
|
|
919
|
+
gap: 8px;
|
|
920
|
+
padding: 0 16px 16px;
|
|
921
|
+
align-self: stretch;
|
|
922
|
+
border-bottom: 1px solid var(--border);
|
|
923
|
+
}
|
|
924
|
+
|
|
925
|
+
.artajs__drawer .artajs__tracking__delay__text {
|
|
926
|
+
color: var(--text-primary);
|
|
927
|
+
font-family: var(--font-family);
|
|
928
|
+
font-size: calc(var(--font-size) - 1px);
|
|
929
|
+
line-height: 150%;
|
|
930
|
+
letter-spacing: 0.2px;
|
|
931
|
+
}
|
|
932
|
+
|
|
915
933
|
/* Shipments Events List */
|
|
916
934
|
|
|
917
935
|
.artajs__drawer .artajs__tracking__events__wrapper {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var css = "/* reset */\n\n:root {\n --background: #ffffff;\n --text-primary: #110f10;\n --text-secondary: #6f6c65;\n --border: #e7e7e7;\n --width: 540px;\n --font-family: 'Neue Haas Grotesk Text Pro, Helvetica, sans-serif, Arial';\n --font-size: 14px;\n --default-styling: 'flex';\n --minimal-styling: 'none';\n\n --location-direction: 'row';\n --location-justify: 'center';\n --location-align: 'flex-start';\n --location-flex: '1 0 0';\n --backdrop-color: rgba(0, 0, 0, 0.5);\n\n --animationIn: none;\n\n --button-background: #110f10;\n --button-background-hover: #6f6c65;\n --button-border: #110f10;\n --button-text: #ffffff;\n --button-text-hover: #ffffff;\n --button-border-hover: #110f10;\n}\n\n.artajs__drawer,\n.artajs__drawer__backdrop {\n all: initial;\n}\n\n.artajs__drawer a,\n.artajs__drawer button,\n.artajs__drawer div,\n.artajs__drawer input,\n.artajs__drawer form,\n.artajs__drawer p,\n.artajs__drawer select,\n.artajs__drawer__backdrop div {\n all: unset;\n}\n\n/* Box sizing rules */\n.artajs__drawer *,\n.artajs__drawer *::before,\n.artajs__drawer *::after,\n.artajs__drawer__backdrop *,\n.artajs__drawer__backdrop *::before,\n.artajs__drawer__backdrop *::after {\n box-sizing: border-box;\n}\n\n/* Remove default margin */\n.artajs__drawer div,\n.artajs__drawer h1,\n.artajs__drawer h2,\n.artajs__drawer h3,\n.artajs__drawer h4,\n.artajs__drawer p {\n margin: 0;\n}\n\n.artajs__drawer div,\n.artajs__drawer p {\n display: block;\n font-family: var(--font-family);\n}\n\n/* Inherit fonts for inputs and buttons */\n.artajs__drawer input,\n.artajs__drawer button,\n.artajs__drawer select {\n font: inherit;\n margin: 0;\n}\n\n/* drawer styles */\n.artajs__drawer {\n background-color: var(--background);\n height: 100vh;\n position: fixed;\n z-index: 2001;\n bottom: 0px;\n font-family: var(--font-family);\n}\n\n@keyframes fadeInAnimation {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes slideInFromRight {\n 0% {\n transform: translateX(100%);\n }\n\n 100% {\n transform: translateX(0);\n }\n}\n\n@keyframes slideInFromLeft {\n 0% {\n transform: translateX(-100%);\n }\n\n 100% {\n transform: translateX(0);\n }\n}\n\n.artajs__drawer__left {\n left: 0;\n right: auto;\n animation: var(--animationIn);\n animation-iteration-count: 1;\n animation-fill-mode: forwards;\n}\n\n.artajs__drawer__right {\n left: auto;\n right: 0;\n animation: var(--animationIn);\n animation-iteration-count: 1;\n animation-fill-mode: forwards;\n}\n\n/* backdrop */\n.artajs__drawer__backdrop {\n background-color: var(--backdrop-color);\n bottom: 0;\n left: 0;\n position: fixed;\n right: 0;\n top: 0;\n z-index: 2001;\n}\n\n.artajs__drawer .artajs__tracking__out__wrapper {\n display: flex;\n width: var(--width);\n flex-direction: column;\n align-items: flex-start;\n\n background: var(--background, #fff);\n\n box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.25);\n height: 100%;\n}\n\n/* Header styles */\n.artajs__drawer .artajs__tracking__header {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__header__title {\n display: flex;\n padding: 16px 24px;\n align-items: center;\n align-self: stretch;\n gap: 16px;\n}\n\n.artajs__drawer .artajs__tracking__header__text {\n flex: 1 0 0;\n font-size: calc(var(--font-size) + 2px);\n font-weight: bold;\n line-height: 150%;\n color: var(--text-primary);\n}\n\n.artajs__drawer .artajs__tracking__header__icon {\n display: flex;\n width: 16px;\n height: 16px;\n padding-right: 0px;\n justify-content: center;\n align-items: center;\n}\n\n.artajs__drawer .artajs__tracking__header__icon a {\n cursor: pointer;\n display: block;\n height: 24px;\n text-decoration: none;\n}\n\n.artajs__drawer .artajs__tracking__header__icon a svg line {\n stroke: var(--text-secondary);\n}\n\n.artajs__drawer .artajs__tracking__header__icon a:hover svg line {\n stroke: var(--text-primary);\n}\n\n.artajs__drawer .artajs__tracking__header__line {\n width: 100%;\n height: 1px;\n background-color: var(--border);\n}\n\n/* Body styles */\n.artajs__drawer .artajs__tracking__body {\n display: flex;\n padding: 16px 24px;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n align-self: stretch;\n overflow-y: auto;\n max-height: 100%;\n flex-grow: 1;\n}\n\n/* Timeline Default styles */\n.artajs__drawer .artajs__tracking__timeline__default__wrapper {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 16px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__timeline__default__steps {\n display: flex;\n padding: 0px 16px;\n justify-content: space-between;\n align-items: flex-start;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__timeline__default__step__icon {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__triple__dots {\n display: flex;\n align-items: flex-start;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__text__large {\n color: var(--text-primary);\n text-align: center;\n\n font-family: var(--font-family);\n font-size: calc(var(--font-size) + 2px);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n}\n\n.artajs__drawer .artajs__tracking__timeline__step {\n display: flex;\n padding-top: 12px;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__step__text__secondary {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__step__text__primary {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__text__wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__date {\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n gap: 0px 4px;\n align-self: stretch;\n flex-wrap: wrap;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__date__content {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n /* 18px */\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__date__secondary {\n color: var(--text-secondary);\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 3px);\n line-height: 150%;\n /* 18px */\n letter-spacing: 0.2px;\n}\n\n/* Timeline Minimal styles */\n.artajs__drawer .artajs__tracking__timeline__minimal__wrapper {\n display: flex;\n width: 140px;\n flex-direction: column;\n align-items: center;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n align-self: stretch;\n}\n\n@media (max-width: 540px) {\n .artajs__drawer .artajs__tracking__out__wrapper {\n width: 100% !important;\n }\n\n .artajs__drawer__right {\n width: 100% !important;\n }\n\n .artajs__drawer__left {\n width: 100% !important;\n }\n\n .artajs__drawer .artajs__tracking__timeline__default__wrapper {\n display: none !important;\n }\n\n .artajs__drawer .artajs__tracking__timeline__minimal__wrapper {\n display: flex !important;\n }\n\n .artajs__drawer .artajs__tracking__location {\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n }\n\n .artajs__drawer .artajs__tracking__location__item {\n flex: 0 1 auto;\n }\n\n .artajs__drawer__backdrop {\n display: none;\n }\n}\n\n@media (min-width: 541px) {\n .artajs__drawer .artajs__tracking__out__wrapper {\n width: var(--width) !important;\n }\n\n .artajs__drawer__right {\n width: var(--width) !important;\n }\n\n .artajs__drawer__left {\n width: var(--width) !important;\n }\n\n .artajs__drawer .artajs__tracking__timeline__default__wrapper {\n display: var(--default-styling) !important;\n }\n\n .artajs__drawer .artajs__tracking__timeline__minimal__wrapper {\n display: var(--minimal-styling) !important;\n }\n\n .artajs__drawer .artajs__tracking__location {\n flex-direction: var(--location-direction);\n justify-content: var(--location-justify);\n align-items: var(--location-align);\n }\n\n .artajs__drawer .artajs__tracking__location__item {\n flex: var(--location-flex);\n }\n\n .artajs__drawer__backdrop {\n display: unset;\n }\n}\n\n.artajs__drawer .artajs__tracking__timeline__minimal__divider {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__minimal__step {\n display: flex;\n padding: 10px;\n align-items: flex-start;\n gap: 10px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__minimal__spacing {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 12px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__divider {\n display: flex;\n width: 140px;\n height: 1px;\n flex-direction: column;\n align-items: center;\n gap: 4px;\n border-bottom: 1px solid var(--border);\n}\n\n/* Tracking Top styles */\n.artajs__drawer .artajs__tracking__top__wrapper {\n display: flex;\n padding-bottom: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 24px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__top__divider {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__top__cta {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 4px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__top__text {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__top__date__wrapper {\n display: flex;\n justify-content: center;\n align-items: flex-end;\n gap: 24px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__top__date__aligner {\n display: flex;\n height: 71px;\n flex-direction: column;\n align-items: center;\n}\n\n.artajs__drawer .artajs__tracking__top__date__day {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n font-weight: bold;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__top__date__day__numeric {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-weight: bold;\n font-size: calc(var(--font-size) + 42px);\n line-height: calc(var(--font-size) + 42px);\n}\n\n.artajs__drawer .artajas__tracking__top__date__and {\n color: var(--text-primary);\n justify-content: flex-end;\n display: flex;\n flex-direction: column;\n font-size: calc(var(--font-size) - 1px);\n height: 95%;\n}\n\n/* Tracking Location */\n.artajs__drawer .artajas__tracking__location__wrapper {\n display: flex;\n padding-bottom: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__location {\n display: flex;\n gap: 8px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__location__item {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__location__text__wrapper {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 2px;\n flex: 1 0 0;\n}\n\n.artajs__drawer .artajs__tracking__location__text__header {\n display: flex;\n align-items: center;\n gap: 4px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__location__text__header__label {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-weight: bold;\n font-size: calc(var(--font-size) - 2px);\n letter-spacing: 0.2px;\n line-height: 150%;\n text-align: left;\n}\n\n.artajs__drawer .artajs__tracking__location__text__content {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n letter-spacing: 0.2px;\n line-height: 150%;\n text-align: left;\n}\n\n/* Tracking Packings */\n\n.artajs__drawer .artajs__packings__wrapper {\n display: flex;\n padding: 16px 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n border-radius: 8px;\n border: 1px solid var(--border);\n background: var(--background);\n\n /* 1 */\n box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);\n}\n\n.artajs__drawer .artajs__packings__spacer {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__header {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__header__top {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 4px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__header__body {\n display: flex;\n align-items: flex-start;\n gap: 4px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__line {\n width: 100%;\n height: 1px;\n background-color: var(--border);\n}\n\n.artajs__drawer .artajs__packings__item {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__item__row {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__item__thumbnail {\n flex-shrink: 0;\n}\n\n.artajs__drawer .artajs__packings__item__thumbnail__img {\n width: 48px;\n height: 48px;\n object-fit: cover;\n border-radius: 2px;\n border: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__packings__item__thumbnail__placeholder {\n width: 48px;\n height: 48px;\n border-radius: 2px;\n border: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__packings__item__content {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex: 1;\n}\n\n.artajs__drawer .artajs__packings__text__wrapper {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__text__regular__underline {\n cursor: pointer;\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n line-height: 150%;\n /* 21px */\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n}\n\n.artajs__drawer .artajs__packings__text__small__underline {\n cursor: pointer;\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n /* 18px */\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n}\n\n.artajs__drawer .artajs__tracking__title {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__subtype {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n /* 18px */\n letter-spacing: 0.2px;\n}\n\n/* Footer */\n.artajs__drawer .artajs__tracking__footer__wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 10px;\n align-self: stretch;\n margin-bottom: 16px;\n margin-top: auto;\n}\n\n.artajs__drawer .artajs__tracking__footer__content {\n display: flex;\n margin-top: 24px;\n justify-content: center;\n align-items: center;\n gap: 6px;\n cursor: pointer;\n padding: 6px 10px;\n background: #ffffff;\n border-radius: 12px;\n}\n\n.artajs__drawer .artajs__tracking__footer__powered__by__text {\n color: #6f6c65;\n text-align: center;\n font-family: Helvetica;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n line-height: 150%;\n padding-top: 2px;\n}\n\n.artajs__drawer .artajs__tracking__footer__powered__by__logo {\n display: flex;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n color: #379464;\n}\n\n.artajs__drawer\n .artajs__tracking__footer__content:hover\n .artajs__tracking__footer__powered__by__text,\n.artajs__drawer\n .artajs__tracking__footer__content:hover\n .artajs__tracking__footer__powered__by__logo {\n color: #000;\n}\n\n/* Insurance box */\n.artajs__drawer .artajs__tracking__insurance__wrapper {\n display: flex;\n padding-top: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n align-self: stretch;\n border-top: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__insurance__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n gap: 2px;\n align-self: stretch;\n border-radius: 8px;\n}\n\n.artajs__drawer .artajs__tracking__insurance__title {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__insurance__body {\n display: flex;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__insurance__body__icon {\n color: var(--text-primary);\n display: flex;\n width: 18px;\n height: 20px;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n}\n\n.artajs__drawer .artajs__tracking__insurance__body__icon__text {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n cursor: pointer;\n}\n\n/* Summary styles */\n.artajs__drawer .artajs__tracking__summary__wrapper {\n display: flex;\n padding-top: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n align-self: stretch;\n border-top: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__summary__content {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__summary__date {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__summary__title {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n/* Exceptions */\n.artajs__drawer .artajs__tracking__exception__wrapper {\n display: flex;\n padding-bottom: 24px;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__exception__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 2px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__exception__title {\n color: var(--text-primary);\n text-align: center;\n align-self: stretch;\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__exception__cta {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n align-self: stretch;\n cursor: pointer;\n}\n\n/* Shipments Events List */\n\n.artajs__drawer .artajs__tracking__events__wrapper {\n display: flex;\n padding: 16px 0px;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n align-self: stretch;\n flex-grow: 1;\n overflow-y: auto;\n}\n\n.artajs__drawer .artajs__tracking__events__return {\n display: flex;\n padding: 0 24px 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n cursor: pointer;\n}\n\n.artajs__drawer .artajs__tracking__events__return__text {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-style: normal;\n line-height: 150%;\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n}\n\n.artajs__drawer .artajs__tracking__events__header {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n align-self: stretch;\n padding: 0 24px;\n}\n\n.artajs__drawer .artajs__tracking__events__header__title {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n /* 21px */\n letter-spacing: 0.2px;\n}\n\n/* Loading */\n\n.artajs__drawer .artajs__drawer__loading {\n position: absolute;\n top: 42%;\n left: 44%;\n transform: translate(-50%, -50%);\n height: 56px;\n width: 56px;\n box-sizing: border-box;\n background: conic-gradient(\n from 90deg at 50% 50%,\n rgba(39, 174, 96, 0) 0deg,\n rgba(31, 144, 255, 0) 0.04deg,\n var(--text-secondary) 360deg\n );\n border-radius: 56px;\n animation: 1s rotate infinite linear;\n}\n\n.artajs__drawer .artajs__drawer__loading::before {\n content: '';\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n height: 40px;\n width: 40px;\n background: var(--background);\n border-radius: 48px;\n}\n\n.artajs__drawer .artajs__drawer__loading::after {\n content: '';\n position: absolute;\n right: 0;\n top: 50%;\n transform: translateY(-50%);\n height: 8px;\n width: 8px;\n background: var(--text-secondary);\n border-radius: 8px;\n}\n\n@keyframes rotate {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\n/* Pill */\n.artajs__drawer .artajs__tracking__pill__wrapper {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__pill__round {\n display: flex;\n padding: 4px 8px;\n justify-content: center;\n align-items: center;\n gap: 8px;\n border-radius: 12px;\n}\n\n.artajs__drawer .artajs__tracking__pill__text {\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 3px);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__events__body {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n align-self: stretch;\n max-height: 100%;\n flex-grow: 1;\n}\n\n.artajs__drawer\n .artajs__tracking__events__body\n .artajs__tracking__footer__wrapper {\n padding: 16px 0 32px 0;\n}\n\n.artajs__drawer .artajs__tracking__events__group {\n align-self: stretch;\n display: flex;\n flex-direction: column;\n margin-left: 6px;\n padding: 0 24px;\n}\n\n.artajs__drawer .artajs__tracking__events__date {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n margin-bottom: 4px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__content {\n display: flex;\n flex-direction: row;\n gap: 2px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__item {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__number__primary {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n margin-top: 6px;\n min-width: 24px;\n text-align: end;\n}\n\n.artajs__drawer .artajs__tracking__events__group__number__secondary {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n margin-top: 6px;\n min-width: 24px;\n text-align: end;\n}\n\n.artajs__drawer .artajs__tracking__events__group__divider {\n display: flex;\n flex-direction: column;\n}\n\n.artajs__drawer .artajs__tracking__events__group__summary {\n display: flex;\n flex-direction: column;\n gap: 6px;\n margin-top: 6px;\n}\n\n.artajs__drawer .artajs__tracking__events__vertical {\n border-width: 1px;\n height: 100%;\n margin-top: 0;\n margin-bottom: 0;\n}\n\n.artajs__drawer .artajs__tracking__events__round {\n margin-top: 0;\n margin-bottom: 0;\n height: 30px;\n width: 30px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__location {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__location__secondary {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__time {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n font-style: normal;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__description {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__card {\n display: flex;\n padding: 16px 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n border-radius: 8px;\n border: 1px solid var(--border);\n background: var(--background);\n box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__content {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__header {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__header__item {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__button {\n display: flex;\n padding: 6px 12px;\n justify-content: center;\n align-items: center;\n border-radius: 4px;\n font-size: calc(var(--font-size) - 1px);\n font-weight: bold;\n\n background: var(--button-background);\n border: 1px solid var(--button-border);\n color: var(--button-text);\n}\n\n.artajs__drawer .artajs__tracking__button:hover {\n background: var(--button-background-hover);\n border: 1px solid var(--button-border-hover);\n color: var(--button-text-hover);\n cursor: pointer;\n}\n\n.artajs__drawer .artajs__tracking__button__container {\n display: flex;\n padding-right: 16px;\n justify-content: center;\n align-items: center;\n gap: 10px;\n border-right: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__exception__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 2px;\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__exception__title {\n color: var(--text-primary);\n align-self: stretch;\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n";
|
|
5
|
+
var css = "/* reset */\n\n:root {\n --background: #ffffff;\n --text-primary: #110f10;\n --text-secondary: #6f6c65;\n --border: #e7e7e7;\n --width: 540px;\n --font-family: 'Neue Haas Grotesk Text Pro, Helvetica, sans-serif, Arial';\n --font-size: 14px;\n --default-styling: 'flex';\n --minimal-styling: 'none';\n\n --location-direction: 'row';\n --location-justify: 'center';\n --location-align: 'flex-start';\n --location-flex: '1 0 0';\n --backdrop-color: rgba(0, 0, 0, 0.5);\n\n --animationIn: none;\n\n --button-background: #110f10;\n --button-background-hover: #6f6c65;\n --button-border: #110f10;\n --button-text: #ffffff;\n --button-text-hover: #ffffff;\n --button-border-hover: #110f10;\n}\n\n.artajs__drawer,\n.artajs__drawer__backdrop {\n all: initial;\n}\n\n.artajs__drawer a,\n.artajs__drawer button,\n.artajs__drawer div,\n.artajs__drawer input,\n.artajs__drawer form,\n.artajs__drawer p,\n.artajs__drawer select,\n.artajs__drawer__backdrop div {\n all: unset;\n}\n\n/* Box sizing rules */\n.artajs__drawer *,\n.artajs__drawer *::before,\n.artajs__drawer *::after,\n.artajs__drawer__backdrop *,\n.artajs__drawer__backdrop *::before,\n.artajs__drawer__backdrop *::after {\n box-sizing: border-box;\n}\n\n/* Remove default margin */\n.artajs__drawer div,\n.artajs__drawer h1,\n.artajs__drawer h2,\n.artajs__drawer h3,\n.artajs__drawer h4,\n.artajs__drawer p {\n margin: 0;\n}\n\n.artajs__drawer div,\n.artajs__drawer p {\n display: block;\n font-family: var(--font-family);\n}\n\n/* Inherit fonts for inputs and buttons */\n.artajs__drawer input,\n.artajs__drawer button,\n.artajs__drawer select {\n font: inherit;\n margin: 0;\n}\n\n/* drawer styles */\n.artajs__drawer {\n background-color: var(--background);\n height: 100vh;\n position: fixed;\n z-index: 2001;\n bottom: 0px;\n font-family: var(--font-family);\n}\n\n@keyframes fadeInAnimation {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes slideInFromRight {\n 0% {\n transform: translateX(100%);\n }\n\n 100% {\n transform: translateX(0);\n }\n}\n\n@keyframes slideInFromLeft {\n 0% {\n transform: translateX(-100%);\n }\n\n 100% {\n transform: translateX(0);\n }\n}\n\n.artajs__drawer__left {\n left: 0;\n right: auto;\n animation: var(--animationIn);\n animation-iteration-count: 1;\n animation-fill-mode: forwards;\n}\n\n.artajs__drawer__right {\n left: auto;\n right: 0;\n animation: var(--animationIn);\n animation-iteration-count: 1;\n animation-fill-mode: forwards;\n}\n\n/* backdrop */\n.artajs__drawer__backdrop {\n background-color: var(--backdrop-color);\n bottom: 0;\n left: 0;\n position: fixed;\n right: 0;\n top: 0;\n z-index: 2001;\n}\n\n.artajs__drawer .artajs__tracking__out__wrapper {\n display: flex;\n width: var(--width);\n flex-direction: column;\n align-items: flex-start;\n\n background: var(--background, #fff);\n\n box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.25);\n height: 100%;\n}\n\n/* Header styles */\n.artajs__drawer .artajs__tracking__header {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__header__title {\n display: flex;\n padding: 16px 24px;\n align-items: center;\n align-self: stretch;\n gap: 16px;\n}\n\n.artajs__drawer .artajs__tracking__header__text {\n flex: 1 0 0;\n font-size: calc(var(--font-size) + 2px);\n font-weight: bold;\n line-height: 150%;\n color: var(--text-primary);\n}\n\n.artajs__drawer .artajs__tracking__header__icon {\n display: flex;\n width: 16px;\n height: 16px;\n padding-right: 0px;\n justify-content: center;\n align-items: center;\n}\n\n.artajs__drawer .artajs__tracking__header__icon a {\n cursor: pointer;\n display: block;\n height: 24px;\n text-decoration: none;\n}\n\n.artajs__drawer .artajs__tracking__header__icon a svg line {\n stroke: var(--text-secondary);\n}\n\n.artajs__drawer .artajs__tracking__header__icon a:hover svg line {\n stroke: var(--text-primary);\n}\n\n.artajs__drawer .artajs__tracking__header__line {\n width: 100%;\n height: 1px;\n background-color: var(--border);\n}\n\n/* Body styles */\n.artajs__drawer .artajs__tracking__body {\n display: flex;\n padding: 16px 24px;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n align-self: stretch;\n overflow-y: auto;\n max-height: 100%;\n flex-grow: 1;\n}\n\n/* Timeline Default styles */\n.artajs__drawer .artajs__tracking__timeline__default__wrapper {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 16px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__timeline__default__steps {\n display: flex;\n padding: 0px 16px;\n justify-content: space-between;\n align-items: flex-start;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__timeline__default__step__icon {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__triple__dots {\n display: flex;\n align-items: flex-start;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__text__large {\n color: var(--text-primary);\n text-align: center;\n\n font-family: var(--font-family);\n font-size: calc(var(--font-size) + 2px);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n}\n\n.artajs__drawer .artajs__tracking__timeline__step {\n display: flex;\n padding-top: 12px;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__step__text__secondary {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__step__text__primary {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__text__wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__date {\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n gap: 0px 4px;\n align-self: stretch;\n flex-wrap: wrap;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__date__content {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n /* 18px */\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__status__date__secondary {\n color: var(--text-secondary);\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 3px);\n line-height: 150%;\n /* 18px */\n letter-spacing: 0.2px;\n}\n\n/* Timeline Minimal styles */\n.artajs__drawer .artajs__tracking__timeline__minimal__wrapper {\n display: flex;\n width: 140px;\n flex-direction: column;\n align-items: center;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n align-self: stretch;\n}\n\n@media (max-width: 540px) {\n .artajs__drawer .artajs__tracking__out__wrapper {\n width: 100% !important;\n }\n\n .artajs__drawer__right {\n width: 100% !important;\n }\n\n .artajs__drawer__left {\n width: 100% !important;\n }\n\n .artajs__drawer .artajs__tracking__timeline__default__wrapper {\n display: none !important;\n }\n\n .artajs__drawer .artajs__tracking__timeline__minimal__wrapper {\n display: flex !important;\n }\n\n .artajs__drawer .artajs__tracking__location {\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n }\n\n .artajs__drawer .artajs__tracking__location__item {\n flex: 0 1 auto;\n }\n\n .artajs__drawer__backdrop {\n display: none;\n }\n}\n\n@media (min-width: 541px) {\n .artajs__drawer .artajs__tracking__out__wrapper {\n width: var(--width) !important;\n }\n\n .artajs__drawer__right {\n width: var(--width) !important;\n }\n\n .artajs__drawer__left {\n width: var(--width) !important;\n }\n\n .artajs__drawer .artajs__tracking__timeline__default__wrapper {\n display: var(--default-styling) !important;\n }\n\n .artajs__drawer .artajs__tracking__timeline__minimal__wrapper {\n display: var(--minimal-styling) !important;\n }\n\n .artajs__drawer .artajs__tracking__location {\n flex-direction: var(--location-direction);\n justify-content: var(--location-justify);\n align-items: var(--location-align);\n }\n\n .artajs__drawer .artajs__tracking__location__item {\n flex: var(--location-flex);\n }\n\n .artajs__drawer__backdrop {\n display: unset;\n }\n}\n\n.artajs__drawer .artajs__tracking__timeline__minimal__divider {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__minimal__step {\n display: flex;\n padding: 10px;\n align-items: flex-start;\n gap: 10px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__minimal__spacing {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 12px;\n}\n\n.artajs__drawer .artajs__tracking__timeline__divider {\n display: flex;\n width: 140px;\n height: 1px;\n flex-direction: column;\n align-items: center;\n gap: 4px;\n border-bottom: 1px solid var(--border);\n}\n\n/* Tracking Top styles */\n.artajs__drawer .artajs__tracking__top__wrapper {\n display: flex;\n padding-bottom: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 24px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__top__divider {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__top__cta {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 4px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__top__text {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__top__date__wrapper {\n display: flex;\n justify-content: center;\n align-items: flex-end;\n gap: 24px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__top__date__aligner {\n display: flex;\n height: 71px;\n flex-direction: column;\n align-items: center;\n}\n\n.artajs__drawer .artajs__tracking__top__date__day {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n font-weight: bold;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__top__date__day__numeric {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-weight: bold;\n font-size: calc(var(--font-size) + 42px);\n line-height: calc(var(--font-size) + 42px);\n}\n\n.artajs__drawer .artajas__tracking__top__date__and {\n color: var(--text-primary);\n justify-content: flex-end;\n display: flex;\n flex-direction: column;\n font-size: calc(var(--font-size) - 1px);\n height: 95%;\n}\n\n/* Tracking Location */\n.artajs__drawer .artajas__tracking__location__wrapper {\n display: flex;\n padding-bottom: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__location {\n display: flex;\n gap: 8px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__location__item {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__location__text__wrapper {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 2px;\n flex: 1 0 0;\n}\n\n.artajs__drawer .artajs__tracking__location__text__header {\n display: flex;\n align-items: center;\n gap: 4px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__location__text__header__label {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-weight: bold;\n font-size: calc(var(--font-size) - 2px);\n letter-spacing: 0.2px;\n line-height: 150%;\n text-align: left;\n}\n\n.artajs__drawer .artajs__tracking__location__text__content {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n letter-spacing: 0.2px;\n line-height: 150%;\n text-align: left;\n}\n\n/* Tracking Packings */\n\n.artajs__drawer .artajs__packings__wrapper {\n display: flex;\n padding: 16px 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n border-radius: 8px;\n border: 1px solid var(--border);\n background: var(--background);\n\n /* 1 */\n box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);\n}\n\n.artajs__drawer .artajs__packings__spacer {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__header {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__header__top {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 4px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__header__body {\n display: flex;\n align-items: flex-start;\n gap: 4px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__line {\n width: 100%;\n height: 1px;\n background-color: var(--border);\n}\n\n.artajs__drawer .artajs__packings__item {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__item__row {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__item__thumbnail {\n flex-shrink: 0;\n}\n\n.artajs__drawer .artajs__packings__item__thumbnail__img {\n width: 48px;\n height: 48px;\n object-fit: cover;\n border-radius: 2px;\n border: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__packings__item__thumbnail__placeholder {\n width: 48px;\n height: 48px;\n border-radius: 2px;\n border: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__packings__item__content {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex: 1;\n}\n\n.artajs__drawer .artajs__packings__text__wrapper {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__packings__text__regular__underline {\n cursor: pointer;\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n line-height: 150%;\n /* 21px */\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n}\n\n.artajs__drawer .artajs__packings__text__small__underline {\n cursor: pointer;\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n /* 18px */\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n}\n\n.artajs__drawer .artajs__tracking__title {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__subtype {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n /* 18px */\n letter-spacing: 0.2px;\n}\n\n/* Footer */\n.artajs__drawer .artajs__tracking__footer__wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 10px;\n align-self: stretch;\n margin-bottom: 16px;\n margin-top: auto;\n}\n\n.artajs__drawer .artajs__tracking__footer__content {\n display: flex;\n margin-top: 24px;\n justify-content: center;\n align-items: center;\n gap: 6px;\n cursor: pointer;\n padding: 6px 10px;\n background: #ffffff;\n border-radius: 12px;\n}\n\n.artajs__drawer .artajs__tracking__footer__powered__by__text {\n color: #6f6c65;\n text-align: center;\n font-family: Helvetica;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n line-height: 150%;\n padding-top: 2px;\n}\n\n.artajs__drawer .artajs__tracking__footer__powered__by__logo {\n display: flex;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n color: #379464;\n}\n\n.artajs__drawer\n .artajs__tracking__footer__content:hover\n .artajs__tracking__footer__powered__by__text,\n.artajs__drawer\n .artajs__tracking__footer__content:hover\n .artajs__tracking__footer__powered__by__logo {\n color: #000;\n}\n\n/* Insurance box */\n.artajs__drawer .artajs__tracking__insurance__wrapper {\n display: flex;\n padding-top: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n align-self: stretch;\n border-top: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__insurance__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n gap: 2px;\n align-self: stretch;\n border-radius: 8px;\n}\n\n.artajs__drawer .artajs__tracking__insurance__title {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__insurance__body {\n display: flex;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__insurance__body__icon {\n color: var(--text-primary);\n display: flex;\n width: 18px;\n height: 20px;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n}\n\n.artajs__drawer .artajs__tracking__insurance__body__icon__text {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n cursor: pointer;\n}\n\n/* Summary styles */\n.artajs__drawer .artajs__tracking__summary__wrapper {\n display: flex;\n padding-top: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n align-self: stretch;\n border-top: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__summary__content {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__summary__date {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__summary__title {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n/* Exceptions */\n.artajs__drawer .artajs__tracking__exception__wrapper {\n display: flex;\n padding-bottom: 24px;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__exception__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 2px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__exception__title {\n color: var(--text-primary);\n text-align: center;\n align-self: stretch;\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__exception__cta {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n line-height: 150%;\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n align-self: stretch;\n cursor: pointer;\n}\n\n.artajs__drawer .artajs__tracking__delay__wrapper {\n display: flex;\n align-items: flex-start;\n justify-content: center;\n gap: 8px;\n padding: 0 16px 16px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__delay__text {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 1px);\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n\n/* Shipments Events List */\n\n.artajs__drawer .artajs__tracking__events__wrapper {\n display: flex;\n padding: 16px 0px;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n align-self: stretch;\n flex-grow: 1;\n overflow-y: auto;\n}\n\n.artajs__drawer .artajs__tracking__events__return {\n display: flex;\n padding: 0 24px 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n align-self: stretch;\n border-bottom: 1px solid var(--border);\n cursor: pointer;\n}\n\n.artajs__drawer .artajs__tracking__events__return__text {\n color: var(--text-primary);\n text-align: center;\n font-family: var(--font-family);\n font-style: normal;\n line-height: 150%;\n letter-spacing: 0.2px;\n text-decoration-line: underline;\n}\n\n.artajs__drawer .artajs__tracking__events__header {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n align-self: stretch;\n padding: 0 24px;\n}\n\n.artajs__drawer .artajs__tracking__events__header__title {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n /* 21px */\n letter-spacing: 0.2px;\n}\n\n/* Loading */\n\n.artajs__drawer .artajs__drawer__loading {\n position: absolute;\n top: 42%;\n left: 44%;\n transform: translate(-50%, -50%);\n height: 56px;\n width: 56px;\n box-sizing: border-box;\n background: conic-gradient(\n from 90deg at 50% 50%,\n rgba(39, 174, 96, 0) 0deg,\n rgba(31, 144, 255, 0) 0.04deg,\n var(--text-secondary) 360deg\n );\n border-radius: 56px;\n animation: 1s rotate infinite linear;\n}\n\n.artajs__drawer .artajs__drawer__loading::before {\n content: '';\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n height: 40px;\n width: 40px;\n background: var(--background);\n border-radius: 48px;\n}\n\n.artajs__drawer .artajs__drawer__loading::after {\n content: '';\n position: absolute;\n right: 0;\n top: 50%;\n transform: translateY(-50%);\n height: 8px;\n width: 8px;\n background: var(--text-secondary);\n border-radius: 8px;\n}\n\n@keyframes rotate {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\n/* Pill */\n.artajs__drawer .artajs__tracking__pill__wrapper {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.artajs__drawer .artajs__tracking__pill__round {\n display: flex;\n padding: 4px 8px;\n justify-content: center;\n align-items: center;\n gap: 8px;\n border-radius: 12px;\n}\n\n.artajs__drawer .artajs__tracking__pill__text {\n text-align: center;\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 3px);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__events__body {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n align-self: stretch;\n max-height: 100%;\n flex-grow: 1;\n}\n\n.artajs__drawer\n .artajs__tracking__events__body\n .artajs__tracking__footer__wrapper {\n padding: 16px 0 32px 0;\n}\n\n.artajs__drawer .artajs__tracking__events__group {\n align-self: stretch;\n display: flex;\n flex-direction: column;\n margin-left: 6px;\n padding: 0 24px;\n}\n\n.artajs__drawer .artajs__tracking__events__date {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n margin-bottom: 4px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__content {\n display: flex;\n flex-direction: row;\n gap: 2px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__item {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__number__primary {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n margin-top: 6px;\n min-width: 24px;\n text-align: end;\n}\n\n.artajs__drawer .artajs__tracking__events__group__number__secondary {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n margin-top: 6px;\n min-width: 24px;\n text-align: end;\n}\n\n.artajs__drawer .artajs__tracking__events__group__divider {\n display: flex;\n flex-direction: column;\n}\n\n.artajs__drawer .artajs__tracking__events__group__summary {\n display: flex;\n flex-direction: column;\n gap: 6px;\n margin-top: 6px;\n}\n\n.artajs__drawer .artajs__tracking__events__vertical {\n border-width: 1px;\n height: 100%;\n margin-top: 0;\n margin-bottom: 0;\n}\n\n.artajs__drawer .artajs__tracking__events__round {\n margin-top: 0;\n margin-bottom: 0;\n height: 30px;\n width: 30px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__location {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__location__secondary {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__time {\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: calc(var(--font-size) - 2px);\n font-style: normal;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__events__group__description {\n color: var(--text-primary);\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n line-height: 130%;\n letter-spacing: 0.2px;\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__card {\n display: flex;\n padding: 16px 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n border-radius: 8px;\n border: 1px solid var(--border);\n background: var(--background);\n box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__content {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__header {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 16px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__header__item {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n align-self: stretch;\n}\n\n.artajs__drawer .artajs__tracking__button {\n display: flex;\n padding: 6px 12px;\n justify-content: center;\n align-items: center;\n border-radius: 4px;\n font-size: calc(var(--font-size) - 1px);\n font-weight: bold;\n\n background: var(--button-background);\n border: 1px solid var(--button-border);\n color: var(--button-text);\n}\n\n.artajs__drawer .artajs__tracking__button:hover {\n background: var(--button-background-hover);\n border: 1px solid var(--button-border-hover);\n color: var(--button-text-hover);\n cursor: pointer;\n}\n\n.artajs__drawer .artajs__tracking__button__container {\n display: flex;\n padding-right: 16px;\n justify-content: center;\n align-items: center;\n gap: 10px;\n border-right: 1px solid var(--border);\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__exception__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 2px;\n}\n\n.artajs__drawer .artajs__tracking__select__shipment__exception__title {\n color: var(--text-primary);\n align-self: stretch;\n font-family: var(--font-family);\n font-size: var(--font-size);\n font-style: normal;\n font-weight: bold;\n line-height: 150%;\n letter-spacing: 0.2px;\n}\n";
|
|
6
6
|
|
|
7
7
|
exports.default = css;
|
|
@@ -50,7 +50,7 @@ export interface ArtaPackage {
|
|
|
50
50
|
handle_with_care: boolean;
|
|
51
51
|
is_sufficiently_packed: boolean;
|
|
52
52
|
eta: string;
|
|
53
|
-
status: 'unknown' | 'pending' | 'notfound' | 'transit' | 'out_for_delivery' | 'delivered' | 'undelivered' | 'exception' | 'expired';
|
|
53
|
+
status: 'unknown' | 'pending' | 'notfound' | 'transit' | 'out_for_delivery' | 'delivered' | 'undelivered' | 'exception' | 'expired' | 'collected' | 'review_packing' | 'packed' | 'label_ready' | 'cancelled';
|
|
54
54
|
objects: ArtaObject[];
|
|
55
55
|
packing_materials: string;
|
|
56
56
|
depth: number;
|
|
@@ -2,15 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
var jsxRuntime = require('preact/jsx-runtime');
|
|
4
4
|
var hooks = require('preact/hooks');
|
|
5
|
-
var index$
|
|
6
|
-
var index$
|
|
5
|
+
var index$5 = require('../ShipToFrom/index.js');
|
|
6
|
+
var index$6 = require('../Package/index.js');
|
|
7
7
|
var index$1 = require('../Timeline/index.js');
|
|
8
8
|
var index$3 = require('../TrackingTop/index.js');
|
|
9
|
-
var index$
|
|
10
|
-
var index$
|
|
11
|
-
var index$
|
|
9
|
+
var index$9 = require('../DrawerFooter/index.js');
|
|
10
|
+
var index$7 = require('../DrawerInsurance/index.js');
|
|
11
|
+
var index$8 = require('../Summary/index.js');
|
|
12
12
|
var index$2 = require('../ShipmentException/index.js');
|
|
13
13
|
var index = require('../PackageEvents/index.js');
|
|
14
|
+
var index$4 = require('../DeliveryDelay/index.js');
|
|
14
15
|
|
|
15
16
|
const hasActiveException = (shipment) => {
|
|
16
17
|
return (shipment.shipment_exceptions.some((ex) => ex.status !== 'resolved') &&
|
|
@@ -27,7 +28,7 @@ const TrackingShipment = ({ shipment, config, }) => {
|
|
|
27
28
|
if (packageId != null) {
|
|
28
29
|
return (jsxRuntime.jsx(index.PackageEvents, { packageId: packageId, shipment: shipment, config: config, setPackageId: setPackageId }));
|
|
29
30
|
}
|
|
30
|
-
return (jsxRuntime.jsxs("div", { class: "artajs__tracking__body", children: [jsxRuntime.jsx(index$1.Timeline, { shipment: shipment, config: config }), jsxRuntime.jsx("div", { class: "artajs__tracking__timeline__divider" }), hasActiveException(shipment) && (jsxRuntime.jsx(index$2.ShipmentException, { shipment: shipment, config: config })), jsxRuntime.jsx(index$3.TrackingTop, { config: config, shipment: shipment }), jsxRuntime.jsx(index$4.ShipToFrom, { config: config, shipment: shipment }), packagesWithObjects.map((pkg, index) => (jsxRuntime.jsx(index$
|
|
31
|
+
return (jsxRuntime.jsxs("div", { class: "artajs__tracking__body", children: [jsxRuntime.jsx(index$1.Timeline, { shipment: shipment, config: config }), jsxRuntime.jsx("div", { class: "artajs__tracking__timeline__divider" }), hasActiveException(shipment) && (jsxRuntime.jsx(index$2.ShipmentException, { shipment: shipment, config: config })), jsxRuntime.jsx(index$3.TrackingTop, { config: config, shipment: shipment }), jsxRuntime.jsx(index$4.DeliveryDelay, { config: config, shipment: shipment }), jsxRuntime.jsx(index$5.ShipToFrom, { config: config, shipment: shipment }), packagesWithObjects.map((pkg, index) => (jsxRuntime.jsx(index$6.Package, { title: `#${index + 1}`, pkg: pkg, shipment: shipment, config: config, setPackageId: setPackageId }))), shipment.insurance_policy != null && jsxRuntime.jsx(index$7.DrawerInsurance, {}), jsxRuntime.jsx(index$8.Summary, { config: config, shipment: shipment }), jsxRuntime.jsx(index$9.DrawerFooter, {})] }));
|
|
31
32
|
};
|
|
32
33
|
|
|
33
34
|
exports.TrackingShipment = TrackingShipment;
|
package/dist/trackingConfig.d.ts
CHANGED
|
@@ -108,6 +108,7 @@ export interface TrackingConfig {
|
|
|
108
108
|
shipmentExceptionDefaultLabel: string;
|
|
109
109
|
viewShipmentDetailLabel: string;
|
|
110
110
|
viewShipmentsListLabel: string;
|
|
111
|
+
deliveryDelayedLabel: string;
|
|
111
112
|
};
|
|
112
113
|
pill: {
|
|
113
114
|
unknown: PillConfig;
|
|
@@ -123,6 +124,9 @@ export interface TrackingConfig {
|
|
|
123
124
|
collected: PillConfig;
|
|
124
125
|
completed: PillConfig;
|
|
125
126
|
confirmed: PillConfig;
|
|
127
|
+
review_packing: PillConfig;
|
|
128
|
+
packed: PillConfig;
|
|
129
|
+
label_ready: PillConfig;
|
|
126
130
|
};
|
|
127
131
|
animation: {
|
|
128
132
|
in: AnimationConfig;
|
package/dist/trackingConfig.js
CHANGED
|
@@ -69,6 +69,7 @@ const defaultTrackingConfig = {
|
|
|
69
69
|
shipmentExceptionDefaultLabel: 'There is an exception with this shipment.',
|
|
70
70
|
viewShipmentDetailLabel: 'View Details',
|
|
71
71
|
viewShipmentsListLabel: '< All Shipments',
|
|
72
|
+
deliveryDelayedLabel: "There is a delay in delivery and we're working on it. We apologize for any inconvenience.",
|
|
72
73
|
dates: {
|
|
73
74
|
locale: navigator.language,
|
|
74
75
|
formatOptions: { dateStyle: 'medium' },
|
|
@@ -153,6 +154,21 @@ const defaultTrackingConfig = {
|
|
|
153
154
|
backgroundColor: '#D6EDE1',
|
|
154
155
|
text: 'Collected',
|
|
155
156
|
},
|
|
157
|
+
review_packing: {
|
|
158
|
+
textColor: '#173E2A',
|
|
159
|
+
backgroundColor: '#D6EDE1',
|
|
160
|
+
text: 'Packed',
|
|
161
|
+
},
|
|
162
|
+
packed: {
|
|
163
|
+
textColor: '#173E2A',
|
|
164
|
+
backgroundColor: '#D6EDE1',
|
|
165
|
+
text: 'Packed',
|
|
166
|
+
},
|
|
167
|
+
label_ready: {
|
|
168
|
+
textColor: '#173E2A',
|
|
169
|
+
backgroundColor: '#D6EDE1',
|
|
170
|
+
text: 'Collected',
|
|
171
|
+
},
|
|
156
172
|
completed: {
|
|
157
173
|
textColor: '#173E2A',
|
|
158
174
|
backgroundColor: '#D6EDE1',
|