Smtn International

\n {icon}\n

\n {label}\n

\n \n \n \n \n \n \n \n

\n \n {description && {description}}\n {errorMessage}\n \n );\n}",[],[160,178,185],{"_105":195,"_96":196,"_161":197,"_163":179,"_164":142,"_165":198,"_167":119,"_107":199,"_101":200,"_169":190,"_171":201,"_172":22,"_173":-5,"_174":202,"_99":203},"d823de64-d927-11f0-8448-42dde27851f2","PackageBarrels.tsx","477f01b8-d8af-11f0-9f0b-42dde27851f2",1704,["D",1765742560155],18,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { BarrelsNumberField } from \"./BarrelsNumberField.tsx\";\nimport {\n IconBarrel\n} from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\n\ninterface PackageBarrelsProps {\n fields: any;\n}\n\nexport function PackageBarrels(\n { fields }: PackageBarrelsProps,\n) {\n const barrelsFields = fields.barrels.getFieldset();\n\n return (\n

\n }\n label=\"Small\"\n name={barrelsFields.small.name}\n defaultValue={0}\n />\n }\n label=\"Large\"\n name={barrelsFields.large.name}\n defaultValue={0}\n />\n

\n );\n}",[],[160,178,196],[160,178],{"_105":206,"_96":207,"_161":208,"_163":162,"_164":142,"_165":209,"_167":119,"_107":210,"_101":166,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":211,"_99":231},"55843f8c-d8a8-11f0-87fb-42dde27851f2","PackageDescription","5274aa52-d8a8-11f0-b2fe-42dde27851f2",1584,["D",1765687794919],[212,221],{"_105":213,"_96":214,"_161":215,"_163":208,"_164":142,"_165":216,"_167":119,"_107":217,"_101":189,"_169":190,"_171":218,"_172":22,"_173":-5,"_174":219,"_99":220},"ce6eeb38-d8ab-11f0-a959-42dde27851f2","DescriptionTextField.tsx","94da3efa-d8aa-11f0-ac6a-42dde27851f2",1621,["D",1765689286279],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n FieldError,\n Label,\n NumberField as _NumberField,\n NumberFieldProps as _NumberFieldProps,\n Text,\n TextArea,\n TextField as _TextField,\n TextFieldProps,\n ValidationResult,\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\n\ninterface DescriptionTextFieldProps extends TextFieldProps {\n label?: string;\n description?: string;\n errorMessage?: string | ((validation: ValidationResult) => string);\n}\n\nexport function DescriptionTextField(\n { label, description, errorMessage, ...props }: DescriptionTextFieldProps,\n) {\n return (\n <_TextField {...props} className=\"flex flex-col w-full\">\n \n {label}\n \n \n {description && {description}}\n {errorMessage}\n \n );\n}",[],[160,207,214],{"_105":222,"_96":223,"_161":224,"_163":208,"_164":142,"_165":225,"_167":119,"_107":226,"_101":227,"_169":190,"_171":228,"_172":22,"_173":-5,"_174":229,"_99":230},"f3dc03a2-d927-11f0-b4df-42dde27851f2","PackageDescription.tsx","6c9ff79c-d8a8-11f0-8542-42dde27851f2",1705,["D",1765742606661],10,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { DescriptionTextField } from \"./DescriptionTextField.tsx\";\n\ninterface PackageDescriptionProps {\n fields: any;\n}\n\nexport function PackageDescription(\n { fields }: PackageDescriptionProps,\n) {\n const descriptionFields = fields.description.getFieldset();\n\n return (\n

\n \n

\n );\n}",[],[160,207,223],[160,207],{"_105":233,"_96":234,"_161":235,"_163":162,"_164":142,"_165":236,"_167":119,"_107":237,"_101":166,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":238,"_99":259},"70c4d088-d8ab-11f0-85e0-42dde27851f2","PackageDevices","019b0ec2-9667-7673-ba2a-26654cc2a668",1617,["D",1765689129137],[239,249],{"_105":240,"_96":241,"_161":242,"_163":235,"_164":142,"_165":243,"_167":119,"_107":244,"_101":245,"_169":190,"_171":246,"_172":22,"_173":-5,"_174":247,"_99":248},"deaa6712-d8aa-11f0-a959-42dde27851f2","DevicesNumberField.tsx","a496eeb8-d6c2-11f0-a1c7-42dde27851f2",1605,["D",1765688884017],2,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n Button,\n FieldError,\n Group,\n Input,\n Label,\n NumberField as _NumberField,\n NumberFieldProps as _NumberFieldProps,\n Text,\n TextArea,\n TextField as _TextField,\n TextFieldProps as _TextFieldProps,\n ValidationResult,\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\nimport {\n IconMinus,\n IconPlus,\n} from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\n\ninterface NumberFieldProps extends _NumberFieldProps {\n icon?: React.ReactNode;\n label?: string;\n description?: string;\n errorMessage?: string | ((validation: ValidationResult) => string);\n}\n\nexport function DevicesNumberField(\n { icon, label, description, errorMessage, ...props }: NumberFieldProps,\n) {\n return (\n <_NumberField\n {...props}\n minValue={0}\n className=\"flex flex-col w-full\"\n >\n \n

\n {icon}\n

\n {label}\n

\n \n \n \n \n \n \n \n

\n \n {description && {description}}\n {errorMessage}\n \n );\n}",[],[160,234,241],{"_105":250,"_96":251,"_161":252,"_163":235,"_164":142,"_165":253,"_167":119,"_107":254,"_101":255,"_169":190,"_171":256,"_172":22,"_173":-5,"_174":257,"_99":258},"5d3595b2-d8af-11f0-aa2a-42dde27851f2","PackageDevices.tsx","a49701e6-d6c2-11f0-a1c7-42dde27851f2",1635,["D",1765690814306],20,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { DevicesNumberField } from \"./DevicesNumberField.tsx\";\nimport {\n IconDeviceGamepad,\n IconDeviceIpad,\n IconDeviceLaptop,\n IconDeviceMobile,\n} from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\n\ninterface PackageDevicesProps {\n fields: any;\n}\n\nexport function PackageDevices(\n { fields }: PackageDevicesProps,\n) {\n const deviceFields = fields.devices.getFieldset();\n\n return (\n

\n }\n label=\"Consoles\"\n name={deviceFields.consoles.name}\n defaultValue={0}\n />\n }\n label=\"Laptops\"\n name={deviceFields.laptops.name}\n defaultValue={0}\n />\n }\n label=\"Tablets\"\n name={deviceFields.tablets.name}\n defaultValue={0}\n />\n }\n label=\"Phones\"\n name={deviceFields.phones.name}\n defaultValue={0}\n />\n

\n );\n}",[],[160,234,251],[160,234],{"_105":261,"_96":262,"_161":263,"_163":162,"_164":142,"_165":264,"_167":119,"_107":265,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":266,"_99":303},"a4972806-d6c2-11f0-a1c7-42dde27851f2","PackageDimensions","019b0ec2-9667-7673-ba2a-2abe6b0d9a62",1284,["D",1765479192170],[267,276,285,294],{"_105":268,"_96":269,"_161":270,"_163":263,"_164":142,"_165":271,"_167":119,"_107":272,"_101":166,"_169":190,"_171":273,"_172":22,"_173":-5,"_174":274,"_99":275},"1add8ba2-d729-11f0-9263-42dde27851f2","DimensionField.tsx","a49707d6-d6c2-11f0-a1c7-42dde27851f2",1447,["D",1765523199274],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n FieldError,\n Input,\n NumberField as _NumberField,\n NumberFieldProps as _NumberFieldProps,\n Text,\n ValidationResult,\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\n\ninterface NumberFieldProps extends _NumberFieldProps {\n label?: string;\n description?: string;\n errorMessage?: string | ((validation: ValidationResult) => string);\n}\n\nexport function DimensionField(\n { description, errorMessage, ...props }: NumberFieldProps,\n) {\n return (\n <_NumberField {...props} className=\"flex flex-col flex-1 min-w-0\">\n \n {description && {description}}\n {errorMessage}\n \n );\n}",[],[160,262,269],{"_105":277,"_96":278,"_161":279,"_163":263,"_164":142,"_165":280,"_167":119,"_107":281,"_101":166,"_169":190,"_171":282,"_172":22,"_173":-5,"_174":283,"_99":284},"ae8b3e6c-d6f2-11f0-8814-42dde27851f2","PackageDimensions.tsx","a49709f2-d6c2-11f0-a1c7-42dde27851f2",1376,["D",1765499824721],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n PackageFieldLabels,\n PackageField,\n} from \"./PackageField.tsx\";\nimport {\n IconMinus,\n IconPlus,\n} from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\n\ninterface PackageDimensionsProps {\n fields: any;\n form: any;\n}\n\nexport function PackageDimensions({\n fields,\n form,\n}: PackageDimensionsProps) {\n const packages = fields.packages.getFieldList();\n\n return (\n

\n {packages.map((p, index) => {\n const pFields = p.getFieldset();\n return (\n

\n \n

\n );\n })}\n

\n \n \n \n \n \n \n

\n );\n}",[],[160,262,278],{"_105":286,"_96":287,"_161":288,"_163":263,"_164":142,"_165":289,"_167":119,"_107":290,"_101":245,"_169":190,"_171":291,"_172":22,"_173":-5,"_174":292,"_99":293},"e70fa1c2-d6ef-11f0-ae37-42dde27851f2","PackageField.tsx","a4970c68-d6c2-11f0-a1c7-42dde27851f2",1341,["D",1765498631051],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { PackageNumberField } from \"./PackageNumberField.tsx\";\nimport { DimensionField } from \"./DimensionField.tsx\";\n\nexport const PackageFieldLabels = () => {\n return (\n

\n \n Quantity\n \n \n Weight (kg)\n \n \n Dimensions (in)\n \n

\n );\n};\n\nexport const PackageField = (\n { fields }: { fields: any },\n) => {\n return (\n

\n \n

\n\n

\n \n

\n\n

\n \n x\n \n x\n \n

\n );\n};",[],[160,262,287],{"_105":295,"_96":296,"_161":297,"_163":263,"_164":142,"_165":298,"_167":119,"_107":299,"_101":166,"_169":190,"_171":300,"_172":22,"_173":-5,"_174":301,"_99":302},"d472b6f8-d6ef-11f0-a95d-42dde27851f2","PackageNumberField.tsx","a4970e16-d6c2-11f0-a1c7-42dde27851f2",1339,["D",1765498599823],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n FieldError,\n Input,\n NumberField as _NumberField,\n NumberFieldProps as _NumberFieldProps,\n Text,\n ValidationResult,\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\n\ninterface NumberFieldProps extends _NumberFieldProps {\n label?: string;\n description?: string;\n errorMessage?: string | ((validation: ValidationResult) => string);\n}\n\nexport function PackageNumberField(\n { description, errorMessage, ...props }: NumberFieldProps,\n) {\n return (\n <_NumberField\n {...props}\n className=\"flex flex-col flex-1 min-w-0\"\n >\n \n {description && {description}}\n {errorMessage}\n \n );\n}",[],[160,262,296],[160,262],{"_105":305,"_96":306,"_161":307,"_163":162,"_164":142,"_165":264,"_167":119,"_107":308,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":309,"_99":379},"a497296e-d6c2-11f0-a1c7-42dde27851f2","PackageTrip","019b0ec2-9667-7673-ba2a-2ff9ac7b0340",["D",1765479192170],[310,320,330,340,350,359,369],{"_105":311,"_96":312,"_161":313,"_163":307,"_164":142,"_165":314,"_167":119,"_107":315,"_101":316,"_169":190,"_171":317,"_172":22,"_173":-5,"_174":318,"_99":319},"403cdf6a-d931-11f0-aa5c-42dde27851f2","DropOffTextField.tsx","7275b8a2-d720-11f0-8066-42dde27851f2",1713,["D",1765746600277],62,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport {\n IconMapPinFilled,\n IconPointFilled,\n} from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\nimport { PlacesTextField } from \"./PlacesTextField.tsx\";\nimport { OfficeItem, OfficeSelect } from \"./OfficeSelect.tsx\";\nimport { newHttpBatchRpcSession, RpcStub } from \"https://esm.sh/capnweb@0.2.0\";\nimport { useParams } from \"https://esm.sh/react-router?deps=react@18.2.0\";\n\ninterface API {\n getAvailableMethods(\n type: string,\n from: string,\n to: string,\n ): Promise;\n}\n\ninterface DropOffTextFieldProps {\n fields: any;\n setAvailableMethods: (methods: string[]) => void;\n}\n\nexport function DropOffTextField(\n { fields, setAvailableMethods }: DropOffTextFieldProps,\n) {\n const offices = [\n \"Toronto Office\",\n \"Lagos Office\",\n \"London Office\",\n \"Abuja Office\",\n ];\n\n const office = useParams().office;\n\n const defaultValue =\n offices.some((o) => o.toLowerCase().includes(office?.toLowerCase()))\n ? offices.find((o) => o.toLowerCase().includes(office?.toLowerCase()))\n : \"Toronto Office\";\n\n const tripFields = fields.trip.getFieldset();\n const [from, setFrom] = useState(defaultValue);\n const [to, setTo] = useState(\"\");\n\n async function handleSelect(from: string, to: string) {\n try {\n const api: RpcStub = newHttpBatchRpcSession(\n \"https://api.smtncargo.com\",\n );\n setFrom(from);\n setTo(to);\n const availableMethods = await api.getAvailableMethods(\n \"dropoff\",\n from,\n to,\n );\n setAvailableMethods(availableMethods);\n } catch (error) {\n console.error(\"API error:\", error);\n setAvailableMethods([]);\n }\n }\n\n return (\n

\n }\n placeholder=\"From\"\n onOfficeSelected={(office: string) => handleSelect(office, to)}\n defaultValue={defaultValue}\n >\n {offices.map((office) => (\n \n {office}\n \n ))}\n \n }\n placeholder=\"To\"\n onPlaceSelected={(place: string) => handleSelect(from, place)}\n />\n

\n );\n}",[],[160,306,312],{"_105":321,"_96":322,"_161":323,"_163":307,"_164":142,"_165":324,"_167":119,"_107":325,"_101":326,"_169":190,"_171":327,"_172":22,"_173":-5,"_174":328,"_99":329},"19d64a80-d825-11f0-b912-42dde27851f2","OfficeSelect.tsx","4ef24d3c-d72a-11f0-9ac9-42dde27851f2",1529,["D",1765631430726],40,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n Button,\n FieldError,\n Label,\n ListBox,\n ListBoxItem,\n Popover,\n Select,\n SelectValue,\n Text,\n ValidationResult,\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\nimport {\n IconChevronDown,\n} from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\n\ninterface OfficeSelectProps\n extends Omit, \"children\"> {\n label?: string;\n description?: string;\n errorMessage?: string | ((validation: ValidationResult) => string);\n items?: Iterable;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n icon?: React.ReactNode;\n placeholder?: string;\n onOfficeSelected?: (office: string) => void;\n}\n\nexport function OfficeSelect(\n {\n label,\n description,\n errorMessage,\n children,\n items,\n icon,\n placeholder,\n onOfficeSelected,\n ...props\n }: OfficeSelectProps,\n) {\n return (\n {\n if (onOfficeSelected && key) {\n onOfficeSelected(String(key));\n }\n }}\n >\n {label && {label}}\n

\n {icon && (\n

\n {icon}\n

\n )}\n \n \n {({ isPlaceholder, selectedText }) => (\n \n {isPlaceholder ? placeholder : selectedText}\n \n )}\n \n \n \n \n \n

\n {description && (\n \n {description}\n \n )}\n \n {errorMessage}\n \n \n \n {children}\n \n \n \n );\n}\n\ninterface OfficeItemProps extends React.ComponentProps {\n children: React.ReactNode;\n}\n\nexport function OfficeItem(props: OfficeItemProps) {\n return (\n \n `px-4 py-3 cursor-pointer text-sm outline-none ${\n isFocused ? \"bg-gray-100\" : \"\"\n } ${isSelected ? \"bg-blue-50 text-blue-700 font-medium\" : \"\"}`}\n />\n );\n}",[],[160,306,322],{"_105":331,"_96":332,"_161":333,"_163":307,"_164":142,"_165":334,"_167":22,"_107":335,"_101":336,"_169":190,"_171":337,"_172":22,"_173":-5,"_174":338,"_99":339},"6e6e2c06-dae7-11f0-9a1d-42dde27851f2","PackageTrip.tsx","a4970f88-d6c2-11f0-a1c7-42dde27851f2",1742,["D",1765934797339],30,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport { DropOffTextField } from \"./DropOffTextField.tsx\";\nimport { PickUpTextField } from \"./PickUpTextField.tsx\";\nimport { TripMethodSegmentedControl } from \"./TripMethodSegmentedControl.tsx\";\nimport { TripTypeSegmentedControl } from \"./TripTypeSegmentedControl.tsx\";\n\ninterface PackageTripProps {\n fields: any;\n setMethod?: (method: string) => void;\n}\n\nexport function PackageTrip({ fields, setMethod }: PackageTripProps) {\n const tripFields = fields.trip.getFieldset();\n const [type, setType] = useState(\"dropoff\");\n const [availableMethods, setAvailableMethods] = useState([]);\n \n const handleTypeChange = (newType: string) => {\n setType(newType);\n setAvailableMethods([]);\n if (setMethod) {\n setMethod(\"\");\n }\n };\n \n return (\n

\n \n {type === \"dropoff\"\n ? (\n \n )\n : (\n \n )}\n \n

\n );\n}",[],[160,306,332],{"_105":341,"_96":342,"_161":343,"_163":307,"_164":142,"_165":344,"_167":119,"_107":345,"_101":346,"_169":190,"_171":347,"_172":22,"_173":-5,"_174":348,"_99":349},"b5aa9168-d894-11f0-bdc6-42dde27851f2","PickUpTextField.tsx","80276d2e-d720-11f0-bd39-42dde27851f2",1562,["D",1765679366302],14,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport {\n IconMapPinFilled,\n IconPointFilled,\n} from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\nimport { PlacesTextField } from \"./PlacesTextField.tsx\";\nimport { newHttpBatchRpcSession, RpcStub } from \"https://esm.sh/capnweb@0.2.0\";\n\ninterface API {\n getAvailableMethods(\n type: string,\n from: string,\n to: string,\n ): Promise;\n}\n\ninterface PickUpTextFieldProps {\n fields: any;\n setAvailableMethods: (methods: string[]) => void;\n}\n\nexport function PickUpTextField(\n { fields, setAvailableMethods }: PickUpTextFieldProps,\n) {\n const tripFields = fields.trip.getFieldset();\n const [from, setFrom] = useState(\"\");\n const [to, setTo] = useState(\"\");\n\n async function handleSelect(from: string, to: string) {\n try {\n const api: RpcStub = newHttpBatchRpcSession(\n \"https://api.smtncargo.com\",\n );\n setFrom(from);\n setTo(to);\n const availableMethods = await api.getAvailableMethods(\n \"pickup\",\n from,\n to,\n );\n setAvailableMethods(availableMethods);\n } catch (error) {\n console.error(\"API error:\", error);\n setAvailableMethods([]);\n }\n }\n\n return (\n

\n }\n placeholder=\"From\"\n onPlaceSelected={(place: string) => handleSelect(place, to)}\n />\n }\n placeholder=\"To\"\n onPlaceSelected={(place: string) => handleSelect(from, place)}\n />\n

\n );\n}",[],[160,306,342],{"_105":351,"_96":352,"_161":353,"_163":307,"_164":142,"_165":354,"_167":119,"_107":355,"_101":200,"_169":190,"_171":356,"_172":22,"_173":-5,"_174":357,"_99":358},"1316f2c0-d727-11f0-bd8c-42dde27851f2","PlacesTextField.tsx","a4971208-d6c2-11f0-a1c7-42dde27851f2",1430,["D",1765522327238],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { newHttpBatchRpcSession, RpcStub } from \"https://esm.sh/capnweb@0.2.0\";\nimport { useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport {\n FieldError,\n Input,\n Text,\n TextField as _TextField,\n TextFieldProps as _TextFieldProps,\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\n\ninterface API {\n getPlaceSuggestions(\n input: string,\n ): Promise>;\n}\n\ninterface PlacesTextFieldProps extends _TextFieldProps {\n description?: string;\n errorMessage?: string;\n icon?: React.ReactNode;\n onPlaceSelected?: (place: string) => void;\n placeholder?: string;\n defaultValue?: string;\n}\n\nexport function PlacesTextField(\n { description, errorMessage, icon, onPlaceSelected, ...props }:\n PlacesTextFieldProps,\n) {\n const [value, setValue] = useState(props.defaultValue || \"\");\n const [suggestions, setSuggestions] = useState<\n Array<{ description: string; placeId: string }>\n >([]);\n const lastSelectedRef = useRef(props.defaultValue || \"\");\n\n async function handleInputChange(value: string) {\n setValue(value);\n if (value.length < 2) {\n setSuggestions([]);\n return;\n }\n try {\n const api: RpcStub = newHttpBatchRpcSession(\n \"https://api.smtncargo.com\",\n );\n const results = await api.getPlaceSuggestions(value);\n setSuggestions(results);\n } catch (error) {\n console.error(\"API error:\", error);\n setSuggestions([]);\n }\n }\n\n function selectPlace(description: string) {\n setValue(description);\n lastSelectedRef.current = description;\n setSuggestions([]);\n onPlaceSelected?.(description);\n }\n\n function handleBlur() {\n // Small timeout to allow click on suggestion to register first\n setTimeout(() => {\n if (suggestions.length > 0) {\n setValue(lastSelectedRef.current);\n setSuggestions([]);\n }\n }, 150);\n }\n\n return (\n <_TextField\n {...props}\n className=\"flex flex-col w-full my-1\"\n value={value}\n >\n

\n {icon && (\n

\n {icon}\n

\n )}\n handleInputChange(e.target.value)}\n onBlur={handleBlur}\n />\n {suggestions.length > 0 && (\n

\n {suggestions.map((suggestion) => (\n {\n e.preventDefault(); // Prevents blur from firing\n selectPlace(suggestion.description);\n }}\n >\n {suggestion.description}\n

\n ))}\n

\n )}\n \n {description && {description}}\n {errorMessage}\n \n );\n}",[],[160,306,352],{"_105":360,"_96":361,"_161":362,"_163":307,"_164":142,"_165":363,"_167":119,"_107":364,"_101":365,"_169":190,"_171":366,"_172":22,"_173":-5,"_174":367,"_99":368},"43b31b5e-d928-11f0-b815-42dde27851f2","TripMethodSegmentedControl.tsx","a497167c-d6c2-11f0-a1c7-42dde27851f2",1708,["D",1765742740615],21,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n FieldError,\n Radio,\n RadioGroup,\n RadioGroupProps as _RadioGroupProps,\n Text,\n ValidationResult,\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\n\ninterface RadioGroupProps extends _RadioGroupProps {\n description?: string;\n errorMessage?: string | ((validation: ValidationResult) => string);\n availableMethods?: string[];\n setMethod?: (method: string) => void;\n}\n\nexport function TripMethodSegmentedControl({\n description,\n errorMessage,\n availableMethods,\n setMethod,\n ...props\n}: RadioGroupProps) {\n return (\n {\n if (setMethod) {\n setMethod(value);\n }\n }}\n >\n

\n \n \n Smtn Air\n 5-10 days\n \n \n \n \n Smtn Freight\n \n 2 months\n \n \n \n \n Smtn Courier\n \n 1-2 days\n \n

\n {description && (\n \n {description}\n \n )}\n \n {errorMessage}\n \n \n );\n}",[],[160,306,361],{"_105":370,"_96":371,"_161":372,"_163":307,"_164":142,"_165":373,"_167":22,"_107":374,"_101":375,"_169":190,"_171":376,"_172":22,"_173":-5,"_174":377,"_99":378},"f7566530-d757-11f0-acc7-42dde27851f2","TripTypeSegmentedControl.tsx","a4972054-d6c2-11f0-a1c7-42dde27851f2",1502,["D",1765543326017],6,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n FieldError,\n Radio,\n RadioGroup,\n RadioGroupProps as _RadioGroupProps,\n Text,\n ValidationResult,\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\n\ninterface RadioGroupProps extends _RadioGroupProps {\n description?: string;\n errorMessage?: string | ((validation: ValidationResult) => string);\n onChange?: (value: string) => void;\n}\n\nexport function TripTypeSegmentedControl({\n description,\n errorMessage,\n onChange,\n ...props\n}: RadioGroupProps) {\n return (\n \n

\n \n Drop Off\n \n \n Pick Up\n \n

\n {description && (\n \n {description}\n \n )}\n \n {errorMessage}\n \n \n );\n}",[],[160,306,371],[160,306],[160],{"_105":382,"_96":383,"_161":384,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":385,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":386,"_99":404},"c01e974c-c1c0-11f0-a93a-42dde27851f2","routes","019a8516-0817-70d9-9aec-f538aacf26ee",["D",1763169404921],[387,396],{"_105":388,"_96":389,"_161":390,"_163":384,"_164":142,"_165":102,"_167":22,"_107":391,"_101":392,"_169":190,"_171":393,"_172":22,"_173":-5,"_174":394,"_99":395},"3692165a-db0d-11f0-a46f-42dde27851f2","_index.tsx","019a8516-0817-70d9-9aec-f349de4a0b64",["D",1765951024497],176,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { db } from \"../instant.ts\";\nimport { useForm } from \"https://esm.sh/@conform-to/react@1.2.2?deps=react@18.2.0\";\nimport { parseWithZod } from \"https://esm.sh/@conform-to/zod@1.2.2?deps=react@18.2.0,zod@3.24.1\";\nimport { z } from \"https://esm.sh/zod@3.24.1?deps=react@18.2.0\";\nimport { PackageBarrels } from \"../components/PackageBarrels/PackageBarrels.tsx\";\nimport { PackageDimensions } from \"../components/PackageDimensions/PackageDimensions.tsx\";\nimport { PackageDevices } from \"../components/PackageDevices/PackageDevices.tsx\";\nimport { PackageDescription } from \"../components/PackageDescription/PackageDescription.tsx\";\nimport { PackageTrip } from \"../components/PackageTrip/PackageTrip.tsx\";\nimport { IconHelp } from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport { newHttpBatchRpcSession, RpcStub } from \"https://esm.sh/capnweb@0.2.0\";\nimport { useNavigate } from \"https://esm.sh/react-router?deps=react@18.2.0\";\n\nconst schema = z.object({\n packages: z.array(\n z.object({\n quantity: z.coerce.number().min(1, \"Quantity must be at least 1\"),\n weight: z.coerce.number().min(1, \"Weight must be at least 1\"),\n height: z.coerce.number().min(1, \"Height must be at least 1\"),\n width: z.coerce.number().min(1, \"Width must be at least 1\"),\n length: z.coerce.number().min(1, \"Length must be at least 1\"),\n }),\n ).min(1, \"At least one package is required\"),\n barrels: z.object({\n small: z.coerce.number().min(0, \"Cannot be negative\").default(0),\n large: z.coerce.number().min(0, \"Cannot be negative\").default(0),\n }).default({ small: 0, large: 0 }),\n description: z.object({\n description: z.string().default(\"\"),\n }).default({ description: \"\" }),\n devices: z.object({\n consoles: z.coerce.number().min(0, \"Cannot be negative\").default(0),\n phones: z.coerce.number().min(0, \"Cannot be negative\").default(0),\n tablets: z.coerce.number().min(0, \"Cannot be negative\").default(0),\n laptops: z.coerce.number().min(0, \"Cannot be negative\").default(0),\n }).default({ consoles: 0, phones: 0, tablets: 0, laptops: 0 }),\n trip: z.object({\n from: z.string().min(1, \"Origin location is required\"),\n to: z.string().min(1, \"Destination location is required\"),\n method: z.enum([\"air\", \"ocean\", \"courier\"], {\n errorMap: () => ({ message: \"Please select a shipping method\" }),\n }),\n type: z.enum([\"dropoff\", \"pickup\"]).default(\"dropoff\"),\n }),\n});\n\ninterface API {\n submit(deviceId: string, payload: any): Promise;\n}\n\nexport const Index = () => {\n const deviceId = db.useLocalId(\"device\");\n const navigate = useNavigate();\n\n const { isLoading, error, data } = db.useQuery({\n activities: {},\n devices: {\n $: {\n where: {\n id: deviceId || \"\",\n },\n },\n users: {},\n },\n });\n\n const [form, fields] = useForm({\n shouldValidate: \"onBlur\",\n shouldRevalidate: \"onInput\",\n defaultValue: {\n packages: [{ quantity: 1, weight: 1, height: 1, width: 1, length: 1 }],\n barrels: { small: 0, large: 0 },\n description: { description: \"\" },\n devices: { consoles: 0, phones: 0, tablets: 0, laptops: 0 },\n trip: { from: \"\", to: \"\", method: \"\", type: \"dropoff\" },\n },\n onValidate({ formData }) {\n return parseWithZod(formData, { schema });\n },\n async onSubmit(event, { submission }) {\n event.preventDefault();\n if (submission?.status === \"success\") {\n try {\n const api: RpcStub = newHttpBatchRpcSession(\n \"https://api.smtncargo.com\",\n );\n const checkoutLink = await api.submit(deviceId, submission.value);\n navigate(checkoutLink);\n } catch (error) {\n console.error(\"API error:\", error);\n }\n }\n },\n });\n\n const [method, setMethod] = useState(\"\");\n\n if (isLoading) {\n return (\n

\n );\n }\n\n if (error) return

An error occurred, please try again later

;\n\n const { activities, devices } = data;\n\n return (\n

\n \n

\n \n \n \n \n

\n\n \n\n {/* Display trip-level errors */}\n {fields.trip.errors && (\n

\n {fields.trip.errors}\n

\n )}\n\n {(() => {\n switch (method) {\n case \"air\":\n return (\n

\n \n \n \n

\n );\n case \"ocean\":\n return (\n

\n \n \n \n

\n );\n case \"courier\":\n return (\n

\n \n \n

\n );\n default:\n return null;\n }\n })()}\n\n \n Submit\n \n \n

\n );\n};\n\nexport default Index;",[],[383,389],{"_105":397,"_96":398,"_161":399,"_163":384,"_164":142,"_165":400,"_167":22,"_107":401,"_101":166,"_169":190,"_171":73,"_172":22,"_173":-5,"_174":402,"_99":403},"9d04a5d6-cd04-11f0-9ee1-42dde27851f2","track.tsx","9a21704c-cd04-11f0-90a4-42dde27851f2",1037,["D",1764408014620],[],[383,398],[383],{"_105":406,"_96":407,"_161":117,"_163":-5,"_164":142,"_165":408,"_167":22,"_107":409,"_101":410,"_169":411,"_171":412,"_172":22,"_173":97,"_174":413,"_99":414},"011e203c-d927-11f0-9e84-42dde27851f2","index.tsx",1700,["D",1765742199406],55,"http","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Hono } from \"https://esm.sh/hono?bundle-deps&deps=react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { renderToString } from \"https://esm.sh/react-dom@18.2.0/server\";\nimport {\n BrowserRouter,\n Route,\n Routes,\n} from \"https://esm.sh/react-router?deps=react@18.2.0\";\n\nimport Index from \"./routes/_index.tsx\";\n\n/* -----------------------------\n * APP (Used by both server + client)\n * ----------------------------- */\nconst App = () => {\n if (typeof window === \"undefined\") {\n return (\n

\n );\n }\n\n return (\n \n \n } />\n } />\n } />\n \n \n );\n};\n\n/* -----------------------------\n * CLIENT ENTRY\n * ----------------------------- */\nfunction client() {\n const root = document.getElementById(\"root\");\n if (root) {\n createRoot(root).render();\n }\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\n/* -----------------------------\n * SERVER SSR\n * ----------------------------- */\n\nconst app = new Hono();\n\nconst renderPage = () => {\n const html = renderToString(\n \n \n \n \n Smtn International\n \n \n \n \n \n

\n \n \n \n

\n \n \n ,\n );\n\n return \"\" + html;\n};\n\napp.get(\"*\", (c) => {\n return c.html(renderPage());\n});\n\nexport default app.fetch;",[],[407],{"_105":416,"_96":417,"_161":418,"_163":-5,"_164":142,"_165":419,"_167":22,"_107":420,"_101":421,"_169":190,"_171":422,"_172":22,"_173":-5,"_174":423,"_99":424},"540b7d84-d93c-11f0-9bd3-42dde27851f2","instant.ts","019a8516-0817-70d9-9aec-fd891d527376",1715,["D",1765751357960],7,"import { init } from \"https://esm.sh/@instantdb/react@0.22.48?bundle-deps&deps=react@18.2.0\";\n\nexport const db = typeof window === \"undefined\"\n ? null\n : init({ appId: \"7b35af25-09c0-4433-a004-c9d566cc8bb4\" });",[],[417],"files",[158,176,183,194,205,212,221,232,239,249,260,267,276,285,294,304,310,320,330,340,350,359,369,381,387,396,405,415],"counts",{"_429":32,"_430":166,"_431":32,"_432":433},"pulls","branches","forks","envVars",{"_434":32,"_435":32},"count","emptyCount","contents",[],"file",{"_105":222,"_96":223,"_161":224,"_163":208,"_164":142,"_165":225,"_167":119,"_107":440,"_101":227,"_169":190,"_171":228,"_172":22,"_173":-5,"_99":441},["D",1765742606661],[160,207,223],"upstreamProject",{"_105":151,"_96":444,"_113":-5,"_114":-5,"_111":149,"_23":445},"reactHonoReactRouterStarter",{"_94":95,"_134":135},"upstreamBranch",{"_105":145,"_107":448,"_449":450,"_96":44,"_143":151,"_101":451,"_144":-5,"_146":-5,"_452":-5,"_109":-5,"_155":22,"_111":149,"_154":95,"_16":123,"_153":444},["D",1763136446372],"updatedAt",["D",1766464457054],118,"lockfileKey","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_94":95,"_96":97,"_98":44,"_101":102,"_99":100,"_103":459,"_156":464,"_425":549,"_438":550,"_436":552,"_553":554,"_557":-5,"_558":559,"_560":561,"_562":563,"_432":-5},{"_105":106,"_96":97,"_107":460,"_109":-5,"_110":22,"_111":112,"_113":-5,"_114":-5,"_14":115,"_116":117,"_118":119,"_120":119,"_121":-5,"_122":32,"_16":123,"_124":125,"_126":125,"_127":128,"_129":128,"_130":128,"_131":125,"_132":125,"_23":461,"_136":462,"_139":463,"_155":22},["D",1763169404921],{"_94":95,"_134":135},{"_94":95,"_138":135,"_14":115},{"_101":141,"_96":44,"_105":142,"_143":106,"_144":145,"_146":147,"_148":149,"_150":151,"_152":123,"_153":97,"_154":95},[465,534,543,546],{"_105":159,"_96":160,"_161":162,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":168,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":466,"_99":533},[467,476,485,494,509],{"_105":177,"_96":178,"_161":179,"_163":162,"_164":142,"_165":180,"_167":119,"_107":181,"_101":166,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":468,"_99":475},[469,472],{"_105":184,"_96":185,"_161":186,"_163":179,"_164":142,"_165":187,"_167":119,"_107":188,"_101":189,"_169":190,"_171":191,"_172":22,"_173":-5,"_174":470,"_99":471},[],[160,178,185],{"_105":195,"_96":196,"_161":197,"_163":179,"_164":142,"_165":198,"_167":119,"_107":199,"_101":200,"_169":190,"_171":201,"_172":22,"_173":-5,"_174":473,"_99":474},[],[160,178,196],[160,178],{"_105":206,"_96":207,"_161":208,"_163":162,"_164":142,"_165":209,"_167":119,"_107":210,"_101":166,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":477,"_99":484},[478,481],{"_105":213,"_96":214,"_161":215,"_163":208,"_164":142,"_165":216,"_167":119,"_107":217,"_101":189,"_169":190,"_171":218,"_172":22,"_173":-5,"_174":479,"_99":480},[],[160,207,214],{"_105":222,"_96":223,"_161":224,"_163":208,"_164":142,"_165":225,"_167":119,"_107":226,"_101":227,"_169":190,"_171":228,"_172":22,"_173":-5,"_174":482,"_99":483},[],[160,207,223],[160,207],{"_105":233,"_96":234,"_161":235,"_163":162,"_164":142,"_165":236,"_167":119,"_107":237,"_101":166,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":486,"_99":493},[487,490],{"_105":240,"_96":241,"_161":242,"_163":235,"_164":142,"_165":243,"_167":119,"_107":244,"_101":245,"_169":190,"_171":246,"_172":22,"_173":-5,"_174":488,"_99":489},[],[160,234,241],{"_105":250,"_96":251,"_161":252,"_163":235,"_164":142,"_165":253,"_167":119,"_107":254,"_101":255,"_169":190,"_171":256,"_172":22,"_173":-5,"_174":491,"_99":492},[],[160,234,251],[160,234],{"_105":261,"_96":262,"_161":263,"_163":162,"_164":142,"_165":264,"_167":119,"_107":265,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":495,"_99":508},[496,499,502,505],{"_105":268,"_96":269,"_161":270,"_163":263,"_164":142,"_165":271,"_167":119,"_107":272,"_101":166,"_169":190,"_171":273,"_172":22,"_173":-5,"_174":497,"_99":498},[],[160,262,269],{"_105":277,"_96":278,"_161":279,"_163":263,"_164":142,"_165":280,"_167":119,"_107":281,"_101":166,"_169":190,"_171":282,"_172":22,"_173":-5,"_174":500,"_99":501},[],[160,262,278],{"_105":286,"_96":287,"_161":288,"_163":263,"_164":142,"_165":289,"_167":119,"_107":290,"_101":245,"_169":190,"_171":291,"_172":22,"_173":-5,"_174":503,"_99":504},[],[160,262,287],{"_105":295,"_96":296,"_161":297,"_163":263,"_164":142,"_165":298,"_167":119,"_107":299,"_101":166,"_169":190,"_171":300,"_172":22,"_173":-5,"_174":506,"_99":507},[],[160,262,296],[160,262],{"_105":305,"_96":306,"_161":307,"_163":162,"_164":142,"_165":264,"_167":119,"_107":308,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":510,"_99":532},[511,514,517,520,523,526,529],{"_105":311,"_96":312,"_161":313,"_163":307,"_164":142,"_165":314,"_167":119,"_107":315,"_101":316,"_169":190,"_171":317,"_172":22,"_173":-5,"_174":512,"_99":513},[],[160,306,312],{"_105":321,"_96":322,"_161":323,"_163":307,"_164":142,"_165":324,"_167":119,"_107":325,"_101":326,"_169":190,"_171":327,"_172":22,"_173":-5,"_174":515,"_99":516},[],[160,306,322],{"_105":331,"_96":332,"_161":333,"_163":307,"_164":142,"_165":334,"_167":22,"_107":335,"_101":336,"_169":190,"_171":337,"_172":22,"_173":-5,"_174":518,"_99":519},[],[160,306,332],{"_105":341,"_96":342,"_161":343,"_163":307,"_164":142,"_165":344,"_167":119,"_107":345,"_101":346,"_169":190,"_171":347,"_172":22,"_173":-5,"_174":521,"_99":522},[],[160,306,342],{"_105":351,"_96":352,"_161":353,"_163":307,"_164":142,"_165":354,"_167":119,"_107":355,"_101":200,"_169":190,"_171":356,"_172":22,"_173":-5,"_174":524,"_99":525},[],[160,306,352],{"_105":360,"_96":361,"_161":362,"_163":307,"_164":142,"_165":363,"_167":119,"_107":364,"_101":365,"_169":190,"_171":366,"_172":22,"_173":-5,"_174":527,"_99":528},[],[160,306,361],{"_105":370,"_96":371,"_161":372,"_163":307,"_164":142,"_165":373,"_167":22,"_107":374,"_101":375,"_169":190,"_171":376,"_172":22,"_173":-5,"_174":530,"_99":531},[],[160,306,371],[160,306],[160],{"_105":382,"_96":383,"_161":384,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":385,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":535,"_99":542},[536,539],{"_105":388,"_96":389,"_161":390,"_163":384,"_164":142,"_165":102,"_167":22,"_107":391,"_101":392,"_169":190,"_171":393,"_172":22,"_173":-5,"_174":537,"_99":538},[],[383,389],{"_105":397,"_96":398,"_161":399,"_163":384,"_164":142,"_165":400,"_167":22,"_107":401,"_101":166,"_169":190,"_171":73,"_172":22,"_173":-5,"_174":540,"_99":541},[],[383,398],[383],{"_105":406,"_96":407,"_161":117,"_163":-5,"_164":142,"_165":408,"_167":22,"_107":409,"_101":410,"_169":411,"_171":412,"_172":22,"_173":97,"_174":544,"_99":545},[],[407],{"_105":416,"_96":417,"_161":418,"_163":-5,"_164":142,"_165":419,"_167":22,"_107":420,"_101":421,"_169":190,"_171":422,"_172":22,"_173":-5,"_174":547,"_99":548},[],[417],[465,467,469,472,476,478,481,485,487,490,494,496,499,502,505,509,511,514,517,520,523,526,529,534,536,539,543,546],{"_105":222,"_96":223,"_161":224,"_163":208,"_164":142,"_165":225,"_167":119,"_107":440,"_101":227,"_169":190,"_171":228,"_172":22,"_173":-5,"_99":551},[160,207,223],[],"upstream",{"_105":145,"_107":555,"_449":556,"_96":44,"_143":151,"_101":451,"_144":-5,"_146":-5,"_452":-5,"_109":-5,"_155":22,"_111":149,"_154":95,"_16":123,"_153":444},["D",1763136446372],["D",1766464457054],"pull","ahead",1776,"behind",35,"templates",[],"actionData","errors"]

vawogbemi

smtn