@uniai-fe/uds-templates 0.0.8 → 0.0.10

package/src/components/auth/login/types/props.ts

@@ -0,0 +1,95 @@
+import React from "react";
+import type { SubmitHandler } from "react-hook-form";
+import type { AuthContainerProps } from "../../container";
+import type {
+  InputFieldConfig,
+  InputPasswordProps,
+  InputProps,
+} from "@uniai-fe/uds-primitives";
+
+/**
+ * 로그인 입력 필드 설정
+ * @typedef {AuthLoginFieldConfig}
+ * @template TProps
+ * @desc
+ * - InputFieldConfig 제네릭을 래핑해 로그인 요구사항과 연결한다.
+ * - props 제네릭으로 Input/PasswordInput 등 세부 props를 주입한다.
+ */
+export type AuthLoginFieldConfig<TProps extends InputProps = InputProps> =
+  InputFieldConfig<TProps>;
+
+/**
+ * 로그인 필드 묶음
+ * @template TAdditional
+ * @desc
+ * - 필수 id/password 필드와 확장 필드를 포함한다.
+ * @property {AuthLoginFieldConfig} id 아이디 필드 설정
+ * @property {AuthLoginFieldConfig} password 비밀번호 필드 설정
+ */
+export type AuthLoginFields<
+  TAdditional extends Record<string, AuthLoginFieldConfig> = Record<
+    string,
+    AuthLoginFieldConfig
+  >,
+> = TAdditional & {
+  /**
+   * 아이디 필드 설정
+   */
+  id: AuthLoginFieldConfig<InputProps>;
+  /**
+   * 비밀번호 필드 설정
+   */
+  password: AuthLoginFieldConfig<InputPasswordProps>;
+};
+
+/**
+ * 로그인 필드 옵션
+ * @template TFields
+ * @desc
+ * - fields, formAttr, onLogin을 묶어 전달한다.
+ * @property {TFields} fields 로그인 입력 필드 설정
+ * @property {React.FormHTMLAttributes<HTMLFormElement>} [formAttr] form 요소 attr
+ * @property {SubmitHandler<Record<string, string>>} onLogin 로그인 제출 핸들러
+ */
+export type AuthLoginFieldOptions<
+  TFields extends AuthLoginFields = AuthLoginFields,
+> = {
+  /** 로그인 필드 설정 */
+  fields: TFields;
+  /** form 요소에 전달할 attr */
+  formAttr?: React.FormHTMLAttributes<HTMLFormElement>;
+  /** 로그인 제출 핸들러 */
+  onLogin: SubmitHandler<Record<string, string>>;
+};
+
+/**
+ * 로그인 화면 링크 옵션
+ * @typedef {Object} AuthLoginLinkOptions
+ * @desc
+ * - 아이디/비밀번호 찾기, 회원가입 링크를 전달한다.
+ * @property {Object} find 아이디/비밀번호 찾기 링크
+ * @property {string} find.id 아이디 찾기 링크
+ * @property {string} find.password 비밀번호 찾기 링크
+ * @property {string} signup 회원가입 링크
+ */
+export type AuthLoginLinkOptions = {
+  find: {
+    id: string;
+    password: string;
+  };
+  signup: string;
+};
+
+/**
+ * 로그인 템플릿 props
+ * @template TFields
+ * @desc
+ * - AuthContainer props와 fieldOptions/linkOptions를 조합한다.
+ * @property {AuthLoginFieldOptions<TFields>} fieldOptions 입력 필드/폼 옵션
+ * @property {AuthLoginLinkOptions} linkOptions 링크 옵션
+ */
+export type AuthLoginProps<TFields extends AuthLoginFields = AuthLoginFields> =
+  Omit<AuthContainerProps, "children"> & {
+    fieldOptions: AuthLoginFieldOptions<TFields>;
+    linkOptions: AuthLoginLinkOptions;
+  };

package/src/components/auth/login/types.ts

@@ -0,0 +1,2 @@
+export * from "./types/props";
+export * from "./types/hooks";

package/src/index.tsx

@@ -1 +1,2 @@
 export * from "./components/page-frame";
+export * from "./components/auth";