@uniai-fe/uds-templates 0.5.6 → 0.5.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniai-fe/uds-templates",
-  "version": "0.5.6",
+  "version": "0.5.7",
   "description": "UNIAI Design System; UI Templates Package",
   "type": "module",
   "private": false,

package/src/cctv/components/Provider.tsx

@@ -2,6 +2,7 @@
 
 import { createContext, useContext } from "react";
 import { Form } from "@uniai-fe/uds-primitives";
+import type { DefaultValues } from "react-hook-form";
 
 import type {
   CctvApiUrlContext,
@@ -39,26 +40,32 @@ export function useCctvApiUrl(): CctvApiUrlContext {
  * @property {string} [listUrl] company-list API 요청 경로
  * @property {string} [tokenUrl] token API 요청 경로
  * @property {string} [username] CCTV 조회시 권한 확인을 위한 계정명
+ * @property {ContextExtension} [defaultValues] 서비스 확장 context 기본값
  * @property {React.ReactNode} children
  */
-export default function CCTVProvider({
+export default function CCTVProvider<ContextExtension extends object = object>({
   username,
   company_id,
   cam_id,
   listUrl,
   tokenUrl,
+  defaultValues,
   children,
-}: CctvProviderProps) {
+}: CctvProviderProps<ContextExtension>) {
+  const mergedDefaultValues = {
+    // 변경 설명: service 확장 context 기본값을 core CCTV form context와 한 RHF scope에서 병합한다.
+    ...defaultValues,
+    ...CCTV_CONTEXT_DEFAULT_VALUES,
+    username,
+    company_id,
+    cam_id,
+  } as DefaultValues<CctvContext<ContextExtension>>;
+
   return (
     <ApiUrlContext.Provider value={{ listUrl, tokenUrl }}>
-      <Form.Provider<CctvContext>
+      <Form.Provider<CctvContext<ContextExtension>>
         options={{
-          defaultValues: {
-            ...CCTV_CONTEXT_DEFAULT_VALUES,
-            username,
-            company_id,
-            cam_id,
-          },
+          defaultValues: mergedDefaultValues,
         }}
       >
         {children}

package/src/cctv/hooks/useContext.ts

@@ -11,7 +11,7 @@ import type {
   CctvCompanyCameraList,
   CctvCompanyGroup,
   CctvCompanyGroupItems,
-  CctvContext,
+  CctvBaseContext,
   UseCctvContextReturn,
 } from "../types";
 import { initCompanyList } from "../utils/data";
@@ -49,7 +49,7 @@ export default function useCctvContext(): UseCctvContextReturn {
   const setCtx = useSetAtom(cctvSelectedContext);
   const liveRegistry = useAtomValue(cctvRtcLiveRegistryAtom);
   // react-hook-form context에서 control/setValue 등을 꺼낸다.
-  const { control, setValue, ...context } = useFormContext<CctvContext>();
+  const { control, setValue, ...context } = useFormContext<CctvBaseContext>();
 
   // 폼 상태를 watch 하여 실시간 컨텍스트 값을 얻는다.
   const username = useWatch({ control, name: "username" });

package/src/cctv/types/context.ts

@@ -59,13 +59,17 @@ export interface CctvApiUrlContext {
  * CCTV; 실시간 영상보기 컨텍스트
  * @property {string} [company_id] 선택된 업체 id코드
  * @property {string} [cam_id] 선택된 카메라 id코드
+ * @property {string} username CCTV 조회시 권한 확인을 위한 계정명
  * @property {string} [search] 검색 키워드 (입력값)
  * @property {string} [filter] 검색 키워드 (필터값)
  * @property {API_Res_CctvCompanyGroup[]} rawData 원본 데이터 배열
  * @property {boolean} isFetching 데이터 로딩 상태
  * @property {boolean} isError 데이터 에러 상태
  */
-export interface CctvContext extends CctvSelectedContext {
+export interface CctvBaseContext extends CctvSelectedContext {
+  /**
+   * CCTV 조회시 권한 확인을 위한 계정명
+   */
   username: string;
   /**
    * 검색 키워드 (입력값)
@@ -79,21 +83,56 @@ export interface CctvContext extends CctvSelectedContext {
    * 원본 데이터 배열
    */
   rawData: API_Res_CctvCompanyGroup[];
+  /**
+   * 데이터 로딩 상태
+   */
   isFetching: boolean;
+  /**
+   * 데이터 에러 상태
+   */
   isError: boolean;
 }
 
+/**
+ * CCTV; Provider form context
+ * @template ContextExtension
+ * @typedef {CctvBaseContext & ContextExtension} CctvContext
+ * @property {string} [company_id] 선택된 업체 id코드
+ * @property {string} [cam_id] 선택된 카메라 id코드
+ * @property {string} username CCTV 조회시 권한 확인을 위한 계정명
+ * @property {string} search 검색 키워드 입력값
+ * @property {string} filter 검색 키워드 필터값
+ * @property {API_Res_CctvCompanyGroup[]} rawData 원본 데이터 배열
+ * @property {boolean} isFetching 데이터 로딩 상태
+ * @property {boolean} isError 데이터 에러 상태
+ */
+export type CctvContext<ContextExtension extends object = object> =
+  CctvBaseContext & ContextExtension;
+
 /**
  * CCTV; Provider props
+ * @template ContextExtension
  * @property {string} [company_id] 선택된 업체 id코드
  * @property {string} [cam_id] 선택된 카메라 id코드
  * @property {string} [listUrl] company-list API 요청 경로
  * @property {string} [tokenUrl] token API 요청 경로
  * @property {string} [username] CCTV 조회시 권한 확인을 위한 계정명
+ * @property {ContextExtension} [defaultValues] 서비스 확장 context 기본값
  * @property {React.ReactNode} children
  */
-export type CctvProviderProps = CctvSelectedContext &
-  CctvApiUrlContext & {
-    username?: string;
-    children: React.ReactNode;
-  };
+export type CctvProviderProps<ContextExtension extends object = object> =
+  CctvSelectedContext &
+    CctvApiUrlContext & {
+      /**
+       * CCTV 조회시 권한 확인을 위한 계정명
+       */
+      username?: string;
+      /**
+       * 서비스 확장 context 기본값
+       */
+      defaultValues?: ContextExtension;
+      /**
+       * Provider 하위 콘텐츠
+       */
+      children: React.ReactNode;
+    };

package/src/cctv/types/hook.ts

@@ -7,7 +7,7 @@ import type {
   CctvCompanyGroupItems,
 } from "./list";
 import type { UseFormReturn } from "react-hook-form";
-import type { CctvContext } from "./context";
+import type { CctvBaseContext } from "./context";
 
 /**
  * CCTV; useCctvRtcStream params
@@ -135,7 +135,7 @@ export interface UseCctvCompanyDataReturn extends Omit<
  * @property {(cam_id: string) => void} onOpenCamera 카메라 선택 함수
  * @property {() => void} onCloseCamera 카메라 선택 해제 함수
  */
-export interface UseCctvContextReturn extends UseFormReturn<CctvContext> {
+export interface UseCctvContextReturn extends UseFormReturn<CctvBaseContext> {
   /**
    * 데이터 로딩 중 상태
    */