sales-frontend-components 0.0.73 → 0.0.75

package/dist/index.d.ts

@@ -247,13 +247,6 @@ interface JobSearchModalProps {
 }
 declare const JobSearchModal: React__default.FC<JobSearchModalProps>;
 
-interface Customer {
-    id: string;
-    name: string;
-    birthdate: string;
-    gender: '남성' | '여성';
-    address?: string;
-}
 interface DspResponseCustomerListResponseDto {
     /** @description 성공여부 */
     isSuccess?: boolean;
@@ -285,11 +278,11 @@ interface CustomerDto {
     /** @description 성별코드 */
     genderCode?: string;
 }
-
 interface CustomerSearchProps {
     onSelect?: (customer: CustomerDto) => void;
 }
+
 declare const CustomerSearch: ({ onSelect }: CustomerSearchProps) => react_jsx_runtime.JSX.Element;
 
 export { Attachment, BankStockSearchModal, CustomerSearch, FormCheckbox, FormCheckboxButton, FormDatePicker, FormDateRangePicker, FormSearchJobField, FormSegmentGroup, FormSelect, FormTextField, JobSearchModal, StepIndicator, resize, testSignatureBase64Data, useAddressComponent, useBankStockSearch, useCamera, useCanvasPaint, useJobVehicleSearchModal, useSearchAddress };
-export type { AttachedPhoto, AttachmentProps, BankStockItem, BankStockSearchModalProps, Customer, CustomerDto, CustomerListResponseDto, DownloadProps, DspResponseCustomerListResponseDto, PaintProps, Pen, StepIndicatorProps, StepItem, cameraItemType, cameraOptions };
+export type { AttachedPhoto, AttachmentProps, BankStockItem, BankStockSearchModalProps, CustomerDto, CustomerListResponseDto, CustomerSearchProps, DownloadProps, DspResponseCustomerListResponseDto, PaintProps, Pen, StepIndicatorProps, StepItem, cameraItemType, cameraOptions };

package/dist/index.esm.js

@@ -1,9 +1,9 @@
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { useController } from 'react-hook-form';
-import { CheckboxButton, Checkbox, DatePicker, DateRangePicker, Accordion, Radio, Table, Button, FormField, Select, Tab, useModalState, Modal, SegmentGroup, ModalUtils, Icon, FormCore, RadioGroup, useDropDown, List, ListItem } from 'sales-frontend-design-system';
+import { CheckboxButton, Checkbox, DatePicker, DateRangePicker, Accordion, Radio, Table, Button, FormField, Select, Tab, useModalState, Modal, SegmentGroup, ModalUtils, FormCore, RadioGroup, useDropDown, List, ListItem } from 'sales-frontend-design-system';
 import React, { useState, useEffect, useRef, useCallback, useMemo } from 'react';
 import { useSearchOccupationQuery, useSearchModalAddressQuery, useSearchVehicleQuery } from 'sales-frontend-api/method';
-import { IconMainUiSearch, IconGraphicsBankHsbc, IconGraphicsBankKebHana, IconGraphicsBankScJeil, IconGraphicsBankGyeongnam, IconGraphicsBankGwangju, IconGraphicsBankKukmin, IconGraphicsBankKiup, IconGraphicsBankJiyeokNonghyeop, IconGraphicsBankNhNonghyeop, IconGraphicsBankDaegu, IconGraphicsBankBusan, IconGraphicsBankSanlim, IconGraphicsBankSaneop, IconGraphicsBankSaemaulGeumgo, IconGraphicsBankSuhyeop, IconGraphicsBankSinhan, IconGraphicsBankSinhyeop, IconGraphicsBankOehwan, IconGraphicsBankWoori, IconGraphicsBankPost, IconGraphicsBankJeochuk, IconGraphicsBankJeonbuk, IconGraphicsBankJeju, IconGraphicsBankKakaoBank, IconGraphicsBankKBank, IconGraphicsBankHankookCity, IconGraphicsStockDbGeumyungTujajeungkwon, IconGraphicsStockKbJeungkwon, IconGraphicsStockNhWooriTujajeungkwon, IconGraphicsStockNhTujajeungkwon, IconGraphicsStockSkJeungkwon, IconGraphicsStockGyoboJeungkwon, IconGraphicsStockDaesinJeungkwon, IconGraphicsStockMeritzJeungkwon, IconGraphicsStockMiraeAssetJeungkwon, IconGraphicsStockBugukJeungkwon, IconGraphicsStockSamsungJeungkwon, IconGraphicsStockSinyeongJeungkwon, IconGraphicsStockSinhanTujajeungkwon, IconGraphicsStockYuantaJeungkwon, IconGraphicsStockYujinTujajeungkwon, IconGraphicsStockKiwoomJeungkwon, IconGraphicsStockHanaGeumyungTujajeungkwon, IconGraphicsStockHiTujajeungkwon, IconGraphicsStockHankookJeungkwonGeumyung, IconGraphicsStockHankookTujajeungkwon, IconGraphicsStockHanwhaTujajeungkwon, IconGraphicsStockHyundaiChaJeungkwon, IconGraphicsStockHochulEopsum, IconIllustGrade, IconIllustJob, IconSubUiArrowRight, IconIllustVehicle } from 'sales-frontend-assets';
+import { IconMainUiSearch, IconIllustCamera, IconGraphicsBankHsbc, IconGraphicsBankKebHana, IconGraphicsBankScJeil, IconGraphicsBankGyeongnam, IconGraphicsBankGwangju, IconGraphicsBankKukmin, IconGraphicsBankKiup, IconGraphicsBankJiyeokNonghyeop, IconGraphicsBankNhNonghyeop, IconGraphicsBankDaegu, IconGraphicsBankBusan, IconGraphicsBankSanlim, IconGraphicsBankSaneop, IconGraphicsBankSaemaulGeumgo, IconGraphicsBankSuhyeop, IconGraphicsBankSinhan, IconGraphicsBankSinhyeop, IconGraphicsBankOehwan, IconGraphicsBankWoori, IconGraphicsBankPost, IconGraphicsBankJeochuk, IconGraphicsBankJeonbuk, IconGraphicsBankJeju, IconGraphicsBankKakaoBank, IconGraphicsBankKBank, IconGraphicsBankHankookCity, IconGraphicsStockDbGeumyungTujajeungkwon, IconGraphicsStockKbJeungkwon, IconGraphicsStockNhWooriTujajeungkwon, IconGraphicsStockNhTujajeungkwon, IconGraphicsStockSkJeungkwon, IconGraphicsStockGyoboJeungkwon, IconGraphicsStockDaesinJeungkwon, IconGraphicsStockMeritzJeungkwon, IconGraphicsStockMiraeAssetJeungkwon, IconGraphicsStockBugukJeungkwon, IconGraphicsStockSamsungJeungkwon, IconGraphicsStockSinyeongJeungkwon, IconGraphicsStockSinhanTujajeungkwon, IconGraphicsStockYuantaJeungkwon, IconGraphicsStockYujinTujajeungkwon, IconGraphicsStockKiwoomJeungkwon, IconGraphicsStockHanaGeumyungTujajeungkwon, IconGraphicsStockHiTujajeungkwon, IconGraphicsStockHankookJeungkwonGeumyung, IconGraphicsStockHankookTujajeungkwon, IconGraphicsStockHanwhaTujajeungkwon, IconGraphicsStockHyundaiChaJeungkwon, IconGraphicsStockHochulEopsum, IconIllustGrade, IconIllustJob, IconSubUiArrowRight, IconIllustVehicle } from 'sales-frontend-assets';
 import styles from './modal/pre-standard/job-search-modal/job-search-modal.module.scss';
 import styles$1 from './step-indicator/step-indicator.module.scss';
 import styles$2 from './camera/camera.module.scss';
@@ -57,12 +57,17 @@ const FormDatePicker = ({
   ...props
 }) => {
   const { field, fieldState } = useController({ name, control, disabled, defaultValue });
-  const [initialDate, setInitialDate] = React.useState();
+  const [selected, setSelected] = React.useState();
   React.useEffect(() => {
     if (field.value) {
-      setInitialDate(field.value);
+      setSelected(field.value);
     }
   }, [defaultValue]);
+  React.useEffect(() => {
+    if (field.value !== selected) {
+      setSelected(field.value);
+    }
+  }, [field.value]);
   return /* @__PURE__ */ jsx(
     DatePicker,
     {
@@ -71,7 +76,7 @@ const FormDatePicker = ({
         ...props,
         ...field,
         id: field.name,
-        defaultValue: initialDate,
+        defaultValue: selected,
         error: fieldState.invalid,
         onValueChange: field.onChange
       }
@@ -87,12 +92,18 @@ const FormDateRangePicker = ({
   ...props
 }) => {
   const { field, fieldState } = useController({ name, control, disabled, defaultValue });
-  const [initialDate, setInitialDate] = React.useState();
+  const [selected, setSelected] = React.useState();
   React.useEffect(() => {
     if (field.value) {
-      setInitialDate(field.value);
+      setSelected(field.value);
     }
   }, [defaultValue]);
+  React.useEffect(() => {
+    if (selected && field.value.startDate.getTime() === selected.startDate?.getTime() && field.value.endDate.getTime() === selected.endDate?.getTime()) {
+      return;
+    }
+    setSelected(field.value);
+  }, [field.value]);
   return /* @__PURE__ */ jsx(
     DateRangePicker,
     {
@@ -101,13 +112,9 @@ const FormDateRangePicker = ({
         ...props,
         ...field,
         id: field.name,
-        defaultValue: initialDate,
+        defaultValue: selected,
         error: fieldState.invalid,
-        onValueChange: (selected) => {
-          if (field.value !== selected) {
-            field.onChange(selected);
-          }
-        }
+        onValueChange: field.onChange
       }
     }
   );
@@ -885,7 +892,7 @@ function Attachment({
   const renderPhotoSingle = () => {
     if (photos.length === 0) {
       return /* @__PURE__ */ jsx("div", { className: cx$5("single-photo-item", "add-photo-item"), children: /* @__PURE__ */ jsxs("button", { className: cx$5("add-photo-button-single"), onClick: handleAddPhoto, children: [
-        /* @__PURE__ */ jsx(Icon, { name: "illust/camera" }),
+        /* @__PURE__ */ jsx(IconIllustCamera, {}),
         /* @__PURE__ */ jsx("span", { children: buttonText || "\uC0AC\uC9C4 \uCCA8\uBD80\uD558\uAE30" })
       ] }) });
     }
@@ -900,7 +907,7 @@ function Attachment({
     if (photos.length < maxPhotos) {
       gridItems.push(
         /* @__PURE__ */ jsx("div", { className: cx$5("photo-item", "add-photo-item"), children: /* @__PURE__ */ jsxs("button", { className: cx$5("add-photo-button"), onClick: handleAddPhoto, children: [
-          /* @__PURE__ */ jsx(Icon, { name: "illust/camera" }),
+          /* @__PURE__ */ jsx(IconIllustCamera, {}),
           /* @__PURE__ */ jsx("span", { children: buttonText || "\uCCA8\uBD80\uD558\uAE30" }),
           /* @__PURE__ */ jsxs("span", { className: cx$5("photo-count"), children: [
             "(",
@@ -2030,7 +2037,11 @@ const useCustomerSearch = (onSelect) => {
     search,
     onClear,
     handleSelectItem,
-    selectedCustomer
+    selectedCustomer,
+    setSearchInput,
+    setCustomerList,
+    setSearchKeyword,
+    setIsOpen
   };
 };
 
@@ -2078,7 +2089,7 @@ const CustomerSearch = ({ onSelect }) => {
         ref: triggerRef
       }
     ) }) }),
-    isOpen && /* @__PURE__ */ jsx(DropDown, { children: /* @__PURE__ */ jsx("div", { className: cx("result-container"), children: customerList.length > 0 && /* @__PURE__ */ jsx(List, { rootProps: { style: { width: "100%" } }, children: customerList.map((customer) => /* @__PURE__ */ jsx(ListItem, { onClick: () => handleSelectItem(customer), selectable: true, children: /* @__PURE__ */ jsxs("div", { className: cx("customer-item"), children: [
+    isOpen && customerList.length > 0 && /* @__PURE__ */ jsx(DropDown, { children: /* @__PURE__ */ jsx("div", { className: cx("result-container"), children: /* @__PURE__ */ jsx(List, { children: customerList.map((customer) => /* @__PURE__ */ jsx(ListItem, { onClick: () => handleSelectItem(customer), selectable: true, children: /* @__PURE__ */ jsxs("div", { className: cx("customer-item"), children: [
       /* @__PURE__ */ jsx("div", { className: cx("name"), children: highlightOnSearchKeyword(customer.customerName || "", searchKeyword) }),
       /* @__PURE__ */ jsxs("div", { className: cx("details"), children: [
         /* @__PURE__ */ jsx("span", { children: customer.birthDate }),