sales-frontend-components 3.0.9 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/camera/camera.module.scss +136 -1
  2. package/dist/index.cjs.js +751 -442
  3. package/dist/index.d.ts +186 -12
  4. package/dist/index.esm.js +751 -443
  5. package/dist/modal/standard/customer-search/customer-search.module.scss +8 -0
  6. package/package.json +12 -12
package/dist/index.cjs.js CHANGED
@@ -22,8 +22,8 @@ var styles$9 = require('./modal/pre-standard/job-vehicle-search-modal/job-vehicl
22
22
  var styles$a = require('./modal/pre-standard/vehicle-search-modal/vehicle-search-modal.module.scss');
23
23
  var styles$b = require('./modal/pre-standard/organization-search-modal/organization-search-modal.module.scss');
24
24
  var styles$c = require('./step-indicator/step-indicator.module.scss');
25
- var salesFrontendBridge = require('sales-frontend-bridge');
26
25
  var styles$d = require('./camera/camera.module.scss');
26
+ var salesFrontendBridge = require('sales-frontend-bridge');
27
27
  var remoteIdentityVerification = require('sales-frontend-headless/remote-identity-verification');
28
28
  var styles$e = require('./terms/components/unit/terms-radio.module.scss');
29
29
  var styles$f = require('./terms/components/unit/terms-rating-bar.module.scss');
@@ -176,12 +176,6 @@ var isClient$1 = () => {
176
176
  return false;
177
177
  }
178
178
  };
179
- var isAndroidDevice = () => {
180
- if (isClient$1() === false) {
181
- return false;
182
- }
183
- return /Android/i.test(navigator.userAgent);
184
- };
185
179
  var _MessageEventManager = class _MessageEventManager2 {
186
180
  constructor() {
187
181
  __publicField(this, "handlers", /* @__PURE__ */ new Map());
@@ -663,12 +657,12 @@ const highlightOnSearchKeyword = (originalText, targetString) => {
663
657
  return replacedText;
664
658
  };
665
659
 
666
- const cx$x = classNames$1.bind(styles);
660
+ const cx$y = classNames$1.bind(styles);
667
661
  const { InputBox: InputBox$4, Input: Input$4 } = salesFrontendDesignSystem.FormCore;
668
662
  const AddressSearchInitialText = () => {
669
663
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
670
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: cx$x("guide-title"), children: "\uC774\uB807\uAC8C \uAC80\uC0C9\uD574 \uBCF4\uC138\uC694." }),
671
- /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: cx$x("guide"), children: [
664
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: cx$y("guide-title"), children: "\uC774\uB807\uAC8C \uAC80\uC0C9\uD574 \uBCF4\uC138\uC694." }),
665
+ /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: cx$y("guide"), children: [
672
666
  /* @__PURE__ */ jsxRuntime.jsx("li", { children: "\uB3C4\uB85C\uBA85/\uC9C0\uBA85\uACFC \uAC74\uBB3C\uBC88\uD638\uB97C \uD568\uAED8 \uC785\uB825\uD574\uC8FC\uC138\uC694" }),
673
667
  /* @__PURE__ */ jsxRuntime.jsx("li", { children: "\uC608) 63\uB85C 50, \uC5EC\uC758\uB3C4\uB3D9 60" }),
674
668
  /* @__PURE__ */ jsxRuntime.jsx("li", { children: "\uC9C0\uBA85\uC740 \uB3D9/\uC74D/\uBA74/\uB9AC\uB85C \uC785\uB825\uD574\uC8FC\uC138\uC694" }),
@@ -685,31 +679,32 @@ const AddressSearchResult = ({
685
679
  selectedAddress
686
680
  }) => {
687
681
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
688
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$x("guide-title"), children: [
682
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$y("guide-title"), children: [
689
683
  "\uCD1D ",
690
684
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: addressSearchList.length }),
691
685
  "\uAC74\uC758 \uAC80\uC0C9\uACB0\uACFC"
692
686
  ] }),
693
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$x("search-result-wrapper"), children: addressSearchList?.map((item, index) => {
694
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$x("search-result-row"), children: /* @__PURE__ */ jsxRuntime.jsx(
687
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$y("search-result-wrapper"), children: addressSearchList?.map((item, index) => {
688
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$y("search-result-row"), children: /* @__PURE__ */ jsxRuntime.jsx(
695
689
  salesFrontendDesignSystem.Radio.Item,
696
690
  {
697
- wrapperProps: { className: cx$x("search-result-radio") },
691
+ wrapperProps: { className: cx$y("search-result-radio") },
698
692
  id: `address-search-result--${index}`,
699
693
  size: "medium",
700
694
  name: "address-search",
695
+ clampLabel: false,
701
696
  onChange,
702
697
  value: String(index),
703
698
  checked: item.firstPostalCode === selectedAddress?.firstPostalCode && item.secondPostalCode === selectedAddress?.secondPostalCode && item.roadNameBaseAddress === selectedAddress?.roadNameBaseAddress && item.roadNameDetailAddress === selectedAddress?.roadNameDetailAddress,
704
- children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$x("search-result"), children: [
705
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("zipcode"), children: highlightOnSearchKeyword(`${item.firstPostalCode}${item.secondPostalCode}`, searchKeyword) }),
706
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("divider") }),
707
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$x("address-info"), children: [
708
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("road-address"), children: highlightOnSearchKeyword(
699
+ children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$y("search-result"), children: [
700
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$y("zipcode"), children: highlightOnSearchKeyword(`${item.firstPostalCode}${item.secondPostalCode}`, searchKeyword) }),
701
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$y("divider") }),
702
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$y("address-info"), children: [
703
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$y("road-address"), children: highlightOnSearchKeyword(
709
704
  `${item.roadNameBaseAddress} ${item.roadNameDetailAddress} ${item.mainBuildingName}`,
710
705
  searchKeyword
711
706
  ) }),
712
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("land-address"), children: highlightOnSearchKeyword(
707
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$y("land-address"), children: highlightOnSearchKeyword(
713
708
  `${item.landNumberBaseAddress} ${item.landNumberDetailAddress}`,
714
709
  searchKeyword
715
710
  ) })
@@ -733,20 +728,29 @@ const AddressSearchDetailInput = ({
733
728
  }) => {
734
729
  const { land, road } = selectedStandardizationAddress || {};
735
730
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
736
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Root, { name: "address-search-standardization", size: "medium", align: "vertical", className: "mb-xxlarge", children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Item, { wrapperProps: { className: cx$x("search-result-radio") }, value: "", checked: true, children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$x("search-result"), children: [
737
- /* @__PURE__ */ jsxRuntime.jsx(
738
- "span",
739
- {
740
- className: cx$x("zipcode"),
741
- children: `${selectedStandardizationAddress?.land?.firstPostalCode}${land?.secondPostalCode}`
742
- }
743
- ),
744
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("divider") }),
745
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$x("address-info"), children: [
746
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("road-address"), children: `${road?.baseAddress} ${road?.detailAddress}` }),
747
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("land-address"), children: `${land?.baseAddress} ${land?.detailAddress}` })
748
- ] })
749
- ] }) }) }),
731
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Root, { name: "address-search-standardization", size: "medium", align: "vertical", className: "mb-xxlarge", children: /* @__PURE__ */ jsxRuntime.jsx(
732
+ salesFrontendDesignSystem.Radio.Item,
733
+ {
734
+ wrapperProps: { className: cx$y("search-result-radio") },
735
+ value: "",
736
+ checked: true,
737
+ clampLabel: false,
738
+ children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$y("search-result"), children: [
739
+ /* @__PURE__ */ jsxRuntime.jsx(
740
+ "span",
741
+ {
742
+ className: cx$y("zipcode"),
743
+ children: `${selectedStandardizationAddress?.land?.firstPostalCode}${land?.secondPostalCode}`
744
+ }
745
+ ),
746
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$y("divider") }),
747
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$y("address-info"), children: [
748
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$y("road-address"), children: `${road?.baseAddress} ${road?.detailAddress}` }),
749
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$y("land-address"), children: `${land?.baseAddress} ${land?.detailAddress}` })
750
+ ] })
751
+ ] })
752
+ }
753
+ ) }),
750
754
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "d-flex gap-large items-center", children: [
751
755
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.FormField.Label, { htmlFor: "detail", children: "\uC0C1\uC138\uC8FC\uC18C" }),
752
756
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -802,7 +806,7 @@ function AddressComponent({ isOpen, onClose, setValue, inputProps, inputBoxProps
802
806
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Overlay, {}),
803
807
  /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Content, { children: [
804
808
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Header, { headerTitle: "\uC8FC\uC18C \uAC80\uC0C9", showCloseButton: true }),
805
- /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Body, { className: cx$x("modal-body"), children: [
809
+ /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Body, { className: cx$y("modal-body"), children: [
806
810
  /* @__PURE__ */ jsxRuntime.jsx(
807
811
  InputBox$4,
808
812
  {
@@ -826,7 +830,7 @@ function AddressComponent({ isOpen, onClose, setValue, inputProps, inputBoxProps
826
830
  }
827
831
  ),
828
832
  addressSearchStep === "initial" && /* @__PURE__ */ jsxRuntime.jsx(AddressSearchInitialText, {}),
829
- isLoading && /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Loading.Wait, { className: cx$x("loading") }),
833
+ isLoading && /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Loading.Wait, { className: cx$y("loading") }),
830
834
  !isLoading && addressSearchStep === "search-result" && /* @__PURE__ */ jsxRuntime.jsx(
831
835
  AddressSearchResult,
832
836
  {
@@ -1497,26 +1501,26 @@ function useBankStockSearch({ onSelect, commonCodeId }) {
1497
1501
  };
1498
1502
  }
1499
1503
 
1500
- const cx$w = classNames$1.bind(styles$1);
1504
+ const cx$x = classNames$1.bind(styles$1);
1501
1505
  function BankStockSearchModal({ open, onClose, onSelect, commonCodeId }) {
1502
1506
  const { bankList, stockList, handleSelect } = useBankStockSearch({
1503
1507
  onSelect,
1504
1508
  commonCodeId
1505
1509
  });
1506
1510
  const renderItems = (list) => {
1507
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$w("grid-container"), children: list.map((item) => {
1511
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$x("grid-container"), children: list.map((item) => {
1508
1512
  const findItem = BANK_STOCK_ICON_LIST.find((icon) => icon.codeVal === item.codeVal);
1509
1513
  const convertedItem = findItem ? findItem : {
1510
1514
  replaceName: item.codeName
1511
1515
  };
1512
- return /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cx$w("grid-item", "text-pre-line"), onClick: () => handleSelect(item), children: [
1513
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$w("icon-box"), children: /* @__PURE__ */ jsxRuntime.jsx(
1516
+ return /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cx$x("grid-item", "text-pre-line"), onClick: () => handleSelect(item), children: [
1517
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("icon-box"), children: /* @__PURE__ */ jsxRuntime.jsx(
1514
1518
  "span",
1515
1519
  {
1516
- className: `${cx$w("icon")} dsp-icons ${findItem?.className ?? "dsp-icons-graphics-stock-hochul-eopsum"}`
1520
+ className: `${cx$x("icon")} dsp-icons ${findItem?.className ?? "dsp-icons-graphics-stock-hochul-eopsum"}`
1517
1521
  }
1518
1522
  ) }),
1519
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$w("icon-name"), children: convertedItem?.replaceName })
1523
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$x("icon-name"), children: convertedItem?.replaceName })
1520
1524
  ] }, item.codeVal);
1521
1525
  }) });
1522
1526
  };
@@ -1524,13 +1528,13 @@ function BankStockSearchModal({ open, onClose, onSelect, commonCodeId }) {
1524
1528
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Overlay, {}),
1525
1529
  /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Content, { children: [
1526
1530
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Header, { headerTitle: "\uC740\uD589/\uC99D\uAD8C\uC0AC \uC120\uD0DD", showCloseButton: true }),
1527
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$w("container"), children: [
1528
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$w("section"), children: [
1529
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cx$w("section-title"), children: "\uC740\uD589\uC0AC" }),
1531
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$x("container"), children: [
1532
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$x("section"), children: [
1533
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cx$x("section-title"), children: "\uC740\uD589\uC0AC" }),
1530
1534
  renderItems(bankList || [])
1531
1535
  ] }),
1532
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$w("section"), children: [
1533
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cx$w("section-title"), children: "\uC99D\uAD8C\uC0AC" }),
1536
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$x("section"), children: [
1537
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cx$x("section-title"), children: "\uC99D\uAD8C\uC0AC" }),
1534
1538
  renderItems(stockList || [])
1535
1539
  ] })
1536
1540
  ] }) })
@@ -1549,7 +1553,7 @@ const useCustomerSearch = (onSelect, options) => {
1549
1553
  const [customerList, setCustomerList] = React9.useState([]);
1550
1554
  const [selectedCustomer, setSelectedCustomer] = React9.useState(null);
1551
1555
  const setSentryCustInfo = salesFrontendStores.useSetSentryCustInfo();
1552
- const { data } = method.useSearchCustomerListQuery({ customerName: searchKeyword });
1556
+ const { data, isFetching } = method.useSearchCustomerListQuery({ customerName: searchKeyword });
1553
1557
  const search = () => {
1554
1558
  if (searchInput.length >= 2) {
1555
1559
  setSearchKeyword(searchInput);
@@ -1602,6 +1606,7 @@ const useCustomerSearch = (onSelect, options) => {
1602
1606
  searchInput,
1603
1607
  customerList,
1604
1608
  searchKeyword,
1609
+ isLoading: isFetching && searchKeyword.length > 0,
1605
1610
  onSearchInputChange,
1606
1611
  onKeyUp,
1607
1612
  search,
@@ -1615,7 +1620,7 @@ const useCustomerSearch = (onSelect, options) => {
1615
1620
  };
1616
1621
  };
1617
1622
 
1618
- const cx$v = classNames$1.bind(styles$2);
1623
+ const cx$w = classNames$1.bind(styles$2);
1619
1624
  const { InputBox: InputBox$3, Input: Input$3 } = salesFrontendDesignSystem.FormCore;
1620
1625
  const CustomerSearch = ({
1621
1626
  onSelectCustomer,
@@ -1632,6 +1637,7 @@ const CustomerSearch = ({
1632
1637
  searchInput,
1633
1638
  customerList,
1634
1639
  searchKeyword,
1640
+ isLoading,
1635
1641
  onSearchInputChange,
1636
1642
  onKeyUp,
1637
1643
  search,
@@ -1642,8 +1648,8 @@ const CustomerSearch = ({
1642
1648
  onClear();
1643
1649
  onSearchClear?.();
1644
1650
  };
1645
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$v("container"), children: [
1646
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$v("search-bar"), children: /* @__PURE__ */ jsxRuntime.jsx(
1651
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$w("container"), children: [
1652
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$w("search-bar"), children: /* @__PURE__ */ jsxRuntime.jsx(
1647
1653
  InputBox$3,
1648
1654
  {
1649
1655
  endElement: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconMainUiSearch, { onClick: search, style: { width: "20px", height: "20px" } }),
@@ -1664,34 +1670,38 @@ const CustomerSearch = ({
1664
1670
  )
1665
1671
  }
1666
1672
  ) }),
1667
- isOpen && customerList.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(DropDown, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$v("result-container"), children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.List, { children: customerList.map((customer, index) => /* @__PURE__ */ jsxRuntime.jsx(
1673
+ isOpen && searchKeyword && /* @__PURE__ */ jsxRuntime.jsx(DropDown, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$w("result-container"), children: customerList.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.List, { children: customerList.map((customer, index) => /* @__PURE__ */ jsxRuntime.jsx(
1668
1674
  salesFrontendDesignSystem.ListItem,
1669
1675
  {
1670
1676
  onClick: () => handleSelectItem(customer),
1671
1677
  selectable: true,
1672
- children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cx$v("customer-item"), children: [
1673
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$v("name"), children: highlightOnSearchKeyword(customer.customerName || "", searchKeyword) }),
1674
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$v("details"), children: [
1678
+ children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cx$w("customer-item"), children: [
1679
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$w("name"), children: highlightOnSearchKeyword(customer.customerName || "", searchKeyword) }),
1680
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$w("details"), children: [
1675
1681
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: customer.birthDate && convertDateString({
1676
1682
  dateString: customer.birthDate,
1677
1683
  fromFormat: "YYYYMMDD",
1678
1684
  toFormat: "YYYY.MM.DD"
1679
1685
  }) }),
1680
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$v("separator"), children: "|" }),
1686
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$w("separator"), children: "|" }),
1681
1687
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: getGenderName(customer.genderCode) }),
1682
1688
  customer.baseAddress && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1683
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$v("separator"), children: "|" }),
1689
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$w("separator"), children: "|" }),
1684
1690
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: customer.baseAddress })
1685
1691
  ] })
1686
1692
  ] })
1687
1693
  ] })
1688
1694
  },
1689
1695
  `cust-item-${customer.customerId}-${index}`
1690
- )) }) }) })
1696
+ )) }) : !isLoading && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$w("no-result-message"), children: [
1697
+ "`",
1698
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: searchKeyword }),
1699
+ "`\uC5D0 \uB300\uD55C \uAC80\uC0C9\uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4."
1700
+ ] }) }) })
1691
1701
  ] });
1692
1702
  };
1693
1703
 
1694
- const cx$u = classNames$1.bind(styles$2);
1704
+ const cx$v = classNames$1.bind(styles$2);
1695
1705
  const { InputBox: InputBox$2, Input: Input$2 } = salesFrontendDesignSystem.FormCore;
1696
1706
  function CustomerSearchModal({ isOpen, closeModal, onSelect, onSearchClear, inputProps, inputBoxProps }) {
1697
1707
  const {
@@ -1738,12 +1748,12 @@ function CustomerSearchModal({ isOpen, closeModal, onSelect, onSearchClear, inpu
1738
1748
  )
1739
1749
  }
1740
1750
  ),
1741
- searchKeyword && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$u("result-count"), children: [
1751
+ searchKeyword && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$v("result-count"), children: [
1742
1752
  "\uCD1D ",
1743
1753
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: customerList.length }),
1744
1754
  "\uAC74\uC758 \uAC80\uC0C9\uACB0\uACFC"
1745
1755
  ] }),
1746
- searchKeyword && customerList.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$u("search-result"), children: [
1756
+ searchKeyword && customerList.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$v("search-result"), children: [
1747
1757
  "`",
1748
1758
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: searchKeyword }),
1749
1759
  "`\uC5D0 \uB300\uD55C \uAC80\uC0C9\uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4."
@@ -1759,18 +1769,18 @@ function CustomerSearchModal({ isOpen, closeModal, onSelect, onSearchClear, inpu
1759
1769
  closeModal();
1760
1770
  },
1761
1771
  selectable: true,
1762
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$u("customer-item", "modal"), children: [
1763
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$u("name"), children: highlightOnSearchKeyword(customer.customerName || "", searchKeyword) }),
1764
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$u("details", "modal"), children: [
1772
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$v("customer-item", "modal"), children: [
1773
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$v("name"), children: highlightOnSearchKeyword(customer.customerName || "", searchKeyword) }),
1774
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$v("details", "modal"), children: [
1765
1775
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: customer.birthDate && convertDateString({
1766
1776
  dateString: customer.birthDate,
1767
1777
  fromFormat: "YYYYMMDD",
1768
1778
  toFormat: "YYYY.MM.DD"
1769
1779
  }) }),
1770
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$u("separator"), children: "|" }),
1780
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$v("separator"), children: "|" }),
1771
1781
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: getGenderName(customer.genderCode) }),
1772
1782
  customer.baseAddress && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1773
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$u("separator"), children: "|" }),
1783
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$v("separator"), children: "|" }),
1774
1784
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: customer.baseAddress })
1775
1785
  ] })
1776
1786
  ] })
@@ -1783,7 +1793,7 @@ function CustomerSearchModal({ isOpen, closeModal, onSelect, onSearchClear, inpu
1783
1793
  ] });
1784
1794
  }
1785
1795
 
1786
- const cx$t = classNames$1.bind(styles$3);
1796
+ const cx$u = classNames$1.bind(styles$3);
1787
1797
  const { InputBox: InputBox$1, Input: Input$1 } = salesFrontendDesignSystem.FormCore;
1788
1798
  const favoriteList = [
1789
1799
  {
@@ -1825,9 +1835,9 @@ const NationalitySearchInitialText = ({
1825
1835
  setSearchInput(keyword);
1826
1836
  setSearchKeyword(keyword);
1827
1837
  };
1828
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$t("favorite-container"), children: [
1829
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: cx$t("favorite-title"), children: "\uB9CE\uC774 \uCC3E\uB294 \uAD6D\uC801" }),
1830
- /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$t("favorite"), children: favoriteList.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx("li", { onClick: () => set(item.nationalityCodeName), children: /* @__PURE__ */ jsxRuntime.jsx("button", { children: item.nationalityCodeName }) }, `${item.nationalityCode}-${index}`)) })
1838
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$u("favorite-container"), children: [
1839
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: cx$u("favorite-title"), children: "\uB9CE\uC774 \uCC3E\uB294 \uAD6D\uC801" }),
1840
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$u("favorite"), children: favoriteList.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx("li", { onClick: () => set(item.nationalityCodeName), children: /* @__PURE__ */ jsxRuntime.jsx("button", { children: item.nationalityCodeName }) }, `${item.nationalityCode}-${index}`)) })
1831
1841
  ] });
1832
1842
  };
1833
1843
  const NationalitySearchResult = ({
@@ -1842,12 +1852,12 @@ const NationalitySearchResult = ({
1842
1852
  setFilterList(filterList2);
1843
1853
  }, [nationalityList, searchKeyWord]);
1844
1854
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4", children: [
1845
- /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$t("favorite-title"), children: [
1855
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$u("favorite-title"), children: [
1846
1856
  "\uCD1D ",
1847
1857
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: filterList.length }),
1848
1858
  "\uAC74\uC758 \uAC80\uC0C9\uACB0\uACFC"
1849
1859
  ] }),
1850
- /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$t("favorite"), children: filterList.length > 0 && filterList.map((item, index) => {
1860
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$u("favorite"), children: filterList.length > 0 && filterList.map((item, index) => {
1851
1861
  return /* @__PURE__ */ jsxRuntime.jsx(
1852
1862
  "li",
1853
1863
  {
@@ -1860,7 +1870,7 @@ const NationalitySearchResult = ({
1860
1870
  `${index}-${item.nationalityCode}`
1861
1871
  );
1862
1872
  }) }),
1863
- filterList.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$t("search-result"), children: [
1873
+ filterList.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$u("search-result"), children: [
1864
1874
  "`",
1865
1875
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: searchKeyWord }),
1866
1876
  "`\uC5D0 \uB300\uD55C \uAC80\uC0C9\uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4."
@@ -1895,7 +1905,7 @@ function NationalityComponent({ isOpen, onClose, setValue, onConfirm, inputProps
1895
1905
  clearable: true,
1896
1906
  endElement: /* @__PURE__ */ jsxRuntime.jsx("button", { children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconMainUiSearch, { onClick: search }) }),
1897
1907
  onClear,
1898
- className: cx$t("search-input"),
1908
+ className: cx$u("search-input"),
1899
1909
  ...inputBoxProps,
1900
1910
  children: /* @__PURE__ */ jsxRuntime.jsx(
1901
1911
  Input$1,
@@ -2006,7 +2016,7 @@ const useNationalityComponent = () => {
2006
2016
  };
2007
2017
  };
2008
2018
 
2009
- const cx$s = classNames$1.bind(styles$4);
2019
+ const cx$t = classNames$1.bind(styles$4);
2010
2020
  const AUTH_TEMPLATE_CODES = {
2011
2021
  appInit: {
2012
2022
  dev: {
@@ -2237,7 +2247,7 @@ function useNxlOneModal({
2237
2247
  isNxlOneModalOpen: isOpen,
2238
2248
  NxlModalComponent: /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Root, { isOpen, onClose: closeModal, modalSize, children: [
2239
2249
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Overlay, {}),
2240
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Content, { children: /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Body, { raw: true, className: cx$s("modal-body", `modal-body-${modalSize}`), children: [
2250
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Content, { children: /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Body, { raw: true, className: cx$t("modal-body", `modal-body-${modalSize}`), children: [
2241
2251
  isIframeShow && /* @__PURE__ */ jsxRuntime.jsx(
2242
2252
  salesFrontendSolution.NxlOneIframe,
2243
2253
  {
@@ -2247,7 +2257,7 @@ function useNxlOneModal({
2247
2257
  env: nxlOnePropsState.env,
2248
2258
  bizCode: nxlOnePropsState.bizCode || bizCode,
2249
2259
  tmplCode: nxlOnePropsState.tmplCode || tmplCode,
2250
- className: cx$s("nxl-one-iframe"),
2260
+ className: cx$t("nxl-one-iframe"),
2251
2261
  onSuccess: (result) => {
2252
2262
  onSuccess(result);
2253
2263
  setIsIframeShow(false);
@@ -2259,16 +2269,16 @@ function useNxlOneModal({
2259
2269
  }
2260
2270
  }
2261
2271
  ),
2262
- !isIframeShow && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$s("nxl-one-iframe") })
2272
+ !isIframeShow && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$t("nxl-one-iframe") })
2263
2273
  ] }) })
2264
2274
  ] })
2265
2275
  };
2266
2276
  }
2267
2277
 
2268
- const cx$r = classNames$1.bind(styles$5);
2278
+ const cx$s = classNames$1.bind(styles$5);
2269
2279
  const { InputBox, Input } = salesFrontendDesignSystem.FormCore;
2270
2280
  const VisaSearchInitialText = ({ visaList, onSelect, onConfirm }) => {
2271
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$r("favorite-container"), children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$r("favorite"), children: visaList.map((item, index) => {
2281
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$s("favorite-container"), children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$s("favorite"), children: visaList.map((item, index) => {
2272
2282
  return /* @__PURE__ */ jsxRuntime.jsx(
2273
2283
  "li",
2274
2284
  {
@@ -2289,12 +2299,12 @@ const VisaSearchResult = ({ visaList, searchKeyword, onSelect, onConfirm }) => {
2289
2299
  setFilterList(filterList2);
2290
2300
  }, [visaList, searchKeyword]);
2291
2301
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4", children: [
2292
- /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$r("favorite-title"), children: [
2302
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$s("favorite-title"), children: [
2293
2303
  "\uCD1D ",
2294
2304
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: filterList.length }),
2295
2305
  "\uAC74\uC758 \uAC80\uC0C9\uACB0\uACFC"
2296
2306
  ] }),
2297
- /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$r("favorite"), children: filterList.length > 0 && filterList.map((item, index) => {
2307
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$s("favorite"), children: filterList.length > 0 && filterList.map((item, index) => {
2298
2308
  return /* @__PURE__ */ jsxRuntime.jsx(
2299
2309
  "li",
2300
2310
  {
@@ -2307,7 +2317,7 @@ const VisaSearchResult = ({ visaList, searchKeyword, onSelect, onConfirm }) => {
2307
2317
  `${index}-${item.integrationCodeValueName}`
2308
2318
  );
2309
2319
  }) }),
2310
- filterList.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$r("search-result"), children: [
2320
+ filterList.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$s("search-result"), children: [
2311
2321
  "`",
2312
2322
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: searchKeyword }),
2313
2323
  "`\uC5D0 \uB300\uD55C \uAC80\uC0C9\uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4."
@@ -2331,7 +2341,7 @@ function VisaComponent({ isOpen, onClose, setValue, onConfirm, inputProps, input
2331
2341
  clearable: true,
2332
2342
  endElement: /* @__PURE__ */ jsxRuntime.jsx("button", { children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconMainUiSearch, { onClick: search }) }),
2333
2343
  onClear,
2334
- className: cx$r("search-input"),
2344
+ className: cx$s("search-input"),
2335
2345
  ...inputBoxProps,
2336
2346
  children: /* @__PURE__ */ jsxRuntime.jsx(
2337
2347
  Input,
@@ -2443,30 +2453,30 @@ const useVisaComponent = () => {
2443
2453
  };
2444
2454
  };
2445
2455
 
2446
- const cx$q = classNames$1.bind(styles$6);
2456
+ const cx$r = classNames$1.bind(styles$6);
2447
2457
  function DeaCustomerSearchResult({
2448
2458
  customerList,
2449
2459
  onCustomerSelect,
2450
2460
  selectedCustomer
2451
2461
  }) {
2452
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$q("result-section"), children: [
2453
- /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$q("result-title"), children: [
2462
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$r("result-section"), children: [
2463
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$r("result-title"), children: [
2454
2464
  "\uCD1D ",
2455
2465
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: customerList.length }),
2456
2466
  "\uAC74"
2457
2467
  ] }),
2458
2468
  /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Table, { variant: "vertical", style: { tableLayout: "fixed" }, height: "292px", children: [
2459
2469
  /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
2460
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$q("th-padding", "select-col"), children: "\uC120\uD0DD" }),
2461
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$q("th-padding"), children: "\uACE0\uAC1DID" }),
2462
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$q("th-padding"), children: "\uACE0\uAC1D\uBA85" }),
2463
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$q("th-padding"), children: "\uC8FC\uBBFC\uB4F1\uB85D\uBC88\uD638" }),
2464
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$q("th-padding"), children: "\uC9C1\uC885\uC5C5\uC885\uBA85" }),
2465
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$q("th-padding"), children: "\uC804\uD654\uBC88\uD638" }),
2466
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$q("th-padding"), children: "\uC8FC\uC18C" })
2470
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$r("th-padding", "select-col"), children: "\uC120\uD0DD" }),
2471
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$r("th-padding"), children: "\uACE0\uAC1DID" }),
2472
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$r("th-padding"), children: "\uACE0\uAC1D\uBA85" }),
2473
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$r("th-padding"), children: "\uC8FC\uBBFC\uB4F1\uB85D\uBC88\uD638" }),
2474
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$r("th-padding"), children: "\uC9C1\uC885\uC5C5\uC885\uBA85" }),
2475
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$r("th-padding"), children: "\uC804\uD654\uBC88\uD638" }),
2476
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$r("th-padding"), children: "\uC8FC\uC18C" })
2467
2477
  ] }) }),
2468
2478
  /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: customerList.length > 0 ? customerList.map((customer, index) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
2469
- /* @__PURE__ */ jsxRuntime.jsx("td", { className: cx$q("radio-cell"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "d-flex-center-center", children: /* @__PURE__ */ jsxRuntime.jsx(
2479
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: cx$r("radio-cell"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "d-flex-center-center", children: /* @__PURE__ */ jsxRuntime.jsx(
2470
2480
  salesFrontendDesignSystem.Radio.Item,
2471
2481
  {
2472
2482
  id: `radio-${index}`,
@@ -2485,7 +2495,7 @@ function DeaCustomerSearchResult({
2485
2495
  /* @__PURE__ */ jsxRuntime.jsx("td", { children: customer.occupationKindName }),
2486
2496
  /* @__PURE__ */ jsxRuntime.jsx("td", { children: customer.mobilePhoneNumber }),
2487
2497
  /* @__PURE__ */ jsxRuntime.jsx("td", { children: customer.address })
2488
- ] }, `cust-item-${customer.customerId}-${index}`)) : /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: 7, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$q("no-result"), children: [
2498
+ ] }, `cust-item-${customer.customerId}-${index}`)) : /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: 7, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$r("no-result"), children: [
2489
2499
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconGraphicsFeedbackEmpty, {}),
2490
2500
  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\uC870\uD68C \uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4." }),
2491
2501
  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\uC785\uB825\uD55C \uC815\uBCF4\uB97C \uB2E4\uC2DC \uD655\uC778\uD574\uC8FC\uC138\uC694." })
@@ -2495,7 +2505,7 @@ function DeaCustomerSearchResult({
2495
2505
  }
2496
2506
 
2497
2507
  const { TextField: TextField$3 } = salesFrontendDesignSystem.FormField;
2498
- const cx$p = classNames$1.bind(styles$6);
2508
+ const cx$q = classNames$1.bind(styles$6);
2499
2509
  function DeaCustomerSearch({
2500
2510
  setSearchParams,
2501
2511
  customerList,
@@ -2566,15 +2576,15 @@ function DeaCustomerSearch({
2566
2576
  }
2567
2577
  }, [initSearchParams]);
2568
2578
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2569
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$p("search-section"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$p("search-filters"), children: [
2570
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$p("search-filters-wrap"), children: [
2571
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$p("search-filter-section", "flex-1"), children: [
2579
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$q("search-section"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$q("search-filters"), children: [
2580
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$q("search-filters-wrap"), children: [
2581
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$q("search-filter-section", "flex-1"), children: [
2572
2582
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.FormField.Label, { className: "subtitle3 text-body-1", children: "\uACE0\uAC1D \uAD6C\uBD84" }),
2573
2583
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Select, { value: "personal", placeholder: "\uAC1C\uC778", disabled: true, size: "small", className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Select.Option, { value: "personal", children: "\uAC1C\uC778" }) })
2574
2584
  ] }),
2575
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$p("search-filter-section", "flex-2"), children: [
2585
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$q("search-filter-section", "flex-2"), children: [
2576
2586
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.FormField.Label, { className: "subtitle3 text-body-1", children: "\uC8FC\uBBFC\uB4F1\uB85D\uBC88\uD638" }),
2577
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$p("resident-number-inputs"), children: [
2587
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$q("resident-number-inputs"), children: [
2578
2588
  /* @__PURE__ */ jsxRuntime.jsx(
2579
2589
  TextField$3,
2580
2590
  {
@@ -2588,7 +2598,7 @@ function DeaCustomerSearch({
2588
2598
  onKeyDown,
2589
2599
  onFocus: onFocusResidentFrontInput,
2590
2600
  rootProps: {
2591
- className: cx$p("search-input"),
2601
+ className: cx$q("search-input"),
2592
2602
  onClear: () => {
2593
2603
  setResidentNumberFront("");
2594
2604
  }
@@ -2612,16 +2622,16 @@ function DeaCustomerSearch({
2612
2622
  onFocus: onFocusResidentBackInput,
2613
2623
  rootProps: {
2614
2624
  clearable: false,
2615
- className: cx$p("search-input")
2625
+ className: cx$q("search-input")
2616
2626
  }
2617
2627
  }
2618
2628
  )
2619
2629
  ] })
2620
2630
  ] })
2621
2631
  ] }),
2622
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$p("search-buttons"), children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Button, { appearance: "filled", size: "small", variant: "primary", className: "button", onClick: handleSearch, children: "\uC870\uD68C" }) })
2632
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$q("search-buttons"), children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Button, { appearance: "filled", size: "small", variant: "primary", className: "button", onClick: handleSearch, children: "\uC870\uD68C" }) })
2623
2633
  ] }) }),
2624
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$p("divider") }),
2634
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$q("divider") }),
2625
2635
  /* @__PURE__ */ jsxRuntime.jsx(
2626
2636
  DeaCustomerSearchResult,
2627
2637
  {
@@ -2734,28 +2744,28 @@ const EMPLOYEE_SEARCH_TABS = [
2734
2744
  { value: "WKIS", label: "\uB0B4\uADFC" }
2735
2745
  ];
2736
2746
 
2737
- const cx$o = classNames$1.bind(styles$7);
2747
+ const cx$p = classNames$1.bind(styles$7);
2738
2748
  function EmployeeSearchResult({
2739
2749
  filteredEmployees,
2740
2750
  onEmployeeSelect,
2741
2751
  selectedEmployee
2742
2752
  }) {
2743
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$o("result-section"), children: [
2744
- /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$o("result-title"), children: [
2753
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$p("result-section"), children: [
2754
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$p("result-title"), children: [
2745
2755
  "\uCD1D ",
2746
2756
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: filteredEmployees.length }),
2747
2757
  "\uAC74"
2748
2758
  ] }),
2749
2759
  /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Table, { variant: "vertical", style: { tableLayout: "fixed" }, height: "292px", children: [
2750
2760
  /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
2751
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$o("th-padding", "select-col"), children: "\uC120\uD0DD" }),
2752
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$o("th-padding"), children: "\uC0AC\uC6D0\uBC88\uD638" }),
2753
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$o("th-padding"), children: "\uC0AC\uC6D0\uBA85" }),
2754
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$o("th-padding"), children: "\uC18C\uC18D\uAE30\uAD00\uBA85" }),
2755
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$o("th-padding"), children: "\uC0AC\uC6D0\uAD6C\uBD84" })
2761
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$p("th-padding", "select-col"), children: "\uC120\uD0DD" }),
2762
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$p("th-padding"), children: "\uC0AC\uC6D0\uBC88\uD638" }),
2763
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$p("th-padding"), children: "\uC0AC\uC6D0\uBA85" }),
2764
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$p("th-padding"), children: "\uC18C\uC18D\uAE30\uAD00\uBA85" }),
2765
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$p("th-padding"), children: "\uC0AC\uC6D0\uAD6C\uBD84" })
2756
2766
  ] }) }),
2757
2767
  /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: filteredEmployees.length > 0 ? filteredEmployees.map((employee, index) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
2758
- /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$o("td-padding"), children: /* @__PURE__ */ jsxRuntime.jsx(
2768
+ /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$p("td-padding"), children: /* @__PURE__ */ jsxRuntime.jsx(
2759
2769
  salesFrontendDesignSystem.Radio.Item,
2760
2770
  {
2761
2771
  id: `radio-${index}`,
@@ -2768,11 +2778,11 @@ function EmployeeSearchResult({
2768
2778
  }
2769
2779
  }
2770
2780
  ) }) }),
2771
- /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$o("td-padding"), children: employee.employeeNumber }) }),
2772
- /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$o("td-padding"), children: employee.employeeName }) }),
2773
- /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$o("td-padding"), children: employee.organizationName }) }),
2774
- /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$o("td-padding"), children: employee.employeeDivisionCodeName }) })
2775
- ] }, `${employee.employeeNumber}-${index}`)) : /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: 5, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$o("no-result"), children: [
2781
+ /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$p("td-padding"), children: employee.employeeNumber }) }),
2782
+ /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$p("td-padding"), children: employee.employeeName }) }),
2783
+ /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$p("td-padding"), children: employee.organizationName }) }),
2784
+ /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$p("td-padding"), children: employee.employeeDivisionCodeName }) })
2785
+ ] }, `${employee.employeeNumber}-${index}`)) : /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: 5, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$p("no-result"), children: [
2776
2786
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconGraphicsFeedbackEmpty, {}),
2777
2787
  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\uC870\uD68C \uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4." }),
2778
2788
  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\uC785\uB825\uD55C \uC815\uBCF4\uB97C \uB2E4\uC2DC \uD655\uC778\uD574\uC8FC\uC138\uC694." })
@@ -2782,7 +2792,7 @@ function EmployeeSearchResult({
2782
2792
  }
2783
2793
 
2784
2794
  const { TextField: TextField$2 } = salesFrontendDesignSystem.FormField;
2785
- const cx$n = classNames$1.bind(styles$7);
2795
+ const cx$o = classNames$1.bind(styles$7);
2786
2796
  function EmployeeSearch({
2787
2797
  activeTab,
2788
2798
  onTabChange,
@@ -2801,9 +2811,9 @@ function EmployeeSearch({
2801
2811
  setSearchInput("");
2802
2812
  };
2803
2813
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2804
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$n("search-section"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$n("search-filters"), children: [
2805
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$n("search-filters-wrap"), children: [
2806
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$n("search-filter-section", "flex-1"), children: [
2814
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$o("search-section"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$o("search-filters"), children: [
2815
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$o("search-filters-wrap"), children: [
2816
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$o("search-filter-section", "flex-1"), children: [
2807
2817
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.FormField.Label, { className: "subtitle3 text-body-1", children: "\uC131\uBA85/\uC0AC\uBC88" }),
2808
2818
  /* @__PURE__ */ jsxRuntime.jsx(
2809
2819
  TextField$2,
@@ -2816,12 +2826,12 @@ function EmployeeSearch({
2816
2826
  rootProps: {
2817
2827
  onClear: handleReset,
2818
2828
  clearable: true,
2819
- className: cx$n("search-input")
2829
+ className: cx$o("search-input")
2820
2830
  }
2821
2831
  }
2822
2832
  )
2823
2833
  ] }),
2824
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$n("search-filter-section"), children: [
2834
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$o("search-filter-section"), children: [
2825
2835
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.FormField.Label, { className: "subtitle3 text-body-1", children: "\uC0AC\uC6D0 \uAD6C\uBD84" }),
2826
2836
  /* @__PURE__ */ jsxRuntime.jsx(
2827
2837
  salesFrontendDesignSystem.Select,
@@ -2835,7 +2845,7 @@ function EmployeeSearch({
2835
2845
  )
2836
2846
  ] })
2837
2847
  ] }),
2838
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$n("search-buttons"), children: [
2848
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$o("search-buttons"), children: [
2839
2849
  /* @__PURE__ */ jsxRuntime.jsx(
2840
2850
  salesFrontendDesignSystem.Button,
2841
2851
  {
@@ -2843,14 +2853,14 @@ function EmployeeSearch({
2843
2853
  size: "small",
2844
2854
  variant: "secondary",
2845
2855
  onClick: handleReset,
2846
- className: cx$n("button"),
2856
+ className: cx$o("button"),
2847
2857
  children: "\uCD08\uAE30\uD654"
2848
2858
  }
2849
2859
  ),
2850
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Button, { appearance: "filled", size: "small", variant: "primary", onClick: handleSearch, className: cx$n("button"), children: "\uC870\uD68C" })
2860
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Button, { appearance: "filled", size: "small", variant: "primary", onClick: handleSearch, className: cx$o("button"), children: "\uC870\uD68C" })
2851
2861
  ] })
2852
2862
  ] }) }),
2853
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$n("divider") }),
2863
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$o("divider") }),
2854
2864
  searchTerm && /* @__PURE__ */ jsxRuntime.jsx(
2855
2865
  EmployeeSearchResult,
2856
2866
  {
@@ -3012,15 +3022,15 @@ function JobSearchDetail({ occupationTypeCode, occupationIndustryCode }) {
3012
3022
  ] }) }) });
3013
3023
  }
3014
3024
 
3015
- const cx$m = classNames$1.bind(styles$8);
3025
+ const cx$n = classNames$1.bind(styles$8);
3016
3026
  function JobSearchCategory({ filteredJobs, onJobSelect, searchTerm }) {
3017
- return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$m("category-section"), children: [
3018
- /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$m("result-title"), children: [
3027
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$n("category-section"), children: [
3028
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$n("result-title"), children: [
3019
3029
  "\uCD1D ",
3020
3030
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: filteredJobs.length }),
3021
3031
  "\uAC74\uC758 \uAC80\uC0C9\uACB0\uACFC"
3022
3032
  ] }),
3023
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Accordion.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Root, { name: "job-selection", size: "small", align: "vertical", className: cx$m("job-radio-root"), children: filteredJobs.map((job, index) => /* @__PURE__ */ jsxRuntime.jsxs(
3033
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Accordion.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Root, { name: "job-selection", size: "small", align: "vertical", className: cx$n("job-radio-root"), children: filteredJobs.map((job, index) => /* @__PURE__ */ jsxRuntime.jsxs(
3024
3034
  salesFrontendDesignSystem.Accordion.Item,
3025
3035
  {
3026
3036
  id: `item-${job.occupationIndustryCode}-${index}-accordion`,
@@ -3050,24 +3060,24 @@ function JobSearchCategory({ filteredJobs, onJobSelect, searchTerm }) {
3050
3060
  ] }) });
3051
3061
  }
3052
3062
 
3053
- const cx$l = classNames$1.bind(styles$8);
3063
+ const cx$m = classNames$1.bind(styles$8);
3054
3064
  function JobSearchFavorite({ filteredJobs, onJobSelect }) {
3055
- return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$l("popular-jobs"), children: [
3065
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$m("popular-jobs"), children: [
3056
3066
  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\uB9CE\uC774 \uCC3E\uB294 \uC9C1\uC885" }),
3057
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Accordion.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Root, { name: "job-selection", size: "small", align: "vertical", className: cx$l("job-radio-root"), children: filteredJobs.map((job, index) => /* @__PURE__ */ jsxRuntime.jsxs(
3067
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Accordion.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Root, { name: "job-selection", size: "small", align: "vertical", className: cx$m("job-radio-root"), children: filteredJobs.map((job, index) => /* @__PURE__ */ jsxRuntime.jsxs(
3058
3068
  salesFrontendDesignSystem.Accordion.Item,
3059
3069
  {
3060
3070
  id: `item-${job.occupationIndustryCode}-${index}`,
3061
- className: cx$l("accordion-item"),
3071
+ className: cx$m("accordion-item"),
3062
3072
  children: [
3063
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Accordion.HeaderDiv, { className: cx$l("accordion-header-item"), children: /* @__PURE__ */ jsxRuntime.jsxs(
3073
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Accordion.HeaderDiv, { className: cx$m("accordion-header-item"), children: /* @__PURE__ */ jsxRuntime.jsxs(
3064
3074
  salesFrontendDesignSystem.Radio.Item,
3065
3075
  {
3066
3076
  size: "small",
3067
3077
  id: `item-radio-${job.occupationIndustryCode}-${index}`,
3068
3078
  value: job.occupationIndustryCode,
3069
3079
  onChange: () => onJobSelect(job),
3070
- className: cx$l("radio-item"),
3080
+ className: cx$m("radio-item"),
3071
3081
  children: [
3072
3082
  job.occupationIndustryName,
3073
3083
  "(",
@@ -3090,15 +3100,15 @@ function JobSearchFavorite({ filteredJobs, onJobSelect }) {
3090
3100
  ] }) });
3091
3101
  }
3092
3102
 
3093
- const cx$k = classNames$1.bind(styles$8);
3103
+ const cx$l = classNames$1.bind(styles$8);
3094
3104
  function JobSearchResult({ filteredJobs, onJobSelect, searchTerm }) {
3095
- return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$k("popular-jobs"), children: [
3096
- /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$k("result-title"), children: [
3105
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$l("popular-jobs"), children: [
3106
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$l("result-title"), children: [
3097
3107
  "\uCD1D ",
3098
3108
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: filteredJobs.length }),
3099
3109
  "\uAC74\uC758 \uAC80\uC0C9\uACB0\uACFC"
3100
3110
  ] }),
3101
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Accordion.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Root, { name: "job-selection", size: "small", align: "vertical", className: cx$k("job-radio-root"), children: filteredJobs.map((job, index) => /* @__PURE__ */ jsxRuntime.jsxs(
3111
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Accordion.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Radio.Root, { name: "job-selection", size: "small", align: "vertical", className: cx$l("job-radio-root"), children: filteredJobs.map((job, index) => /* @__PURE__ */ jsxRuntime.jsxs(
3102
3112
  salesFrontendDesignSystem.Accordion.Item,
3103
3113
  {
3104
3114
  id: `item-${job.occupationIndustryCode}`,
@@ -3135,7 +3145,7 @@ function JobSearchResult({ filteredJobs, onJobSelect, searchTerm }) {
3135
3145
  }
3136
3146
 
3137
3147
  const { TextField: TextField$1 } = salesFrontendDesignSystem.FormField;
3138
- const cx$j = classNames$1.bind(styles$8);
3148
+ const cx$k = classNames$1.bind(styles$8);
3139
3149
  const { Option } = salesFrontendDesignSystem.Select;
3140
3150
  function JobSearch({
3141
3151
  activeTab,
@@ -3173,7 +3183,7 @@ function JobSearch({
3173
3183
  }
3174
3184
  ),
3175
3185
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
3176
- activeTab === "jobName" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$j("favorite-jobs-section"), children: [
3186
+ activeTab === "jobName" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$k("favorite-jobs-section"), children: [
3177
3187
  /* @__PURE__ */ jsxRuntime.jsx(
3178
3188
  TextField$1,
3179
3189
  {
@@ -3195,8 +3205,8 @@ function JobSearch({
3195
3205
  !searchTerm && /* @__PURE__ */ jsxRuntime.jsx(JobSearchFavorite, { filteredJobs, onJobSelect }),
3196
3206
  searchTerm && !isLoading && /* @__PURE__ */ jsxRuntime.jsx(JobSearchResult, { filteredJobs, onJobSelect, searchTerm })
3197
3207
  ] }),
3198
- activeTab === "jobCode" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$j("select-jobs-section"), children: [
3199
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$j("category-section"), children: [
3208
+ activeTab === "jobCode" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$k("select-jobs-section"), children: [
3209
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$k("category-section"), children: [
3200
3210
  /* @__PURE__ */ jsxRuntime.jsx(
3201
3211
  salesFrontendDesignSystem.Select,
3202
3212
  {
@@ -3488,20 +3498,20 @@ function useJobSearchModal() {
3488
3498
  };
3489
3499
  }
3490
3500
 
3491
- const cx$i = classNames$1.bind(styles$9);
3501
+ const cx$j = classNames$1.bind(styles$9);
3492
3502
  const JobVehicleSearchGrade = ({ riskGrade, hospitalizationGrade }) => {
3493
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$i("grade-section"), children: [
3494
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$i("icon-title"), children: [
3503
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$j("grade-section"), children: [
3504
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$j("icon-title"), children: [
3495
3505
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconIllustGrade, {}),
3496
3506
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "typo-title5 text-body", children: "\uB4F1\uAE09" })
3497
3507
  ] }),
3498
3508
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "typo-body2 text-body_3", children: "\uC9C1\uC885, \uC6B4\uC804 \uC5EC\uBD80 \uC120\uD0DD\uC2DC \uC790\uB3D9\uC73C\uB85C \uC0B0\uC815\uB429\uB2C8\uB2E4." }),
3499
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$i("grade-list"), children: [
3500
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$i("grade"), children: [
3509
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$j("grade-list"), children: [
3510
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$j("grade"), children: [
3501
3511
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\uC704\uD5D8\uB4F1\uAE09" }),
3502
3512
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary typo-subtitle3", children: riskGrade || "-" })
3503
3513
  ] }),
3504
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$i("grade"), children: [
3514
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$j("grade"), children: [
3505
3515
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\uC785\uC6D0\uB4F1\uAE09" }),
3506
3516
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary typo-subtitle3", children: hospitalizationGrade || "-" })
3507
3517
  ] })
@@ -3509,9 +3519,9 @@ const JobVehicleSearchGrade = ({ riskGrade, hospitalizationGrade }) => {
3509
3519
  ] });
3510
3520
  };
3511
3521
 
3512
- const cx$h = classNames$1.bind(styles$a);
3522
+ const cx$i = classNames$1.bind(styles$a);
3513
3523
  function VehicleSearch({ vehicles, onVehicleSelect, selectedVehicle }) {
3514
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$h("vehicle-search-section"), children: [
3524
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$i("vehicle-search-section"), children: [
3515
3525
  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\uC6B4\uC804 \uCC28\uC885" }),
3516
3526
  /* @__PURE__ */ jsxRuntime.jsx(
3517
3527
  salesFrontendDesignSystem.Radio.Root,
@@ -3519,7 +3529,7 @@ function VehicleSearch({ vehicles, onVehicleSelect, selectedVehicle }) {
3519
3529
  name: "vehicle-selection",
3520
3530
  size: "small",
3521
3531
  align: "vertical",
3522
- className: cx$h("vehicle-radio-root"),
3532
+ className: cx$i("vehicle-radio-root"),
3523
3533
  defaultValue: selectedVehicle?.integrationCodeValue || "",
3524
3534
  children: vehicles.map((vehicle, index) => /* @__PURE__ */ jsxRuntime.jsxs(
3525
3535
  salesFrontendDesignSystem.Radio.Item,
@@ -3534,7 +3544,7 @@ function VehicleSearch({ vehicles, onVehicleSelect, selectedVehicle }) {
3534
3544
  onVehicleSelect(selected);
3535
3545
  }
3536
3546
  },
3537
- className: cx$h("item"),
3547
+ className: cx$i("item"),
3538
3548
  children: [
3539
3549
  vehicle.integrationCodeValueName,
3540
3550
  "(",
@@ -3613,7 +3623,7 @@ const useJobVehicleSearch = () => {
3613
3623
  };
3614
3624
  };
3615
3625
 
3616
- const cx$g = classNames$1.bind(styles$9);
3626
+ const cx$h = classNames$1.bind(styles$9);
3617
3627
  function useJobVehicleSearchModal() {
3618
3628
  const {
3619
3629
  selectedVehicle,
@@ -3682,18 +3692,18 @@ function useJobVehicleSearchModal() {
3682
3692
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Overlay, {}),
3683
3693
  /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Content, { style: { height: "697px" }, children: [
3684
3694
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Header, { headerTitle: "\uC9C1\uC885\xB7\uC6B4\uC804\uCC28\uC885 \uAC80\uC0C9", showCloseButton: true }),
3685
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Body, { className: cx$g("job-vehicle-search-modal"), raw: true, children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3686
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$g("left-panel"), children: [
3687
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$g("card-section"), children: [
3695
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Body, { className: cx$h("job-vehicle-search-modal"), raw: true, children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3696
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$h("left-panel"), children: [
3697
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$h("card-section"), children: [
3688
3698
  /* @__PURE__ */ jsxRuntime.jsxs(
3689
3699
  "div",
3690
3700
  {
3691
- className: cx$g("card-menu", { "card-selected": rightPanelView === "jobSearch" }),
3701
+ className: cx$h("card-menu", { "card-selected": rightPanelView === "jobSearch" }),
3692
3702
  onClick: () => setRightPanelView("jobSearch"),
3693
3703
  children: [
3694
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$g("card-title"), children: [
3695
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconIllustJob, { className: cx$g("card-icon") }),
3696
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$g("card-text", "typo-title5", "text-body"), children: "\uC9C1\uC885" }),
3704
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$h("card-title"), children: [
3705
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconIllustJob, { className: cx$h("card-icon") }),
3706
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$h("card-text", "typo-title5", "text-body"), children: "\uC9C1\uC885" }),
3697
3707
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconSubUiArrowRight, {})
3698
3708
  ] }),
3699
3709
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "typo-body2 text-body_2", children: selectedJob ? selectedJob.occupationIndustryName : "\uBBF8\uC120\uD0DD" })
@@ -3703,12 +3713,12 @@ function useJobVehicleSearchModal() {
3703
3713
  /* @__PURE__ */ jsxRuntime.jsxs(
3704
3714
  "div",
3705
3715
  {
3706
- className: cx$g("card-menu", { "card-selected": rightPanelView === "vehicleSelection" }),
3716
+ className: cx$h("card-menu", { "card-selected": rightPanelView === "vehicleSelection" }),
3707
3717
  onClick: () => setRightPanelView("vehicleSelection"),
3708
3718
  children: [
3709
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$g("card-title"), children: [
3710
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconIllustVehicle, { className: cx$g("card-icon") }),
3711
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$g("card-text", "typo-title5", "text-body"), children: "\uC6B4\uC804 \uC5EC\uBD80\xB7\uCC28\uC885" }),
3719
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$h("card-title"), children: [
3720
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconIllustVehicle, { className: cx$h("card-icon") }),
3721
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$h("card-text", "typo-title5", "text-body"), children: "\uC6B4\uC804 \uC5EC\uBD80\xB7\uCC28\uC885" }),
3712
3722
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconSubUiArrowRight, {})
3713
3723
  ] }),
3714
3724
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "typo-body2 text-body_2", children: [
@@ -3721,7 +3731,7 @@ function useJobVehicleSearchModal() {
3721
3731
  ] }),
3722
3732
  /* @__PURE__ */ jsxRuntime.jsx(JobVehicleSearchGrade, { riskGrade, hospitalizationGrade })
3723
3733
  ] }),
3724
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$g("right-panel"), children: rightPanelView === "jobSearch" ? JobSearch : VehicleSearch })
3734
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$h("right-panel"), children: rightPanelView === "jobSearch" ? JobSearch : VehicleSearch })
3725
3735
  ] }) }),
3726
3736
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Footer, { style: { marginTop: 0 }, children: /* @__PURE__ */ jsxRuntime.jsx(
3727
3737
  salesFrontendDesignSystem.Button,
@@ -3744,27 +3754,27 @@ function useJobVehicleSearchModal() {
3744
3754
  };
3745
3755
  }
3746
3756
 
3747
- const cx$f = classNames$1.bind(styles$b);
3757
+ const cx$g = classNames$1.bind(styles$b);
3748
3758
  function OrganizationSearchResult({
3749
3759
  filteredOrganizations,
3750
3760
  selectedOrganization,
3751
3761
  onOrganizationSelect
3752
3762
  }) {
3753
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$f("result-section"), children: [
3754
- /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$f("result-title"), children: [
3763
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$g("result-section"), children: [
3764
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$g("result-title"), children: [
3755
3765
  "\uCD1D ",
3756
3766
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: filteredOrganizations.length }),
3757
3767
  "\uAC74"
3758
3768
  ] }),
3759
3769
  /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Table, { variant: "vertical", style: { tableLayout: "fixed" }, height: "292px", children: [
3760
3770
  /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
3761
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$f("th-padding", "select-col"), children: "\uC120\uD0DD" }),
3762
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$f("th-padding"), children: "\uAE30\uAD00\uCF54\uB4DC" }),
3763
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$f("th-padding"), children: "\uAE30\uAD00\uC774\uB984" }),
3764
- /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$f("th-padding"), children: "\uD3D0\uC1C4\uC77C\uC790" })
3771
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$g("th-padding", "select-col"), children: "\uC120\uD0DD" }),
3772
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$g("th-padding"), children: "\uAE30\uAD00\uCF54\uB4DC" }),
3773
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$g("th-padding"), children: "\uAE30\uAD00\uC774\uB984" }),
3774
+ /* @__PURE__ */ jsxRuntime.jsx("th", { className: cx$g("th-padding"), children: "\uD3D0\uC1C4\uC77C\uC790" })
3765
3775
  ] }) }),
3766
3776
  /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: filteredOrganizations.length > 0 ? filteredOrganizations.map((organization, index) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
3767
- /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$f("td-padding"), children: /* @__PURE__ */ jsxRuntime.jsx(
3777
+ /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$g("td-padding"), children: /* @__PURE__ */ jsxRuntime.jsx(
3768
3778
  salesFrontendDesignSystem.Radio.Item,
3769
3779
  {
3770
3780
  id: `radio-${index}`,
@@ -3780,7 +3790,7 @@ function OrganizationSearchResult({
3780
3790
  /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "td-padding", children: organization.organizationCode }) }),
3781
3791
  /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "td-padding", children: organization.organizationName }) }),
3782
3792
  /* @__PURE__ */ jsxRuntime.jsx("td", { children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "td-padding", children: organization.closeDate }) })
3783
- ] }, `${organization.organizationCode}-${index}`)) : /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: 4, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$f("no-result"), children: [
3793
+ ] }, `${organization.organizationCode}-${index}`)) : /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: 4, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$g("no-result"), children: [
3784
3794
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconGraphicsFeedbackEmpty, {}),
3785
3795
  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\uC870\uD68C \uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4." }),
3786
3796
  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\uC785\uB825\uD55C \uC815\uBCF4\uB97C \uB2E4\uC2DC \uD655\uC778\uD574\uC8FC\uC138\uC694." })
@@ -3790,7 +3800,7 @@ function OrganizationSearchResult({
3790
3800
  }
3791
3801
 
3792
3802
  const { TextField } = salesFrontendDesignSystem.FormField;
3793
- const cx$e = classNames$1.bind(styles$b);
3803
+ const cx$f = classNames$1.bind(styles$b);
3794
3804
  function OrganizationSearch({
3795
3805
  searchTerm,
3796
3806
  setSearchTerm,
@@ -3807,8 +3817,8 @@ function OrganizationSearch({
3807
3817
  setSearchInput("");
3808
3818
  };
3809
3819
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3810
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$e("search-section"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$e("search-filters"), children: [
3811
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$e("search-filter-section"), children: [
3820
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$f("search-section"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$f("search-filters"), children: [
3821
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$f("search-filter-section"), children: [
3812
3822
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.FormField.Label, { className: "subtitle3 text-body-1", children: "\uAE30\uAD00\uCF54\uB4DC(\uBA85)" }),
3813
3823
  /* @__PURE__ */ jsxRuntime.jsx(
3814
3824
  TextField,
@@ -3819,19 +3829,19 @@ function OrganizationSearch({
3819
3829
  size: "small",
3820
3830
  onKeyUp: (e) => isEnter(e) && handleSearch(),
3821
3831
  rootProps: {
3822
- className: cx$e("search-input"),
3832
+ className: cx$f("search-input"),
3823
3833
  clearable: true,
3824
3834
  onClear: handleReset
3825
3835
  }
3826
3836
  }
3827
3837
  )
3828
3838
  ] }),
3829
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$e("search-buttons"), children: [
3830
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Button, { appearance: "outline", size: "small", variant: "secondary", className: cx$e("button"), onClick: handleReset, children: "\uCD08\uAE30\uD654" }),
3831
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Button, { appearance: "filled", size: "small", variant: "primary", className: cx$e("button"), onClick: handleSearch, children: "\uC870\uD68C" })
3839
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$f("search-buttons"), children: [
3840
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Button, { appearance: "outline", size: "small", variant: "secondary", className: cx$f("button"), onClick: handleReset, children: "\uCD08\uAE30\uD654" }),
3841
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Button, { appearance: "filled", size: "small", variant: "primary", className: cx$f("button"), onClick: handleSearch, children: "\uC870\uD68C" })
3832
3842
  ] })
3833
3843
  ] }) }),
3834
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$e("divider") }),
3844
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$f("divider") }),
3835
3845
  searchTerm && /* @__PURE__ */ jsxRuntime.jsx(
3836
3846
  OrganizationSearchResult,
3837
3847
  {
@@ -3919,14 +3929,14 @@ const OrganizationSearchModal = ({
3919
3929
  ] });
3920
3930
  };
3921
3931
 
3922
- const cx$d = classNames$1.bind(styles$a);
3932
+ const cx$e = classNames$1.bind(styles$a);
3923
3933
  function JobVehicleSearchModal({ onClose }) {
3924
3934
  const { selectedVehicle, VehicleSearchComponent } = useVehicleSearch();
3925
3935
  return /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Root, { isOpen: true, onClose, modalSize: "xlarge", children: [
3926
3936
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Overlay, {}),
3927
3937
  /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Content, { style: { height: "697px" }, children: [
3928
3938
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Header, { headerTitle: "\uC6B4\uC804\uCC28\uC885 \uAC80\uC0C9", showCloseButton: true }),
3929
- /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Body, { className: cx$d("job-vehicle-search-modal"), raw: true, children: VehicleSearchComponent }),
3939
+ /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Body, { className: cx$e("job-vehicle-search-modal"), raw: true, children: VehicleSearchComponent }),
3930
3940
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Modal.Footer, { style: { marginTop: 0 }, children: /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Button, { variant: "primary", size: "medium", appearance: "filled", width: "full", onClick: onClose, children: [
3931
3941
  "\uD655\uC778(",
3932
3942
  selectedVehicle?.integrationCodeValueName || "\uBBF8\uC120\uD0DD",
@@ -4244,7 +4254,7 @@ const HookFormDateRangePickerRenew = ({
4244
4254
  return /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.DatePickerRangeRenew, { startDateProps: startDateMergedProps, endDateProps: endDateMergedProps });
4245
4255
  };
4246
4256
 
4247
- const cx$c = classNames$1.bind(styles$c);
4257
+ const cx$d = classNames$1.bind(styles$c);
4248
4258
  const StepIndicator = ({
4249
4259
  items,
4250
4260
  onClickItem,
@@ -4279,26 +4289,26 @@ const StepIndicator = ({
4279
4289
  salesFrontendDesignSystem.ModalUtils.alert("\uC774\uC804 \uB2E8\uACC4\uB97C \uBAA8\uB450 \uC644\uB8CC\uD574\uC57C \uC120\uD0DD\uD55C \uB2E8\uACC4\uB85C\n\uC774\uB3D9\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4.", "\uC774\uC804 \uB2E8\uACC4\uB97C \uBA3C\uC800 \uC9C4\uD589\uD574\uC8FC\uC138\uC694");
4280
4290
  }
4281
4291
  };
4282
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$c("stepper-layout", { loading: isLoading }), children: [
4283
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$c("stepper"), children: steps.map((item, idx) => /* @__PURE__ */ jsxRuntime.jsxs(React9.Fragment, { children: [
4292
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$d("stepper-layout", { loading: isLoading }), children: [
4293
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$d("stepper"), children: steps.map((item, idx) => /* @__PURE__ */ jsxRuntime.jsxs(React9.Fragment, { children: [
4284
4294
  /* @__PURE__ */ jsxRuntime.jsx(
4285
4295
  "div",
4286
4296
  {
4287
- className: cx$c(
4297
+ className: cx$d(
4288
4298
  "circle",
4289
4299
  { completed: item.isCompleted ?? false },
4290
4300
  { active: defaultValue === item.value || current === idx }
4291
4301
  ),
4292
4302
  onClick: () => handleClickStep?.(item),
4293
- children: item.isCompleted ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$c("completed-icon") }) : idx + 1
4303
+ children: item.isCompleted ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$d("completed-icon") }) : idx + 1
4294
4304
  }
4295
4305
  ),
4296
- idx < steps.length - 1 && Array.from({ length: dotCount }).map((_, dotIdx) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$c("dot") }, `dot-${idx}-${dotIdx}`))
4306
+ idx < steps.length - 1 && Array.from({ length: dotCount }).map((_, dotIdx) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$d("dot") }, `dot-${idx}-${dotIdx}`))
4297
4307
  ] }, `num-${idx}`)) }),
4298
- /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$c("step-labels"), children: steps.map((item, idx) => /* @__PURE__ */ jsxRuntime.jsx(
4308
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$d("step-labels"), children: steps.map((item, idx) => /* @__PURE__ */ jsxRuntime.jsx(
4299
4309
  "li",
4300
4310
  {
4301
- className: cx$c(
4311
+ className: cx$d(
4302
4312
  { completed: steps[idx < 1 ? idx : idx - 1]?.isCompleted ?? false },
4303
4313
  { active: defaultValue === item.value || current === idx }
4304
4314
  ),
@@ -4310,15 +4320,17 @@ const StepIndicator = ({
4310
4320
  ] });
4311
4321
  };
4312
4322
 
4313
- const cx$b = classNames$1.bind(styles$d);
4323
+ const cx$c = classNames$1.bind(styles$d);
4314
4324
  function Attachment({
4315
4325
  photos,
4316
4326
  onAddPhoto,
4317
4327
  onRemovePhoto,
4318
4328
  show,
4319
4329
  type = "multiple",
4320
- buttonText
4330
+ buttonText,
4331
+ maxPhotos
4321
4332
  }) {
4333
+ const resolvedMaxPhotos = maxPhotos ?? (type === "single" ? 1 : 4);
4322
4334
  const handleAddPhoto = () => {
4323
4335
  onAddPhoto();
4324
4336
  };
@@ -4327,17 +4339,17 @@ function Attachment({
4327
4339
  };
4328
4340
  const renderPhotoSingle = () => {
4329
4341
  if (photos.length === 0) {
4330
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$b("single-photo-item", "add-photo-item"), children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cx$b("add-photo-button-single"), onClick: handleAddPhoto, children: [
4342
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$c("single-photo-item", "add-photo-item"), children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cx$c("add-photo-button-single"), onClick: handleAddPhoto, children: [
4331
4343
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconIllustCamera, {}),
4332
4344
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: buttonText || "\uC0AC\uC9C4 \uCCA8\uBD80\uD558\uAE30" })
4333
4345
  ] }) });
4334
4346
  }
4335
- return photos.map((photo) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$b("single-photo-item"), children: [
4336
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$b("photo-placeholder"), children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: photo.src, alt: photo.name, className: cx$b("photo-image") }) }),
4347
+ return photos.map((photo) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$c("single-photo-item"), children: [
4348
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$c("photo-placeholder"), children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: photo.src, alt: photo.name, className: cx$c("photo-image") }) }),
4337
4349
  /* @__PURE__ */ jsxRuntime.jsx(
4338
4350
  "button",
4339
4351
  {
4340
- className: cx$b("remove-button", "dsp-icons", "dsp-icons-icons-sub-ui-reset"),
4352
+ className: cx$c("remove-button", "dsp-icons", "dsp-icons-icons-sub-ui-reset"),
4341
4353
  onClick: () => handleRemovePhoto(photo.id),
4342
4354
  "aria-label": "\uC0AC\uC9C4 \uC0AD\uC81C"
4343
4355
  }
@@ -4345,18 +4357,17 @@ function Attachment({
4345
4357
  ] }, photo.id));
4346
4358
  };
4347
4359
  const renderPhotoGrid = () => {
4348
- const maxPhotos = type === "single" ? 1 : 4;
4349
4360
  const gridItems = [];
4350
- if (photos.length < maxPhotos) {
4361
+ if (photos.length < resolvedMaxPhotos) {
4351
4362
  gridItems.push(
4352
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$b("photo-item", "add-photo-item"), children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cx$b("add-photo-button"), onClick: handleAddPhoto, children: [
4363
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$c("photo-item", "add-photo-item"), children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: cx$c("add-photo-button"), onClick: handleAddPhoto, children: [
4353
4364
  /* @__PURE__ */ jsxRuntime.jsx(salesFrontendAssets.IconIllustCamera, {}),
4354
4365
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: buttonText || "\uCCA8\uBD80\uD558\uAE30" }),
4355
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$b("photo-count"), children: [
4366
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cx$c("photo-count"), children: [
4356
4367
  "(",
4357
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$b("photo-count-number"), children: photos.length }),
4368
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx$c("photo-count-number"), children: photos.length }),
4358
4369
  "/",
4359
- maxPhotos,
4370
+ resolvedMaxPhotos,
4360
4371
  ")"
4361
4372
  ] })
4362
4373
  ] }) }, "add-photo")
@@ -4364,12 +4375,12 @@ function Attachment({
4364
4375
  }
4365
4376
  photos.forEach((photo) => {
4366
4377
  gridItems.push(
4367
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$b("photo-item"), children: [
4368
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$b("photo-placeholder"), children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: photo.src, alt: photo.name, className: cx$b("photo-image") }) }),
4378
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$c("photo-item"), children: [
4379
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$c("photo-placeholder"), children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: photo.src, alt: photo.name, className: cx$c("photo-image") }) }),
4369
4380
  /* @__PURE__ */ jsxRuntime.jsx(
4370
4381
  "button",
4371
4382
  {
4372
- className: cx$b("remove-button", "dsp-icons", "dsp-icons-icons-sub-ui-reset"),
4383
+ className: cx$c("remove-button", "dsp-icons", "dsp-icons-icons-sub-ui-reset"),
4373
4384
  onClick: () => handleRemovePhoto(photo.id),
4374
4385
  "aria-label": "\uC0AC\uC9C4 \uC0AD\uC81C"
4375
4386
  }
@@ -4384,9 +4395,96 @@ function Attachment({
4384
4395
  return null;
4385
4396
  }
4386
4397
  if (type === "single") {
4387
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$b("photo-single"), children: renderPhotoSingle() });
4398
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$c("photo-single"), children: renderPhotoSingle() });
4399
+ }
4400
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$c("photo-grid", { linear: type === "linear" }), children: renderPhotoGrid() });
4401
+ }
4402
+
4403
+ const CAMERA_DEBUG_STORAGE_KEY = "dsp-camera-debug";
4404
+ const CAMERA_DEBUG_COOKIE_VALUE = "camera";
4405
+ const DEBUG_FILTER_COOKIE_KEY = "dsp-debug-mode-filter-name=";
4406
+ function isCameraDebugEnabled() {
4407
+ if (typeof window === "undefined") {
4408
+ return false;
4409
+ }
4410
+ const localStorageEnabled = getLocalStorageDebugEnabled();
4411
+ const cookieEnabled = typeof document !== "undefined" && document.cookie.split(";").some((cookie) => cookie.trim().startsWith(DEBUG_FILTER_COOKIE_KEY) && cookie.includes(CAMERA_DEBUG_COOKIE_VALUE));
4412
+ return localStorageEnabled || cookieEnabled;
4413
+ }
4414
+ function logCameraDebug(message, detail) {
4415
+ if (!isCameraDebugEnabled()) {
4416
+ return;
4417
+ }
4418
+ console.debug(`[camera] ${message}`, detail ?? "");
4419
+ }
4420
+ function logCameraError(message, error) {
4421
+ console.error(`[camera] ${message}`, error ?? "");
4422
+ }
4423
+ function getLocalStorageDebugEnabled() {
4424
+ try {
4425
+ return window.localStorage?.getItem(CAMERA_DEBUG_STORAGE_KEY) === "true";
4426
+ } catch {
4427
+ return false;
4388
4428
  }
4389
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$b("photo-grid", { linear: type === "linear" }), children: renderPhotoGrid() });
4429
+ }
4430
+
4431
+ const MIN_PAGE_LIMIT = 1;
4432
+ const MAX_PAGE_LIMIT = 20;
4433
+ function clampPageLimit(pageLimit) {
4434
+ if (!pageLimit || Number.isNaN(pageLimit)) {
4435
+ return MIN_PAGE_LIMIT;
4436
+ }
4437
+ return Math.min(MAX_PAGE_LIMIT, Math.max(MIN_PAGE_LIMIT, Math.floor(pageLimit)));
4438
+ }
4439
+ async function convertSourceToFile(source, convertType) {
4440
+ if (source.kind === "file") {
4441
+ return source.file;
4442
+ }
4443
+ if (source.kind === "base64") {
4444
+ return base64ToFile(source.uri, "image.jpg");
4445
+ }
4446
+ return imageUrlToFile(source.uri, convertType);
4447
+ }
4448
+ async function captureNativeDocuments({ pageLimit }) {
4449
+ const clampedPageLimit = clampPageLimit(pageLimit);
4450
+ logCameraDebug("native documentCapture requested", { pageLimit: clampedPageLimit });
4451
+ const response = await salesFrontendBridge.Bridge.native.documentCapture({ pageLimit: clampedPageLimit });
4452
+ if (response.uris && response.uris.length > 0) {
4453
+ logCameraDebug("native documentCapture android uris", { count: response.uris.length });
4454
+ return response.uris.map((uri) => ({ kind: "scheme", uri }));
4455
+ }
4456
+ if (response.sessionId) {
4457
+ return pullIosSession(response.sessionId, response.count ?? 0);
4458
+ }
4459
+ logCameraDebug("native documentCapture canceled or empty");
4460
+ return [];
4461
+ }
4462
+ async function pullIosSession(sessionId, count) {
4463
+ logCameraDebug("native documentCapture ios session", { sessionId, count });
4464
+ const sources = [];
4465
+ try {
4466
+ for (let index = 0; index < count; index += 1) {
4467
+ const { base64 } = await salesFrontendBridge.Bridge.native.documentCaptureNext({ sessionId, index });
4468
+ sources.push({ kind: "base64", uri: base64 });
4469
+ }
4470
+ } catch (error) {
4471
+ logCameraError("native documentCaptureNext failed", error);
4472
+ } finally {
4473
+ await salesFrontendBridge.Bridge.native.documentCaptureEnd({ sessionId });
4474
+ logCameraDebug("native documentCaptureEnd called", { sessionId });
4475
+ }
4476
+ return sources;
4477
+ }
4478
+
4479
+ const DEFAULT_CAPTURE_ENGINE_TYPE = "input";
4480
+ function resolveCaptureEngineType(options) {
4481
+ if (options.captureEngineType) {
4482
+ return options.captureEngineType;
4483
+ }
4484
+ if (options.useNativeCamera) {
4485
+ return "native";
4486
+ }
4487
+ return DEFAULT_CAPTURE_ENGINE_TYPE;
4390
4488
  }
4391
4489
 
4392
4490
  const maxImageSize = 300 * 1024;
@@ -4562,161 +4660,259 @@ function resize(image, options = { ext: "jpeg", filesize: maxImageSize }) {
4562
4660
  });
4563
4661
  }
4564
4662
 
4565
- const genImageId$1 = () => `camera-${Date.now()}-${Math.random()}`;
4566
- function useCamera({
4567
- onChange,
4568
- resize: resizeOption = {
4569
- processType: "mixed",
4570
- resizeRatio: 5,
4571
- width: 1920,
4572
- // 300kb
4573
- filesize: 300 * 1024,
4574
- ext: "jpeg"
4575
- },
4576
- cameraOnly,
4577
- onDelete,
4578
- show,
4579
- type = "multiple",
4580
- buttonText,
4581
- initData,
4582
- useNativeCamera = false,
4583
- responseFileType,
4584
- convertType = "canvas"
4585
- } = {}) {
4586
- const convertedInitData = initData?.map((data, index) => ({ ...data, id: String(index + 1) }));
4587
- const [attachedPhotos, setAttachedPhotos] = React9.useState(convertedInitData || []);
4588
- const findImage = (imageId) => {
4589
- return attachedPhotos.find((image) => image.id === imageId);
4663
+ const cx$b = classNames$1.bind(styles$d);
4664
+ const VIDEO_CAPTURE_MIME_TYPE = "image/jpeg";
4665
+ const VIDEO_CAPTURE_QUALITY = 0.92;
4666
+ function createVideoCaptureConstraints() {
4667
+ return {
4668
+ audio: false,
4669
+ video: {
4670
+ facingMode: { ideal: "environment" },
4671
+ width: { ideal: 1920 },
4672
+ height: { ideal: 1080 }
4673
+ }
4590
4674
  };
4591
- const imageHandler = async (file) => {
4592
- const newPhoto = {
4593
- id: genImageId$1(),
4594
- src: URL.createObjectURL(resizeOption ? await resize(file, resizeOption) : file),
4595
- name: `\uC11C\uB958\uC0AC\uC9C4_${attachedPhotos.length + 1}`
4596
- };
4597
- if (type === "single") {
4598
- setAttachedPhotos([newPhoto]);
4599
- } else {
4600
- setAttachedPhotos([...attachedPhotos, newPhoto]);
4675
+ }
4676
+ async function createVideoCaptureFile(video) {
4677
+ const width = video.videoWidth;
4678
+ const height = video.videoHeight;
4679
+ if (width <= 0 || height <= 0) {
4680
+ throw new Error("Video frame is not ready");
4681
+ }
4682
+ const canvas = document.createElement("canvas");
4683
+ canvas.width = width;
4684
+ canvas.height = height;
4685
+ const context = canvas.getContext("2d");
4686
+ if (!context) {
4687
+ throw new Error("Canvas 2D context is not available");
4688
+ }
4689
+ context.drawImage(video, 0, 0, width, height);
4690
+ const blob = await canvasToBlob(canvas);
4691
+ return new File([blob], `camera-video-${Date.now()}.jpg`, {
4692
+ type: blob.type || VIDEO_CAPTURE_MIME_TYPE,
4693
+ lastModified: Date.now()
4694
+ });
4695
+ }
4696
+ function VideoCaptureModal({ open, onCapture, onClose, maxShots = 1 }) {
4697
+ const videoRef = React9.useRef(null);
4698
+ const streamRef = React9.useRef(null);
4699
+ const [errorMessage, setErrorMessage] = React9.useState(null);
4700
+ const [isReady, setIsReady] = React9.useState(false);
4701
+ const [isCapturing, setIsCapturing] = React9.useState(false);
4702
+ const [capturedShots, setCapturedShots] = React9.useState([]);
4703
+ const normalizedMaxShots = maxShots > 0 ? maxShots : 1;
4704
+ const isMultiShot = normalizedMaxShots > 1;
4705
+ const canCaptureMore = capturedShots.length < normalizedMaxShots;
4706
+ const revokeAllPreviewUrls = (shots) => {
4707
+ shots.forEach((shot) => URL.revokeObjectURL(shot.previewUrl));
4708
+ };
4709
+ React9.useEffect(() => {
4710
+ if (!open) {
4711
+ setCapturedShots((prev) => {
4712
+ revokeAllPreviewUrls(prev);
4713
+ return [];
4714
+ });
4715
+ return void 0;
4601
4716
  }
4602
- if (onChange) {
4603
- onChange(file);
4717
+ let canceled = false;
4718
+ const startVideoStream = async () => {
4719
+ try {
4720
+ setErrorMessage(null);
4721
+ setIsReady(false);
4722
+ logCameraDebug("video engine stream request");
4723
+ if (!navigator.mediaDevices?.getUserMedia) {
4724
+ throw new Error("mediaDevices.getUserMedia is not supported");
4725
+ }
4726
+ const stream = await navigator.mediaDevices.getUserMedia(createVideoCaptureConstraints());
4727
+ if (canceled) {
4728
+ stopVideoStream(stream);
4729
+ return;
4730
+ }
4731
+ streamRef.current = stream;
4732
+ if (!videoRef.current) {
4733
+ throw new Error("Video element is not mounted");
4734
+ }
4735
+ videoRef.current.srcObject = stream;
4736
+ await videoRef.current.play();
4737
+ if (canceled) {
4738
+ stopVideoStream(stream);
4739
+ return;
4740
+ }
4741
+ if (isVideoFrameReady(videoRef.current)) {
4742
+ setIsReady(true);
4743
+ }
4744
+ logCameraDebug("video engine stream ready");
4745
+ } catch (error) {
4746
+ if (canceled) {
4747
+ return;
4748
+ }
4749
+ logCameraError("video engine stream failed", error);
4750
+ setErrorMessage("\uCE74\uBA54\uB77C\uB97C \uC0AC\uC6A9\uD560 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4.");
4751
+ }
4752
+ };
4753
+ void startVideoStream();
4754
+ return () => {
4755
+ canceled = true;
4756
+ stopVideoStream(streamRef.current);
4757
+ streamRef.current = null;
4758
+ logCameraDebug("video engine stream stopped");
4759
+ };
4760
+ }, [open]);
4761
+ const handleLoadedMetadata = () => {
4762
+ if (!videoRef.current) {
4763
+ return;
4604
4764
  }
4765
+ setIsReady(isVideoFrameReady(videoRef.current));
4605
4766
  };
4606
- const processImage = async (uri) => {
4607
- if (responseFileType === "scheme") {
4608
- const file = await imageUrlToFile(uri, convertType);
4609
- await imageHandler(file);
4610
- } else {
4611
- const file = await base64ToFile(uri, "image.jpg");
4612
- await imageHandler(file);
4767
+ const handleCapture = async () => {
4768
+ if (!videoRef.current || isCapturing || !canCaptureMore) {
4769
+ return;
4613
4770
  }
4614
- };
4615
- const onClick = () => {
4616
- if (useNativeCamera) {
4617
- if (isAndroidDevice()) {
4618
- salesFrontendBridge.Bridge.native.documentCapture({ responseFileType: responseFileType || "scheme" }).then(async ({ uri }) => {
4619
- processImage(uri);
4620
- });
4621
- } else {
4622
- salesFrontendBridge.Bridge.native.documentCapture({ responseFileType: responseFileType || "base64" }).then(async ({ uri }) => {
4623
- processImage(uri);
4624
- });
4625
- }
4626
- } else {
4627
- const input = document.createElement("input");
4628
- input.type = "file";
4629
- input.accept = "image/*";
4630
- if (cameraOnly) {
4631
- input.capture = "camera";
4771
+ try {
4772
+ setIsCapturing(true);
4773
+ const file = await createVideoCaptureFile(videoRef.current);
4774
+ logCameraDebug("video engine capture completed", { size: file.size, type: file.type });
4775
+ if (isMultiShot) {
4776
+ setCapturedShots((prev) => [...prev, { file, previewUrl: URL.createObjectURL(file) }]);
4777
+ return;
4632
4778
  }
4633
- input.addEventListener("change", async (event) => {
4634
- const target = event.target;
4635
- const { files } = target;
4636
- if (files && files.length > 0) {
4637
- const file = files[0];
4638
- if (file) {
4639
- await imageHandler(file);
4640
- }
4641
- }
4642
- document.body.removeChild(input);
4643
- });
4644
- input.style.display = "none";
4645
- document.body.appendChild(input);
4646
- input.click();
4779
+ await onCapture([file]);
4780
+ onClose();
4781
+ } catch (error) {
4782
+ logCameraError("video engine capture failed", error);
4783
+ setErrorMessage("\uCD2C\uC601 \uC774\uBBF8\uC9C0\uB97C \uCC98\uB9AC\uD558\uC9C0 \uBABB\uD588\uC2B5\uB2C8\uB2E4.");
4784
+ } finally {
4785
+ setIsCapturing(false);
4647
4786
  }
4648
4787
  };
4649
- const deleteImage = (imageId) => {
4650
- const imageIndex = attachedPhotos.findIndex((image) => image.id === imageId);
4651
- if (imageIndex > -1) {
4652
- const item = attachedPhotos.splice(imageIndex, 1);
4653
- if (item[0]) {
4654
- URL.revokeObjectURL(item[0].src);
4655
- }
4656
- setAttachedPhotos([...attachedPhotos]);
4657
- if (onDelete) {
4658
- onDelete(imageId);
4659
- }
4788
+ const handleComplete = async () => {
4789
+ if (capturedShots.length === 0) {
4790
+ return;
4791
+ }
4792
+ try {
4793
+ await onCapture(capturedShots.map((shot) => shot.file));
4794
+ onClose();
4795
+ } catch (error) {
4796
+ logCameraError("video engine multi-shot complete failed", error);
4797
+ setErrorMessage("\uCD2C\uC601 \uC774\uBBF8\uC9C0\uB97C \uCC98\uB9AC\uD558\uC9C0 \uBABB\uD588\uC2B5\uB2C8\uB2E4.");
4660
4798
  }
4661
4799
  };
4662
- const deleteAllImages = () => {
4663
- attachedPhotos.forEach((image) => {
4664
- URL.revokeObjectURL(image.src);
4665
- if (onDelete) {
4666
- onDelete(image.id);
4800
+ const handleRemoveCapturedShot = (targetIndex) => {
4801
+ setCapturedShots((prev) => {
4802
+ const target = prev[targetIndex];
4803
+ if (target) {
4804
+ URL.revokeObjectURL(target.previewUrl);
4667
4805
  }
4806
+ return prev.filter((_, index) => index !== targetIndex);
4668
4807
  });
4669
- setAttachedPhotos([]);
4670
4808
  };
4671
- const CameraComponent = () => /* @__PURE__ */ jsxRuntime.jsx(
4672
- Attachment,
4673
- {
4674
- show: !!show,
4675
- onAddPhoto: onClick,
4676
- onRemovePhoto: deleteImage,
4677
- photos: attachedPhotos,
4678
- type,
4679
- buttonText
4680
- }
4681
- );
4682
- React9.useEffect(() => {
4683
- return () => {
4684
- attachedPhotos.forEach((image) => {
4685
- URL.revokeObjectURL(image.src);
4686
- });
4687
- };
4688
- }, []);
4689
- return {
4690
- onClick,
4691
- getImage: findImage,
4692
- deleteImage,
4693
- deleteAllImages,
4694
- attachedPhotos,
4695
- Attachment: CameraComponent,
4696
- addImage: (data) => {
4697
- setAttachedPhotos([
4698
- ...attachedPhotos,
4699
- ...data.map((item) => {
4700
- let blobUrl = "";
4701
- if (item.data instanceof Blob) {
4702
- blobUrl = URL.createObjectURL(item.data);
4703
- } else if (typeof item.data === "string") {
4704
- blobUrl = URL.createObjectURL(base64ToBlob(item.data));
4809
+ if (!open) {
4810
+ return null;
4811
+ }
4812
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx$b("video-capture-overlay"), role: "dialog", "aria-modal": "true", "aria-label": "\uCE74\uBA54\uB77C \uCD2C\uC601", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$b("video-capture-dialog"), children: [
4813
+ /* @__PURE__ */ jsxRuntime.jsx(
4814
+ "video",
4815
+ {
4816
+ ref: videoRef,
4817
+ className: cx$b("video-capture-view"),
4818
+ autoPlay: true,
4819
+ muted: true,
4820
+ playsInline: true,
4821
+ onLoadedMetadata: handleLoadedMetadata
4822
+ }
4823
+ ),
4824
+ errorMessage ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cx$b("video-capture-error"), role: "alert", children: errorMessage }) : null,
4825
+ isMultiShot ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$b("video-capture-thumbnails"), "aria-live": "polite", children: [
4826
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cx$b("video-capture-counter"), children: [
4827
+ capturedShots.length,
4828
+ "/",
4829
+ normalizedMaxShots
4830
+ ] }),
4831
+ capturedShots.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cx$b("video-capture-thumbnail-list"), children: capturedShots.map((shot, index) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: cx$b("video-capture-thumbnail-item"), children: [
4832
+ /* @__PURE__ */ jsxRuntime.jsx(
4833
+ "img",
4834
+ {
4835
+ src: shot.previewUrl,
4836
+ alt: `\uCD2C\uC601 ${index + 1}\uBC88 \uC0AC\uC9C4`,
4837
+ className: cx$b("video-capture-thumbnail-image")
4705
4838
  }
4706
- const newPhoto = {
4707
- id: genImageId$1(),
4708
- src: blobUrl,
4709
- name: item.name || `\uC11C\uB958\uC0AC\uC9C4_${attachedPhotos.length + 1}`
4710
- };
4711
- return newPhoto;
4712
- })
4713
- ]);
4714
- }
4715
- };
4839
+ ),
4840
+ /* @__PURE__ */ jsxRuntime.jsx(
4841
+ "button",
4842
+ {
4843
+ type: "button",
4844
+ className: cx$b("video-capture-thumbnail-remove"),
4845
+ onClick: () => handleRemoveCapturedShot(index),
4846
+ "aria-label": `\uCD2C\uC601 ${index + 1}\uBC88 \uC0AC\uC9C4 \uC0AD\uC81C`,
4847
+ children: "\xD7"
4848
+ }
4849
+ )
4850
+ ] }, shot.previewUrl)) }) : null
4851
+ ] }) : null,
4852
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx$b("video-capture-actions"), children: [
4853
+ /* @__PURE__ */ jsxRuntime.jsx("button", { className: cx$b("video-capture-button", "video-capture-secondary"), type: "button", onClick: onClose, children: "\uB2EB\uAE30" }),
4854
+ /* @__PURE__ */ jsxRuntime.jsx(
4855
+ "button",
4856
+ {
4857
+ className: cx$b("video-capture-button", "video-capture-primary"),
4858
+ type: "button",
4859
+ disabled: !isReady || isCapturing || !canCaptureMore,
4860
+ onClick: handleCapture,
4861
+ children: "\uCD2C\uC601"
4862
+ }
4863
+ ),
4864
+ isMultiShot ? /* @__PURE__ */ jsxRuntime.jsx(
4865
+ "button",
4866
+ {
4867
+ className: cx$b("video-capture-button", "video-capture-primary"),
4868
+ type: "button",
4869
+ disabled: capturedShots.length === 0,
4870
+ onClick: handleComplete,
4871
+ children: "\uC644\uB8CC"
4872
+ }
4873
+ ) : null
4874
+ ] })
4875
+ ] }) });
4876
+ }
4877
+ function stopVideoStream(stream) {
4878
+ stream?.getTracks().forEach((track) => {
4879
+ track.stop();
4880
+ });
4881
+ }
4882
+ function isVideoFrameReady(video) {
4883
+ return video.videoWidth > 0 && video.videoHeight > 0;
4884
+ }
4885
+ function canvasToBlob(canvas) {
4886
+ if (canvas.toBlob) {
4887
+ return new Promise((resolve, reject) => {
4888
+ canvas.toBlob(
4889
+ (blob) => {
4890
+ if (!blob) {
4891
+ reject(new Error("Canvas blob is empty"));
4892
+ return;
4893
+ }
4894
+ resolve(blob);
4895
+ },
4896
+ VIDEO_CAPTURE_MIME_TYPE,
4897
+ VIDEO_CAPTURE_QUALITY
4898
+ );
4899
+ });
4900
+ }
4901
+ return Promise.resolve(dataUrlToBlob(canvas.toDataURL(VIDEO_CAPTURE_MIME_TYPE, VIDEO_CAPTURE_QUALITY)));
4902
+ }
4903
+ function dataUrlToBlob(dataUrl) {
4904
+ const [header = "", body = ""] = dataUrl.split(",");
4905
+ const mimeType = header.match(/data:(.*);base64/)?.[1] || VIDEO_CAPTURE_MIME_TYPE;
4906
+ const binary = window.atob(body);
4907
+ const bytes = new Uint8Array(binary.length);
4908
+ for (let i = 0; i < binary.length; i++) {
4909
+ bytes[i] = binary.charCodeAt(i);
4910
+ }
4911
+ return new Blob([bytes], { type: mimeType });
4716
4912
  }
4717
4913
 
4718
4914
  const genImageId = () => `camera-${Date.now()}-${Math.random()}`;
4719
- function useCameraV2({
4915
+ function useCameraV3({
4720
4916
  onChange,
4721
4917
  resize: resizeOption = {
4722
4918
  processType: "mixed",
@@ -4732,83 +4928,152 @@ function useCameraV2({
4732
4928
  type = "multiple",
4733
4929
  buttonText,
4734
4930
  initData,
4931
+ captureEngineType,
4932
+ resizeTiming = "onCapture",
4933
+ pageLimit,
4735
4934
  useNativeCamera = false,
4736
- responseFileType,
4737
- convertType = "canvas"
4738
- }) {
4935
+ convertType = "canvas",
4936
+ maxPhotos,
4937
+ overMaxPhotosBehavior,
4938
+ maxPhotosErrorHandler
4939
+ } = {}) {
4739
4940
  const convertedInitData = initData?.map((data, index) => ({ ...data, id: String(index + 1) }));
4740
4941
  const [attachedPhotos, setAttachedPhotos] = React9.useState(convertedInitData || []);
4741
- const findImage = async (imageId) => {
4742
- const photo = attachedPhotos.find((image) => image.id === imageId);
4743
- if (!photo) {
4744
- throw new Error("[use-camera-v2] : Image not found");
4942
+ const attachedPhotosRef = React9.useRef(convertedInitData || []);
4943
+ const [isVideoCaptureOpen, setIsVideoCaptureOpen] = React9.useState(false);
4944
+ const resolvedCaptureEngineType = resolveCaptureEngineType({ captureEngineType, useNativeCamera });
4945
+ const normalizedPageLimit = pageLimit && pageLimit > 0 ? pageLimit : 1;
4946
+ const resolvedMaxPhotos = maxPhotos ?? (type === "single" ? 1 : Math.max(4, normalizedPageLimit));
4947
+ const resolvedOverflowBehavior = overMaxPhotosBehavior ?? (maxPhotosErrorHandler ? "error" : "truncate");
4948
+ const applyMaxPhotosPolicy = (items, overflow) => {
4949
+ if (items.length === 0) {
4950
+ return items;
4951
+ }
4952
+ const current = attachedPhotosRef.current.length;
4953
+ const remaining = Math.max(0, resolvedMaxPhotos - current);
4954
+ if (items.length <= remaining) {
4955
+ return items;
4956
+ }
4957
+ if (resolvedOverflowBehavior === "error" && maxPhotosErrorHandler) {
4958
+ maxPhotosErrorHandler(
4959
+ overflow.buildInfo({ attempted: items.length, current, max: resolvedMaxPhotos, data: items })
4960
+ );
4961
+ return null;
4745
4962
  }
4746
- const file = await imageUrlToFile(photo?.src, convertType);
4747
- const convertedPhoto = {
4748
- ...photo,
4749
- src: URL.createObjectURL(resizeOption ? await resize(file, resizeOption) : file)
4750
- };
4751
- return convertedPhoto;
4963
+ if (remaining === 0) {
4964
+ return null;
4965
+ }
4966
+ return items.slice(0, remaining);
4752
4967
  };
4753
- const imageHandler = async (uri) => {
4754
- const newPhoto = {
4755
- id: genImageId(),
4756
- src: uri,
4757
- name: `\uC11C\uB958\uC0AC\uC9C4_${attachedPhotos.length + 1}`
4758
- };
4759
- if (type === "single") {
4760
- setAttachedPhotos([newPhoto]);
4761
- } else {
4762
- setAttachedPhotos([...attachedPhotos, newPhoto]);
4968
+ const buildPhoto = async (source, name) => {
4969
+ if (resizeTiming === "onCapture") {
4970
+ const original = await convertSourceToFile(source, convertType);
4971
+ const processed = resizeOption ? await resize(original, resizeOption) : original;
4972
+ return { photo: { id: genImageId(), src: URL.createObjectURL(processed), name }, file: original };
4973
+ }
4974
+ const file = onChange ? await convertSourceToFile(source, convertType) : void 0;
4975
+ return { photo: { id: genImageId(), src: source.uri, name }, file };
4976
+ };
4977
+ const storeCapturedSources = async (sources, source = "native", overflowData) => {
4978
+ if (sources.length === 0) {
4979
+ return;
4980
+ }
4981
+ const accepted = applyMaxPhotosPolicy(sources, {
4982
+ source,
4983
+ buildInfo: ({ attempted, current, max }) => {
4984
+ const data = overflowData ?? sources;
4985
+ if (source === "native") {
4986
+ return { source: "native", attempted, current, max, data };
4987
+ }
4988
+ if (source === "addImage") {
4989
+ return { source: "addImage", attempted, current, max, data };
4990
+ }
4991
+ return { source, attempted, current, max, data };
4992
+ }
4993
+ });
4994
+ if (!accepted || accepted.length === 0) {
4995
+ return;
4763
4996
  }
4997
+ const baseCount = attachedPhotosRef.current.length;
4998
+ const built = await Promise.all(
4999
+ accepted.map((item, index) => buildPhoto(item, `\uC11C\uB958\uC0AC\uC9C4_${baseCount + index + 1}`))
5000
+ );
5001
+ const builtPhotos = built.map((item) => item.photo);
5002
+ setAttachedPhotos((prev) => type === "single" ? builtPhotos.slice(-1) : [...prev, ...builtPhotos]);
4764
5003
  if (onChange) {
4765
- const file = await imageUrlToFile(uri, convertType);
4766
- onChange(file);
5004
+ built.forEach((item) => {
5005
+ if (item.file) {
5006
+ onChange(item.file);
5007
+ }
5008
+ });
4767
5009
  }
4768
5010
  };
4769
- const onClick = () => {
4770
- if (useNativeCamera) {
4771
- salesFrontendBridge.Bridge.native.documentCapture({ responseFileType }).then(async ({ uri }) => {
4772
- imageHandler(uri);
4773
- });
4774
- } else {
4775
- const input = document.createElement("input");
4776
- input.type = "file";
4777
- input.accept = "image/*";
4778
- if (cameraOnly) {
4779
- input.capture = "camera";
5011
+ const openFileInput = () => {
5012
+ const input = document.createElement("input");
5013
+ input.type = "file";
5014
+ input.accept = "image/*";
5015
+ input.multiple = normalizedPageLimit > 1;
5016
+ if (cameraOnly) {
5017
+ input.capture = "camera";
5018
+ }
5019
+ input.addEventListener("change", async (event) => {
5020
+ const target = event.target;
5021
+ const fileList = target.files ? Array.from(target.files) : [];
5022
+ if (fileList.length > 0) {
5023
+ const sources = fileList.map((file) => ({
5024
+ kind: "file",
5025
+ file,
5026
+ uri: URL.createObjectURL(file)
5027
+ }));
5028
+ await storeCapturedSources(sources, "input", fileList);
4780
5029
  }
4781
- input.addEventListener("change", async (event) => {
4782
- const target = event.target;
4783
- const { files } = target;
4784
- if (files && files.length > 0) {
4785
- const file = files[0];
4786
- if (file) {
4787
- await imageHandler(URL.createObjectURL(file));
4788
- }
4789
- }
4790
- document.body.removeChild(input);
4791
- });
4792
- input.style.display = "none";
4793
- document.body.appendChild(input);
4794
- input.click();
5030
+ document.body.removeChild(input);
5031
+ });
5032
+ input.style.display = "none";
5033
+ document.body.appendChild(input);
5034
+ input.click();
5035
+ };
5036
+ const onClick = () => {
5037
+ logCameraDebug("useCameraV3 capture requested", {
5038
+ captureEngineType: resolvedCaptureEngineType,
5039
+ resizeTiming
5040
+ });
5041
+ if (resolvedCaptureEngineType === "native") {
5042
+ captureNativeDocuments({ pageLimit }).then((sources) => storeCapturedSources(sources, "native"));
5043
+ return;
5044
+ }
5045
+ if (resolvedCaptureEngineType === "video") {
5046
+ setIsVideoCaptureOpen(true);
5047
+ return;
4795
5048
  }
5049
+ openFileInput();
5050
+ };
5051
+ const getImage = async (imageId) => {
5052
+ const photo = attachedPhotosRef.current.find((image) => image.id === imageId);
5053
+ if (!photo) {
5054
+ throw new Error("[use-camera-v3] : Image not found");
5055
+ }
5056
+ if (resizeTiming === "onCapture") {
5057
+ return photo;
5058
+ }
5059
+ const file = await convertSourceToFile({ kind: "scheme", uri: photo.src }, convertType);
5060
+ return { ...photo, src: URL.createObjectURL(resizeOption ? await resize(file, resizeOption) : file) };
4796
5061
  };
4797
5062
  const deleteImage = (imageId) => {
4798
- const imageIndex = attachedPhotos.findIndex((image) => image.id === imageId);
4799
- if (imageIndex > -1) {
4800
- const item = attachedPhotos.splice(imageIndex, 1);
4801
- if (item[0]) {
4802
- URL.revokeObjectURL(item[0].src);
5063
+ setAttachedPhotos((prev) => {
5064
+ const target = prev.find((image) => image.id === imageId);
5065
+ if (!target) {
5066
+ return prev;
4803
5067
  }
4804
- setAttachedPhotos([...attachedPhotos]);
5068
+ URL.revokeObjectURL(target.src);
4805
5069
  if (onDelete) {
4806
5070
  onDelete(imageId);
4807
5071
  }
4808
- }
5072
+ return prev.filter((image) => image.id !== imageId);
5073
+ });
4809
5074
  };
4810
5075
  const deleteAllImages = () => {
4811
- attachedPhotos.forEach((image) => {
5076
+ attachedPhotosRef.current.forEach((image) => {
4812
5077
  URL.revokeObjectURL(image.src);
4813
5078
  if (onDelete) {
4814
5079
  onDelete(image.id);
@@ -4816,51 +5081,94 @@ function useCameraV2({
4816
5081
  });
4817
5082
  setAttachedPhotos([]);
4818
5083
  };
4819
- const CameraComponent = () => /* @__PURE__ */ jsxRuntime.jsx(
4820
- Attachment,
4821
- {
4822
- show: !!show,
4823
- onAddPhoto: onClick,
4824
- onRemovePhoto: deleteImage,
4825
- photos: attachedPhotos,
4826
- type,
4827
- buttonText
5084
+ const addImage = (data) => {
5085
+ const accepted = applyMaxPhotosPolicy(data, {
5086
+ source: "addImage",
5087
+ buildInfo: ({ attempted, current, max }) => ({
5088
+ source: "addImage",
5089
+ attempted,
5090
+ current,
5091
+ max,
5092
+ data
5093
+ })
5094
+ });
5095
+ if (!accepted || accepted.length === 0) {
5096
+ return;
4828
5097
  }
4829
- );
5098
+ setAttachedPhotos((prev) => [
5099
+ ...prev,
5100
+ ...accepted.map((item, index) => {
5101
+ let blobUrl = "";
5102
+ if (item.data instanceof Blob) {
5103
+ blobUrl = URL.createObjectURL(item.data);
5104
+ } else if (typeof item.data === "string") {
5105
+ blobUrl = URL.createObjectURL(base64ToBlob(item.data));
5106
+ }
5107
+ return { id: genImageId(), src: blobUrl, name: item.name || `\uC11C\uB958\uC0AC\uC9C4_${prev.length + index + 1}` };
5108
+ })
5109
+ ]);
5110
+ };
5111
+ const CameraComponent = () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5112
+ /* @__PURE__ */ jsxRuntime.jsx(
5113
+ Attachment,
5114
+ {
5115
+ show: !!show,
5116
+ onAddPhoto: onClick,
5117
+ onRemovePhoto: deleteImage,
5118
+ photos: attachedPhotos,
5119
+ type,
5120
+ buttonText,
5121
+ maxPhotos: resolvedMaxPhotos
5122
+ }
5123
+ ),
5124
+ /* @__PURE__ */ jsxRuntime.jsx(
5125
+ VideoCaptureModal,
5126
+ {
5127
+ open: resolvedCaptureEngineType === "video" && isVideoCaptureOpen,
5128
+ maxShots: normalizedPageLimit,
5129
+ onCapture: (files) => {
5130
+ const sources = files.map((file) => ({
5131
+ kind: "file",
5132
+ file,
5133
+ uri: URL.createObjectURL(file)
5134
+ }));
5135
+ return storeCapturedSources(sources, "video", files);
5136
+ },
5137
+ onClose: () => setIsVideoCaptureOpen(false)
5138
+ }
5139
+ )
5140
+ ] });
5141
+ React9.useEffect(() => {
5142
+ attachedPhotosRef.current = attachedPhotos;
5143
+ }, [attachedPhotos]);
4830
5144
  React9.useEffect(() => {
4831
5145
  return () => {
4832
- attachedPhotos.forEach((image) => {
5146
+ attachedPhotosRef.current.forEach((image) => {
4833
5147
  URL.revokeObjectURL(image.src);
4834
5148
  });
4835
5149
  };
4836
5150
  }, []);
4837
5151
  return {
4838
5152
  onClick,
4839
- getImage: findImage,
5153
+ getImage,
4840
5154
  deleteImage,
4841
5155
  deleteAllImages,
4842
5156
  attachedPhotos,
4843
5157
  Attachment: CameraComponent,
4844
- addImage: (data) => {
4845
- setAttachedPhotos([
4846
- ...attachedPhotos,
4847
- ...data.map((item) => {
4848
- let blobUrl = "";
4849
- if (item.data instanceof Blob) {
4850
- blobUrl = URL.createObjectURL(item.data);
4851
- } else if (typeof item.data === "string") {
4852
- blobUrl = URL.createObjectURL(base64ToBlob(item.data));
4853
- }
4854
- const newPhoto = {
4855
- id: genImageId(),
4856
- src: blobUrl,
4857
- name: item.name || `\uC11C\uB958\uC0AC\uC9C4_${attachedPhotos.length + 1}`
4858
- };
4859
- return newPhoto;
4860
- })
4861
- ]);
4862
- }
5158
+ addImage
5159
+ };
5160
+ }
5161
+
5162
+ function useCamera(options = {}) {
5163
+ const camera = useCameraV3({ pageLimit: 1, ...options, resizeTiming: "onCapture" });
5164
+ const getImage = (imageId) => {
5165
+ return camera.attachedPhotos.find((image) => image.id === imageId);
4863
5166
  };
5167
+ return { ...camera, getImage };
5168
+ }
5169
+
5170
+ function useCameraV2(options) {
5171
+ return useCameraV3({ pageLimit: 1, ...options, resizeTiming: "onRetrieve" });
4864
5172
  }
4865
5173
 
4866
5174
  const HISTORY_SIZE = 100;
@@ -7447,6 +7755,7 @@ exports.useAddressComponent = useAddressComponent;
7447
7755
  exports.useBankStockSearch = useBankStockSearch;
7448
7756
  exports.useCamera = useCamera;
7449
7757
  exports.useCameraV2 = useCameraV2;
7758
+ exports.useCameraV3 = useCameraV3;
7450
7759
  exports.useCanvasPaint = useCanvasPaint;
7451
7760
  exports.useCustomerSearch = useCustomerSearch;
7452
7761
  exports.useDownloader = useDownloader;