@asdp/ferryui 0.1.22-dev.10687 → 0.1.22-dev.10695
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +71 -257
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +71 -257
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -12950,6 +12950,18 @@ var CardVehicleOwnerForm = ({
|
|
|
12950
12950
|
const styles = useStyles27();
|
|
12951
12951
|
const mergedLabels = { ...DEFAULT_LABELS26[language], ...labels };
|
|
12952
12952
|
const formValues = watch();
|
|
12953
|
+
const [defaultOpenCargoItems, setOpenCargoItems] = React__default.default.useState(/* @__PURE__ */ new Set());
|
|
12954
|
+
React.useEffect(() => {
|
|
12955
|
+
const allOpenItems = /* @__PURE__ */ new Set();
|
|
12956
|
+
owners.forEach((owner) => {
|
|
12957
|
+
owner.cargoItems?.forEach((cargo) => {
|
|
12958
|
+
if (cargo._isAccordionOpen) {
|
|
12959
|
+
allOpenItems.add(`cargo-${cargo.id}`);
|
|
12960
|
+
}
|
|
12961
|
+
});
|
|
12962
|
+
});
|
|
12963
|
+
setOpenCargoItems(allOpenItems);
|
|
12964
|
+
}, [owners]);
|
|
12953
12965
|
React.useEffect(() => {
|
|
12954
12966
|
console.log("[CardVehicleOwnerForm] Form values changed:", formValues);
|
|
12955
12967
|
}, [formValues]);
|
|
@@ -13446,9 +13458,18 @@ var CardVehicleOwnerForm = ({
|
|
|
13446
13458
|
reactComponents.Accordion,
|
|
13447
13459
|
{
|
|
13448
13460
|
collapsible: true,
|
|
13449
|
-
defaultOpenItems:
|
|
13450
|
-
|
|
13451
|
-
|
|
13461
|
+
defaultOpenItems: Array.from(defaultOpenCargoItems),
|
|
13462
|
+
onToggle: (e, data) => {
|
|
13463
|
+
const newOpenItems = new Set(data.openItems);
|
|
13464
|
+
setOpenCargoItems(newOpenItems);
|
|
13465
|
+
const updatedCargoItems = owner.cargoItems?.map((cargo) => ({
|
|
13466
|
+
...cargo,
|
|
13467
|
+
_isAccordionOpen: newOpenItems.has(`cargo-${cargo.id}`)
|
|
13468
|
+
}));
|
|
13469
|
+
onUpdateOwner(owner.id, {
|
|
13470
|
+
cargoItems: updatedCargoItems
|
|
13471
|
+
});
|
|
13472
|
+
},
|
|
13452
13473
|
multiple: true,
|
|
13453
13474
|
children: owner.cargoItems?.map((cargo, cargoIndex) => {
|
|
13454
13475
|
const watchCommodity = watch(
|
|
@@ -13494,19 +13515,56 @@ var CardVehicleOwnerForm = ({
|
|
|
13494
13515
|
{
|
|
13495
13516
|
className: styles.accordionHeader,
|
|
13496
13517
|
expandIconPosition: "end",
|
|
13497
|
-
children: /* @__PURE__ */ jsxRuntime.
|
|
13518
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
13498
13519
|
"div",
|
|
13499
13520
|
{
|
|
13500
13521
|
style: {
|
|
13501
13522
|
display: "flex",
|
|
13502
13523
|
justifyContent: "space-between",
|
|
13503
13524
|
alignItems: "center",
|
|
13504
|
-
width: "100%"
|
|
13525
|
+
width: "100%",
|
|
13526
|
+
gap: "1rem"
|
|
13505
13527
|
},
|
|
13506
|
-
children:
|
|
13507
|
-
"
|
|
13508
|
-
|
|
13509
|
-
|
|
13528
|
+
children: [
|
|
13529
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { style: { minWidth: "fit-content" }, children: mergedLabels.cargoItemTitle.replace(
|
|
13530
|
+
"{index}",
|
|
13531
|
+
(cargoIndex + 1).toString()
|
|
13532
|
+
) }),
|
|
13533
|
+
_selectedLoadType && !cargo._isAccordionOpen && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
13534
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1Strong, { style: { flex: 1 }, children: [
|
|
13535
|
+
_selectedLoadType.name,
|
|
13536
|
+
" \u2022",
|
|
13537
|
+
" ",
|
|
13538
|
+
watchQuantity,
|
|
13539
|
+
"x",
|
|
13540
|
+
" ",
|
|
13541
|
+
_selectedLoadType.unit?.name,
|
|
13542
|
+
" \u2022",
|
|
13543
|
+
" ",
|
|
13544
|
+
_selectedLoadType.formattedPrice
|
|
13545
|
+
] }),
|
|
13546
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
13547
|
+
reactComponents.Body1Stronger,
|
|
13548
|
+
{
|
|
13549
|
+
style: {
|
|
13550
|
+
color: sharedColors["Shared_Secondary_Primary"],
|
|
13551
|
+
minWidth: "fit-content"
|
|
13552
|
+
},
|
|
13553
|
+
children: new Intl.NumberFormat("id-ID", {
|
|
13554
|
+
style: "currency",
|
|
13555
|
+
currency: "IDR",
|
|
13556
|
+
minimumFractionDigits: 0
|
|
13557
|
+
}).format(
|
|
13558
|
+
Number(
|
|
13559
|
+
getValues(
|
|
13560
|
+
`owners.${index}.cargo.${cargoIndex}.quantity`
|
|
13561
|
+
) || 0
|
|
13562
|
+
) * (_selectedLoadType.price || 0)
|
|
13563
|
+
)
|
|
13564
|
+
}
|
|
13565
|
+
)
|
|
13566
|
+
] })
|
|
13567
|
+
]
|
|
13510
13568
|
}
|
|
13511
13569
|
)
|
|
13512
13570
|
}
|
|
@@ -13783,253 +13841,6 @@ var CardVehicleOwnerForm = ({
|
|
|
13783
13841
|
}
|
|
13784
13842
|
) })
|
|
13785
13843
|
] }),
|
|
13786
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
|
|
13787
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.estimatedLooseCargoQuantityLabel }) }),
|
|
13788
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { lg: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
13789
|
-
"div",
|
|
13790
|
-
{
|
|
13791
|
-
style: {
|
|
13792
|
-
display: "flex",
|
|
13793
|
-
alignItems: "center",
|
|
13794
|
-
border: `1px solid ${reactComponents.tokens.colorNeutralStroke1}`,
|
|
13795
|
-
borderRadius: reactComponents.tokens.borderRadiusMedium,
|
|
13796
|
-
height: "40px",
|
|
13797
|
-
padding: "0 12px",
|
|
13798
|
-
backgroundColor: reactComponents.tokens.colorNeutralBackground1
|
|
13799
|
-
},
|
|
13800
|
-
children: [
|
|
13801
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { flex: 0.5 } }),
|
|
13802
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
13803
|
-
"div",
|
|
13804
|
-
{
|
|
13805
|
-
style: {
|
|
13806
|
-
display: "flex",
|
|
13807
|
-
alignItems: "center",
|
|
13808
|
-
gap: "12px"
|
|
13809
|
-
},
|
|
13810
|
-
children: [
|
|
13811
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
13812
|
-
reactComponents.Button,
|
|
13813
|
-
{
|
|
13814
|
-
appearance: "transparent",
|
|
13815
|
-
disabled,
|
|
13816
|
-
icon: /* @__PURE__ */ jsxRuntime.jsx(
|
|
13817
|
-
react.Icon,
|
|
13818
|
-
{
|
|
13819
|
-
icon: "fluent:subtract-circle-24-regular",
|
|
13820
|
-
style: {
|
|
13821
|
-
fontSize: "24px",
|
|
13822
|
-
color: reactComponents.tokens.colorNeutralForeground4
|
|
13823
|
-
}
|
|
13824
|
-
}
|
|
13825
|
-
),
|
|
13826
|
-
"aria-label": mergedLabels.decrementQuantityAriaLabel,
|
|
13827
|
-
size: "small",
|
|
13828
|
-
onClick: () => {
|
|
13829
|
-
const currentVal = getValues(
|
|
13830
|
-
`owners.${index}.cargo.${cargoIndex}.estimatedLooseCargoQuantity`
|
|
13831
|
-
) || 0;
|
|
13832
|
-
const currentQty = Number(currentVal);
|
|
13833
|
-
if (currentQty > 0) {
|
|
13834
|
-
const newVal = currentQty - 1;
|
|
13835
|
-
setValue(
|
|
13836
|
-
`owners.${index}.cargo.${cargoIndex}.estimatedLooseCargoQuantity`,
|
|
13837
|
-
newVal
|
|
13838
|
-
);
|
|
13839
|
-
const updatedCargoItems = owner.cargoItems?.map(
|
|
13840
|
-
(c, cIdx) => cIdx === cargoIndex ? {
|
|
13841
|
-
...c,
|
|
13842
|
-
estimatedLooseCargoQuantity: newVal
|
|
13843
|
-
} : c
|
|
13844
|
-
);
|
|
13845
|
-
onUpdateOwner(owner.id, {
|
|
13846
|
-
cargoItems: updatedCargoItems
|
|
13847
|
-
});
|
|
13848
|
-
}
|
|
13849
|
-
},
|
|
13850
|
-
style: {
|
|
13851
|
-
minWidth: "32px",
|
|
13852
|
-
padding: "0"
|
|
13853
|
-
}
|
|
13854
|
-
}
|
|
13855
|
-
),
|
|
13856
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "40px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
13857
|
-
reactHookForm.Controller,
|
|
13858
|
-
{
|
|
13859
|
-
name: `owners.${index}.cargo.${cargoIndex}.estimatedLooseCargoQuantity`,
|
|
13860
|
-
control,
|
|
13861
|
-
disabled,
|
|
13862
|
-
render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
13863
|
-
"input",
|
|
13864
|
-
{
|
|
13865
|
-
...field,
|
|
13866
|
-
min: 0,
|
|
13867
|
-
step: "1",
|
|
13868
|
-
type: "number",
|
|
13869
|
-
style: {
|
|
13870
|
-
border: "none",
|
|
13871
|
-
width: "100%",
|
|
13872
|
-
textAlign: "center",
|
|
13873
|
-
outline: "none",
|
|
13874
|
-
backgroundColor: "transparent",
|
|
13875
|
-
color: reactComponents.tokens.colorNeutralForeground1,
|
|
13876
|
-
fontSize: reactComponents.tokens.fontSizeBase400,
|
|
13877
|
-
fontFamily: reactComponents.tokens.fontFamilyBase
|
|
13878
|
-
},
|
|
13879
|
-
onKeyDown: (e) => {
|
|
13880
|
-
if ([
|
|
13881
|
-
"e",
|
|
13882
|
-
"E",
|
|
13883
|
-
"+",
|
|
13884
|
-
"-",
|
|
13885
|
-
".",
|
|
13886
|
-
","
|
|
13887
|
-
].includes(e.key)) {
|
|
13888
|
-
e.preventDefault();
|
|
13889
|
-
}
|
|
13890
|
-
},
|
|
13891
|
-
onPaste: (e) => {
|
|
13892
|
-
const paste = e.clipboardData.getData(
|
|
13893
|
-
"text"
|
|
13894
|
-
);
|
|
13895
|
-
if (!/^\d+$/.test(paste)) {
|
|
13896
|
-
e.preventDefault();
|
|
13897
|
-
}
|
|
13898
|
-
},
|
|
13899
|
-
onWheel: (e) => e.target.blur(),
|
|
13900
|
-
onChange: (e) => {
|
|
13901
|
-
const newVal = Number(
|
|
13902
|
-
e.target.value
|
|
13903
|
-
);
|
|
13904
|
-
field.onChange(e);
|
|
13905
|
-
const updatedCargoItems = owner.cargoItems?.map(
|
|
13906
|
-
(c, cIdx) => cIdx === cargoIndex ? {
|
|
13907
|
-
...c,
|
|
13908
|
-
estimatedLooseCargoQuantity: newVal
|
|
13909
|
-
} : c
|
|
13910
|
-
);
|
|
13911
|
-
onUpdateOwner(owner.id, {
|
|
13912
|
-
cargoItems: updatedCargoItems
|
|
13913
|
-
});
|
|
13914
|
-
}
|
|
13915
|
-
}
|
|
13916
|
-
),
|
|
13917
|
-
rules: {
|
|
13918
|
-
validate: (val) => Number(val) >= 0
|
|
13919
|
-
}
|
|
13920
|
-
}
|
|
13921
|
-
) }),
|
|
13922
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
13923
|
-
reactComponents.Button,
|
|
13924
|
-
{
|
|
13925
|
-
appearance: "transparent",
|
|
13926
|
-
disabled,
|
|
13927
|
-
icon: /* @__PURE__ */ jsxRuntime.jsx(
|
|
13928
|
-
react.Icon,
|
|
13929
|
-
{
|
|
13930
|
-
icon: "fluent:add-circle-24-regular",
|
|
13931
|
-
style: {
|
|
13932
|
-
fontSize: "24px",
|
|
13933
|
-
color: reactComponents.tokens.colorBrandStroke1
|
|
13934
|
-
}
|
|
13935
|
-
}
|
|
13936
|
-
),
|
|
13937
|
-
"aria-label": mergedLabels.incrementQuantityAriaLabel,
|
|
13938
|
-
size: "small",
|
|
13939
|
-
onClick: () => {
|
|
13940
|
-
const currentVal = getValues(
|
|
13941
|
-
`owners.${index}.cargo.${cargoIndex}.estimatedLooseCargoQuantity`
|
|
13942
|
-
) || 0;
|
|
13943
|
-
const currentQty = Number(currentVal);
|
|
13944
|
-
const newVal = currentQty + 1;
|
|
13945
|
-
setValue(
|
|
13946
|
-
`owners.${index}.cargo.${cargoIndex}.estimatedLooseCargoQuantity`,
|
|
13947
|
-
newVal
|
|
13948
|
-
);
|
|
13949
|
-
const updatedCargoItems = owner.cargoItems?.map(
|
|
13950
|
-
(c, cIdx) => cIdx === cargoIndex ? {
|
|
13951
|
-
...c,
|
|
13952
|
-
estimatedLooseCargoQuantity: newVal
|
|
13953
|
-
} : c
|
|
13954
|
-
);
|
|
13955
|
-
onUpdateOwner(owner.id, {
|
|
13956
|
-
cargoItems: updatedCargoItems
|
|
13957
|
-
});
|
|
13958
|
-
},
|
|
13959
|
-
style: {
|
|
13960
|
-
minWidth: "32px",
|
|
13961
|
-
padding: "0"
|
|
13962
|
-
}
|
|
13963
|
-
}
|
|
13964
|
-
)
|
|
13965
|
-
]
|
|
13966
|
-
}
|
|
13967
|
-
),
|
|
13968
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
13969
|
-
"div",
|
|
13970
|
-
{
|
|
13971
|
-
style: {
|
|
13972
|
-
flex: 1,
|
|
13973
|
-
textAlign: "left",
|
|
13974
|
-
color: reactComponents.tokens.colorNeutralForeground1,
|
|
13975
|
-
fontSize: reactComponents.tokens.fontSizeBase300,
|
|
13976
|
-
paddingRight: "8px"
|
|
13977
|
-
},
|
|
13978
|
-
children: mergedLabels.estimatedLooseCargoUnitLabel
|
|
13979
|
-
}
|
|
13980
|
-
)
|
|
13981
|
-
]
|
|
13982
|
-
}
|
|
13983
|
-
) })
|
|
13984
|
-
] }),
|
|
13985
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Row, { children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Col, { lg: 12, children: [
|
|
13986
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.label, children: mergedLabels.priceLabel }),
|
|
13987
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
13988
|
-
reactComponents.Body2,
|
|
13989
|
-
{
|
|
13990
|
-
style: { marginTop: "0.5rem" },
|
|
13991
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
|
|
13992
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xl: 6, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1Strong, { children: [
|
|
13993
|
-
watch(
|
|
13994
|
-
`owners.${index}.cargo.${cargoIndex}.commodity`
|
|
13995
|
-
) || "Komoditas",
|
|
13996
|
-
" ",
|
|
13997
|
-
"\u2022 ",
|
|
13998
|
-
watch(
|
|
13999
|
-
`owners.${index}.cargo.${cargoIndex}.estimatedLooseCargoQuantity`
|
|
14000
|
-
) || 0,
|
|
14001
|
-
"x",
|
|
14002
|
-
" ",
|
|
14003
|
-
mergedLabels.estimatedLooseCargoUnitLabel,
|
|
14004
|
-
" ",
|
|
14005
|
-
"\u2022 IDR. 15,000"
|
|
14006
|
-
] }) }),
|
|
14007
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
14008
|
-
reactGridSystem.Col,
|
|
14009
|
-
{
|
|
14010
|
-
xl: 6,
|
|
14011
|
-
style: {
|
|
14012
|
-
color: sharedColors["Shared_Secondary_Primary"],
|
|
14013
|
-
textAlign: "right"
|
|
14014
|
-
},
|
|
14015
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Stronger, { children: new Intl.NumberFormat(
|
|
14016
|
-
"id-ID",
|
|
14017
|
-
{
|
|
14018
|
-
style: "currency",
|
|
14019
|
-
currency: "IDR",
|
|
14020
|
-
minimumFractionDigits: 0
|
|
14021
|
-
}
|
|
14022
|
-
).format(
|
|
14023
|
-
(watch(
|
|
14024
|
-
`owners.${index}.cargo.${cargoIndex}.estimatedLooseCargoQuantity`
|
|
14025
|
-
) || 0) * 15e3
|
|
14026
|
-
) })
|
|
14027
|
-
}
|
|
14028
|
-
)
|
|
14029
|
-
] })
|
|
14030
|
-
}
|
|
14031
|
-
)
|
|
14032
|
-
] }) }),
|
|
14033
13844
|
(() => {
|
|
14034
13845
|
if (!_selectedLoadType) return null;
|
|
14035
13846
|
return /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { children: [
|
|
@@ -14254,7 +14065,10 @@ var CardVehicleOwnerForm = ({
|
|
|
14254
14065
|
reactGridSystem.Col,
|
|
14255
14066
|
{
|
|
14256
14067
|
xl: 6,
|
|
14257
|
-
style: {
|
|
14068
|
+
style: {
|
|
14069
|
+
color: sharedColors["Shared_Secondary_Primary"],
|
|
14070
|
+
textAlign: "right"
|
|
14071
|
+
},
|
|
14258
14072
|
children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Stronger, { children: new Intl.NumberFormat(
|
|
14259
14073
|
"id-ID",
|
|
14260
14074
|
{
|