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}",[],[159,177,184],{"_104":194,"_96":195,"_160":196,"_162":178,"_163":141,"_164":197,"_166":118,"_106":198,"_101":199,"_168":189,"_170":200,"_171":22,"_172":-5,"_173":201,"_99":202},"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}",[],[159,177,195],[159,177],{"_104":205,"_96":206,"_160":207,"_162":161,"_163":141,"_164":208,"_166":118,"_106":209,"_101":165,"_168":169,"_170":-5,"_171":22,"_172":-5,"_173":210,"_99":230},"55843f8c-d8a8-11f0-87fb-42dde27851f2","PackageDescription","5274aa52-d8a8-11f0-b2fe-42dde27851f2",1584,["D",1765687794919],[211,220],{"_104":212,"_96":213,"_160":214,"_162":207,"_163":141,"_164":215,"_166":118,"_106":216,"_101":188,"_168":189,"_170":217,"_171":22,"_172":-5,"_173":218,"_99":219},"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}",[],[159,206,213],{"_104":221,"_96":222,"_160":223,"_162":207,"_163":141,"_164":224,"_166":118,"_106":225,"_101":226,"_168":189,"_170":227,"_171":22,"_172":-5,"_173":228,"_99":229},"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}",[],[159,206,222],[159,206],{"_104":232,"_96":233,"_160":234,"_162":161,"_163":141,"_164":235,"_166":118,"_106":236,"_101":165,"_168":169,"_170":-5,"_171":22,"_172":-5,"_173":237,"_99":258},"70c4d088-d8ab-11f0-85e0-42dde27851f2","PackageDevices","019b0ec2-9667-7673-ba2a-26654cc2a668",1617,["D",1765689129137],[238,248],{"_104":239,"_96":240,"_160":241,"_162":234,"_163":141,"_164":242,"_166":118,"_106":243,"_101":244,"_168":189,"_170":245,"_171":22,"_172":-5,"_173":246,"_99":247},"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}",[],[159,233,240],{"_104":249,"_96":250,"_160":251,"_162":234,"_163":141,"_164":252,"_166":118,"_106":253,"_101":254,"_168":189,"_170":255,"_171":22,"_172":-5,"_173":256,"_99":257},"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}",[],[159,233,250],[159,233],{"_104":260,"_96":261,"_160":262,"_162":161,"_163":141,"_164":263,"_166":118,"_106":264,"_101":32,"_168":169,"_170":-5,"_171":22,"_172":-5,"_173":265,"_99":302},"a4972806-d6c2-11f0-a1c7-42dde27851f2","PackageDimensions","019b0ec2-9667-7673-ba2a-2abe6b0d9a62",1284,["D",1765479192170],[266,275,284,293],{"_104":267,"_96":268,"_160":269,"_162":262,"_163":141,"_164":270,"_166":118,"_106":271,"_101":165,"_168":189,"_170":272,"_171":22,"_172":-5,"_173":273,"_99":274},"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}",[],[159,261,268],{"_104":276,"_96":277,"_160":278,"_162":262,"_163":141,"_164":279,"_166":118,"_106":280,"_101":165,"_168":189,"_170":281,"_171":22,"_172":-5,"_173":282,"_99":283},"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}",[],[159,261,277],{"_104":285,"_96":286,"_160":287,"_162":262,"_163":141,"_164":288,"_166":118,"_106":289,"_101":244,"_168":189,"_170":290,"_171":22,"_172":-5,"_173":291,"_99":292},"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};",[],[159,261,286],{"_104":294,"_96":295,"_160":296,"_162":262,"_163":141,"_164":297,"_166":118,"_106":298,"_101":165,"_168":189,"_170":299,"_171":22,"_172":-5,"_173":300,"_99":301},"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}",[],[159,261,295],[159,261],{"_104":304,"_96":305,"_160":306,"_162":161,"_163":141,"_164":263,"_166":118,"_106":307,"_101":32,"_168":169,"_170":-5,"_171":22,"_172":-5,"_173":308,"_99":378},"a497296e-d6c2-11f0-a1c7-42dde27851f2","PackageTrip","019b0ec2-9667-7673-ba2a-2ff9ac7b0340",["D",1765479192170],[309,319,329,339,349,358,368],{"_104":310,"_96":311,"_160":312,"_162":306,"_163":141,"_164":313,"_166":118,"_106":314,"_101":315,"_168":189,"_170":316,"_171":22,"_172":-5,"_173":317,"_99":318},"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}",[],[159,305,311],{"_104":320,"_96":321,"_160":322,"_162":306,"_163":141,"_164":323,"_166":118,"_106":324,"_101":325,"_168":189,"_170":326,"_171":22,"_172":-5,"_173":327,"_99":328},"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}",[],[159,305,321],{"_104":330,"_96":331,"_160":332,"_162":306,"_163":141,"_164":333,"_166":118,"_106":334,"_101":335,"_168":189,"_170":336,"_171":22,"_172":-5,"_173":337,"_99":338},"ba8c1e3a-db42-11f0-bab8-42dde27851f2","PackageTrip.tsx","a4970f88-d6c2-11f0-a1c7-42dde27851f2",1776,["D",1765974009235],34,"/** @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}",[],[159,305,331],{"_104":340,"_96":341,"_160":342,"_162":306,"_163":141,"_164":343,"_166":118,"_106":344,"_101":345,"_168":189,"_170":346,"_171":22,"_172":-5,"_173":347,"_99":348},"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}",[],[159,305,341],{"_104":350,"_96":351,"_160":352,"_162":306,"_163":141,"_164":353,"_166":118,"_106":354,"_101":199,"_168":189,"_170":355,"_171":22,"_172":-5,"_173":356,"_99":357},"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}",[],[159,305,351],{"_104":359,"_96":360,"_160":361,"_162":306,"_163":141,"_164":362,"_166":118,"_106":363,"_101":364,"_168":189,"_170":365,"_171":22,"_172":-5,"_173":366,"_99":367},"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}",[],[159,305,360],{"_104":369,"_96":370,"_160":371,"_162":306,"_163":141,"_164":372,"_166":118,"_106":373,"_101":374,"_168":189,"_170":375,"_171":22,"_172":-5,"_173":376,"_99":377},"79bce27c-db42-11f0-a946-42dde27851f2","TripTypeSegmentedControl.tsx","a4972054-d6c2-11f0-a1c7-42dde27851f2",1772,["D",1765973900507],8,"/** @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}",[],[159,305,370],[159,305],[159],{"_104":381,"_96":382,"_160":383,"_162":-5,"_163":141,"_164":165,"_166":118,"_106":384,"_101":32,"_168":169,"_170":-5,"_171":22,"_172":-5,"_173":385,"_99":404},"c01e974c-c1c0-11f0-a93a-42dde27851f2","routes","019a8516-0817-70d9-9aec-f538aacf26ee",["D",1763169404921],[386,395],{"_104":387,"_96":388,"_160":389,"_162":383,"_163":141,"_164":140,"_166":118,"_106":390,"_101":391,"_168":189,"_170":392,"_171":22,"_172":-5,"_173":393,"_99":394},"051b5556-db43-11f0-b338-42dde27851f2","_index.tsx","019a8516-0817-70d9-9aec-f349de4a0b64",["D",1765974134337],180,"/** @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, Link } 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 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 console.log(deviceId);\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 \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;",[],[382,388],{"_104":396,"_96":397,"_160":398,"_162":383,"_163":141,"_164":399,"_166":118,"_106":400,"_101":226,"_168":189,"_170":401,"_171":22,"_172":-5,"_173":402,"_99":403},"b8eb51e6-db14-11f0-aef1-42dde27851f2","track.tsx","9a21704c-cd04-11f0-90a4-42dde27851f2",1767,["D",1765954249653],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { db } from \"../instant.ts\";\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport { newHttpBatchRpcSession, RpcStub } from \"https://esm.sh/capnweb@0.2.0\";\nimport {\n useNavigate,\n Link,\n} from \"https://esm.sh/react-router?deps=react@18.2.0\";\nimport { IconHelp } from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\n\ninterface API {\n submit(deviceId: string, payload: any): Promise;\n}\n\nexport const Track = () => {\n const deviceId = db.useLocalId(\"device\");\n const navigate = useNavigate();\n console.log(deviceId);\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 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\nexport default Track;",[],[382,397],[382],{"_104":406,"_96":407,"_160":116,"_162":-5,"_163":141,"_164":408,"_166":118,"_106":409,"_101":410,"_168":411,"_170":412,"_171":22,"_172":97,"_173":413,"_99":414},"179392c2-db28-11f0-b54b-42dde27851f2","index.tsx",1769,["D",1765962568915],67,"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\";\nimport Index from \"./routes/_index.tsx\";\nimport Track from \"./routes/track.tsx\";\nimport { db } from \"./instant.ts\";\n\n\n/* -----------------------------\n * APP (Used by both server + client)\n * ----------------------------- */\nconst App = () => {\n if (typeof window === \"undefined\") {\n return (\n

\n );\n }\n \n const deviceId = db.useLocalId(\"device\");\n \n return (\n \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],{"_104":416,"_96":417,"_160":418,"_162":-5,"_163":141,"_164":419,"_166":118,"_106":420,"_101":374,"_168":189,"_170":421,"_171":22,"_172":-5,"_173":422,"_99":423},"b78c19de-db0f-11f0-a2c3-42dde27851f2","instant.ts","019a8516-0817-70d9-9aec-fd891d527376",1751,["D",1765952099880],"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 ? undefined\n : init({ appId: \"7b35af25-09c0-4433-a004-c9d566cc8bb4\" });",[],[417],"files",[157,175,182,193,204,211,220,231,238,248,259,266,275,284,293,303,309,319,329,339,349,358,368,380,386,395,405,415],"counts",{"_428":32,"_429":165,"_430":32,"_431":432},"pulls","branches","forks","envVars",{"_433":32,"_434":32},"count","emptyCount","contents",[],"file",{"_104":320,"_163":141,"_160":322,"_96":321,"_170":326,"_168":189,"_101":325,"_162":306,"_106":439,"_164":323,"_172":-5,"_99":440},["D",1765631430726],[159,305,321],"upstreamProject",{"_104":150,"_96":443,"_112":-5,"_113":-5,"_110":148,"_23":444},"reactHonoReactRouterStarter",{"_94":95,"_133":134},"upstreamBranch",{"_104":144,"_106":447,"_448":449,"_96":44,"_142":150,"_101":450,"_143":-5,"_145":-5,"_451":-5,"_108":-5,"_154":22,"_110":148,"_153":95,"_16":122,"_152":443},["D",1763136446372],"updatedAt",["D",1766464457054],118,"lockfileKey","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.history_.$",{"_94":95,"_96":97,"_98":44,"_99":100,"_102":458,"_437":463,"_466":467,"_514":515,"_526":-7,"_527":165,"_528":22},{"_104":105,"_96":97,"_106":459,"_108":-5,"_109":22,"_110":111,"_112":-5,"_113":-5,"_14":114,"_115":116,"_117":118,"_119":118,"_120":-5,"_121":32,"_16":122,"_123":124,"_125":124,"_126":127,"_128":127,"_129":127,"_130":124,"_131":124,"_23":460,"_135":461,"_138":462,"_154":22},["D",1763169404921],{"_94":95,"_133":134},{"_94":95,"_137":134,"_14":114},{"_101":140,"_96":44,"_104":141,"_142":105,"_143":144,"_145":146,"_147":148,"_149":150,"_151":122,"_152":97,"_153":95},{"_104":320,"_96":321,"_160":322,"_162":306,"_163":141,"_164":323,"_166":118,"_106":464,"_101":325,"_168":189,"_170":326,"_171":22,"_172":-5,"_99":465},["D",1765631430726],[159,305,321],"history",[468,473,479,485,490,495,500,505,509],{"_104":469,"_163":141,"_160":322,"_96":321,"_170":470,"_168":189,"_101":374,"_162":306,"_106":471,"_164":472,"_172":-5},"d1a21f10-d72e-11f0-aba8-42dde27851f2","/** @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 Label,\n Button,\n SelectValue,\n Popover,\n ListBox,\n ListBoxItem,\n Select,\n ValidationResult\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\n\n// Import ChevronDown icon (assuming lucide-react or similar)\nfunction ChevronDown({ size }: { size: number }) {\n return (\n \n );\n}\n\ninterface MySelectProps\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}\n\nexport function MySelect(\n { label, description, errorMessage, children, items, icon, placeholder, ...props }:\n MySelectProps\n) {\n return (\n \n );\n}\n\ninterface MyItemProps extends React.ComponentProps {\n children: React.ReactNode;\n}\n\nexport function MyItem(props: MyItemProps) {\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 );\n}",["D",1765525653308],1459,{"_104":474,"_163":141,"_160":322,"_96":321,"_170":475,"_168":189,"_101":476,"_162":306,"_106":477,"_164":478,"_172":-5},"362fded4-d72c-11f0-b903-42dde27851f2","/** @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 ListBox,\n ListBoxItem,\n ListBoxItemProps as _ListBoxItemProps,\n SelectProps as _SelectProps,\n Select,\n ValidationResult\n} from \"https://esm.sh/react-aria-components?bundle-deps&deps=react@18.2.0\";\n\nimport type {ListBoxItemProps, SelectProps, ValidationResult} from 'react-aria-components';\n\ninterface MySelectProps\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}\n\nexport function MySelect<\n T extends object,\n M extends 'single' | 'multiple' = 'single'\n>(\n { label, description, errorMessage, children, items, ...props }:\n MySelectProps\n) {\n return (\n \n );\n}\n\nexport function MyItem(props: ListBoxItemProps) {\n return (\n \n `my-item ${isFocused ? 'focused' : ''} ${isSelected ? 'selected' : ''}`}\n />\n );\n}\n\n\n Chocolate\n Mint\n Strawberry\n Vanilla\n",7,["D",1765524533601],1458,{"_104":480,"_163":141,"_160":322,"_96":321,"_170":481,"_168":189,"_101":482,"_162":306,"_106":483,"_164":484,"_172":-5},"d9c77a94-d72b-11f0-ada8-42dde27851f2","/** @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\n\ninterface MySelectProps\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}\n\nexport function MySelect<\n T extends object,\n M extends 'single' | 'multiple' = 'single'\n>(\n { label, description, errorMessage, children, items, ...props }:\n MySelectProps\n) {\n return (\n \n );\n}\n\nexport function MyItem(props: ListBoxItemProps) {\n return (\n \n `my-item ${isFocused ? 'focused' : ''} ${isSelected ? 'selected' : ''}`}\n />\n );\n}\n\n\n Chocolate\n Mint\n Strawberry\n Vanilla\n",6,["D",1765524378572],1457,{"_104":486,"_163":141,"_160":322,"_96":321,"_170":487,"_168":189,"_101":188,"_162":306,"_106":488,"_164":489,"_172":-5},"ccbc40b4-d72b-11f0-8dfa-42dde27851f2","import type {ListBoxItemProps, SelectProps, ValidationResult} from 'react-aria-components';\nimport {FieldError, Text} from 'react-aria-components';\n\ninterface MySelectProps\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}\n\nexport function MySelect<\n T extends object,\n M extends 'single' | 'multiple' = 'single'\n>(\n { label, description, errorMessage, children, items, ...props }:\n MySelectProps\n) {\n return (\n \n );\n}\n\nexport function MyItem(props: ListBoxItemProps) {\n return (\n \n `my-item ${isFocused ? 'focused' : ''} ${isSelected ? 'selected' : ''}`}\n />\n );\n}\n\n\n Chocolate\n Mint\n Strawberry\n Vanilla\n",["D",1765524356685],1456,{"_104":491,"_163":141,"_160":322,"_96":321,"_170":73,"_168":189,"_101":492,"_162":306,"_106":493,"_164":494,"_172":-5},"5a54e8b0-d72a-11f0-ae5c-42dde27851f2",4,["D",1765523735252],1455,{"_104":496,"_163":141,"_160":322,"_96":321,"_170":73,"_168":437,"_101":497,"_162":306,"_106":498,"_164":499,"_172":-5},"5a512f7c-d72a-11f0-ae5c-42dde27851f2",3,["D",1765523735226],1454,{"_104":501,"_163":141,"_160":322,"_96":502,"_170":73,"_168":437,"_101":244,"_162":306,"_106":503,"_164":504,"_172":-5},"58d7bb8e-d72a-11f0-8ceb-42dde27851f2","OfficeSelect.tsxx",["D",1765523732754],1453,{"_104":506,"_163":141,"_160":322,"_96":502,"_170":73,"_168":189,"_101":165,"_162":306,"_106":507,"_164":508,"_172":-5},"58d46718-d72a-11f0-8ceb-42dde27851f2",["D",1765523732732],1452,{"_104":510,"_163":141,"_160":322,"_96":511,"_170":73,"_168":189,"_101":32,"_162":306,"_106":512,"_164":513,"_172":-5},"4ef24c6a-d72a-11f0-9ac9-42dde27851f2","new-file-4364.ts",["D",1765523716145],1451,"versions",[516,518,519,520,521,522,523,524,525],{"_437":468,"_517":473},"previous",{"_437":473,"_517":479},{"_437":479,"_517":485},{"_437":485,"_517":490},{"_437":490,"_517":495},{"_437":495,"_517":500},{"_437":500,"_517":505},{"_437":505,"_517":509},{"_437":509,"_517":-5},"versionNumber","page","hasNext","actionData","errors"]

vawogbemi

smtn

History for OfficeSelect.tsx