@pfct/purple 1.10.0 → 1.11.1

package/dist/components/Navigation/Navigation.esm.js

@@ -1,42 +1,45 @@
 import e from "../../icons/src/icons/Cancel.esm.js";
 import t from "../../icons/src/icons/Chevron_left.esm.js";
 import "../../icons/src/aliases/index.esm.js";
-import { t as n } from "../../chunks/utils.DKI2ovkh.js";
+import { t as n } from "../../chunks/utils.D6DjRYW1.js";
 import { Title3 as r } from "../../core/Typography/index.esm.js";
 import { BaseNavigation as i } from "./BaseNavigation/index.esm.js";
 import { CONTENT_COLOR_MAP as a } from "./constant.esm.js";
-import { IconWrapper as o, TextWrapper as s } from "./index.styled.esm.js";
-import { useMemo as c } from "react";
-import { jsx as l } from "react/jsx-runtime";
+import { useMemo as o } from "react";
+import { jsx as s } from "react/jsx-runtime";
 //#region src/components/Navigation/Navigation.tsx
-var u = ({ contentColor: u, hasBackgroundColor: d, leftArea: f, rightArea: p, ...m }) => {
-	let h = a[u].backgroundColor, g = c(() => {
+var c = "flex h-full items-center justify-center", l = "flex h-full items-center justify-center mr-[5px]", u = ({ contentColor: u, hasBackgroundColor: d, leftArea: f, rightArea: p, ...m }) => {
+	let h = a[u].backgroundColor, g = o(() => {
 		let e = () => {
 			f?.handleClickButton();
 		};
 		switch (f?.type) {
-			case "backIcon": return /* @__PURE__ */ l(o, {
+			case "backIcon": return /* @__PURE__ */ s("div", {
+				className: c,
 				onClick: e,
-				children: /* @__PURE__ */ l(t, { className: n(u === "white" ? "text-white" : "text-gray-900") })
+				children: /* @__PURE__ */ s(t, { className: n(u === "white" ? "text-white" : "text-gray-900") })
 			});
 			default: return;
 		}
-	}, [f, u]), _ = c(() => {
+	}, [f, u]), _ = o(() => {
 		let t = () => {
 			p?.handleClickButton();
 		};
 		switch (p?.type) {
-			case "closeIcon": return /* @__PURE__ */ l(o, {
+			case "closeIcon": return /* @__PURE__ */ s("div", {
+				className: c,
 				onClick: t,
-				children: /* @__PURE__ */ l(e, { className: n(u === "white" ? "text-white" : "text-gray-900") })
+				children: /* @__PURE__ */ s(e, { className: n(u === "white" ? "text-white" : "text-gray-900") })
 			});
-			case "icon": return /* @__PURE__ */ l(o, {
+			case "icon": return /* @__PURE__ */ s("div", {
+				className: c,
 				onClick: t,
-				children: /* @__PURE__ */ l(p.children, { className: n(u === "white" ? "text-white" : "text-gray-900") })
+				children: /* @__PURE__ */ s(p.children, { className: n(u === "white" ? "text-white" : "text-gray-900") })
 			});
-			case "text": return /* @__PURE__ */ l(s, {
+			case "text": return /* @__PURE__ */ s("div", {
+				className: l,
 				onClick: t,
-				children: /* @__PURE__ */ l(r, {
+				children: /* @__PURE__ */ s(r, {
 					className: n(u === "white" ? "text-white" : "text-gray-700"),
 					children: p.children
 				})
@@ -44,7 +47,7 @@ var u = ({ contentColor: u, hasBackgroundColor: d, leftArea: f, rightArea: p, ..
 			default: return;
 		}
 	}, [p, u]);
-	return /* @__PURE__ */ l(i, {
+	return /* @__PURE__ */ s(i, {
 		backgroundColor: d ? h : "transparent",
 		leftChildren: g,
 		rightChildren: _,

package/dist/components/Navigation/PageNavigationBar/index.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../../../chunks/chunk.BwUGlERp.js`);const e=require(`../../../icons/src/icons/Chevron_left.cjs.js`);require(`../../../icons/src/aliases/index.cjs.js`);const t=require(`../../../chunks/utils.BICeWUKj.js`),n=require(`../../ui/typography.cjs.js`);let r=require(`react/jsx-runtime`);function i({hasBackground:e=!0,contentColor:t=`gray`,showTitle:n=!0,header:a={},title:o={children:`타이틀`},leftArea:s,rightArea:c={children:[]}}){return(0,r.jsxs)(i.Header,{contentColor:t,hasBackground:e,...a,children:[s?(0,r.jsx)(i.BackButton,{contentColor:t,...s}):null,n?(0,r.jsx)(i.Title,{contentColor:t,hasBackground:e,...o}):null,c?(0,r.jsx)(i.RightArea,{contentColor:t,hasBackground:e,...c}):null]})}i.Header=function({children:e,className:n=``,hasBackground:i=!0,contentColor:a=`gray`,...o}){return(0,r.jsx)(`header`,{className:t.t(`fixed top-0 mx-auto my-0 box-border flex h-[55px] w-full items-center`,i?`bg-white`:`bg-transparent`,a===`white`?`text-white`:`text-gray-900`,n),...o,children:e})},i.Title=function({children:e,className:i=``,contentColor:a=`gray`,...o}){return(0,r.jsx)(n.Typography,{className:t.t(`absolute left-1/2 -translate-x-1/2`,a===`white`?`text-white`:`text-gray-900`,i),variant:`h5`,...o,children:e})},i.BackButton=function({className:n=``,contentColor:i,size:a=25,ref:o,...s}){return(0,r.jsx)(`button`,{className:t.t(`absolute left-[20px] cursor-pointer`,n),ref:o,...s,children:(0,r.jsx)(e.default,{className:t.t(i===`white`?`text-white`:`text-gray-900`,n),size:a})})},i.RightArea=function({children:e,className:n=``,...i}){return(0,r.jsx)(`div`,{className:t.t(`absolute right-[20px] flex items-center justify-center gap-[20px]`,n),...i,children:e})},exports.PageNavigationBar=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../icons/src/icons/Chevron_left.cjs.js");require("../../../icons/src/aliases/index.cjs.js");const t=require("../../../chunks/utils.C67s_c-g.js"),n=require("../../ui/typography.cjs.js");let r=require("react/jsx-runtime");function i({hasBackground:e=!0,contentColor:t=`gray`,showTitle:n=!0,header:a={},title:o={children:`타이틀`},leftArea:s,rightArea:c={children:[]}}){return(0,r.jsxs)(i.Header,{contentColor:t,hasBackground:e,...a,children:[s?(0,r.jsx)(i.BackButton,{contentColor:t,...s}):null,n?(0,r.jsx)(i.Title,{contentColor:t,hasBackground:e,...o}):null,c?(0,r.jsx)(i.RightArea,{contentColor:t,hasBackground:e,...c}):null]})}i.Header=function({children:e,className:n=``,hasBackground:i=!0,contentColor:a=`gray`,...o}){return(0,r.jsx)(`header`,{className:t.t(`fixed top-0 mx-auto my-0 box-border flex h-[55px] w-full items-center`,i?`bg-white`:`bg-transparent`,a===`white`?`text-white`:`text-gray-900`,n),...o,children:e})},i.Title=function({children:e,className:i=``,contentColor:a=`gray`,...o}){return(0,r.jsx)(n.Typography,{className:t.t(`absolute left-1/2 -translate-x-1/2`,a===`white`?`text-white`:`text-gray-900`,i),variant:`h5`,...o,children:e})},i.BackButton=function({className:n=``,contentColor:i,size:a=25,ref:o,...s}){return(0,r.jsx)(`button`,{className:t.t(`absolute left-[20px] cursor-pointer`,n),ref:o,...s,children:(0,r.jsx)(e.default,{className:t.t(i===`white`?`text-white`:`text-gray-900`,n),size:a})})},i.RightArea=function({children:e,className:n=``,...i}){return(0,r.jsx)(`div`,{className:t.t(`absolute right-[20px] flex items-center justify-center gap-[20px]`,n),...i,children:e})},exports.PageNavigationBar=i;

package/dist/components/Navigation/PageNavigationBar/index.d.ts

@@ -9,14 +9,14 @@ interface PageNavigationBarProps {
     showTitle?: boolean;
     title?: Omit<PageNavigationBarTitleProps, 'hasBackground' | 'contentColor'>;
 }
-declare function PageNavigationBar({ hasBackground, contentColor, showTitle, header, title, leftArea, rightArea, }: PageNavigationBarProps): import("react/jsx-runtime").JSX.Element;
+declare function PageNavigationBar({ hasBackground, contentColor, showTitle, header, title, leftArea, rightArea, }: PageNavigationBarProps): React.JSX.Element;
 declare namespace PageNavigationBar {
-    var Header: ({ children, className, hasBackground, contentColor, ...props }: PageNavigationBarHeaderProps) => import("react/jsx-runtime").JSX.Element;
-    var Title: ({ children, className, contentColor, ...props }: PageNavigationBarTitleProps) => import("react/jsx-runtime").JSX.Element;
+    var Header: ({ children, className, hasBackground, contentColor, ...props }: PageNavigationBarHeaderProps) => React.JSX.Element;
+    var Title: ({ children, className, contentColor, ...props }: PageNavigationBarTitleProps) => React.JSX.Element;
     var BackButton: ({ className, contentColor, size, ref, ...props }: PageNavigationBarBackButtonProps & {
-        ref?: React.RefObject<HTMLButtonElement | null>;
-    }) => import("react/jsx-runtime").JSX.Element;
-    var RightArea: ({ children, className, ...props }: PageNavigationBarRightAreaProps) => import("react/jsx-runtime").JSX.Element;
+        ref?: React.Ref<HTMLButtonElement>;
+    }) => React.JSX.Element;
+    var RightArea: ({ children, className, ...props }: PageNavigationBarRightAreaProps) => React.JSX.Element;
 }
 interface PageNavigationBarComponentProps {
     contentColor?: 'white' | 'gray';

package/dist/components/Navigation/PageNavigationBar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Navigation/PageNavigationBar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAGnD,UAAU,sBAAsB;IAC/B,YAAY,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAChC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,IAAI,CAAC,4BAA4B,EAAE,eAAe,GAAG,cAAc,CAAC,CAAC;IAC9E,QAAQ,CAAC,EAAE,gCAAgC,CAAC;IAC5C,SAAS,CAAC,EAAE,IAAI,CAAC,+BAA+B,EAAE,eAAe,GAAG,cAAc,CAAC,CAAC;IACpF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,IAAI,CAAC,2BAA2B,EAAE,eAAe,GAAG,cAAc,CAAC,CAAC;CAC5E;AAGD,iBAAS,iBAAiB,CAAC,EAC1B,aAAoB,EACpB,YAAqB,EACrB,SAAgB,EAChB,MAAW,EACX,KAEC,EACD,QAAQ,EACR,SAEC,GACD,EAAE,sBAAsB,2CAYxB;kBAxBQ,iBAAiB;iFAwCvB,4BAA4B;iEAuB5B,2BAA2B;uEA0B3B,gCAAgC,GAAG;QAAE,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAA;KAAE;uDAiBtF,+BAA+B;;AAhFlC,UAAU,+BAA+B;IACxC,YAAY,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAChC,aAAa,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,KAAK,4BAA4B,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,+BAA+B,CAAC;AAyBxG,KAAK,2BAA2B,GAAG,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,GAAG,+BAA+B,CAAC;AAuB9G,KAAK,gCAAgC,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GACpF,OAAO,CAAC,+BAA+B,CAAC,GACxC,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;AAmBxB,KAAK,+BAA+B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG,+BAA+B,CAAC;AAc9G,YAAY,EAAE,sBAAsB,EAAE,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Navigation/PageNavigationBar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAGnD,UAAU,sBAAsB;IAC/B,YAAY,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAChC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,IAAI,CAAC,4BAA4B,EAAE,eAAe,GAAG,cAAc,CAAC,CAAC;IAC9E,QAAQ,CAAC,EAAE,gCAAgC,CAAC;IAC5C,SAAS,CAAC,EAAE,IAAI,CAAC,+BAA+B,EAAE,eAAe,GAAG,cAAc,CAAC,CAAC;IACpF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,IAAI,CAAC,2BAA2B,EAAE,eAAe,GAAG,cAAc,CAAC,CAAC;CAC5E;AAGD,iBAAS,iBAAiB,CAAC,EAC1B,aAAoB,EACpB,YAAqB,EACrB,SAAgB,EAChB,MAAW,EACX,KAEC,EACD,QAAQ,EACR,SAEC,GACD,EAAE,sBAAsB,qBAYxB;kBAxBQ,iBAAiB;iFAwCvB,4BAA4B;iEAuB5B,2BAA2B;uEA0B3B,gCAAgC,GAAG;QAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAA;KAAE;uDAiBzE,+BAA+B;;AAhFlC,UAAU,+BAA+B;IACxC,YAAY,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAChC,aAAa,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,KAAK,4BAA4B,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,+BAA+B,CAAC;AAyBxG,KAAK,2BAA2B,GAAG,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,GAAG,+BAA+B,CAAC;AAuB9G,KAAK,gCAAgC,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GACpF,OAAO,CAAC,+BAA+B,CAAC,GACxC,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;AAmBxB,KAAK,+BAA+B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG,+BAA+B,CAAC;AAc9G,YAAY,EAAE,sBAAsB,EAAE,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,CAAC"}

package/dist/components/Navigation/PageNavigationBar/index.esm.js

@@ -1,6 +1,6 @@
 import e from "../../../icons/src/icons/Chevron_left.esm.js";
 import "../../../icons/src/aliases/index.esm.js";
-import { t } from "../../../chunks/utils.DKI2ovkh.js";
+import { t } from "../../../chunks/utils.D6DjRYW1.js";
 import { Typography as n } from "../../ui/typography.esm.js";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/Navigation/PageNavigationBar/index.tsx

package/dist/components/Navigation/TitleNavigationBar/index.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../../../chunks/chunk.BwUGlERp.js`);const e=require(`../../../chunks/utils.BICeWUKj.js`),t=require(`../../ui/typography.cjs.js`);let n=require(`react/jsx-runtime`);var r=({hasBackground:r=!0,contentColor:i=`gray`,type:a=`title`,leftArea:o,rightArea:s,leftProps:c,ref:l,...u})=>(0,n.jsxs)(`div`,{className:e.t(`flex h-[55px] w-full items-center justify-between px-[20px]`,r?`bg-white`:`bg-transparent`,u.className),ref:l,...u,children:[a===`title`?(0,n.jsx)(t.Typography,{className:e.t(i===`white`?`text-white`:`text-gray-900`,c?.className),variant:`h3`,...c,children:o}):o,(0,n.jsx)(`div`,{className:`flex items-center gap-[20px]`,children:s?.map((e,t)=>(0,n.jsx)(`div`,{className:i===`white`?`text-white`:`text-gray-900`,children:e},t))})]});r.displayName=`TitleNavigationBar`,exports.TitleNavigationBar=r;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/utils.C67s_c-g.js"),t=require("../../ui/typography.cjs.js");let n=require("react/jsx-runtime");var r=({hasBackground:r=!0,contentColor:i=`gray`,type:a=`title`,leftArea:o,rightArea:s,leftProps:c,ref:l,...u})=>(0,n.jsxs)(`div`,{className:e.t(`flex h-[55px] w-full items-center justify-between px-[20px]`,r?`bg-white`:`bg-transparent`,u.className),ref:l,...u,children:[a===`title`?(0,n.jsx)(t.Typography,{className:e.t(i===`white`?`text-white`:`text-gray-900`,c?.className),variant:`h3`,...c,children:o}):o,(0,n.jsx)(`div`,{className:`flex items-center gap-[20px]`,children:s?.map((e,t)=>(0,n.jsx)(`div`,{className:i===`white`?`text-white`:`text-gray-900`,children:e},t))})]});r.displayName=`TitleNavigationBar`,exports.TitleNavigationBar=r;

package/dist/components/Navigation/TitleNavigationBar/index.d.ts

@@ -10,7 +10,7 @@ type TitleNavigationBarProps = {
     ref?: React.Ref<HTMLDivElement>;
 } & React.HTMLAttributes<HTMLDivElement>;
 declare const TitleNavigationBar: {
-    ({ hasBackground, contentColor, type, leftArea, rightArea, leftProps, ref, ...props }: TitleNavigationBarProps): import("react/jsx-runtime").JSX.Element;
+    ({ hasBackground, contentColor, type, leftArea, rightArea, leftProps, ref, ...props }: TitleNavigationBarProps): React.JSX.Element;
     displayName: string;
 };
 export type { TitleNavigationBarProps };

package/dist/components/Navigation/TitleNavigationBar/index.esm.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../chunks/utils.DKI2ovkh.js";
+import { t as e } from "../../../chunks/utils.D6DjRYW1.js";
 import { Typography as t } from "../../ui/typography.esm.js";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/components/Navigation/TitleNavigationBar/index.tsx

package/dist/components/Navigation/constant.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../core/Colors/index.cjs.js`);var t={white:{icon:e.basicColors.white,title:e.basicColors.white,rightText:e.basicColors.white,backgroundColor:e.basicColors.gray900},gray:{icon:e.basicColors.gray900,title:e.basicColors.gray900,rightText:e.basicColors.gray700,backgroundColor:e.basicColors.white}};exports.CONTENT_COLOR_MAP=t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../core/Colors/index.cjs.js");var t={white:{icon:e.basicColors.white,title:e.basicColors.white,rightText:e.basicColors.white,backgroundColor:e.basicColors.gray900},gray:{icon:e.basicColors.gray900,title:e.basicColors.gray900,rightText:e.basicColors.gray700,backgroundColor:e.basicColors.white}};exports.CONTENT_COLOR_MAP=t;

package/dist/components/Navigation/index.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./BaseNavigation/index.cjs.js`),t=require(`./BottomNavigationBar/index.cjs.js`),n=require(`./constant.cjs.js`),r=require(`./Navigation.cjs.js`),i=require(`./PageNavigationBar/index.cjs.js`),a=require(`./TitleNavigationBar/index.cjs.js`);exports.BaseNavigation=e.BaseNavigation,exports.BottomNavigationBar=t.BottomNavigationBar,exports.BottomNavigationBarItem=t.BottomNavigationBarItem,exports.CONTENT_COLOR_MAP=n.CONTENT_COLOR_MAP,exports.Navigation=r.Navigation,exports.PageNavigationBar=i.PageNavigationBar,exports.TitleNavigationBar=a.TitleNavigationBar;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./BaseNavigation/index.cjs.js"),t=require("./BottomNavigationBar/index.cjs.js"),n=require("./constant.cjs.js"),r=require("./Navigation.cjs.js"),i=require("./PageNavigationBar/index.cjs.js"),a=require("./TitleNavigationBar/index.cjs.js");exports.BaseNavigation=e.BaseNavigation,exports.BottomNavigationBar=t.BottomNavigationBar,exports.BottomNavigationBarItem=t.BottomNavigationBarItem,exports.CONTENT_COLOR_MAP=n.CONTENT_COLOR_MAP,exports.Navigation=r.Navigation,exports.PageNavigationBar=i.PageNavigationBar,exports.TitleNavigationBar=a.TitleNavigationBar;

package/dist/components/OverlayRoot/index.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../chunks/chunk.BwUGlERp.js`),t=require(`../../constants/style.constants.cjs.js`),n=require(`../../hooks/useOverlayPreventScroll.cjs.js`);require(`../../hooks/index.cjs.js`);const r=require(`./index.styled.cjs.js`);let i=require(`react`);i=e.n(i);let a=require(`react/jsx-runtime`);var o=i.default.memo(({className:e,visible:o,onClick:s,zIndex:c=t.zIndex.modal,children:l})=>{let[u,d]=(0,i.useState)(!1);return(0,i.useEffect)(()=>{let e;return o?d(!0):e=setTimeout(()=>d(!1),400),()=>{e!==void 0&&clearTimeout(e)}},[o]),n.useOverlayPreventScroll(o),u?(0,a.jsx)(r.Overlay,{className:e,onClick:e=>{e.target===e.currentTarget&&s?.()},visible:o,zIndex:c,children:l}):null});exports.OverlayRoot=o;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/chunk.CMqjfN_6.js"),t=require("../../chunks/utils.C67s_c-g.js"),n=require("../../constants/style.constants.cjs.js"),r=require("../../hooks/useOverlayPreventScroll.cjs.js");require("../../hooks/index.cjs.js");let i=require("react");i=e.t(i);let a=require("react/jsx-runtime");var o=i.default.memo(({className:e,visible:o,onClick:s,zIndex:c=n.zIndex.modal,children:l})=>{let[u,d]=(0,i.useState)(!1);return(0,i.useEffect)(()=>{let e;return o?d(!0):e=setTimeout(()=>d(!1),400),()=>{e!==void 0&&clearTimeout(e)}},[o]),r.useOverlayPreventScroll(o),u?(0,a.jsx)(`div`,{className:t.t(`fixed inset-0 box-border bg-black/60 transition-[visibility] duration-[400ms]`,o?`visible animate-overlay-fade-in`:`invisible animate-overlay-fade-out`,e),"data-slot":`overlay-root`,onClick:e=>{e.target===e.currentTarget&&s?.()},style:{zIndex:c},children:l}):null});exports.OverlayRoot=o;

package/dist/components/OverlayRoot/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/OverlayRoot/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAG3D,KAAK,gBAAgB,GAAG,iBAAiB,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC,CAAC;AAEH,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAsC3C,CAAC;AAEF,YAAY,EAAE,gBAAgB,EAAE,CAAC;AACjC,OAAO,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/OverlayRoot/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAInD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D,KAAK,gBAAgB,GAAG,iBAAiB,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC,CAAC;AAEH,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAsD3C,CAAC;AAEF,YAAY,EAAE,gBAAgB,EAAE,CAAC;AACjC,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/components/OverlayRoot/index.esm.js

@@ -1,24 +1,24 @@
-import { zIndex as e } from "../../constants/style.constants.esm.js";
-import { useOverlayPreventScroll as t } from "../../hooks/useOverlayPreventScroll.esm.js";
+import { t as e } from "../../chunks/utils.D6DjRYW1.js";
+import { zIndex as t } from "../../constants/style.constants.esm.js";
+import { useOverlayPreventScroll as n } from "../../hooks/useOverlayPreventScroll.esm.js";
 import "../../hooks/index.esm.js";
-import { Overlay as n } from "./index.styled.esm.js";
 import r, { useEffect as i, useState as a } from "react";
 import { jsx as o } from "react/jsx-runtime";
 //#region src/components/OverlayRoot/index.tsx
-var s = r.memo(({ className: r, visible: s, onClick: c, zIndex: l = e.modal, children: u }) => {
+var s = r.memo(({ className: r, visible: s, onClick: c, zIndex: l = t.modal, children: u }) => {
 	let [d, f] = a(!1);
 	return i(() => {
 		let e;
 		return s ? f(!0) : e = setTimeout(() => f(!1), 400), () => {
 			e !== void 0 && clearTimeout(e);
 		};
-	}, [s]), t(s), d ? /* @__PURE__ */ o(n, {
-		className: r,
+	}, [s]), n(s), d ? /* @__PURE__ */ o("div", {
+		className: e("fixed inset-0 box-border bg-black/60 transition-[visibility] duration-[400ms]", s ? "visible animate-overlay-fade-in" : "invisible animate-overlay-fade-out", r),
+		"data-slot": "overlay-root",
 		onClick: (e) => {
 			e.target === e.currentTarget && c?.();
 		},
-		visible: s,
-		zIndex: l,
+		style: { zIndex: l },
 		children: u
 	}) : null;
 });

package/dist/components/Pagination/index.cjs.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/dist.CrnGARhp.js"),t=require("../../icons/src/icons/Chevron_left.cjs.js"),n=require("../../icons/src/icons/Chevron_right.cjs.js"),r=require("../../icons/src/icons/Double_Chevron_left.cjs.js"),i=require("../../icons/src/icons/Double_Chevron_right.cjs.js");require("../../icons/src/aliases/index.cjs.js");const a=require("../../chunks/utils.C67s_c-g.js"),o=require("../../chunks/dist.ChAGEqMb.js"),s=require("./usePagination.cjs.js");let c=require("react/jsx-runtime");function l({className:e,...t}){return(0,c.jsx)(`nav`,{"aria-label":`페이지네이션`,className:a.t(`mx-auto flex w-full justify-center`,e),"data-slot":`pagination`,...t})}function u({className:e,...t}){return(0,c.jsx)(`ul`,{className:a.t(`flex flex-row items-center gap-1`,e),"data-slot":`pagination-content`,...t})}function d({className:e,...t}){return(0,c.jsx)(`li`,{className:a.t(`flex items-center`,e),"data-slot":`pagination-item`,...t})}var f=o.t(`typo-b1 inline-flex size-7.5 cursor-pointer items-center justify-center rounded-[5px] transition-colors focus-visible:outline-none disabled:pointer-events-none`,{variants:{isActive:{true:`bg-lime-50 font-medium text-lime-400`,false:`text-gray-600 hover:bg-gray-25 focus-visible:bg-gray-100 disabled:text-gray-100`}},defaultVariants:{isActive:!1}});function p({className:t,isActive:n,asChild:r=!1,onClick:i,...o}){let s=r?e.t:`button`;return(0,c.jsx)(s,{"aria-current":n?`page`:void 0,className:a.t(f({isActive:n,className:t})),"data-active":n,"data-slot":`pagination-button`,onClick:e=>{i?.(e),e.currentTarget.blur()},type:r?void 0:`button`,...o})}var m=`size-5`,h=`size-[0.9375rem]`;function g({className:e,...t}){return(0,c.jsx)(p,{"aria-label":`첫 페이지로 이동`,className:a.t(m,e),...t,children:(0,c.jsx)(r.default,{className:h})})}function _({className:e,...n}){return(0,c.jsx)(p,{"aria-label":`이전 페이지로 이동`,className:a.t(m,e),...n,children:(0,c.jsx)(t.default,{className:h})})}function v({className:e,...t}){return(0,c.jsx)(p,{"aria-label":`다음 페이지로 이동`,className:a.t(m,e),...t,children:(0,c.jsx)(n.default,{className:h})})}function y({className:e,...t}){return(0,c.jsx)(p,{"aria-label":`마지막 페이지로 이동`,className:a.t(m,e),...t,children:(0,c.jsx)(i.default,{className:h})})}function b({currentPage:e,totalPages:t,onPageChange:n,pageWindowSize:r,className:i}){let{pages:a,isFirstPage:o,isLastPage:f,hasPages:m}=s.usePagination({currentPage:e,totalPages:t,pageWindowSize:r});return m?(0,c.jsx)(l,{className:i,children:(0,c.jsxs)(u,{children:[(0,c.jsx)(d,{children:(0,c.jsx)(g,{disabled:o,onClick:()=>n(1)})}),(0,c.jsx)(d,{children:(0,c.jsx)(_,{disabled:o,onClick:()=>n(e-1)})}),a.map((t,r)=>(0,c.jsx)(d,{children:(0,c.jsx)(p,{isActive:t===e,onClick:()=>n(t),children:t})},r)),(0,c.jsx)(d,{children:(0,c.jsx)(v,{disabled:f,onClick:()=>n(e+1)})}),(0,c.jsx)(d,{children:(0,c.jsx)(y,{disabled:f,onClick:()=>n(t)})})]})}):null}exports.Pagination=b,exports.PaginationButton=p,exports.PaginationContent=u,exports.PaginationFirst=g,exports.PaginationItem=d,exports.PaginationLast=y,exports.PaginationNext=v,exports.PaginationPrevious=_,exports.PaginationRoot=l,exports.paginationButtonVariants=f,exports.usePagination=s.usePagination;

package/dist/components/Pagination/index.d.ts

@@ -0,0 +1,81 @@
+import type * as React from 'react';
+/**
+ * 페이지네이션 프리미티브 루트 (`<nav>`)
+ * 스크린리더가 페이지 탐색 영역임을 인지할 수 있도록 navigation landmark로 동작합니다.
+ *
+ * 일반적인 경우에는 편의 컴포넌트 `Pagination`을 사용하고,
+ * 비표준 레이아웃이나 링크 기반(`<a>`) 페이지네이션이 필요할 때 이 프리미티브를 직접 조합합니다.
+ */
+declare function PaginationRoot({ className, ...props }: React.ComponentProps<'nav'>): React.JSX.Element;
+/** 페이지 항목을 감싸는 리스트 컨테이너 (`<ul>`) */
+declare function PaginationContent({ className, ...props }: React.ComponentProps<'ul'>): React.JSX.Element;
+/** 개별 페이지 항목 (`<li>`) */
+declare function PaginationItem({ className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
+/**
+ * 페이지 번호 · 컨트롤러 버튼의 공통 스타일.
+ *
+ * 상태별 색상은 디자인 스펙을 따릅니다.
+ * - 기본/Hover/Focused: gray-600 텍스트, hover 시 gray-25, focus 시 gray-100 배경
+ * - 활성(현재 페이지): lime-50 배경 + lime-400 텍스트
+ * - 비활성(disabled, 컨트롤러 한정): gray-100 아이콘
+ */
+declare const paginationButtonVariants: (props?: ({
+    isActive?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type PaginationButtonProps = {
+    /** 현재 페이지 여부. `true`면 `aria-current="page"`와 활성 스타일을 적용합니다. */
+    isActive?: boolean;
+    /** `<a>`/라우터 Link 등 다른 엘리먼트로 렌더링할 때 사용합니다. */
+    asChild?: boolean;
+} & React.ComponentProps<'button'>;
+/**
+ * 페이지 번호 버튼 (Figma: 30x30px)
+ *
+ * - `asChild`로 `<a>`나 라우터 Link로 교체할 수 있습니다.
+ * - 클릭 후 포커스 잔상이 남지 않도록 blur 처리합니다.
+ */
+declare function PaginationButton({ className, isActive, asChild, onClick, ...props }: PaginationButtonProps): React.JSX.Element;
+type PaginationNavButtonProps = Omit<PaginationButtonProps, 'isActive' | 'children'>;
+/** 첫 페이지로 이동 (Figma: 20x20px) */
+declare function PaginationFirst({ className, ...props }: PaginationNavButtonProps): React.JSX.Element;
+/** 이전 페이지로 이동 (Figma: 20x20px) */
+declare function PaginationPrevious({ className, ...props }: PaginationNavButtonProps): React.JSX.Element;
+/** 다음 페이지로 이동 (Figma: 20x20px) */
+declare function PaginationNext({ className, ...props }: PaginationNavButtonProps): React.JSX.Element;
+/** 마지막 페이지로 이동 (Figma: 20x20px) */
+declare function PaginationLast({ className, ...props }: PaginationNavButtonProps): React.JSX.Element;
+type PaginationProps = {
+    /** 현재 페이지 (1-based) */
+    currentPage: number;
+    /** 전체 페이지 수 */
+    totalPages: number;
+    /** 페이지 변경 콜백 */
+    onPageChange: (page: number) => void;
+    /**
+     * 한 번에 노출할 최대 페이지 번호 개수
+     * @default 5
+     */
+    pageWindowSize?: number;
+    /** 루트 `<nav>`에 전달할 className */
+    className?: string;
+};
+/**
+ * 페이지네이션 (편의 컴포넌트 · 드롭인)
+ *
+ * `currentPage` · `totalPages` · `onPageChange`만 넘기면 컨트롤러와 페이지 번호를
+ * 디자인 스펙대로 렌더링합니다. 전체 페이지가 1개 이하면 아무것도 렌더링하지 않습니다.
+ *
+ * 비표준 레이아웃이나 링크 기반(`<a>`) 페이지네이션이 필요하면
+ * `PaginationRoot` 등 프리미티브를 직접 조합하세요.
+ *
+ * @example
+ * ```tsx
+ * const [page, setPage] = useState(1);
+ * <Pagination currentPage={page} totalPages={20} onPageChange={setPage} />
+ * ```
+ */
+declare function Pagination({ currentPage, totalPages, onPageChange, pageWindowSize, className }: PaginationProps): React.JSX.Element | null;
+export * from './usePagination';
+export type { PaginationButtonProps, PaginationNavButtonProps, PaginationProps };
+export { Pagination, PaginationButton, PaginationContent, PaginationFirst, PaginationItem, PaginationLast, PaginationNext, PaginationPrevious, PaginationRoot, paginationButtonVariants, };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Pagination/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAKpC;;;;;;GAMG;AACH,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAS3E;AAED,oCAAoC;AACpC,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAE7E;AAED,yBAAyB;AACzB,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAE1E;AAED;;;;;;;GAOG;AACH,QAAA,MAAM,wBAAwB;;8EAa7B,CAAC;AAEF,KAAK,qBAAqB,GAAG;IAC5B,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;CAClB,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;AAEnC;;;;;GAKG;AACH,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAe,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,qBAmB3G;AAKD,KAAK,wBAAwB,GAAG,IAAI,CAAC,qBAAqB,EAAE,UAAU,GAAG,UAAU,CAAC,CAAC;AAErF,iCAAiC;AACjC,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,wBAAwB,qBAMzE;AAED,kCAAkC;AAClC,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,wBAAwB,qBAM5E;AAED,kCAAkC;AAClC,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,wBAAwB,qBAMxE;AAED,mCAAmC;AACnC,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,wBAAwB,qBAMxE;AAED,KAAK,eAAe,GAAG;IACtB,uBAAuB;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB;IAChB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gCAAgC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,iBAAS,UAAU,CAAC,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,cAAc,EAAE,SAAS,EAAE,EAAE,eAAe,4BAyCxG;AAED,cAAc,iBAAiB,CAAC;AAChC,YAAY,EAAE,qBAAqB,EAAE,wBAAwB,EAAE,eAAe,EAAE,CAAC;AACjF,OAAO,EACN,UAAU,EACV,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,cAAc,EACd,cAAc,EACd,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,wBAAwB,GACxB,CAAC"}

package/dist/components/Pagination/index.esm.js

@@ -0,0 +1,124 @@
+import { t as e } from "../../chunks/dist.DxuGUd9a.js";
+import t from "../../icons/src/icons/Chevron_left.esm.js";
+import n from "../../icons/src/icons/Chevron_right.esm.js";
+import r from "../../icons/src/icons/Double_Chevron_left.esm.js";
+import i from "../../icons/src/icons/Double_Chevron_right.esm.js";
+import "../../icons/src/aliases/index.esm.js";
+import { t as a } from "../../chunks/utils.D6DjRYW1.js";
+import { t as o } from "../../chunks/dist.BQo0PXod.js";
+import { usePagination as s } from "./usePagination.esm.js";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/components/Pagination/index.tsx
+function u({ className: e, ...t }) {
+	return /* @__PURE__ */ c("nav", {
+		"aria-label": "페이지네이션",
+		className: a("mx-auto flex w-full justify-center", e),
+		"data-slot": "pagination",
+		...t
+	});
+}
+function d({ className: e, ...t }) {
+	return /* @__PURE__ */ c("ul", {
+		className: a("flex flex-row items-center gap-1", e),
+		"data-slot": "pagination-content",
+		...t
+	});
+}
+function f({ className: e, ...t }) {
+	return /* @__PURE__ */ c("li", {
+		className: a("flex items-center", e),
+		"data-slot": "pagination-item",
+		...t
+	});
+}
+var p = o("typo-b1 inline-flex size-7.5 cursor-pointer items-center justify-center rounded-[5px] transition-colors focus-visible:outline-none disabled:pointer-events-none", {
+	variants: { isActive: {
+		true: "bg-lime-50 font-medium text-lime-400",
+		false: "text-gray-600 hover:bg-gray-25 focus-visible:bg-gray-100 disabled:text-gray-100"
+	} },
+	defaultVariants: { isActive: !1 }
+});
+function m({ className: t, isActive: n, asChild: r = !1, onClick: i, ...o }) {
+	return /* @__PURE__ */ c(r ? e : "button", {
+		"aria-current": n ? "page" : void 0,
+		className: a(p({
+			isActive: n,
+			className: t
+		})),
+		"data-active": n,
+		"data-slot": "pagination-button",
+		onClick: (e) => {
+			i?.(e), e.currentTarget.blur();
+		},
+		type: r ? void 0 : "button",
+		...o
+	});
+}
+var h = "size-5", g = "size-[0.9375rem]";
+function _({ className: e, ...t }) {
+	return /* @__PURE__ */ c(m, {
+		"aria-label": "첫 페이지로 이동",
+		className: a(h, e),
+		...t,
+		children: /* @__PURE__ */ c(r, { className: g })
+	});
+}
+function v({ className: e, ...n }) {
+	return /* @__PURE__ */ c(m, {
+		"aria-label": "이전 페이지로 이동",
+		className: a(h, e),
+		...n,
+		children: /* @__PURE__ */ c(t, { className: g })
+	});
+}
+function y({ className: e, ...t }) {
+	return /* @__PURE__ */ c(m, {
+		"aria-label": "다음 페이지로 이동",
+		className: a(h, e),
+		...t,
+		children: /* @__PURE__ */ c(n, { className: g })
+	});
+}
+function b({ className: e, ...t }) {
+	return /* @__PURE__ */ c(m, {
+		"aria-label": "마지막 페이지로 이동",
+		className: a(h, e),
+		...t,
+		children: /* @__PURE__ */ c(i, { className: g })
+	});
+}
+function x({ currentPage: e, totalPages: t, onPageChange: n, pageWindowSize: r, className: i }) {
+	let { pages: a, isFirstPage: o, isLastPage: p, hasPages: h } = s({
+		currentPage: e,
+		totalPages: t,
+		pageWindowSize: r
+	});
+	return h ? /* @__PURE__ */ c(u, {
+		className: i,
+		children: /* @__PURE__ */ l(d, { children: [
+			/* @__PURE__ */ c(f, { children: /* @__PURE__ */ c(_, {
+				disabled: o,
+				onClick: () => n(1)
+			}) }),
+			/* @__PURE__ */ c(f, { children: /* @__PURE__ */ c(v, {
+				disabled: o,
+				onClick: () => n(e - 1)
+			}) }),
+			a.map((t, r) => /* @__PURE__ */ c(f, { children: /* @__PURE__ */ c(m, {
+				isActive: t === e,
+				onClick: () => n(t),
+				children: t
+			}) }, r)),
+			/* @__PURE__ */ c(f, { children: /* @__PURE__ */ c(y, {
+				disabled: p,
+				onClick: () => n(e + 1)
+			}) }),
+			/* @__PURE__ */ c(f, { children: /* @__PURE__ */ c(b, {
+				disabled: p,
+				onClick: () => n(t)
+			}) })
+		] })
+	}) : null;
+}
+//#endregion
+export { x as Pagination, m as PaginationButton, d as PaginationContent, _ as PaginationFirst, f as PaginationItem, b as PaginationLast, y as PaginationNext, v as PaginationPrevious, u as PaginationRoot, p as paginationButtonVariants, s as usePagination };

package/dist/components/Pagination/usePagination.cjs.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=5,t=1,n=({currentPage:n,totalPages:r,pageWindowSize:i=e})=>{let a=Math.floor(i/2);return{pages:(()=>{if(r<=i)return Array.from({length:r},(e,t)=>t+1);let e=n-a,o=n+a;return e<t&&(o+=t-e,e=t),o>r&&(e-=o-r,o=r),e=Math.max(t,e),Array.from({length:o-e+1},(t,n)=>e+n)})(),isFirstPage:n<=t,isLastPage:n>=r,hasPages:r>t}};exports.usePagination=n;

package/dist/components/Pagination/usePagination.d.ts

@@ -0,0 +1,35 @@
+interface UsePaginationOptions {
+    /** 현재 페이지 (1-based) */
+    readonly currentPage: number;
+    /**
+     * 한 번에 노출할 최대 페이지 번호 개수
+     * @default 5
+     */
+    readonly pageWindowSize?: number;
+    /** 전체 페이지 수 */
+    readonly totalPages: number;
+}
+interface UsePaginationResult {
+    /** 페이지네이션을 노출할 필요가 있는지 여부 (총 페이지가 2개 이상) */
+    readonly hasPages: boolean;
+    /** 현재 페이지가 첫 페이지인지 여부 */
+    readonly isFirstPage: boolean;
+    /** 현재 페이지가 마지막 페이지인지 여부 */
+    readonly isLastPage: boolean;
+    /** 현재 윈도우에 노출할 페이지 번호 목록 (1-based) */
+    readonly pages: number[];
+}
+/**
+ * 현재 페이지를 중심으로 노출할 페이지 번호 윈도우를 계산합니다.
+ *
+ * - 전체 페이지가 `pageWindowSize` 이하면 모든 페이지를 노출합니다.
+ * - 그 외에는 현재 페이지를 가운데 두고 양옆으로 균등하게 노출하며,
+ *   경계(첫/마지막 페이지)에 가까울 때 윈도우를 보정합니다.
+ *
+ * 렌더링은 사용처에서 프리미티브(`Pagination`, `PaginationButton` 등)를
+ * 자유롭게 조합하도록 분리되어 있습니다.
+ */
+declare const usePagination: ({ currentPage, totalPages, pageWindowSize, }: UsePaginationOptions) => UsePaginationResult;
+export type { UsePaginationOptions, UsePaginationResult };
+export { usePagination };
+//# sourceMappingURL=usePagination.d.ts.map

package/dist/components/Pagination/usePagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/usePagination.ts"],"names":[],"mappings":"AAGA,UAAU,oBAAoB;IAC7B,uBAAuB;IACvB,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,MAAM,CAAC;IACjC,eAAe;IACf,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;CAC5B;AAED,UAAU,mBAAmB;IAC5B,4CAA4C;IAC5C,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,yBAAyB;IACzB,QAAQ,CAAC,WAAW,EAAE,OAAO,CAAC;IAC9B,2BAA2B;IAC3B,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;IAC7B,sCAAsC;IACtC,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC;CACzB;AAED;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,GAAI,8CAIpB,oBAAoB,KAAG,mBAoCzB,CAAC;AAEF,YAAY,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/Pagination/usePagination.esm.js

@@ -0,0 +1,16 @@
+//#region src/components/Pagination/usePagination.ts
+var e = 5, t = 1, n = ({ currentPage: n, totalPages: r, pageWindowSize: i = e }) => {
+	let a = Math.floor(i / 2);
+	return {
+		pages: (() => {
+			if (r <= i) return Array.from({ length: r }, (e, t) => t + 1);
+			let e = n - a, o = n + a;
+			return e < t && (o += t - e, e = t), o > r && (e -= o - r, o = r), e = Math.max(t, e), Array.from({ length: o - e + 1 }, (t, n) => e + n);
+		})(),
+		isFirstPage: n <= t,
+		isLastPage: n >= r,
+		hasPages: r > t
+	};
+};
+//#endregion
+export { n as usePagination };

package/dist/components/Segment/BaseSegment/index.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../../chunks/chunk.BwUGlERp.js`),t=require(`./index.styled.cjs.js`);let n=require(`react`);n=e.n(n);let r=require(`react/jsx-runtime`);var i=({item:e,value:i,onChange:a})=>{let o=100/e.length;return(0,r.jsx)(t.Wrapper,{children:(0,r.jsxs)(t.LabelWrapper,{width:o,children:[e.map((e,o)=>(0,r.jsx)(n.default.Fragment,{children:(0,r.jsxs)(t.Label,{active:i===e,className:t.className.segmentLabel,children:[(0,r.jsx)(t.Input,{checked:i===e,name:`radio`,onChange:e=>a(e.target.value),type:`radio`,value:e}),e]})},o)),(0,r.jsx)(t.Control,{className:t.className.segmentControl,control:(()=>{let t=e.indexOf(i)*100;return t<0?0:t/e.length})(),width:o})]})})};exports.Segment=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/utils.C67s_c-g.js"),t=require("../segment.styles.cjs.js");let n=require("react"),r=require("react/jsx-runtime");var i=({item:i,value:a,onChange:o})=>{let s=(0,n.useId)(),c=100/i.length;return(0,r.jsx)(`div`,{className:t.segmentWrapper,"data-slot":`segment`,children:(0,r.jsxs)(`div`,{className:t.segmentLabelWrapper,children:[i.map(n=>(0,r.jsxs)(`label`,{className:e.t(t.segmentLabelBase,`inline-block`,a===n?`text-gray-900`:`text-gray-400`),"data-slot":`segment-label`,style:{width:`${c}%`},children:[(0,r.jsx)(`input`,{checked:a===n,className:`hidden`,name:s,onChange:e=>o(e.target.value),type:`radio`,value:n}),n]},n)),(0,r.jsx)(`div`,{className:t.segmentPill,"data-slot":`segment-control`,style:{width:`${c}%`,left:`${(()=>{let e=i.indexOf(a)*100;return e<0?0:e/i.length})()}%`}})]})})};exports.Segment=i;

package/dist/components/Segment/BaseSegment/index.d.ts

@@ -3,7 +3,7 @@ interface SegmentProps<T> {
     onChange: (value: T) => void;
     value: T;
 }
-declare const Segment: <T extends string>({ item, value, onChange }: SegmentProps<T>) => import("react/jsx-runtime").JSX.Element;
+declare const Segment: <T extends string>({ item, value, onChange }: SegmentProps<T>) => import("react").JSX.Element;
 export type { SegmentProps };
 export { Segment };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Segment/BaseSegment/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Segment/BaseSegment/index.tsx"],"names":[],"mappings":"AAGA,UAAU,YAAY,CAAC,CAAC;IACvB,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,KAAK,EAAE,CAAC,CAAC;CACT;AAED,QAAA,MAAM,OAAO,GAAI,CAAC,SAAS,MAAM,EAAE,2BAA2B,YAAY,CAAC,CAAC,CAAC,4CA+B5E,CAAC;AAEF,YAAY,EAAE,YAAY,EAAE,CAAC;AAC7B,OAAO,EAAE,OAAO,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Segment/BaseSegment/index.tsx"],"names":[],"mappings":"AAIA,UAAU,YAAY,CAAC,CAAC;IACvB,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,KAAK,EAAE,CAAC,CAAC;CACT;AAED,QAAA,MAAM,OAAO,GAAI,CAAC,SAAS,MAAM,EAAE,2BAA2B,YAAY,CAAC,CAAC,CAAC,gCA0C5E,CAAC;AAEF,YAAY,EAAE,YAAY,EAAE,CAAC;AAC7B,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/components/Segment/BaseSegment/index.esm.js

@@ -1,30 +1,40 @@
-import { Control as e, Input as t, Label as n, LabelWrapper as r, Wrapper as i, className as a } from "./index.styled.esm.js";
-import o from "react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { t as e } from "../../../chunks/utils.D6DjRYW1.js";
+import { segmentLabelBase as t, segmentLabelWrapper as n, segmentPill as r, segmentWrapper as i } from "../segment.styles.esm.js";
+import { useId as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/components/Segment/BaseSegment/index.tsx
-var l = ({ item: l, value: u, onChange: d }) => {
-	let f = 100 / l.length;
-	return /* @__PURE__ */ s(i, { children: /* @__PURE__ */ c(r, {
-		width: f,
-		children: [l.map((e, r) => /* @__PURE__ */ s(o.Fragment, { children: /* @__PURE__ */ c(n, {
-			active: u === e,
-			className: a.segmentLabel,
-			children: [/* @__PURE__ */ s(t, {
-				checked: u === e,
-				name: "radio",
-				onChange: (e) => d(e.target.value),
-				type: "radio",
-				value: e
-			}), e]
-		}) }, r)), /* @__PURE__ */ s(e, {
-			className: a.segmentControl,
-			control: (() => {
-				let e = l.indexOf(u) * 100;
-				return e < 0 ? 0 : e / l.length;
-			})(),
-			width: f
-		})]
-	}) });
+var c = ({ item: c, value: l, onChange: u }) => {
+	let d = a(), f = 100 / c.length;
+	return /* @__PURE__ */ o("div", {
+		className: i,
+		"data-slot": "segment",
+		children: /* @__PURE__ */ s("div", {
+			className: n,
+			children: [c.map((n) => /* @__PURE__ */ s("label", {
+				className: e(t, "inline-block", l === n ? "text-gray-900" : "text-gray-400"),
+				"data-slot": "segment-label",
+				style: { width: `${f}%` },
+				children: [/* @__PURE__ */ o("input", {
+					checked: l === n,
+					className: "hidden",
+					name: d,
+					onChange: (e) => u(e.target.value),
+					type: "radio",
+					value: n
+				}), n]
+			}, n)), /* @__PURE__ */ o("div", {
+				className: r,
+				"data-slot": "segment-control",
+				style: {
+					width: `${f}%`,
+					left: `${(() => {
+						let e = c.indexOf(l) * 100;
+						return e < 0 ? 0 : e / c.length;
+					})()}%`
+				}
+			})]
+		})
+	});
 };
 //#endregion
-export { l as Segment };
+export { c as Segment };

package/dist/components/Segment/ExtendSegment/index.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../../chunks/chunk.BwUGlERp.js`),t=require(`./index.styled.cjs.js`);let n=require(`react`);n=e.n(n);let r=require(`react/jsx-runtime`);var i=({item:e,value:i=``,onChange:a})=>{let o=100/e.length;return(0,r.jsx)(t.Wrapper,{children:(0,r.jsxs)(t.LabelWrapper,{width:o,children:[e.map((e,o)=>{let s=i===e.value,c=(()=>{let e=[s?`active`:`disabled`];return e.push(t.className.extendSegmentLabel),e.join(` `)})();return(0,r.jsx)(n.default.Fragment,{children:(0,r.jsx)(t.Label,{active:s,className:c,onClick:()=>{a(e.value)},children:e.children})},o)}),(0,r.jsx)(t.Control,{control:(()=>{let t=e.findIndex(e=>e.value===i)*100;return t<0?0:t/e.length})(),width:o})]})})};exports.ExtendSegment=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/utils.C67s_c-g.js"),t=require("../segment.styles.cjs.js");let n=require("react/jsx-runtime");var r=({item:r,value:i=``,onChange:a})=>{let o=100/r.length;return(0,n.jsx)(`div`,{className:t.segmentWrapper,"data-slot":`segment`,children:(0,n.jsxs)(`div`,{className:t.segmentLabelWrapper,children:[r.map(r=>(0,n.jsx)(`label`,{className:e.t(t.segmentLabelBase,`inline-flex flex-row justify-center`,i===r.value?`text-gray-900`:`[&>*]:!text-gray-400 text-gray-400`),"data-slot":`segment-label`,onClick:()=>a(r.value),style:{width:`${o}%`},children:r.children},r.value)),(0,n.jsx)(`div`,{className:t.segmentPill,"data-slot":`segment-control`,style:{width:`${o}%`,left:`${(()=>{let e=r.findIndex(e=>e.value===i)*100;return e<0?0:e/r.length})()}%`}})]})})};exports.ExtendSegment=r;

package/dist/components/Segment/ExtendSegment/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Segment/ExtendSegment/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,UAAU,kBAAkB;IAC3B,IAAI,EAAE;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACrD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;CACd;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAuC/C,CAAC;AAEF,YAAY,EAAE,kBAAkB,EAAE,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Segment/ExtendSegment/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,UAAU,kBAAkB;IAC3B,IAAI,EAAE;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACrD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;CACd;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA0C/C,CAAC;AAEF,YAAY,EAAE,kBAAkB,EAAE,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,CAAC"}