@asdp/ferryui 0.1.22-dev.10832 → 0.1.22-dev.10841

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.
Files changed (7) hide show
  1. package/dist/index.d.mts +3 -4
  2. package/dist/index.d.ts +3 -4
  3. package/dist/index.js +1065 -1001
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +1066 -1002
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -12818,10 +12818,9 @@ var DEFAULT_LABELS26 = {
12818
12818
  industryTypeOthersLabel: "Jenis Industri Lainnya",
12819
12819
  industryTypeOthersPlaceholder: "Masukkan Jenis Industri",
12820
12820
  cargoCategoryLabel: "Kategori Muatan",
12821
- estimatedLooseCargoLabel: "Estimasi Berat Barang Lepas",
12822
- estimatedLooseCargoWeightPlaceholder: "Masukkan Berat (Ton)",
12823
- estimatedLooseCargoQuantityLabel: "Jumlah Karung",
12824
- estimatedLooseCargoUnitLabel: "Karung",
12821
+ cargoLabel: "Estimasi Berat Barang Lepas",
12822
+ cargoWeightPlaceholder: "Masukkan Berat (Ton)",
12823
+ cargoUnitLabel: "Karung",
12825
12824
  deleteCargoButton: "Hapus Muatan",
12826
12825
  addCargoButton: "Tambah Muatan",
12827
12826
  loadTypeOptions: {
@@ -12878,10 +12877,9 @@ var DEFAULT_LABELS26 = {
12878
12877
  industryTypeOthersLabel: "Other Industry Type",
12879
12878
  industryTypeOthersPlaceholder: "Enter Industry Type",
12880
12879
  cargoCategoryLabel: "Cargo Category",
12881
- estimatedLooseCargoLabel: "Estimated Loose Cargo Weight",
12882
- estimatedLooseCargoWeightPlaceholder: "Enter Weight (Ton)",
12883
- estimatedLooseCargoQuantityLabel: "Number of Bags",
12884
- estimatedLooseCargoUnitLabel: "Bags",
12880
+ cargoLabel: "Estimated Loose Cargo Weight",
12881
+ cargoWeightPlaceholder: "Enter Weight (Ton)",
12882
+ cargoUnitLabel: "Bags",
12885
12883
  deleteCargoButton: "Delete Cargo",
12886
12884
  addCargoButton: "Add Cargo",
12887
12885
  loadTypeOptions: {
@@ -12969,7 +12967,7 @@ var CardVehicleOwnerForm = ({
12969
12967
  }) => {
12970
12968
  const styles = useStyles27();
12971
12969
  const mergedLabels = { ...DEFAULT_LABELS26[language], ...labels };
12972
- const formValues = watch();
12970
+ watch();
12973
12971
  const [defaultOpenCargoItems, setOpenCargoItems] = React__default.default.useState(/* @__PURE__ */ new Set());
12974
12972
  React.useEffect(() => {
12975
12973
  const allOpenItems = /* @__PURE__ */ new Set();
@@ -12982,9 +12980,38 @@ var CardVehicleOwnerForm = ({
12982
12980
  });
12983
12981
  setOpenCargoItems(allOpenItems);
12984
12982
  }, [owners]);
12985
- React.useEffect(() => {
12986
- console.log("[CardVehicleOwnerForm] Form values changed:", formValues);
12987
- }, [formValues]);
12983
+ function OwnerWeightSync({
12984
+ owner,
12985
+ ownerIndex
12986
+ }) {
12987
+ const { fields } = reactHookForm.useFieldArray({
12988
+ control,
12989
+ name: `owners.${ownerIndex}.cargoItems`
12990
+ });
12991
+ console.log(140, fields);
12992
+ const cargoWeights = reactHookForm.useWatch({
12993
+ control,
12994
+ name: fields.map(
12995
+ (_, cargoIndex) => `owners.${ownerIndex}.cargoItems.${cargoIndex}.cargoWeight`
12996
+ )
12997
+ });
12998
+ console.log(149, cargoWeights);
12999
+ React.useEffect(() => {
13000
+ const total = cargoWeights?.reduce(
13001
+ (sum, w) => sum + (Number(w) || 0),
13002
+ 0
13003
+ ) ?? 0;
13004
+ const current = Number(getValues(`owners.${ownerIndex}.estimatedWeight`)) || 0;
13005
+ console.log(160, current, total);
13006
+ if (current !== total) {
13007
+ setValue(`owners.${ownerIndex}.estimatedWeight`, total);
13008
+ onUpdateOwner(owner.id, {
13009
+ estimatedWeight: total
13010
+ });
13011
+ }
13012
+ }, [cargoWeights, ownerIndex, setValue, getValues]);
13013
+ return null;
13014
+ }
12988
13015
  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: styles.card, children: [
12989
13016
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.header, children: [
12990
13017
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", flex: 1 }, children: [
@@ -13008,165 +13035,59 @@ var CardVehicleOwnerForm = ({
13008
13035
  collapsible: true,
13009
13036
  defaultOpenItems: owners.map((o) => String(o.id)),
13010
13037
  multiple: true,
13011
- children: owners.map((owner, index) => /* @__PURE__ */ jsxRuntime.jsxs(
13012
- reactComponents.AccordionItem,
13013
- {
13014
- value: String(owner.id),
13015
- className: styles.accordion,
13016
- children: [
13017
- /* @__PURE__ */ jsxRuntime.jsx(
13018
- reactComponents.AccordionHeader,
13019
- {
13020
- className: styles.accordionHeader,
13021
- expandIconPosition: "end",
13022
- children: /* @__PURE__ */ jsxRuntime.jsxs(
13023
- "div",
13024
- {
13025
- style: {
13026
- display: "flex",
13027
- justifyContent: "space-between",
13028
- alignItems: "center",
13029
- width: "100%"
13030
- },
13031
- children: [
13032
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.ownerInfoTitle.replace(
13033
- "{index}",
13034
- (index + 1).toString()
13035
- ) }),
13036
- owners.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(
13037
- reactComponents.Button,
13038
- {
13039
- appearance: "transparent",
13040
- "aria-label": mergedLabels.deleteOwnerAriaLabel,
13041
- disabled,
13042
- icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:delete-24-regular" }),
13043
- onClick: (e) => {
13044
- e.stopPropagation();
13045
- onDeleteOwner(owner.id);
13046
- },
13047
- style: { color: reactComponents.tokens.colorPaletteRedForeground1 }
13048
- }
13049
- )
13050
- ]
13051
- }
13052
- )
13053
- }
13054
- ),
13055
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.form, children: [
13056
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13057
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13058
- mergedLabels.cargoOwnerTitle,
13059
- " ",
13060
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13061
- ] }) }),
13062
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { lg: 12, children: [
13063
- /* @__PURE__ */ jsxRuntime.jsx(
13038
+ children: owners.map((owner, ownerIndex) => /* @__PURE__ */ jsxRuntime.jsxs(React__default.default.Fragment, { children: [
13039
+ /* @__PURE__ */ jsxRuntime.jsx(OwnerWeightSync, { owner, ownerIndex }),
13040
+ /* @__PURE__ */ jsxRuntime.jsxs(
13041
+ reactComponents.AccordionItem,
13042
+ {
13043
+ value: String(owner.id),
13044
+ className: styles.accordion,
13045
+ children: [
13046
+ /* @__PURE__ */ jsxRuntime.jsx(
13047
+ reactComponents.AccordionHeader,
13048
+ {
13049
+ className: styles.accordionHeader,
13050
+ expandIconPosition: "end",
13051
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
13064
13052
  "div",
13065
13053
  {
13066
13054
  style: {
13067
13055
  display: "flex",
13068
- gap: "2rem",
13069
- marginBottom: "0.5rem"
13056
+ justifyContent: "space-between",
13057
+ alignItems: "center",
13058
+ width: "100%"
13070
13059
  },
13071
- children: /* @__PURE__ */ jsxRuntime.jsxs(
13072
- reactComponents.RadioGroup,
13073
- {
13074
- disabled,
13075
- layout: "horizontal",
13076
- onChange: (_, data) => {
13077
- onUpdateOwner(owner.id, {
13078
- cargoOwnerEntityType: data.value,
13079
- cargoOwnerEntity: "",
13080
- cargoOwnerEntityOther: ""
13081
- });
13082
- setValue(`owners.${index}.cargoOwnerEntity`, "");
13083
- setValue(`owners.${index}.cargoOwnerEntityOther`, "");
13084
- },
13085
- required: true,
13086
- value: owner.cargoOwnerEntityType || MANIFEST_ENTITY.COMPANY,
13087
- children: [
13088
- /* @__PURE__ */ jsxRuntime.jsx(
13089
- reactComponents.Radio,
13090
- {
13091
- value: MANIFEST_ENTITY.COMPANY,
13092
- label: mergedLabels.entityTypeCompany
13093
- }
13094
- ),
13095
- /* @__PURE__ */ jsxRuntime.jsx(
13096
- reactComponents.Radio,
13097
- {
13098
- value: MANIFEST_ENTITY.INDIVIDUAL,
13099
- label: mergedLabels.entityTypeIndividual
13100
- }
13101
- )
13102
- ]
13103
- }
13104
- )
13105
- }
13106
- ),
13107
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13108
- /* @__PURE__ */ jsxRuntime.jsx(
13109
- reactGridSystem.Col,
13110
- {
13111
- lg: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoOwnerEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13112
- children: /* @__PURE__ */ jsxRuntime.jsx(
13113
- InputDynamic_default,
13060
+ children: [
13061
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.ownerInfoTitle.replace(
13062
+ "{index}",
13063
+ (ownerIndex + 1).toString()
13064
+ ) }),
13065
+ owners.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(
13066
+ reactComponents.Button,
13114
13067
  {
13068
+ appearance: "transparent",
13069
+ "aria-label": mergedLabels.deleteOwnerAriaLabel,
13115
13070
  disabled,
13116
- control,
13117
- name: `owners.${index}.cargoOwnerEntity`,
13118
- options: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? companyOwnerOptions : [],
13119
- onChange: (val) => {
13120
- setValue(`owners.${index}.cargoOwnerEntity`, val);
13121
- onUpdateOwner(owner.id, {
13122
- cargoOwnerEntity: val
13123
- });
13071
+ icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:delete-24-regular" }),
13072
+ onClick: (e) => {
13073
+ e.stopPropagation();
13074
+ onDeleteOwner(owner.id);
13124
13075
  },
13125
- placeholder: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.cargoOwnerCompanyPlaceholder : mergedLabels.cargoOwnerIndividualPlaceholder,
13126
- required: true,
13127
- size: "large",
13128
- type: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text"
13076
+ style: { color: reactComponents.tokens.colorPaletteRedForeground1 }
13129
13077
  }
13130
13078
  )
13131
- }
13132
- ),
13133
- owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoOwnerEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xl: 6, children: /* @__PURE__ */ jsxRuntime.jsx(
13134
- InputDynamic_default,
13135
- {
13136
- control,
13137
- disabled,
13138
- name: `owners.${index}.cargoOwnerEntityOther`,
13139
- placeholder: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13140
- required: true,
13141
- size: "large",
13142
- type: "text",
13143
- onChange: (val) => {
13144
- setValue(
13145
- `owners.${index}.cargoOwnerEntityOther`,
13146
- val
13147
- );
13148
- onUpdateOwner(owner.id, {
13149
- cargoOwnerEntityOther: val
13150
- });
13151
- }
13152
- }
13153
- ) })
13154
- ] }),
13155
- /* @__PURE__ */ jsxRuntime.jsx(
13156
- reactComponents.Caption1,
13157
- {
13158
- style: {
13159
- color: reactComponents.tokens.colorNeutralForeground3,
13160
- marginTop: "0.25rem"
13161
- },
13162
- children: mergedLabels.otherCompanyHelperText
13079
+ ]
13163
13080
  }
13164
13081
  )
13165
- ] })
13166
- ] }),
13167
- hasLoad && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
13168
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, children: [
13169
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.cargoReceiverTitle }) }),
13082
+ }
13083
+ ),
13084
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.form, children: [
13085
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13086
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13087
+ mergedLabels.cargoOwnerTitle,
13088
+ " ",
13089
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13090
+ ] }) }),
13170
13091
  /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { lg: 12, children: [
13171
13092
  /* @__PURE__ */ jsxRuntime.jsx(
13172
13093
  "div",
@@ -13183,21 +13104,21 @@ var CardVehicleOwnerForm = ({
13183
13104
  layout: "horizontal",
13184
13105
  onChange: (_, data) => {
13185
13106
  onUpdateOwner(owner.id, {
13186
- cargoReceiverEntityType: data.value,
13187
- cargoReceiverEntity: "",
13188
- cargoReceiverEntityOther: ""
13107
+ cargoOwnerEntityType: data.value,
13108
+ cargoOwnerEntity: "",
13109
+ cargoOwnerEntityOther: ""
13189
13110
  });
13190
13111
  setValue(
13191
- `owners.${index}.cargoReceiverEntity`,
13112
+ `owners.${ownerIndex}.cargoOwnerEntity`,
13192
13113
  ""
13193
13114
  );
13194
13115
  setValue(
13195
- `owners.${index}.cargoReceiverEntityOther`,
13116
+ `owners.${ownerIndex}.cargoOwnerEntityOther`,
13196
13117
  ""
13197
13118
  );
13198
13119
  },
13199
13120
  required: true,
13200
- value: owner.cargoReceiverEntityType || MANIFEST_ENTITY.COMPANY,
13121
+ value: owner.cargoOwnerEntityType || MANIFEST_ENTITY.COMPANY,
13201
13122
  children: [
13202
13123
  /* @__PURE__ */ jsxRuntime.jsx(
13203
13124
  reactComponents.Radio,
@@ -13222,48 +13143,48 @@ var CardVehicleOwnerForm = ({
13222
13143
  /* @__PURE__ */ jsxRuntime.jsx(
13223
13144
  reactGridSystem.Col,
13224
13145
  {
13225
- lg: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoReceiverEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13146
+ lg: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoOwnerEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13226
13147
  children: /* @__PURE__ */ jsxRuntime.jsx(
13227
13148
  InputDynamic_default,
13228
13149
  {
13229
- control,
13230
13150
  disabled,
13231
- name: `owners.${index}.cargoReceiverEntity`,
13232
- placeholder: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.cargoReceiverCompanyPlaceholder : mergedLabels.cargoReceiverIndividualPlaceholder,
13233
- required: true,
13234
- size: "large",
13235
- type: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text",
13236
- options: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? companyReceiverOptions : [],
13151
+ control,
13152
+ name: `owners.${ownerIndex}.cargoOwnerEntity`,
13153
+ options: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? companyOwnerOptions : [],
13237
13154
  onChange: (val) => {
13238
13155
  setValue(
13239
- `owners.${index}.cargoReceiverEntity`,
13156
+ `owners.${ownerIndex}.cargoOwnerEntity`,
13240
13157
  val
13241
13158
  );
13242
13159
  onUpdateOwner(owner.id, {
13243
- cargoReceiverEntity: val
13160
+ cargoOwnerEntity: val
13244
13161
  });
13245
- }
13162
+ },
13163
+ placeholder: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.cargoOwnerCompanyPlaceholder : mergedLabels.cargoOwnerIndividualPlaceholder,
13164
+ required: true,
13165
+ size: "large",
13166
+ type: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text"
13246
13167
  }
13247
13168
  )
13248
13169
  }
13249
13170
  ),
13250
- owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoReceiverEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 6, children: /* @__PURE__ */ jsxRuntime.jsx(
13171
+ owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoOwnerEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xl: 6, children: /* @__PURE__ */ jsxRuntime.jsx(
13251
13172
  InputDynamic_default,
13252
13173
  {
13253
13174
  control,
13254
13175
  disabled,
13255
- name: `owners.${index}.cargoReceiverEntityOther`,
13256
- placeholder: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13176
+ name: `owners.${ownerIndex}.cargoOwnerEntityOther`,
13177
+ placeholder: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13257
13178
  required: true,
13258
13179
  size: "large",
13259
13180
  type: "text",
13260
13181
  onChange: (val) => {
13261
13182
  setValue(
13262
- `owners.${index}.cargoReceiverEntityOther`,
13183
+ `owners.${ownerIndex}.cargoOwnerEntityOther`,
13263
13184
  val
13264
13185
  );
13265
13186
  onUpdateOwner(owner.id, {
13266
- cargoReceiverEntityOther: val
13187
+ cargoOwnerEntityOther: val
13267
13188
  });
13268
13189
  }
13269
13190
  }
@@ -13281,895 +13202,1038 @@ var CardVehicleOwnerForm = ({
13281
13202
  )
13282
13203
  ] })
13283
13204
  ] }),
13284
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, children: [
13285
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13286
- mergedLabels.logisticsCompanyTitle,
13287
- " ",
13288
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13289
- ] }) }),
13290
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { lg: 12, children: [
13291
- /* @__PURE__ */ jsxRuntime.jsx(
13292
- "div",
13293
- {
13294
- style: {
13295
- display: "flex",
13296
- gap: "2rem",
13297
- marginBottom: "0.5rem"
13298
- },
13299
- children: /* @__PURE__ */ jsxRuntime.jsxs(
13300
- reactComponents.RadioGroup,
13205
+ hasLoad && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
13206
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, children: [
13207
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.cargoReceiverTitle }) }),
13208
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { lg: 12, children: [
13209
+ /* @__PURE__ */ jsxRuntime.jsx(
13210
+ "div",
13211
+ {
13212
+ style: {
13213
+ display: "flex",
13214
+ gap: "2rem",
13215
+ marginBottom: "0.5rem"
13216
+ },
13217
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
13218
+ reactComponents.RadioGroup,
13219
+ {
13220
+ disabled,
13221
+ layout: "horizontal",
13222
+ onChange: (_, data) => {
13223
+ onUpdateOwner(owner.id, {
13224
+ cargoReceiverEntityType: data.value,
13225
+ cargoReceiverEntity: "",
13226
+ cargoReceiverEntityOther: ""
13227
+ });
13228
+ setValue(
13229
+ `owners.${ownerIndex}.cargoReceiverEntity`,
13230
+ ""
13231
+ );
13232
+ setValue(
13233
+ `owners.${ownerIndex}.cargoReceiverEntityOther`,
13234
+ ""
13235
+ );
13236
+ },
13237
+ required: true,
13238
+ value: owner.cargoReceiverEntityType || MANIFEST_ENTITY.COMPANY,
13239
+ children: [
13240
+ /* @__PURE__ */ jsxRuntime.jsx(
13241
+ reactComponents.Radio,
13242
+ {
13243
+ value: MANIFEST_ENTITY.COMPANY,
13244
+ label: mergedLabels.entityTypeCompany
13245
+ }
13246
+ ),
13247
+ /* @__PURE__ */ jsxRuntime.jsx(
13248
+ reactComponents.Radio,
13249
+ {
13250
+ value: MANIFEST_ENTITY.INDIVIDUAL,
13251
+ label: mergedLabels.entityTypeIndividual
13252
+ }
13253
+ )
13254
+ ]
13255
+ }
13256
+ )
13257
+ }
13258
+ ),
13259
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13260
+ /* @__PURE__ */ jsxRuntime.jsx(
13261
+ reactGridSystem.Col,
13262
+ {
13263
+ lg: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoReceiverEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13264
+ children: /* @__PURE__ */ jsxRuntime.jsx(
13265
+ InputDynamic_default,
13266
+ {
13267
+ control,
13268
+ disabled,
13269
+ name: `owners.${ownerIndex}.cargoReceiverEntity`,
13270
+ placeholder: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.cargoReceiverCompanyPlaceholder : mergedLabels.cargoReceiverIndividualPlaceholder,
13271
+ required: true,
13272
+ size: "large",
13273
+ type: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text",
13274
+ options: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? companyReceiverOptions : [],
13275
+ onChange: (val) => {
13276
+ setValue(
13277
+ `owners.${ownerIndex}.cargoReceiverEntity`,
13278
+ val
13279
+ );
13280
+ onUpdateOwner(owner.id, {
13281
+ cargoReceiverEntity: val
13282
+ });
13283
+ }
13284
+ }
13285
+ )
13286
+ }
13287
+ ),
13288
+ owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoReceiverEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 6, children: /* @__PURE__ */ jsxRuntime.jsx(
13289
+ InputDynamic_default,
13301
13290
  {
13291
+ control,
13302
13292
  disabled,
13303
- layout: "horizontal",
13304
- onChange: (_, data) => {
13305
- onUpdateOwner(owner.id, {
13306
- logisticsEntityType: data.value,
13307
- logisticsEntity: "",
13308
- logisticsEntityOther: ""
13309
- });
13310
- setValue(`owners.${index}.logisticsEntity`, "");
13293
+ name: `owners.${ownerIndex}.cargoReceiverEntityOther`,
13294
+ placeholder: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13295
+ required: true,
13296
+ size: "large",
13297
+ type: "text",
13298
+ onChange: (val) => {
13311
13299
  setValue(
13312
- `owners.${index}.logisticsEntityOther`,
13313
- ""
13300
+ `owners.${ownerIndex}.cargoReceiverEntityOther`,
13301
+ val
13314
13302
  );
13315
- },
13316
- required: true,
13317
- value: owner.logisticsEntityType || MANIFEST_ENTITY.COMPANY,
13318
- children: [
13319
- /* @__PURE__ */ jsxRuntime.jsx(
13320
- reactComponents.Radio,
13321
- {
13322
- value: MANIFEST_ENTITY.COMPANY,
13323
- label: mergedLabels.entityTypeCompany
13324
- }
13325
- ),
13326
- /* @__PURE__ */ jsxRuntime.jsx(
13327
- reactComponents.Radio,
13328
- {
13329
- value: MANIFEST_ENTITY.INDIVIDUAL,
13330
- label: mergedLabels.entityTypeIndividual
13331
- }
13332
- )
13333
- ]
13303
+ onUpdateOwner(owner.id, {
13304
+ cargoReceiverEntityOther: val
13305
+ });
13306
+ }
13334
13307
  }
13335
- )
13336
- }
13337
- ),
13338
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13308
+ ) })
13309
+ ] }),
13339
13310
  /* @__PURE__ */ jsxRuntime.jsx(
13340
- reactGridSystem.Col,
13311
+ reactComponents.Caption1,
13341
13312
  {
13342
- xl: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY && owner.logisticsEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13343
- children: /* @__PURE__ */ jsxRuntime.jsx(
13344
- InputDynamic_default,
13313
+ style: {
13314
+ color: reactComponents.tokens.colorNeutralForeground3,
13315
+ marginTop: "0.25rem"
13316
+ },
13317
+ children: mergedLabels.otherCompanyHelperText
13318
+ }
13319
+ )
13320
+ ] })
13321
+ ] }),
13322
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, children: [
13323
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13324
+ mergedLabels.logisticsCompanyTitle,
13325
+ " ",
13326
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13327
+ ] }) }),
13328
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { lg: 12, children: [
13329
+ /* @__PURE__ */ jsxRuntime.jsx(
13330
+ "div",
13331
+ {
13332
+ style: {
13333
+ display: "flex",
13334
+ gap: "2rem",
13335
+ marginBottom: "0.5rem"
13336
+ },
13337
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
13338
+ reactComponents.RadioGroup,
13345
13339
  {
13346
- control,
13347
13340
  disabled,
13348
- name: `owners.${index}.logisticsEntity`,
13349
- placeholder: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.logisticsCompanyPlaceholder : mergedLabels.logisticsIndividualPlaceholder,
13350
- required: true,
13351
- size: "large",
13352
- type: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text",
13353
- options: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? companyLogisticsOptions : [],
13354
- onChange: (val) => {
13355
- setValue(
13356
- `owners.${index}.logisticsEntity`,
13357
- val
13358
- );
13341
+ layout: "horizontal",
13342
+ onChange: (_, data) => {
13359
13343
  onUpdateOwner(owner.id, {
13360
- logisticsEntity: val
13344
+ logisticsEntityType: data.value,
13345
+ logisticsEntity: "",
13346
+ logisticsEntityOther: ""
13361
13347
  });
13362
- }
13348
+ setValue(
13349
+ `owners.${ownerIndex}.logisticsEntity`,
13350
+ ""
13351
+ );
13352
+ setValue(
13353
+ `owners.${ownerIndex}.logisticsEntityOther`,
13354
+ ""
13355
+ );
13356
+ },
13357
+ required: true,
13358
+ value: owner.logisticsEntityType || MANIFEST_ENTITY.COMPANY,
13359
+ children: [
13360
+ /* @__PURE__ */ jsxRuntime.jsx(
13361
+ reactComponents.Radio,
13362
+ {
13363
+ value: MANIFEST_ENTITY.COMPANY,
13364
+ label: mergedLabels.entityTypeCompany
13365
+ }
13366
+ ),
13367
+ /* @__PURE__ */ jsxRuntime.jsx(
13368
+ reactComponents.Radio,
13369
+ {
13370
+ value: MANIFEST_ENTITY.INDIVIDUAL,
13371
+ label: mergedLabels.entityTypeIndividual
13372
+ }
13373
+ )
13374
+ ]
13363
13375
  }
13364
13376
  )
13365
13377
  }
13366
13378
  ),
13367
- owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY && owner.logisticsEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xl: 6, children: /* @__PURE__ */ jsxRuntime.jsx(
13368
- InputDynamic_default,
13369
- {
13370
- control,
13371
- disabled,
13372
- name: `owners.${index}.logisticsEntityOther`,
13373
- placeholder: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13374
- required: true,
13375
- size: "large",
13376
- type: "text",
13377
- onChange: (val) => {
13378
- setValue(
13379
- `owners.${index}.logisticsEntityOther`,
13380
- val
13381
- );
13382
- onUpdateOwner(owner.id, {
13383
- logisticsEntityOther: val
13384
- });
13379
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13380
+ /* @__PURE__ */ jsxRuntime.jsx(
13381
+ reactGridSystem.Col,
13382
+ {
13383
+ xl: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY && owner.logisticsEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13384
+ children: /* @__PURE__ */ jsxRuntime.jsx(
13385
+ InputDynamic_default,
13386
+ {
13387
+ control,
13388
+ disabled,
13389
+ name: `owners.${ownerIndex}.logisticsEntity`,
13390
+ placeholder: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.logisticsCompanyPlaceholder : mergedLabels.logisticsIndividualPlaceholder,
13391
+ required: true,
13392
+ size: "large",
13393
+ type: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text",
13394
+ options: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? companyLogisticsOptions : [],
13395
+ onChange: (val) => {
13396
+ setValue(
13397
+ `owners.${ownerIndex}.logisticsEntity`,
13398
+ val
13399
+ );
13400
+ onUpdateOwner(owner.id, {
13401
+ logisticsEntity: val
13402
+ });
13403
+ }
13404
+ }
13405
+ )
13385
13406
  }
13386
- }
13387
- ) })
13388
- ] })
13389
- ] }),
13390
- /* @__PURE__ */ jsxRuntime.jsx(
13391
- reactComponents.Caption1,
13392
- {
13393
- style: {
13394
- color: reactComponents.tokens.colorNeutralForeground3,
13395
- marginTop: "0.25rem"
13396
- },
13397
- children: mergedLabels.otherCompanyHelperText
13398
- }
13399
- )
13400
- ] })
13401
- ] }),
13402
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13403
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xl: 6, children: [
13404
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.originCityLabel }),
13405
- /* @__PURE__ */ jsxRuntime.jsx(
13406
- InputDynamic_default,
13407
- {
13408
- control,
13409
- disabled,
13410
- name: `owners.${index}.originCity`,
13411
- onChange: (val) => {
13412
- setValue(`owners.${index}.originCity`, val);
13413
- onUpdateOwner(owner.id, {
13414
- originCity: val
13415
- });
13416
- },
13417
- options: cityOriginOptions,
13418
- placeholder: mergedLabels.selectPlaceholder,
13419
- required: true,
13420
- size: "large",
13421
- type: "select"
13422
- }
13423
- )
13424
- ] }),
13425
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xl: 6, children: [
13426
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.destinationCityLabel }),
13427
- /* @__PURE__ */ jsxRuntime.jsx(
13428
- InputDynamic_default,
13429
- {
13430
- control,
13431
- disabled,
13432
- name: `owners.${index}.destinationCity`,
13433
- options: cityDestinationOptions,
13434
- onChange: (val) => {
13435
- setValue(`owners.${index}.destinationCity`, val);
13436
- onUpdateOwner(owner.id, {
13437
- destinationCity: val
13438
- });
13439
- },
13440
- placeholder: mergedLabels.selectPlaceholder,
13441
- required: true,
13442
- size: "large",
13443
- type: "select"
13444
- }
13445
- )
13407
+ ),
13408
+ owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY && owner.logisticsEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xl: 6, children: /* @__PURE__ */ jsxRuntime.jsx(
13409
+ InputDynamic_default,
13410
+ {
13411
+ control,
13412
+ disabled,
13413
+ name: `owners.${ownerIndex}.logisticsEntityOther`,
13414
+ placeholder: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13415
+ required: true,
13416
+ size: "large",
13417
+ type: "text",
13418
+ onChange: (val) => {
13419
+ setValue(
13420
+ `owners.${ownerIndex}.logisticsEntityOther`,
13421
+ val
13422
+ );
13423
+ onUpdateOwner(owner.id, {
13424
+ logisticsEntityOther: val
13425
+ });
13426
+ }
13427
+ }
13428
+ ) })
13429
+ ] })
13430
+ ] }),
13431
+ /* @__PURE__ */ jsxRuntime.jsx(
13432
+ reactComponents.Caption1,
13433
+ {
13434
+ style: {
13435
+ color: reactComponents.tokens.colorNeutralForeground3,
13436
+ marginTop: "0.25rem"
13437
+ },
13438
+ children: mergedLabels.otherCompanyHelperText
13439
+ }
13440
+ )
13441
+ ] })
13446
13442
  ] }),
13447
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { lg: 12, children: [
13448
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: "1rem" } }),
13449
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13450
- mergedLabels.estimatedVehicleWeightLabel,
13451
- " ",
13452
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13443
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13444
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xl: 6, children: [
13445
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.originCityLabel }),
13446
+ /* @__PURE__ */ jsxRuntime.jsx(
13447
+ InputDynamic_default,
13448
+ {
13449
+ control,
13450
+ disabled,
13451
+ name: `owners.${ownerIndex}.originCity`,
13452
+ onChange: (val) => {
13453
+ setValue(`owners.${ownerIndex}.originCity`, val);
13454
+ onUpdateOwner(owner.id, {
13455
+ originCity: val
13456
+ });
13457
+ },
13458
+ options: cityOriginOptions,
13459
+ placeholder: mergedLabels.selectPlaceholder,
13460
+ required: true,
13461
+ size: "large",
13462
+ type: "select"
13463
+ }
13464
+ )
13453
13465
  ] }),
13454
- /* @__PURE__ */ jsxRuntime.jsx(
13455
- InputDynamic_default,
13456
- {
13457
- control,
13458
- disabled,
13459
- name: `owners.${index}.estimatedWeight`,
13460
- placeholder: mergedLabels.inputNumberPlaceholder,
13461
- required: true,
13462
- size: "large",
13463
- type: "number",
13464
- onChange: (val) => {
13465
- setValue(`owners.${index}.estimatedWeight`, val);
13466
- onUpdateOwner(owner.id, {
13467
- estimatedWeight: val
13468
- });
13466
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xl: 6, children: [
13467
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.destinationCityLabel }),
13468
+ /* @__PURE__ */ jsxRuntime.jsx(
13469
+ InputDynamic_default,
13470
+ {
13471
+ control,
13472
+ disabled,
13473
+ name: `owners.${ownerIndex}.destinationCity`,
13474
+ options: cityDestinationOptions,
13475
+ onChange: (val) => {
13476
+ setValue(`owners.${ownerIndex}.destinationCity`, val);
13477
+ onUpdateOwner(owner.id, {
13478
+ destinationCity: val
13479
+ });
13480
+ },
13481
+ placeholder: mergedLabels.selectPlaceholder,
13482
+ required: true,
13483
+ size: "large",
13484
+ type: "select"
13469
13485
  }
13470
- }
13471
- )
13472
- ] })
13473
- ] }),
13474
- hasLoad && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
13475
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.cargoListTitle }) }) }),
13476
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Row, { children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xs: 12, children: [
13477
- /* @__PURE__ */ jsxRuntime.jsx(
13478
- reactComponents.Accordion,
13479
- {
13480
- collapsible: true,
13481
- defaultOpenItems: Array.from(defaultOpenCargoItems),
13482
- onToggle: (e, data) => {
13483
- const newOpenItems = new Set(data.openItems);
13484
- setOpenCargoItems(newOpenItems);
13485
- const updatedCargoItems = owner.cargoItems?.map((cargo) => ({
13486
- ...cargo,
13487
- _isAccordionOpen: newOpenItems.has(`cargo-${cargo.id}`)
13488
- }));
13489
- onUpdateOwner(owner.id, {
13490
- cargoItems: updatedCargoItems
13491
- });
13492
- },
13493
- multiple: true,
13494
- children: owner.cargoItems?.map((cargo, cargoIndex) => {
13495
- const watchCommodity = watch(
13496
- `owners.${index}.cargo.${cargoIndex}.commodity`
13497
- );
13498
- const watchLoadType = watch(
13499
- `owners.${index}.cargo.${cargoIndex}.loadType`
13500
- );
13501
- const watchIndustryType = watch(
13502
- `owners.${index}.cargo.${cargoIndex}.industryType`
13503
- );
13504
- const watchQuantity = watch(
13505
- `owners.${index}.cargo.${cargoIndex}.quantity`
13506
- );
13507
- let _loadTypeOptions = [];
13508
- if (watchCommodity && loadTypeOptionsByCommodityId[watchCommodity]) {
13509
- _loadTypeOptions = loadTypeOptionsByCommodityId[watchCommodity];
13510
- } else {
13511
- _loadTypeOptions = loadTypeOptions.map((lt) => ({
13512
- value: lt.id.toString(),
13513
- label: `${lt.name}${lt.unit?.name ? ` (${lt.unit.name})` : ""}`
13514
- }));
13486
+ )
13487
+ ] }),
13488
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { lg: 12, children: [
13489
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: "1rem" } }),
13490
+ /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13491
+ mergedLabels.estimatedVehicleWeightLabel,
13492
+ " ",
13493
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13494
+ ] }),
13495
+ /* @__PURE__ */ jsxRuntime.jsx(
13496
+ InputDynamic_default,
13497
+ {
13498
+ control,
13499
+ disabled,
13500
+ name: `owners.${ownerIndex}.estimatedWeight`,
13501
+ placeholder: mergedLabels.inputNumberPlaceholder,
13502
+ required: true,
13503
+ size: "large",
13504
+ type: "number",
13505
+ onChange: (val) => {
13506
+ setValue(`owners.${ownerIndex}.estimatedWeight`, val);
13507
+ onUpdateOwner(owner.id, {
13508
+ estimatedWeight: val
13509
+ });
13515
13510
  }
13516
- const _selectedLoadType = loadTypes.find(
13517
- (loadType) => loadType.id.toString() === watchLoadType
13518
- );
13519
- const isLoadTypeOther = _loadTypeOptions.find(
13520
- (lt) => lt.value.toString() === String(watchLoadType)
13521
- )?.label.startsWith(
13522
- HARDCODED_NAME.LOAD_TYPE__LAINNYA
13523
- );
13524
- const isIndustryTypeOther = industryOptions?.find(
13525
- (it) => it.value.toString() === String(watchIndustryType)
13526
- )?.label === HARDCODED_NAME.INDUSTRY_TYPE__LAINNYA;
13527
- return /* @__PURE__ */ jsxRuntime.jsxs(
13528
- reactComponents.AccordionItem,
13529
- {
13530
- value: `cargo-${cargo.id}`,
13531
- className: styles.accordion,
13532
- children: [
13533
- /* @__PURE__ */ jsxRuntime.jsx(
13534
- reactComponents.AccordionHeader,
13535
- {
13536
- className: styles.accordionHeader,
13537
- expandIconPosition: "end",
13538
- children: /* @__PURE__ */ jsxRuntime.jsxs(
13539
- "div",
13540
- {
13541
- style: {
13542
- display: "flex",
13543
- justifyContent: "space-between",
13544
- alignItems: "center",
13545
- width: "100%",
13546
- gap: "1rem"
13547
- },
13548
- children: [
13549
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { style: { minWidth: "fit-content" }, children: mergedLabels.cargoItemTitle.replace(
13550
- "{index}",
13551
- (cargoIndex + 1).toString()
13552
- ) }),
13553
- _selectedLoadType && !cargo._isAccordionOpen && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
13554
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1Strong, { style: { flex: 1 }, children: [
13555
- _selectedLoadType.name,
13556
- " \u2022",
13557
- " ",
13558
- watchQuantity,
13559
- "x",
13560
- " ",
13561
- _selectedLoadType.unit?.name,
13562
- " \u2022",
13563
- " ",
13564
- _selectedLoadType.formattedPrice
13565
- ] }),
13511
+ }
13512
+ )
13513
+ ] })
13514
+ ] }),
13515
+ hasLoad && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
13516
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.cargoListTitle }) }) }),
13517
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Row, { children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xs: 12, children: [
13518
+ /* @__PURE__ */ jsxRuntime.jsx(
13519
+ reactComponents.Accordion,
13520
+ {
13521
+ collapsible: true,
13522
+ defaultOpenItems: Array.from(defaultOpenCargoItems),
13523
+ onToggle: (e, data) => {
13524
+ const newOpenItems = new Set(
13525
+ data.openItems
13526
+ );
13527
+ setOpenCargoItems(newOpenItems);
13528
+ const updatedCargoItems = owner.cargoItems?.map(
13529
+ (cargo) => ({
13530
+ ...cargo,
13531
+ _isAccordionOpen: newOpenItems.has(
13532
+ `cargo-${cargo.id}`
13533
+ )
13534
+ })
13535
+ );
13536
+ onUpdateOwner(owner.id, {
13537
+ cargoItems: updatedCargoItems
13538
+ });
13539
+ },
13540
+ multiple: true,
13541
+ children: owner.cargoItems?.map((cargo, cargoIndex) => {
13542
+ const watchCommodity = watch(
13543
+ `owners.${ownerIndex}.cargo.${cargoIndex}.commodity`
13544
+ );
13545
+ const watchLoadType = watch(
13546
+ `owners.${ownerIndex}.cargo.${cargoIndex}.loadType`
13547
+ );
13548
+ const watchIndustryType = watch(
13549
+ `owners.${ownerIndex}.cargo.${cargoIndex}.industryType`
13550
+ );
13551
+ const watchQuantity = watch(
13552
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
13553
+ );
13554
+ let _loadTypeOptions = [];
13555
+ if (watchCommodity && loadTypeOptionsByCommodityId[watchCommodity]) {
13556
+ _loadTypeOptions = loadTypeOptionsByCommodityId[watchCommodity];
13557
+ } else {
13558
+ _loadTypeOptions = loadTypeOptions.map(
13559
+ (lt) => ({
13560
+ value: lt.id.toString(),
13561
+ label: `${lt.name}${lt.unit?.name ? ` (${lt.unit.name})` : ""}`
13562
+ })
13563
+ );
13564
+ }
13565
+ const _selectedLoadType = loadTypes.find(
13566
+ (loadType) => loadType.id.toString() === watchLoadType
13567
+ );
13568
+ const isLoadTypeOther = _loadTypeOptions.find(
13569
+ (lt) => lt.value.toString() === String(watchLoadType)
13570
+ )?.label.startsWith(
13571
+ HARDCODED_NAME.LOAD_TYPE__LAINNYA
13572
+ );
13573
+ const isIndustryTypeOther = industryOptions?.find(
13574
+ (it) => it.value.toString() === String(watchIndustryType)
13575
+ )?.label === HARDCODED_NAME.INDUSTRY_TYPE__LAINNYA;
13576
+ return /* @__PURE__ */ jsxRuntime.jsxs(
13577
+ reactComponents.AccordionItem,
13578
+ {
13579
+ value: `cargo-${cargo.id}`,
13580
+ className: styles.accordion,
13581
+ children: [
13582
+ /* @__PURE__ */ jsxRuntime.jsx(
13583
+ reactComponents.AccordionHeader,
13584
+ {
13585
+ className: styles.accordionHeader,
13586
+ expandIconPosition: "end",
13587
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
13588
+ "div",
13589
+ {
13590
+ style: {
13591
+ display: "flex",
13592
+ justifyContent: "space-between",
13593
+ alignItems: "center",
13594
+ width: "100%",
13595
+ gap: "1rem"
13596
+ },
13597
+ children: [
13566
13598
  /* @__PURE__ */ jsxRuntime.jsx(
13567
- reactComponents.Body1Stronger,
13599
+ reactComponents.Body1Strong,
13568
13600
  {
13569
- style: {
13570
- color: sharedColors["Shared_Secondary_Primary"],
13571
- minWidth: "fit-content"
13572
- },
13573
- children: new Intl.NumberFormat("id-ID", {
13574
- style: "currency",
13575
- currency: "IDR",
13576
- minimumFractionDigits: 0
13577
- }).format(
13578
- Number(
13579
- getValues(
13580
- `owners.${index}.cargo.${cargoIndex}.quantity`
13581
- ) || 0
13582
- ) * (_selectedLoadType.price || 0)
13601
+ style: { minWidth: "fit-content" },
13602
+ children: mergedLabels.cargoItemTitle.replace(
13603
+ "{index}",
13604
+ (cargoIndex + 1).toString()
13583
13605
  )
13584
13606
  }
13585
- )
13586
- ] })
13587
- ]
13588
- }
13589
- )
13590
- }
13591
- ),
13592
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.form, children: [
13593
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13594
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: isLoadTypeOther ? 4 : 6, children: [
13595
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13596
- mergedLabels.commodityLabel,
13597
- " ",
13598
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13599
- ] }),
13600
- /* @__PURE__ */ jsxRuntime.jsx(
13601
- InputDynamic_default,
13602
- {
13603
- control,
13604
- disabled,
13605
- name: `owners.${index}.cargo.${cargoIndex}.commodity`,
13606
- onChange: (val) => {
13607
- const name = `owners.${index}.cargo.${cargoIndex}.commodity`;
13608
- setValue(name, val);
13609
- const updatedCargoItems = owner.cargoItems?.map(
13610
- (c, cIdx) => cIdx === cargoIndex ? {
13611
- ...c,
13612
- commodity: val
13613
- } : c
13614
- );
13615
- onUpdateOwner(owner.id, {
13616
- cargoItems: updatedCargoItems
13617
- });
13618
- setValue(
13619
- `owners.${index}.cargo.${cargoIndex}.loadType`,
13620
- ""
13621
- );
13622
- },
13623
- options: commodityOptions,
13624
- placeholder: mergedLabels.selectPlaceholder,
13625
- required: true,
13626
- type: "select",
13627
- size: "large"
13607
+ ),
13608
+ _selectedLoadType && !cargo._isAccordionOpen && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
13609
+ /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1Strong, { style: { flex: 1 }, children: [
13610
+ _selectedLoadType.name,
13611
+ " \u2022",
13612
+ " ",
13613
+ watchQuantity,
13614
+ "x",
13615
+ " ",
13616
+ _selectedLoadType.unit?.name,
13617
+ " \u2022",
13618
+ " ",
13619
+ _selectedLoadType.formattedPrice
13620
+ ] }),
13621
+ /* @__PURE__ */ jsxRuntime.jsx(
13622
+ reactComponents.Body1Stronger,
13623
+ {
13624
+ style: {
13625
+ color: sharedColors["Shared_Secondary_Primary"],
13626
+ minWidth: "fit-content"
13627
+ },
13628
+ children: new Intl.NumberFormat("id-ID", {
13629
+ style: "currency",
13630
+ currency: "IDR",
13631
+ minimumFractionDigits: 0
13632
+ }).format(
13633
+ Number(
13634
+ getValues(
13635
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
13636
+ ) || 0
13637
+ ) * (_selectedLoadType.price || 0)
13638
+ ).replace("Rp", "IDR")
13639
+ }
13640
+ )
13641
+ ] })
13642
+ ]
13628
13643
  }
13629
13644
  )
13630
- ] }),
13631
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: isLoadTypeOther ? 4 : 6, children: [
13632
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13633
- mergedLabels.loadTypeLabel,
13634
- " ",
13635
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13645
+ }
13646
+ ),
13647
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.form, children: [
13648
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13649
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: isLoadTypeOther ? 4 : 6, children: [
13650
+ /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13651
+ mergedLabels.commodityLabel,
13652
+ " ",
13653
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13654
+ ] }),
13655
+ /* @__PURE__ */ jsxRuntime.jsx(
13656
+ InputDynamic_default,
13657
+ {
13658
+ control,
13659
+ disabled,
13660
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.commodity`,
13661
+ onChange: (val) => {
13662
+ const name = `owners.${ownerIndex}.cargo.${cargoIndex}.commodity`;
13663
+ setValue(name, val);
13664
+ const updatedCargoItems = owner.cargoItems?.map(
13665
+ (c, cIdx) => cIdx === cargoIndex ? {
13666
+ ...c,
13667
+ commodity: val
13668
+ } : c
13669
+ );
13670
+ onUpdateOwner(owner.id, {
13671
+ cargoItems: updatedCargoItems
13672
+ });
13673
+ setValue(
13674
+ `owners.${ownerIndex}.cargo.${cargoIndex}.loadType`,
13675
+ ""
13676
+ );
13677
+ },
13678
+ options: commodityOptions,
13679
+ placeholder: mergedLabels.selectPlaceholder,
13680
+ required: true,
13681
+ type: "select",
13682
+ size: "large"
13683
+ }
13684
+ )
13636
13685
  ] }),
13637
- /* @__PURE__ */ jsxRuntime.jsx(
13638
- InputDynamic_default,
13639
- {
13640
- control,
13641
- disabled: disabled || (getValues(
13642
- `owners.${index}.cargo.${cargoIndex}.commodity`
13643
- ) || "") === "",
13644
- name: `owners.${index}.cargo.${cargoIndex}.loadType`,
13645
- onChange: (val) => {
13646
- const name = `owners.${index}.cargo.${cargoIndex}.loadType`;
13647
- setValue(name, val);
13648
- const updatedCargoItems = owner.cargoItems?.map(
13649
- (c, cIdx) => cIdx === cargoIndex ? {
13650
- ...c,
13651
- loadType: val
13652
- } : c
13653
- );
13654
- onUpdateOwner(owner.id, {
13655
- cargoItems: updatedCargoItems
13656
- });
13657
- },
13658
- options: _loadTypeOptions,
13659
- placeholder: mergedLabels.selectPlaceholder,
13660
- required: true,
13661
- size: "large",
13662
- type: "select"
13663
- }
13664
- ),
13665
- /* @__PURE__ */ jsxRuntime.jsx(
13666
- reactComponents.Caption1,
13667
- {
13668
- style: {
13669
- color: reactComponents.tokens.colorNeutralForeground3,
13670
- marginTop: "0.25rem"
13671
- },
13672
- children: mergedLabels.loadTypeHelperText
13673
- }
13674
- )
13686
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: isLoadTypeOther ? 4 : 6, children: [
13687
+ /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13688
+ mergedLabels.loadTypeLabel,
13689
+ " ",
13690
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13691
+ ] }),
13692
+ /* @__PURE__ */ jsxRuntime.jsx(
13693
+ InputDynamic_default,
13694
+ {
13695
+ control,
13696
+ disabled: disabled || (getValues(
13697
+ `owners.${ownerIndex}.cargo.${cargoIndex}.commodity`
13698
+ ) || "") === "",
13699
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.loadType`,
13700
+ onChange: (val) => {
13701
+ const name = `owners.${ownerIndex}.cargo.${cargoIndex}.loadType`;
13702
+ setValue(name, val);
13703
+ const updatedCargoItems = owner.cargoItems?.map(
13704
+ (c, cIdx) => cIdx === cargoIndex ? {
13705
+ ...c,
13706
+ loadType: val
13707
+ } : c
13708
+ );
13709
+ onUpdateOwner(owner.id, {
13710
+ cargoItems: updatedCargoItems
13711
+ });
13712
+ },
13713
+ options: _loadTypeOptions,
13714
+ placeholder: mergedLabels.selectPlaceholder,
13715
+ required: true,
13716
+ size: "large",
13717
+ type: "select"
13718
+ }
13719
+ ),
13720
+ /* @__PURE__ */ jsxRuntime.jsx(
13721
+ reactComponents.Caption1,
13722
+ {
13723
+ style: {
13724
+ color: reactComponents.tokens.colorNeutralForeground3,
13725
+ marginTop: "0.25rem"
13726
+ },
13727
+ children: mergedLabels.loadTypeHelperText
13728
+ }
13729
+ )
13730
+ ] }),
13731
+ isLoadTypeOther && /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xl: 4, children: [
13732
+ /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13733
+ mergedLabels.loadTypeOthersLabel,
13734
+ " ",
13735
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13736
+ ] }),
13737
+ /* @__PURE__ */ jsxRuntime.jsx(
13738
+ InputDynamic_default,
13739
+ {
13740
+ control,
13741
+ disabled,
13742
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.loadTypeOther`,
13743
+ placeholder: mergedLabels.loadTypeOthersPlaceholder,
13744
+ required: true,
13745
+ size: "large",
13746
+ type: "text",
13747
+ onChange: (val) => {
13748
+ setValue(
13749
+ `owners.${ownerIndex}.cargo.${cargoIndex}.loadTypeOther`,
13750
+ val
13751
+ );
13752
+ const updatedCargoItems = owner.cargoItems?.map(
13753
+ (c, cIdx) => cIdx === cargoIndex ? {
13754
+ ...c,
13755
+ loadTypeOther: val
13756
+ } : c
13757
+ );
13758
+ onUpdateOwner(owner.id, {
13759
+ cargoItems: updatedCargoItems
13760
+ });
13761
+ }
13762
+ }
13763
+ )
13764
+ ] })
13675
13765
  ] }),
13676
- isLoadTypeOther && /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xl: 4, children: [
13677
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13678
- mergedLabels.loadTypeOthersLabel,
13679
- " ",
13680
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13766
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13767
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: isIndustryTypeOther ? 4 : 6, children: [
13768
+ /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13769
+ mergedLabels.industryTypeLabel,
13770
+ " ",
13771
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13772
+ ] }),
13773
+ /* @__PURE__ */ jsxRuntime.jsx(
13774
+ InputDynamic_default,
13775
+ {
13776
+ control,
13777
+ disabled,
13778
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.industryType`,
13779
+ options: industryOptions,
13780
+ onChange: (val) => {
13781
+ const name = `owners.${ownerIndex}.cargo.${cargoIndex}.industryType`;
13782
+ setValue(name, val);
13783
+ const updatedCargoItems = owner.cargoItems?.map(
13784
+ (c, cIdx) => cIdx === cargoIndex ? {
13785
+ ...c,
13786
+ industryType: val
13787
+ } : c
13788
+ );
13789
+ onUpdateOwner(owner.id, {
13790
+ cargoItems: updatedCargoItems
13791
+ });
13792
+ },
13793
+ placeholder: mergedLabels.selectPlaceholder,
13794
+ required: true,
13795
+ size: "large",
13796
+ type: "select"
13797
+ }
13798
+ ),
13799
+ /* @__PURE__ */ jsxRuntime.jsx(
13800
+ reactComponents.Caption1,
13801
+ {
13802
+ style: {
13803
+ color: reactComponents.tokens.colorNeutralForeground3,
13804
+ marginTop: "0.25rem"
13805
+ },
13806
+ children: mergedLabels.industryTypeHelperText
13807
+ }
13808
+ )
13681
13809
  ] }),
13682
- /* @__PURE__ */ jsxRuntime.jsx(
13683
- InputDynamic_default,
13684
- {
13685
- control,
13686
- disabled,
13687
- name: `owners.${index}.cargo.${cargoIndex}.loadTypeOther`,
13688
- placeholder: mergedLabels.loadTypeOthersPlaceholder,
13689
- required: true,
13690
- size: "large",
13691
- type: "text",
13692
- onChange: (val) => {
13693
- setValue(
13694
- `owners.${index}.cargo.${cargoIndex}.loadTypeOther`,
13695
- val
13696
- );
13697
- const updatedCargoItems = owner.cargoItems?.map(
13698
- (c, cIdx) => cIdx === cargoIndex ? {
13699
- ...c,
13700
- loadTypeOther: val
13701
- } : c
13702
- );
13703
- onUpdateOwner(owner.id, {
13704
- cargoItems: updatedCargoItems
13705
- });
13810
+ isIndustryTypeOther && /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xl: 4, children: [
13811
+ /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13812
+ mergedLabels.industryTypeOthersLabel,
13813
+ " ",
13814
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13815
+ ] }),
13816
+ /* @__PURE__ */ jsxRuntime.jsx(
13817
+ InputDynamic_default,
13818
+ {
13819
+ control,
13820
+ disabled,
13821
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.industryTypeOther`,
13822
+ placeholder: mergedLabels.industryTypeOthersPlaceholder,
13823
+ required: true,
13824
+ size: "large",
13825
+ type: "text",
13826
+ onChange: (val) => {
13827
+ setValue(
13828
+ `owners.${ownerIndex}.cargo.${cargoIndex}.industryTypeOther`,
13829
+ val
13830
+ );
13831
+ const updatedCargoItems = owner.cargoItems?.map(
13832
+ (c, cIdx) => cIdx === cargoIndex ? {
13833
+ ...c,
13834
+ industryTypeOther: val
13835
+ } : c
13836
+ );
13837
+ onUpdateOwner(owner.id, {
13838
+ cargoItems: updatedCargoItems
13839
+ });
13840
+ }
13706
13841
  }
13707
- }
13708
- )
13709
- ] })
13710
- ] }),
13711
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13712
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: isIndustryTypeOther ? 4 : 6, children: [
13713
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13714
- mergedLabels.industryTypeLabel,
13715
- " ",
13716
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13842
+ )
13717
13843
  ] }),
13718
- /* @__PURE__ */ jsxRuntime.jsx(
13719
- InputDynamic_default,
13720
- {
13721
- control,
13722
- disabled,
13723
- name: `owners.${index}.cargo.${cargoIndex}.industryType`,
13724
- options: industryOptions,
13725
- onChange: (val) => {
13726
- const name = `owners.${index}.cargo.${cargoIndex}.industryType`;
13727
- setValue(name, val);
13728
- const updatedCargoItems = owner.cargoItems?.map(
13729
- (c, cIdx) => cIdx === cargoIndex ? {
13730
- ...c,
13731
- industryType: val
13732
- } : c
13733
- );
13734
- onUpdateOwner(owner.id, {
13735
- cargoItems: updatedCargoItems
13736
- });
13737
- },
13738
- placeholder: mergedLabels.selectPlaceholder,
13739
- required: true,
13740
- size: "large",
13741
- type: "select"
13742
- }
13743
- ),
13744
- /* @__PURE__ */ jsxRuntime.jsx(
13745
- reactComponents.Caption1,
13746
- {
13747
- style: {
13748
- color: reactComponents.tokens.colorNeutralForeground3,
13749
- marginTop: "0.25rem"
13750
- },
13751
- children: mergedLabels.industryTypeHelperText
13752
- }
13753
- )
13844
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: isIndustryTypeOther ? 4 : 6, children: [
13845
+ /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13846
+ mergedLabels.cargoCategoryLabel,
13847
+ " ",
13848
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13849
+ ] }),
13850
+ /* @__PURE__ */ jsxRuntime.jsx(
13851
+ InputDynamic_default,
13852
+ {
13853
+ control,
13854
+ disabled,
13855
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.cargoCategory`,
13856
+ options: loadCategoryOptions,
13857
+ onChange: (val) => {
13858
+ const name = `owners.${ownerIndex}.cargo.${cargoIndex}.cargoCategory`;
13859
+ setValue(name, val);
13860
+ const updatedCargoItems = owner.cargoItems?.map(
13861
+ (c, cIdx) => cIdx === cargoIndex ? {
13862
+ ...c,
13863
+ cargoCategory: val
13864
+ } : c
13865
+ );
13866
+ onUpdateOwner(owner.id, {
13867
+ cargoItems: updatedCargoItems
13868
+ });
13869
+ },
13870
+ placeholder: mergedLabels.selectPlaceholder,
13871
+ required: true,
13872
+ size: "large",
13873
+ type: "select"
13874
+ }
13875
+ )
13876
+ ] })
13754
13877
  ] }),
13755
- isIndustryTypeOther && /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { xl: 4, children: [
13756
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13757
- mergedLabels.industryTypeOthersLabel,
13758
- " ",
13759
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13760
- ] }),
13761
- /* @__PURE__ */ jsxRuntime.jsx(
13878
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13879
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.cargoLabel }) }),
13880
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { md: 12, children: /* @__PURE__ */ jsxRuntime.jsx(
13762
13881
  InputDynamic_default,
13763
13882
  {
13764
13883
  control,
13765
13884
  disabled,
13766
- name: `owners.${index}.cargo.${cargoIndex}.industryTypeOther`,
13767
- placeholder: mergedLabels.industryTypeOthersPlaceholder,
13768
- required: true,
13885
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.cargoWeight`,
13886
+ placeholder: mergedLabels.cargoWeightPlaceholder,
13769
13887
  size: "large",
13770
- type: "text",
13888
+ type: "number",
13889
+ step: "1",
13771
13890
  onChange: (val) => {
13772
13891
  setValue(
13773
- `owners.${index}.cargo.${cargoIndex}.industryTypeOther`,
13774
- val
13892
+ `owners.${ownerIndex}.cargo.${cargoIndex}.cargoWeight`,
13893
+ val ? Number(val) : 0
13775
13894
  );
13776
13895
  const updatedCargoItems = owner.cargoItems?.map(
13777
13896
  (c, cIdx) => cIdx === cargoIndex ? {
13778
13897
  ...c,
13779
- industryTypeOther: val
13780
- } : c
13781
- );
13782
- onUpdateOwner(owner.id, {
13783
- cargoItems: updatedCargoItems
13784
- });
13785
- }
13786
- }
13787
- )
13788
- ] }),
13789
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: isIndustryTypeOther ? 4 : 6, children: [
13790
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1, { className: styles.label, children: [
13791
- mergedLabels.cargoCategoryLabel,
13792
- " ",
13793
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "red" }, children: "*" })
13794
- ] }),
13795
- /* @__PURE__ */ jsxRuntime.jsx(
13796
- InputDynamic_default,
13797
- {
13798
- control,
13799
- disabled,
13800
- name: `owners.${index}.cargo.${cargoIndex}.cargoCategory`,
13801
- options: loadCategoryOptions,
13802
- onChange: (val) => {
13803
- const name = `owners.${index}.cargo.${cargoIndex}.cargoCategory`;
13804
- setValue(name, val);
13805
- const updatedCargoItems = owner.cargoItems?.map(
13806
- (c, cIdx) => cIdx === cargoIndex ? {
13807
- ...c,
13808
- cargoCategory: val
13898
+ cargoWeight: val ? Number(val) : 0
13809
13899
  } : c
13810
13900
  );
13811
13901
  onUpdateOwner(owner.id, {
13812
13902
  cargoItems: updatedCargoItems
13813
13903
  });
13814
13904
  },
13815
- placeholder: mergedLabels.selectPlaceholder,
13816
- required: true,
13817
- size: "large",
13818
- type: "select"
13905
+ contentAfter: /* @__PURE__ */ jsxRuntime.jsx(
13906
+ "div",
13907
+ {
13908
+ style: {
13909
+ paddingRight: "12px",
13910
+ color: reactComponents.tokens.colorNeutralForeground1,
13911
+ fontSize: reactComponents.tokens.fontSizeBase300
13912
+ },
13913
+ children: "Ton"
13914
+ }
13915
+ )
13819
13916
  }
13820
- )
13821
- ] })
13822
- ] }),
13823
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13824
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.estimatedLooseCargoLabel }) }),
13825
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { md: 12, children: /* @__PURE__ */ jsxRuntime.jsx(
13826
- InputDynamic_default,
13827
- {
13828
- control,
13829
- disabled,
13830
- name: `owners.${index}.cargo.${cargoIndex}.cargoWeight`,
13831
- placeholder: mergedLabels.estimatedLooseCargoWeightPlaceholder,
13832
- size: "large",
13833
- type: "number",
13834
- step: "1",
13835
- onChange: (val) => {
13836
- setValue(
13837
- `owners.${index}.cargo.${cargoIndex}.cargoWeight`,
13838
- val ? Number(val) : 0
13839
- );
13840
- const updatedCargoItems = owner.cargoItems?.map(
13841
- (c, cIdx) => cIdx === cargoIndex ? {
13842
- ...c,
13843
- estimatedLooseCargoWeight: val ? Number(val) : 0
13844
- } : c
13845
- );
13846
- onUpdateOwner(owner.id, {
13847
- cargoItems: updatedCargoItems
13848
- });
13849
- },
13850
- contentAfter: /* @__PURE__ */ jsxRuntime.jsx(
13851
- "div",
13852
- {
13853
- style: {
13854
- paddingRight: "12px",
13855
- color: reactComponents.tokens.colorNeutralForeground1,
13856
- fontSize: reactComponents.tokens.fontSizeBase300
13857
- },
13858
- children: "Ton"
13859
- }
13860
- )
13861
- }
13862
- ) })
13863
- ] }),
13864
- (() => {
13865
- if (!_selectedLoadType) return null;
13866
- return /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13867
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: 12, children: [
13868
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.cargoQuantityLabel }),
13869
- /* @__PURE__ */ jsxRuntime.jsxs(
13870
- "div",
13871
- {
13872
- style: {
13873
- display: "flex",
13874
- alignItems: "center",
13875
- border: `1px solid ${reactComponents.tokens.colorNeutralStroke1}`,
13876
- borderRadius: reactComponents.tokens.borderRadiusMedium,
13877
- height: "40px",
13878
- padding: "0 12px",
13879
- backgroundColor: reactComponents.tokens.colorNeutralBackground1
13880
- },
13881
- children: [
13882
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flex: 0.5 } }),
13883
- /* @__PURE__ */ jsxRuntime.jsxs(
13884
- "div",
13885
- {
13886
- style: {
13887
- display: "flex",
13888
- alignItems: "center",
13889
- gap: "12px"
13890
- },
13891
- children: [
13892
- /* @__PURE__ */ jsxRuntime.jsx(
13893
- reactComponents.Button,
13894
- {
13895
- appearance: "transparent",
13896
- disabled,
13897
- icon: /* @__PURE__ */ jsxRuntime.jsx(
13898
- react.Icon,
13899
- {
13900
- icon: "fluent:subtract-circle-24-regular",
13901
- style: {
13902
- fontSize: "24px",
13903
- color: reactComponents.tokens.colorNeutralForeground4
13904
- }
13905
- }
13906
- ),
13907
- "aria-label": mergedLabels.decrementQuantityAriaLabel,
13908
- size: "small",
13909
- onClick: () => {
13910
- const currentVal = getValues(
13911
- `owners.${index}.cargo.${cargoIndex}.quantity`
13912
- ) || 0;
13913
- const currentQty = Number(currentVal);
13914
- if (currentQty > 1) {
13915
- const newVal = currentQty - 1;
13916
- setValue(
13917
- `owners.${index}.cargo.${cargoIndex}.quantity`,
13918
- newVal
13919
- );
13920
- onUpdateCargoQuantity(
13921
- owner.id,
13922
- cargo.id,
13923
- newVal
13924
- );
13925
- }
13926
- },
13927
- style: {
13928
- minWidth: "32px",
13929
- padding: "0"
13930
- }
13931
- }
13932
- ),
13933
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "40px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
13934
- reactHookForm.Controller,
13935
- {
13936
- name: `owners.${index}.cargo.${cargoIndex}.quantity`,
13937
- control,
13938
- disabled,
13939
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsx(
13940
- "input",
13941
- {
13942
- ...field,
13943
- min: 1,
13944
- step: "1",
13945
- type: "number",
13946
- style: {
13947
- border: "none",
13948
- width: "100%",
13949
- textAlign: "center",
13950
- outline: "none",
13951
- backgroundColor: "transparent",
13952
- color: reactComponents.tokens.colorNeutralForeground1,
13953
- fontSize: reactComponents.tokens.fontSizeBase400,
13954
- fontFamily: reactComponents.tokens.fontFamilyBase
13955
- },
13956
- onKeyDown: (e) => {
13957
- if ([
13958
- "e",
13959
- "E",
13960
- "+",
13961
- "-",
13962
- ".",
13963
- ","
13964
- ].includes(e.key)) {
13965
- e.preventDefault();
13966
- }
13967
- },
13968
- onPaste: (e) => {
13969
- const paste = e.clipboardData.getData(
13970
- "text"
13971
- );
13972
- if (!/^\d+$/.test(paste)) {
13973
- e.preventDefault();
13917
+ ) })
13918
+ ] }),
13919
+ (() => {
13920
+ if (!_selectedLoadType) return null;
13921
+ return /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
13922
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: 12, children: [
13923
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.cargoQuantityLabel }),
13924
+ /* @__PURE__ */ jsxRuntime.jsxs(
13925
+ "div",
13926
+ {
13927
+ style: {
13928
+ display: "flex",
13929
+ alignItems: "center",
13930
+ border: `1px solid ${reactComponents.tokens.colorNeutralStroke1}`,
13931
+ borderRadius: reactComponents.tokens.borderRadiusMedium,
13932
+ height: "40px",
13933
+ padding: "0 12px",
13934
+ backgroundColor: reactComponents.tokens.colorNeutralBackground1
13935
+ },
13936
+ children: [
13937
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flex: 0.5 } }),
13938
+ /* @__PURE__ */ jsxRuntime.jsxs(
13939
+ "div",
13940
+ {
13941
+ style: {
13942
+ display: "flex",
13943
+ alignItems: "center",
13944
+ gap: "12px"
13945
+ },
13946
+ children: [
13947
+ /* @__PURE__ */ jsxRuntime.jsx(
13948
+ reactComponents.Button,
13949
+ {
13950
+ appearance: "transparent",
13951
+ disabled,
13952
+ icon: /* @__PURE__ */ jsxRuntime.jsx(
13953
+ react.Icon,
13954
+ {
13955
+ icon: "fluent:subtract-circle-24-regular",
13956
+ style: {
13957
+ fontSize: "24px",
13958
+ color: reactComponents.tokens.colorNeutralForeground4
13974
13959
  }
13975
- },
13976
- onWheel: (e) => e.target.blur(),
13977
- onChange: (e) => {
13978
- const newVal = Number(
13979
- e.target.value
13960
+ }
13961
+ ),
13962
+ "aria-label": mergedLabels.decrementQuantityAriaLabel,
13963
+ size: "small",
13964
+ onClick: () => {
13965
+ const currentVal = getValues(
13966
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
13967
+ ) || 0;
13968
+ const currentQty = Number(currentVal);
13969
+ if (currentQty > 1) {
13970
+ const newVal = currentQty - 1;
13971
+ setValue(
13972
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`,
13973
+ newVal
13980
13974
  );
13981
- field.onChange(e);
13982
13975
  onUpdateCargoQuantity(
13983
13976
  owner.id,
13984
13977
  cargo.id,
13985
13978
  newVal
13986
13979
  );
13987
13980
  }
13981
+ },
13982
+ style: {
13983
+ minWidth: "32px",
13984
+ padding: "0"
13988
13985
  }
13989
- ),
13990
- rules: {
13991
- required: true,
13992
- validate: (val) => Number(val) > 0
13993
13986
  }
13994
- }
13995
- ) }),
13996
- /* @__PURE__ */ jsxRuntime.jsx(
13997
- reactComponents.Button,
13998
- {
13999
- appearance: "transparent",
14000
- disabled,
14001
- icon: /* @__PURE__ */ jsxRuntime.jsx(
14002
- react.Icon,
14003
- {
14004
- icon: "fluent:add-circle-24-regular",
14005
- style: {
14006
- fontSize: "24px",
14007
- color: reactComponents.tokens.colorBrandStroke1
13987
+ ),
13988
+ /* @__PURE__ */ jsxRuntime.jsx(
13989
+ "div",
13990
+ {
13991
+ style: { width: "40px" },
13992
+ children: /* @__PURE__ */ jsxRuntime.jsx(
13993
+ reactHookForm.Controller,
13994
+ {
13995
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`,
13996
+ control,
13997
+ disabled,
13998
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsx(
13999
+ "input",
14000
+ {
14001
+ ...field,
14002
+ min: 1,
14003
+ step: "1",
14004
+ type: "number",
14005
+ style: {
14006
+ border: "none",
14007
+ width: "100%",
14008
+ textAlign: "center",
14009
+ outline: "none",
14010
+ backgroundColor: "transparent",
14011
+ color: reactComponents.tokens.colorNeutralForeground1,
14012
+ fontSize: reactComponents.tokens.fontSizeBase400,
14013
+ fontFamily: reactComponents.tokens.fontFamilyBase
14014
+ },
14015
+ onKeyDown: (e) => {
14016
+ if ([
14017
+ "e",
14018
+ "E",
14019
+ "+",
14020
+ "-",
14021
+ ".",
14022
+ ","
14023
+ ].includes(e.key)) {
14024
+ e.preventDefault();
14025
+ }
14026
+ },
14027
+ onPaste: (e) => {
14028
+ const paste = e.clipboardData.getData(
14029
+ "text"
14030
+ );
14031
+ if (!/^\d+$/.test(
14032
+ paste
14033
+ )) {
14034
+ e.preventDefault();
14035
+ }
14036
+ },
14037
+ onWheel: (e) => e.target.blur(),
14038
+ onChange: (e) => {
14039
+ const newVal = Number(
14040
+ e.target.value
14041
+ );
14042
+ field.onChange(e);
14043
+ onUpdateCargoQuantity(
14044
+ owner.id,
14045
+ cargo.id,
14046
+ newVal
14047
+ );
14048
+ }
14049
+ }
14050
+ ),
14051
+ rules: {
14052
+ required: true,
14053
+ validate: (val) => Number(val) > 0
14054
+ }
14008
14055
  }
14056
+ )
14057
+ }
14058
+ ),
14059
+ /* @__PURE__ */ jsxRuntime.jsx(
14060
+ reactComponents.Button,
14061
+ {
14062
+ appearance: "transparent",
14063
+ disabled,
14064
+ icon: /* @__PURE__ */ jsxRuntime.jsx(
14065
+ react.Icon,
14066
+ {
14067
+ icon: "fluent:add-circle-24-regular",
14068
+ style: {
14069
+ fontSize: "24px",
14070
+ color: reactComponents.tokens.colorBrandStroke1
14071
+ }
14072
+ }
14073
+ ),
14074
+ "aria-label": mergedLabels.incrementQuantityAriaLabel,
14075
+ size: "small",
14076
+ onClick: () => {
14077
+ const currentVal = getValues(
14078
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
14079
+ ) || 0;
14080
+ const currentQty = Number(currentVal);
14081
+ const newVal = currentQty + 1;
14082
+ setValue(
14083
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`,
14084
+ newVal
14085
+ );
14086
+ onUpdateCargoQuantity(
14087
+ owner.id,
14088
+ cargo.id,
14089
+ newVal
14090
+ );
14091
+ },
14092
+ style: {
14093
+ minWidth: "32px",
14094
+ padding: "0"
14009
14095
  }
14010
- ),
14011
- "aria-label": mergedLabels.incrementQuantityAriaLabel,
14012
- size: "small",
14013
- onClick: () => {
14014
- const currentVal = getValues(
14015
- `owners.${index}.cargo.${cargoIndex}.quantity`
14016
- ) || 0;
14017
- const currentQty = Number(currentVal);
14018
- const newVal = currentQty + 1;
14019
- setValue(
14020
- `owners.${index}.cargo.${cargoIndex}.quantity`,
14021
- newVal
14022
- );
14023
- onUpdateCargoQuantity(
14024
- owner.id,
14025
- cargo.id,
14026
- newVal
14027
- );
14028
- },
14029
- style: {
14030
- minWidth: "32px",
14031
- padding: "0"
14032
14096
  }
14097
+ )
14098
+ ]
14099
+ }
14100
+ ),
14101
+ /* @__PURE__ */ jsxRuntime.jsx(
14102
+ "div",
14103
+ {
14104
+ style: {
14105
+ flex: 1,
14106
+ textAlign: "left",
14107
+ color: reactComponents.tokens.colorNeutralForeground1,
14108
+ fontSize: reactComponents.tokens.fontSizeBase300,
14109
+ paddingRight: "8px"
14110
+ },
14111
+ children: (() => {
14112
+ const selectedLoadType2 = loadTypes.find(
14113
+ (loadType) => loadType.id.toString() === watchLoadType
14114
+ );
14115
+ return selectedLoadType2?.unit?.name;
14116
+ })()
14117
+ }
14118
+ )
14119
+ ]
14120
+ }
14121
+ )
14122
+ ] }),
14123
+ /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: 12, children: [
14124
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flex: 0.5 } }),
14125
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.priceLabel }),
14126
+ /* @__PURE__ */ jsxRuntime.jsx(
14127
+ reactComponents.Body2,
14128
+ {
14129
+ style: { marginTop: "0.5rem" },
14130
+ children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
14131
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xl: 6, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1Strong, { children: [
14132
+ _selectedLoadType.name,
14133
+ " \u2022",
14134
+ " ",
14135
+ watchQuantity,
14136
+ "x",
14137
+ " ",
14138
+ _selectedLoadType.unit?.name,
14139
+ " ",
14140
+ "\u2022",
14141
+ " ",
14142
+ _selectedLoadType.formattedPrice
14143
+ ] }) }),
14144
+ /* @__PURE__ */ jsxRuntime.jsx(
14145
+ reactGridSystem.Col,
14146
+ {
14147
+ xl: 6,
14148
+ style: {
14149
+ color: sharedColors["Shared_Secondary_Primary"],
14150
+ textAlign: "right"
14151
+ },
14152
+ children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Stronger, { children: new Intl.NumberFormat(
14153
+ "id-ID",
14154
+ {
14155
+ style: "currency",
14156
+ currency: "IDR",
14157
+ minimumFractionDigits: 0
14033
14158
  }
14034
- )
14035
- ]
14036
- }
14037
- ),
14038
- /* @__PURE__ */ jsxRuntime.jsx(
14039
- "div",
14040
- {
14041
- style: {
14042
- flex: 1,
14043
- textAlign: "left",
14044
- color: reactComponents.tokens.colorNeutralForeground1,
14045
- fontSize: reactComponents.tokens.fontSizeBase300,
14046
- paddingRight: "8px"
14047
- },
14048
- children: (() => {
14049
- const type = watch(
14050
- `owners.${index}.cargo.${cargoIndex}.loadType`
14051
- );
14052
- const selectedLoadType2 = loadTypes.find(
14053
- (loadType) => loadType.id.toString() === type
14054
- );
14055
- return selectedLoadType2?.unit?.name;
14056
- })()
14057
- }
14058
- )
14059
- ]
14060
- }
14061
- )
14062
- ] }),
14063
- /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { md: 12, children: [
14064
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flex: 0.5 } }),
14065
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.priceLabel }),
14066
- /* @__PURE__ */ jsxRuntime.jsx(
14067
- reactComponents.Body2,
14068
- {
14069
- style: { marginTop: "0.5rem" },
14070
- children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
14071
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xl: 6, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1Strong, { children: [
14072
- _selectedLoadType.name,
14073
- " \u2022",
14074
- " ",
14075
- watchQuantity,
14076
- "x",
14077
- " ",
14078
- _selectedLoadType.unit?.name,
14079
- " ",
14080
- "\u2022",
14081
- " ",
14082
- _selectedLoadType.formattedPrice
14083
- ] }) }),
14084
- /* @__PURE__ */ jsxRuntime.jsx(
14085
- reactGridSystem.Col,
14086
- {
14087
- xl: 6,
14088
- style: {
14089
- color: sharedColors["Shared_Secondary_Primary"],
14090
- textAlign: "right"
14091
- },
14092
- children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Stronger, { children: new Intl.NumberFormat(
14093
- "id-ID",
14094
- {
14095
- style: "currency",
14096
- currency: "IDR",
14097
- minimumFractionDigits: 0
14098
- }
14099
- ).format(
14100
- Number(
14101
- getValues(
14102
- `owners.${index}.cargo.${cargoIndex}.quantity`
14103
- ) || 0
14104
- ) * (_selectedLoadType.price || 0)
14105
- ) })
14106
- }
14107
- )
14108
- ] })
14109
- }
14110
- )
14111
- ] })
14112
- ] });
14113
- })(),
14114
- /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: (owner.cargoItems?.length || 0) > 1 && /* @__PURE__ */ jsxRuntime.jsx(
14115
- reactComponents.Button,
14116
- {
14117
- disabled,
14118
- icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:delete-24-regular" }),
14119
- onClick: (e) => {
14120
- e.stopPropagation();
14121
- onDeleteCargo(owner.id, cargo.id);
14122
- },
14123
- onKeyDown: (e) => {
14124
- if (e.key === "Enter" || e.key === " ") {
14159
+ ).format(
14160
+ Number(
14161
+ getValues(
14162
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
14163
+ ) || 0
14164
+ ) * (_selectedLoadType.price || 0)
14165
+ ).replace("Rp", "IDR") })
14166
+ }
14167
+ )
14168
+ ] })
14169
+ }
14170
+ )
14171
+ ] })
14172
+ ] });
14173
+ })(),
14174
+ /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Row, { children: /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: (owner.cargoItems?.length || 0) > 1 && /* @__PURE__ */ jsxRuntime.jsx(
14175
+ reactComponents.Button,
14176
+ {
14177
+ disabled,
14178
+ icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:delete-24-regular" }),
14179
+ onClick: (e) => {
14125
14180
  e.stopPropagation();
14126
14181
  onDeleteCargo(
14127
14182
  owner.id,
14128
14183
  cargo.id
14129
14184
  );
14130
- }
14131
- },
14132
- size: "medium",
14133
- shape: "circular",
14134
- style: {
14135
- border: `1px solid ${reactComponents.tokens.colorPaletteRedForeground1}`,
14136
- color: reactComponents.tokens.colorPaletteRedForeground1,
14137
- width: "100%"
14138
- },
14139
- children: mergedLabels.deleteCargoButton
14140
- }
14141
- ) }) })
14142
- ] }) })
14143
- ]
14144
- },
14145
- cargo.id
14146
- );
14147
- })
14148
- }
14149
- ),
14150
- /* @__PURE__ */ jsxRuntime.jsx(
14151
- reactComponents.Button,
14152
- {
14153
- appearance: "secondary",
14154
- icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:add-24-regular" }),
14155
- shape: "circular",
14156
- style: {
14157
- borderColor: reactComponents.tokens.colorBrandStroke1,
14158
- color: reactComponents.tokens.colorBrandBackground,
14159
- marginTop: "1rem",
14160
- width: "100%"
14161
- },
14162
- onClick: () => onAddCargo(owner.id),
14163
- children: mergedLabels.addCargoButton
14164
- }
14165
- )
14166
- ] }) })
14167
- ] })
14168
- ] }) })
14169
- ]
14170
- },
14171
- owner.id
14172
- ))
14185
+ },
14186
+ onKeyDown: (e) => {
14187
+ if (e.key === "Enter" || e.key === " ") {
14188
+ e.stopPropagation();
14189
+ onDeleteCargo(
14190
+ owner.id,
14191
+ cargo.id
14192
+ );
14193
+ }
14194
+ },
14195
+ size: "medium",
14196
+ shape: "circular",
14197
+ style: {
14198
+ border: `1px solid ${reactComponents.tokens.colorPaletteRedForeground1}`,
14199
+ color: reactComponents.tokens.colorPaletteRedForeground1,
14200
+ width: "100%"
14201
+ },
14202
+ children: mergedLabels.deleteCargoButton
14203
+ }
14204
+ ) }) })
14205
+ ] }) })
14206
+ ]
14207
+ },
14208
+ cargo.id
14209
+ );
14210
+ })
14211
+ }
14212
+ ),
14213
+ /* @__PURE__ */ jsxRuntime.jsx(
14214
+ reactComponents.Button,
14215
+ {
14216
+ appearance: "secondary",
14217
+ icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:add-24-regular" }),
14218
+ shape: "circular",
14219
+ style: {
14220
+ borderColor: reactComponents.tokens.colorBrandStroke1,
14221
+ color: reactComponents.tokens.colorBrandBackground,
14222
+ marginTop: "1rem",
14223
+ width: "100%"
14224
+ },
14225
+ onClick: () => onAddCargo(owner.id),
14226
+ children: mergedLabels.addCargoButton
14227
+ }
14228
+ )
14229
+ ] }) })
14230
+ ] })
14231
+ ] }) })
14232
+ ]
14233
+ },
14234
+ owner.id
14235
+ )
14236
+ ] }, owner.id))
14173
14237
  }
14174
14238
  )
14175
14239
  ] });