lumir-design-system-shared
Version:
Lumir Design System - Shared Components & Tokens
315 lines (301 loc) • 1.54 MB
JavaScript
import { jsx, jsxs } from 'react/jsx-runtime';
import React, { forwardRef, useState, useRef, useEffect } from 'react';
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z$7 = ".Text-module_text__KqVlw {\r\n margin: 0;\r\n padding: 0;\r\n font-family: 'Pretendard', sans-serif;\r\n }\r\n \r\n /* 기본 타이포그래피 스타일 */\r\n \r\n /* Hero 타이포그래피 */\r\n.Text-module_text--hero-1-regular__nM871 {\r\n font-size: 48px;\r\n line-height: 1.6;\r\n letter-spacing: -0.025em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--hero-1-medium__7Y-I8 {\r\n font-size: 48px;\r\n line-height: 1.6;\r\n letter-spacing: -0.025em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--hero-1-bold__ODwhN {\r\n font-size: 48px;\r\n line-height: 1.6;\r\n letter-spacing: -0.025em;\r\n font-weight: 700;\r\n}\r\n\r\n.Text-module_text--hero-2-regular__jYDb- {\r\n font-size: 36px;\r\n line-height: 1.6;\r\n letter-spacing: -0.025em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--hero-2-medium__sOUZM {\r\n font-size: 36px;\r\n line-height: 1.6;\r\n letter-spacing: -0.025em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--hero-2-bold__NBgi7 {\r\n font-size: 36px;\r\n line-height: 1.6;\r\n letter-spacing: -0.025em;\r\n font-weight: 700;\r\n}\r\n \r\n /* Title 타이포그래피 */\r\n.Text-module_text--title-1-regular__hd5sC {\r\n font-size: 30px;\r\n line-height: 1.4;\r\n letter-spacing: -0.025em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--title-1-medium__QJtFx {\r\n font-size: 30px;\r\n line-height: 1.4;\r\n letter-spacing: -0.025em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--title-1-bold__IPIfM {\r\n font-size: 30px;\r\n line-height: 1.4;\r\n letter-spacing: -0.025em;\r\n font-weight: 700;\r\n}\r\n\r\n.Text-module_text--title-2-regular__9TXVV {\r\n font-size: 24px;\r\n line-height: 1.4;\r\n letter-spacing: -0.025em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--title-2-medium__P0yir {\r\n font-size: 24px;\r\n line-height: 1.4;\r\n letter-spacing: -0.025em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--title-2-bold__svFOV {\r\n font-size: 24px;\r\n line-height: 1.4;\r\n letter-spacing: -0.025em;\r\n font-weight: 700;\r\n}\r\n \r\n /* Heading 타이포그래피 */\r\n.Text-module_text--heading-1-regular__1NvAH {\r\n font-size: 20px;\r\n line-height: 1.4;\r\n letter-spacing: -0.05em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--heading-1-medium__a7qia {\r\n font-size: 20px;\r\n line-height: 1.4;\r\n letter-spacing: -0.05em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--heading-1-bold__xxmBq {\r\n font-size: 20px;\r\n line-height: 1.4;\r\n letter-spacing: -0.05em;\r\n font-weight: 600;\r\n}\r\n\r\n.Text-module_text--heading-2-regular__qX26a {\r\n font-size: 20px;\r\n line-height: 1.4;\r\n letter-spacing: -0.05em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--heading-2-medium__pamk8 {\r\n font-size: 20px;\r\n line-height: 1.4;\r\n letter-spacing: -0.05em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--heading-2-bold__jU8eT {\r\n font-size: 20px;\r\n line-height: 1.4;\r\n letter-spacing: -0.05em;\r\n font-weight: 600;\r\n}\r\n\r\n.Text-module_text--heading-3-regular__QV-Pp {\r\n font-size: 16px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--heading-3-medium__xDOeT {\r\n font-size: 16px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--heading-3-bold__7ubpH {\r\n font-size: 16px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 600;\r\n}\r\n \r\n /* Body 타이포그래피 */\r\n.Text-module_text--body-1-regular__qK-a3 {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0.025em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--body-1-medium__cFvcV {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0.025em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--body-1-bold__nE475 {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0.025em;\r\n font-weight: 700;\r\n}\r\n\r\n.Text-module_text--body-2-regular__Nsqoz {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0.025em;\r\n font-weight: 400;\r\n}\r\n\r\n.Text-module_text--body-2-medium__1oYuY {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0.025em;\r\n font-weight: 500;\r\n}\r\n\r\n.Text-module_text--body-2-bold__RizCM {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0.025em;\r\n font-weight: 700;\r\n}\r\n \r\n /* Reading 타이포그래피 */\r\n .Text-module_text--reading-regular__ajqnd {\r\n font-size: 16px;\r\n line-height: 1.8;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n \r\n .Text-module_text--reading-medium__RFLlS {\r\n font-size: 16px;\r\n line-height: 1.8;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n \r\n .Text-module_text--reading-bold__roi6i {\r\n font-size: 16px;\r\n line-height: 1.8;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n /* Label 타이포그래피 */\r\n .Text-module_text--label-1-regular__QRyHK {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n \r\n .Text-module_text--label-1-medium__bAzIL {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n \r\n .Text-module_text--label-1-bold__8RCeA {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n .Text-module_text--label-2-regular__l7PPh {\r\n font-size: 12px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n \r\n .Text-module_text--label-2-medium__YvRhD {\r\n font-size: 12px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n \r\n .Text-module_text--label-2-bold__dh8mm {\r\n font-size: 12px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n /* Caption 타이포그래피 */\r\n .Text-module_text--caption-1-regular__FqRHO {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n \r\n .Text-module_text--caption-1-medium__7-pgF {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n \r\n .Text-module_text--caption-1-bold__fbRPm {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n .Text-module_text--caption-2-regular__WPdXz {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n \r\n .Text-module_text--caption-2-medium__Z7xdp {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n \r\n .Text-module_text--caption-2-bold__gmqRl {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n .Text-module_text--caption-3-regular__jFQ5l {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n \r\n .Text-module_text--caption-3-medium__kw2M1 {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n \r\n .Text-module_text--caption-3-bold__uJXEr {\r\n font-size: 12px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n /* 정렬 */\r\n .Text-module_text--align-left__raNv9 {\r\n text-align: left;\r\n }\r\n \r\n .Text-module_text--align-center__j97B5 {\r\n text-align: center;\r\n }\r\n \r\n .Text-module_text--align-right__AVfkJ {\r\n text-align: right;\r\n }\r\n \r\n .Text-module_text--align-justify__1k9uS {\r\n text-align: justify;\r\n }\r\n \r\n /* 텍스트 변형 */\r\n .Text-module_text--transform-none__GRgMz {\r\n text-transform: none;\r\n }\r\n \r\n .Text-module_text--transform-capitalize__2FwIY {\r\n text-transform: capitalize;\r\n }\r\n \r\n .Text-module_text--transform-uppercase__x024t {\r\n text-transform: uppercase;\r\n }\r\n \r\n .Text-module_text--transform-lowercase__BuEZq {\r\n text-transform: lowercase;\r\n }\r\n \r\n /* 노랩 및 truncate */\r\n .Text-module_text--nowrap__LIrZb {\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n }\r\n \r\n .Text-module_text--truncate__-Dxj1 {\r\n overflow: hidden;\r\n display: -webkit-box;\r\n -webkit-box-orient: vertical;\r\n -webkit-line-clamp: var(--webkit-line-clamp);\r\n line-clamp: var(--webkit-line-clamp);\r\n }\r\n \r\n /* ================================================\r\n 반응형 미디어 쿼리 스타일 \r\n ================================================ */\r\n \r\n /* Mobile 브레이크포인트 (max-width: 479px) */\r\n @media (max-width: 479px) {\r\n /* Typography Variants */\r\n .Text-module_text--hero-1-regular--mobile__3G2Cu {\r\n font-size: 72px;\r\n line-height: 1.2;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--hero-1-medium--mobile__NtW8K {\r\n font-size: 72px;\r\n line-height: 1.2;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n .Text-module_text--hero-1-bold--mobile__EXvL5 {\r\n font-size: 72px;\r\n line-height: 1.2;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n .Text-module_text--title-1-regular--mobile__qtMVg {\r\n font-size: 48px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--title-1-medium--mobile__-RKFq {\r\n font-size: 48px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n .Text-module_text--title-1-bold--mobile__x8IU9 {\r\n font-size: 48px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n .Text-module_text--heading-1-regular--mobile__I9YBI {\r\n font-size: 30px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--heading-1-medium--mobile__CjIMZ {\r\n font-size: 30px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n .Text-module_text--heading-1-bold--mobile__x9Hrd {\r\n font-size: 30px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n .Text-module_text--body-1-regular--mobile__LM7vm {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--body-1-medium--mobile__djdvY {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n .Text-module_text--body-1-bold--mobile__vlx5L {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n .Text-module_text--body-2-regular--mobile__KSW35 {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--body-2-medium--mobile__y-aWp {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 500;\r\n }\r\n .Text-module_text--body-2-bold--mobile__QiMuZ {\r\n font-size: 14px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 700;\r\n }\r\n \r\n /* 정렬 클래스들 */\r\n .Text-module_text--align-left--mobile__lN7E6 { text-align: left; }\r\n .Text-module_text--align-center--mobile__sQoPL { text-align: center; }\r\n .Text-module_text--align-right--mobile__PLCmY { text-align: right; }\r\n .Text-module_text--align-justify--mobile__L6oOq { text-align: justify; }\r\n }\r\n \r\n /* Tablet 브레이크포인트 (480px ~ 639px) */\r\n @media (min-width: 480px) and (max-width: 639px) {\r\n .Text-module_text--hero-1-regular--tablet__qo4iK {\r\n font-size: 72px;\r\n line-height: 1.2;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--title-1-regular--tablet__CfgkG {\r\n font-size: 48px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--body-1-regular--tablet__6boMZ {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--align-left--tablet__cRW60 { text-align: left; }\r\n .Text-module_text--align-center--tablet__lYcpM { text-align: center; }\r\n .Text-module_text--align-right--tablet__f1JPI { text-align: right; }\r\n }\r\n \r\n /* Desktop 브레이크포인트 (640px ~ 1023px) */\r\n @media (min-width: 640px) and (max-width: 1023px) {\r\n .Text-module_text--hero-1-regular--desktop__u9uTS {\r\n font-size: 72px;\r\n line-height: 1.2;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--title-1-regular--desktop__NXdPX {\r\n font-size: 48px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--body-1-regular--desktop__ERWLo {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--align-left--desktop__3PB7k { text-align: left; }\r\n .Text-module_text--align-center--desktop__ZKR0G { text-align: center; }\r\n .Text-module_text--align-right--desktop__qA9Py { text-align: right; }\r\n }\r\n \r\n /* Desktop Large 브레이크포인트 (1024px ~ 1365px) */\r\n @media (min-width: 1024px) and (max-width: 1365px) {\r\n .Text-module_text--hero-1-regular--desktopLg__Iw22i {\r\n font-size: 72px;\r\n line-height: 1.2;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--title-1-regular--desktopLg__rWlGm {\r\n font-size: 48px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--body-1-regular--desktopLg__ErHQp {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--align-left--desktopLg__rTBnx { text-align: left; }\r\n .Text-module_text--align-center--desktopLg__pbJlh { text-align: center; }\r\n .Text-module_text--align-right--desktopLg__V99a1 { text-align: right; }\r\n }\r\n \r\n /* Desktop XL 브레이크포인트 (1366px+) */\r\n @media (min-width: 1366px) {\r\n .Text-module_text--hero-1-regular--desktopXl__fDwSH {\r\n font-size: 72px;\r\n line-height: 1.2;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--title-1-regular--desktopXl__qi6Qe {\r\n font-size: 48px;\r\n line-height: 1.4;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--body-1-regular--desktopXl__be9iZ {\r\n font-size: 16px;\r\n line-height: 1.6;\r\n letter-spacing: 0em;\r\n font-weight: 400;\r\n }\r\n .Text-module_text--align-left--desktopXl__G0lij { text-align: left; }\r\n .Text-module_text--align-center--desktopXl__lCWIb { text-align: center; }\r\n .Text-module_text--align-right--desktopXl__2uWAZ { text-align: right; }\r\n } ";
var styles$7 = {"text":"Text-module_text__KqVlw","text--hero-1-regular":"Text-module_text--hero-1-regular__nM871","text--hero-1-medium":"Text-module_text--hero-1-medium__7Y-I8","text--hero-1-bold":"Text-module_text--hero-1-bold__ODwhN","text--hero-2-regular":"Text-module_text--hero-2-regular__jYDb-","text--hero-2-medium":"Text-module_text--hero-2-medium__sOUZM","text--hero-2-bold":"Text-module_text--hero-2-bold__NBgi7","text--title-1-regular":"Text-module_text--title-1-regular__hd5sC","text--title-1-medium":"Text-module_text--title-1-medium__QJtFx","text--title-1-bold":"Text-module_text--title-1-bold__IPIfM","text--title-2-regular":"Text-module_text--title-2-regular__9TXVV","text--title-2-medium":"Text-module_text--title-2-medium__P0yir","text--title-2-bold":"Text-module_text--title-2-bold__svFOV","text--heading-1-regular":"Text-module_text--heading-1-regular__1NvAH","text--heading-1-medium":"Text-module_text--heading-1-medium__a7qia","text--heading-1-bold":"Text-module_text--heading-1-bold__xxmBq","text--heading-2-regular":"Text-module_text--heading-2-regular__qX26a","text--heading-2-medium":"Text-module_text--heading-2-medium__pamk8","text--heading-2-bold":"Text-module_text--heading-2-bold__jU8eT","text--heading-3-regular":"Text-module_text--heading-3-regular__QV-Pp","text--heading-3-medium":"Text-module_text--heading-3-medium__xDOeT","text--heading-3-bold":"Text-module_text--heading-3-bold__7ubpH","text--body-1-regular":"Text-module_text--body-1-regular__qK-a3","text--body-1-medium":"Text-module_text--body-1-medium__cFvcV","text--body-1-bold":"Text-module_text--body-1-bold__nE475","text--body-2-regular":"Text-module_text--body-2-regular__Nsqoz","text--body-2-medium":"Text-module_text--body-2-medium__1oYuY","text--body-2-bold":"Text-module_text--body-2-bold__RizCM","text--reading-regular":"Text-module_text--reading-regular__ajqnd","text--reading-medium":"Text-module_text--reading-medium__RFLlS","text--reading-bold":"Text-module_text--reading-bold__roi6i","text--label-1-regular":"Text-module_text--label-1-regular__QRyHK","text--label-1-medium":"Text-module_text--label-1-medium__bAzIL","text--label-1-bold":"Text-module_text--label-1-bold__8RCeA","text--label-2-regular":"Text-module_text--label-2-regular__l7PPh","text--label-2-medium":"Text-module_text--label-2-medium__YvRhD","text--label-2-bold":"Text-module_text--label-2-bold__dh8mm","text--caption-1-regular":"Text-module_text--caption-1-regular__FqRHO","text--caption-1-medium":"Text-module_text--caption-1-medium__7-pgF","text--caption-1-bold":"Text-module_text--caption-1-bold__fbRPm","text--caption-2-regular":"Text-module_text--caption-2-regular__WPdXz","text--caption-2-medium":"Text-module_text--caption-2-medium__Z7xdp","text--caption-2-bold":"Text-module_text--caption-2-bold__gmqRl","text--caption-3-regular":"Text-module_text--caption-3-regular__jFQ5l","text--caption-3-medium":"Text-module_text--caption-3-medium__kw2M1","text--caption-3-bold":"Text-module_text--caption-3-bold__uJXEr","text--align-left":"Text-module_text--align-left__raNv9","text--align-center":"Text-module_text--align-center__j97B5","text--align-right":"Text-module_text--align-right__AVfkJ","text--align-justify":"Text-module_text--align-justify__1k9uS","text--transform-none":"Text-module_text--transform-none__GRgMz","text--transform-capitalize":"Text-module_text--transform-capitalize__2FwIY","text--transform-uppercase":"Text-module_text--transform-uppercase__x024t","text--transform-lowercase":"Text-module_text--transform-lowercase__BuEZq","text--nowrap":"Text-module_text--nowrap__LIrZb","text--truncate":"Text-module_text--truncate__-Dxj1","text--hero-1-regular--mobile":"Text-module_text--hero-1-regular--mobile__3G2Cu","text--hero-1-medium--mobile":"Text-module_text--hero-1-medium--mobile__NtW8K","text--hero-1-bold--mobile":"Text-module_text--hero-1-bold--mobile__EXvL5","text--title-1-regular--mobile":"Text-module_text--title-1-regular--mobile__qtMVg","text--title-1-medium--mobile":"Text-module_text--title-1-medium--mobile__-RKFq","text--title-1-bold--mobile":"Text-module_text--title-1-bold--mobile__x8IU9","text--heading-1-regular--mobile":"Text-module_text--heading-1-regular--mobile__I9YBI","text--heading-1-medium--mobile":"Text-module_text--heading-1-medium--mobile__CjIMZ","text--heading-1-bold--mobile":"Text-module_text--heading-1-bold--mobile__x9Hrd","text--body-1-regular--mobile":"Text-module_text--body-1-regular--mobile__LM7vm","text--body-1-medium--mobile":"Text-module_text--body-1-medium--mobile__djdvY","text--body-1-bold--mobile":"Text-module_text--body-1-bold--mobile__vlx5L","text--body-2-regular--mobile":"Text-module_text--body-2-regular--mobile__KSW35","text--body-2-medium--mobile":"Text-module_text--body-2-medium--mobile__y-aWp","text--body-2-bold--mobile":"Text-module_text--body-2-bold--mobile__QiMuZ","text--align-left--mobile":"Text-module_text--align-left--mobile__lN7E6","text--align-center--mobile":"Text-module_text--align-center--mobile__sQoPL","text--align-right--mobile":"Text-module_text--align-right--mobile__PLCmY","text--align-justify--mobile":"Text-module_text--align-justify--mobile__L6oOq","text--hero-1-regular--tablet":"Text-module_text--hero-1-regular--tablet__qo4iK","text--title-1-regular--tablet":"Text-module_text--title-1-regular--tablet__CfgkG","text--body-1-regular--tablet":"Text-module_text--body-1-regular--tablet__6boMZ","text--align-left--tablet":"Text-module_text--align-left--tablet__cRW60","text--align-center--tablet":"Text-module_text--align-center--tablet__lYcpM","text--align-right--tablet":"Text-module_text--align-right--tablet__f1JPI","text--hero-1-regular--desktop":"Text-module_text--hero-1-regular--desktop__u9uTS","text--title-1-regular--desktop":"Text-module_text--title-1-regular--desktop__NXdPX","text--body-1-regular--desktop":"Text-module_text--body-1-regular--desktop__ERWLo","text--align-left--desktop":"Text-module_text--align-left--desktop__3PB7k","text--align-center--desktop":"Text-module_text--align-center--desktop__ZKR0G","text--align-right--desktop":"Text-module_text--align-right--desktop__qA9Py","text--hero-1-regular--desktopLg":"Text-module_text--hero-1-regular--desktopLg__Iw22i","text--title-1-regular--desktopLg":"Text-module_text--title-1-regular--desktopLg__rWlGm","text--body-1-regular--desktopLg":"Text-module_text--body-1-regular--desktopLg__ErHQp","text--align-left--desktopLg":"Text-module_text--align-left--desktopLg__rTBnx","text--align-center--desktopLg":"Text-module_text--align-center--desktopLg__pbJlh","text--align-right--desktopLg":"Text-module_text--align-right--desktopLg__V99a1","text--hero-1-regular--desktopXl":"Text-module_text--hero-1-regular--desktopXl__fDwSH","text--title-1-regular--desktopXl":"Text-module_text--title-1-regular--desktopXl__qi6Qe","text--body-1-regular--desktopXl":"Text-module_text--body-1-regular--desktopXl__be9iZ","text--align-left--desktopXl":"Text-module_text--align-left--desktopXl__G0lij","text--align-center--desktopXl":"Text-module_text--align-center--desktopXl__lCWIb","text--align-right--desktopXl":"Text-module_text--align-right--desktopXl__2uWAZ"};
styleInject(css_248z$7);
/**
* 반응형 클래스 생성을 위한 유틸리티 함수
*
* @param value 반응형 값 또는 단일 값
* @param prefix CSS 클래스 접두사
* @param styles CSS 모듈 스타일 객체
* @returns 생성된 CSS 클래스명 배열
*/
const generateResponsiveClasses = (value, prefix, styles) => {
if (!value)
return [];
// 단일 값인 경우
if (typeof value === 'string' || typeof value === 'number') {
return [styles[`${prefix}-${value}`]].filter(Boolean);
}
// 반응형 값인 경우
const classes = [];
const responsiveValue = value;
if (responsiveValue.mobile) {
classes.push(styles[`${prefix}-${responsiveValue.mobile}--mobile`]);
}
if (responsiveValue.tablet) {
classes.push(styles[`${prefix}-${responsiveValue.tablet}--tablet`]);
}
if (responsiveValue.desktop) {
classes.push(styles[`${prefix}-${responsiveValue.desktop}--desktop`]);
}
if (responsiveValue.desktopL) {
classes.push(styles[`${prefix}-${responsiveValue.desktopL}--desktopL`]);
}
if (responsiveValue.desktopXL) {
classes.push(styles[`${prefix}-${responsiveValue.desktopXL}--desktopXL`]);
}
return classes.filter(Boolean);
};
/**
* variant + weight 조합 클래스를 생성하는 함수
*/
const generateVariantClasses = (variant, weight, styles) => {
const defaultVariant = 'body-1';
const defaultWeight = 'regular';
// 둘 다 단일 값이거나 undefined인 경우
if ((!variant || typeof variant === 'string') && (!weight || typeof weight === 'string')) {
const finalVariant = variant || defaultVariant;
const finalWeight = weight || defaultWeight;
const className = `text--${finalVariant}-${finalWeight}`;
return styles[className] ? [styles[className]] : [];
}
// 반응형인 경우 각 브레이크포인트별로 클래스 생성
const classes = [];
const breakpoints = ['mobile', 'tablet', 'desktop', 'desktopL', 'desktopXL'];
breakpoints.forEach(breakpoint => {
const variantValue = typeof variant === 'object' && variant ? variant[breakpoint] : variant;
const weightValue = typeof weight === 'object' && weight ? weight[breakpoint] : weight;
if (variantValue || weightValue) {
const finalVariant = variantValue || defaultVariant;
const finalWeight = weightValue || defaultWeight;
const className = `text--${finalVariant}-${finalWeight}--${breakpoint}`;
if (styles[className]) {
classes.push(styles[className]);
}
}
});
return classes;
};
/**
* Text 컴포넌트는 순수한 타이포그래피 프리미티브입니다.
* Fluent Design System의 타이포그래피 계층 구조를 따르며, 시멘틱 토큰을 사용하여 일관된 스타일을 제공합니다.
* 색상은 Surface 프리미티브와 조합하여 사용하세요.
*
* @example
* ```tsx
* <Text variant="title-1" weight="bold">
* 제목 텍스트
* </Text>
*
* // Surface와 조합하여 색상 적용
* <Surface foreground="primary-foreground-1-rest">
* <Text variant="body-1">색상이 적용된 텍스트</Text>
* </Surface>
*
* // 반응형 사용 예시
* <Text
* variant={{ mobile: 'body-1', desktop: 'title-1' }}
* weight={{ mobile: 'regular', desktop: 'bold' }}
* textAlign={{ mobile: 'center', desktop: 'left' }}
* >
* 반응형 텍스트
* </Text>
* ```
*/
const Text = forwardRef(({ as: Component = 'p', variant = 'body-1', weight = 'regular', textAlign, transform, noWrap, truncate, className, children, style, ...rest }, ref) => {
const classes = [
styles$7.text,
// 반응형 variant + weight 조합 클래스들
...generateVariantClasses(variant, weight, styles$7),
// 반응형 정렬 클래스들
...generateResponsiveClasses(textAlign, 'text--align', styles$7),
// 반응형 변형 클래스들
...generateResponsiveClasses(transform, 'text--transform', styles$7),
// 기존 비반응형 클래스들
noWrap && styles$7['text--nowrap'],
truncate && styles$7['text--truncate'],
className
].filter(Boolean).join(' ');
const textStyles = {
...(truncate && { WebkitLineClamp: truncate }),
...style
};
return (jsx(Component, { ref: ref, className: classes, style: textStyles, ...rest, children: children }));
});
Text.displayName = 'Text';
var css_248z$6 = ".Icon-module_icon__OctqN {\r\n display: inline-block !important;\r\n vertical-align: middle;\r\n flex-shrink: 0;\r\n color: currentColor; /* 부모의 color 속성 상속 */\r\n}\r\n\r\n/* 사이즈 토큰 기반 - semantic.json과 일치하도록 수정 */\r\n.Icon-module_icon--size-xs__MUgtq {\r\n width: 12px !important; /* 12px */\r\n height: 12px !important;\r\n}\r\n\r\n.Icon-module_icon--size-sm__Ld2lY {\r\n width: 16px !important; /* 16px */\r\n height: 16px !important;\r\n}\r\n\r\n.Icon-module_icon--size-md__ecfRK {\r\n width: 20px !important; /* 20px */\r\n height: 20px !important;\r\n}\r\n\r\n.Icon-module_icon--size-lg__5jvZM {\r\n width: 24px !important; /* 24px */\r\n height: 24px !important;\r\n}\r\n\r\n.Icon-module_icon--size-xl__cC4ob {\r\n width: 28px !important; /* 28px */\r\n height: 28px !important;\r\n}\r\n\r\n.Icon-module_icon--size-xxl__oIUs- {\r\n width: 32px !important; /* 32px */\r\n height: 32px !important;\r\n}\r\n\r\n.Icon-module_icon--size-xxxl__Pg2KS {\r\n width: 36px !important; /* 36px */\r\n height: 36px !important;\r\n}\r\n\r\n/* ================================================================================================\r\n * 시스템별 색상 체계 (기본 색상만, 상태별 색상 제거)\r\n * ================================================================================================ */\r\n\r\n/* Primary Colors */\r\n.Icon-module_icon--color-primary-system01__sVFli { color: #00A0E9 !important; } /* Classic & Compact - Blue */\r\n.Icon-module_icon--color-primary-system02__UDUir { color: #4CAF50 !important; } /* Modern & Spacious - Green */\r\n.Icon-module_icon--color-primary-system03__Q-MSd { color: #FF9800 !important; } /* Playful & Dynamic - Orange */\r\n\r\n/* Secondary Colors */\r\n.Icon-module_icon--color-secondary-system01-1__kmvAv { color: #333333 !important; }\r\n.Icon-module_icon--color-secondary-system01-2__sUAbb { color: #666666 !important; }\r\n.Icon-module_icon--color-secondary-system01-3__r6B3m { color: #999999 !important; }\r\n.Icon-module_icon--color-secondary-system02-1__kkHVJ { color: #333333 !important; }\r\n.Icon-module_icon--color-secondary-system02-2__9VcKo { color: #666666 !important; }\r\n.Icon-module_icon--color-secondary-system02-3__gYuh7 { color: #999999 !important; }\r\n.Icon-module_icon--color-secondary-system03-1__SSKW7 { color: #333333 !important; }\r\n.Icon-module_icon--color-secondary-system03-2__-s4E5 { color: #666666 !important; }\r\n.Icon-module_icon--color-secondary-system03-3__3IigF { color: #999999 !important; }\r\n\r\n/* CTA Colors */\r\n.Icon-module_icon--color-cta-system01__OJpWA { color: #43A047 !important; } /* Green CTA for Blue primary */\r\n.Icon-module_icon--color-cta-system02__osMWq { color: #510E65 !important; } /* Purple CTA for Green primary */\r\n.Icon-module_icon--color-cta-system03__FQeYy { color: #0080BA !important; } /* Blue CTA for Orange primary */\r\n\r\n/* Status Colors (시스템 공통) */\r\n.Icon-module_icon--color-status-error__EDtTk { color: #EF5350 !important; }\r\n.Icon-module_icon--color-status-warning__N3eyB { color: #FF9800 !important; }\r\n.Icon-module_icon--color-status-success__pf8sB { color: #66BB6A !important; }\r\n.Icon-module_icon--color-status-info__bzEnT { color: #33C1FF !important; }\r\n.Icon-module_icon--color-status-focused__F3ux6 { color: #666666 !important; }\r\n\r\n/* OnColor (배경 위의 아이콘) */\r\n.Icon-module_icon--color-oncolor__l5nnj { color: #FFFFFF !important; }\r\n\r\n/* 유틸리티 색상들 */\r\n.Icon-module_icon--color-disabled__h3AfZ { color: #CCCCCC !important; }\r\n.Icon-module_icon--color-transparent__FRIu7 { color: transparent !important; } ";
var styles$6 = {"icon":"Icon-module_icon__OctqN","icon--size-xs":"Icon-module_icon--size-xs__MUgtq","icon--size-sm":"Icon-module_icon--size-sm__Ld2lY","icon--size-md":"Icon-module_icon--size-md__ecfRK","icon--size-lg":"Icon-module_icon--size-lg__5jvZM","icon--size-xl":"Icon-module_icon--size-xl__cC4ob","icon--size-xxl":"Icon-module_icon--size-xxl__oIUs-","icon--size-xxxl":"Icon-module_icon--size-xxxl__Pg2KS","icon--color-primary-system01":"Icon-module_icon--color-primary-system01__sVFli","icon--color-primary-system02":"Icon-module_icon--color-primary-system02__UDUir","icon--color-primary-system03":"Icon-module_icon--color-primary-system03__Q-MSd","icon--color-secondary-system01-1":"Icon-module_icon--color-secondary-system01-1__kmvAv","icon--color-secondary-system01-2":"Icon-module_icon--color-secondary-system01-2__sUAbb","icon--color-secondary-system01-3":"Icon-module_icon--color-secondary-system01-3__r6B3m","icon--color-secondary-system02-1":"Icon-module_icon--color-secondary-system02-1__kkHVJ","icon--color-secondary-system02-2":"Icon-module_icon--color-secondary-system02-2__9VcKo","icon--color-secondary-system02-3":"Icon-module_icon--color-secondary-system02-3__gYuh7","icon--color-secondary-system03-1":"Icon-module_icon--color-secondary-system03-1__SSKW7","icon--color-secondary-system03-2":"Icon-module_icon--color-secondary-system03-2__-s4E5","icon--color-secondary-system03-3":"Icon-module_icon--color-secondary-system03-3__3IigF","icon--color-cta-system01":"Icon-module_icon--color-cta-system01__OJpWA","icon--color-cta-system02":"Icon-module_icon--color-cta-system02__osMWq","icon--color-cta-system03":"Icon-module_icon--color-cta-system03__FQeYy","icon--color-status-error":"Icon-module_icon--color-status-error__EDtTk","icon--color-status-warning":"Icon-module_icon--color-status-warning__N3eyB","icon--color-status-success":"Icon-module_icon--color-status-success__pf8sB","icon--color-status-info":"Icon-module_icon--color-status-info__bzEnT","icon--color-status-focused":"Icon-module_icon--color-status-focused__F3ux6","icon--color-oncolor":"Icon-module_icon--color-oncolor__l5nnj","icon--color-disabled":"Icon-module_icon--color-disabled__h3AfZ","icon--color-transparent":"Icon-module_icon--color-transparent__FRIu7"};
styleInject(css_248z$6);
/**
* AdministratorIcon 아이콘 컴포넌트
*
* @param props - 아이콘 속성
* @returns JSX 엘리먼트
*/
const AdministratorIcon = ({ size = 24, color = 'currentColor', className, style, 'aria-label': ariaLabel, onClick, ...props }) => {
const combinedStyle = {
width: typeof size === 'number' ? `${size}px` : size,
height: typeof size === 'number' ? `${size}px` : size,
color,
...style,
};
// SVG의 width/height 속성은 숫자나 픽셀 값만 허용하므로 토큰을 변환
const getSvgSize = (size) => {
if (typeof size === 'number')
return size;
// 토큰을 픽셀 값으로 변환
const tokenToPixel = {
'xxsm': 12,
'xsm': 14,
'sm': 16,
'md': 20,
'lg': 24,
'xl': 32,
'xxl': 40
};
return tokenToPixel[size] || 24; // 기본값 24px
};
const svgSize = getSvgSize(size);
return (jsxs("svg", { width: svgSize, height: svgSize, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, style: combinedStyle, "aria-label": ariaLabel, onClick: onClick, ...props, children: [jsx("path", { d: "M8.71667 8.33334H11.2167C12.3217 8.33334 13.3815 8.77234 14.1629 9.55368C14.9443 10.3351 15.3833 11.3949 15.3833 12.5V17.5C15.3833 17.942 15.2077 18.3659 14.8952 18.6785C14.5826 18.9911 14.1587 19.1667 13.7167 19.1667H6.21664C5.77461 19.1667 5.35069 18.9911 5.03813 18.6785C4.72556 18.3659 4.54997 17.942 4.54997 17.5V12.5C4.54997 11.3949 4.98896 10.3351 5.77036 9.55368C6.55176 8.77234 7.61157 8.33334 8.71667 8.33334Z", fill: "#C7CED5" }), jsx("path", { d: "M10 7.50001C11.8409 7.50001 13.3333 6.00763 13.3333 4.16668C13.3333 2.32573 11.8409 0.833344 10 0.833344C8.15905 0.833344 6.66667 2.32573 6.66667 4.16668C6.66667 6.00763 8.15905 7.50001 10 7.50001Z", fill: "#C7CED5" }), jsx("path", { d: "M14.5833 18.3333C16.1942 18.3333 17.5 17.0275 17.5 15.4167C17.5 13.8058 16.1942 12.5 14.5833 12.5C12.9725 12.5 11.6667 13.8058 11.6667 15.4167C11.6667 17.0275 12.9725 18.3333 14.5833 18.3333Z", fill: "#6B758F" }), jsx("path", { d: "M14.5833 16.6667C15.2737 16.6667 15.8333 16.107 15.8333 15.4167C15.8333 14.7263 15.2737 14.1667 14.5833 14.1667C13.893 14.1667 13.3333 14.7263 13.3333 15.4167C13.3333 16.107 13.893 16.6667 14.5833 16.6667Z", fill: "white" }), jsx("path", { d: "M15.6413 11.6748H13.5579V13.3415H15.6413V11.6748Z", fill: "#6B758F" }), jsx("path", { d: "M11.8791 12.6351L10.8374 14.4392L12.2808 15.2726L13.3224 13.4684L11.8791 12.6351Z", fill: "#6B758F" }), jsx("path", { d: "M10.8228 16.3786L11.8644 18.1828L13.3078 17.3494L12.2662 15.5453L10.8228 16.3786Z", fill: "#6B758F" }), jsx("path", { d: "M13.5246 19.1585H15.6079V17.4918H13.5246V19.1585Z", fill: "#6B758F" }), jsx("path", { d: "M17.2933 18.2088L18.335 16.4046L16.8916 15.5713L15.8499 17.3755L17.2933 18.2088Z", fill: "#6B758F" }), jsx("path", { d: "M18.3496 14.4621L17.3079 12.6579L15.8646 13.4913L16.9062 15.2954L18.3496 14.4621Z", fill: "#6B758F" })] }));
};
/**
* BuildingIcon 아이콘 컴포넌트
*
* @param props - 아이콘 속성
* @returns JSX 엘리먼트
*/
const BuildingIcon = ({ size = 24, color = 'currentColor', className, style, 'aria-label': ariaLabel, onClick, ...props }) => {
const combinedStyle = {
width: typeof size === 'number' ? `${size}px` : size,
height: typeof size === 'number' ? `${size}px` : size,
color,
...style,
};
// SVG의 width/height 속성은 숫자나 픽셀 값만 허용하므로 토큰을 변환
const getSvgSize = (size) => {
if (typeof size === 'number')
return size;
// 토큰을 픽셀 값으로 변환
const tokenToPixel = {
'xxsm': 12,
'xsm': 14,
'sm': 16,
'md': 20,
'lg': 24,
'xl': 32,
'xxl': 40
};
return tokenToPixel[size] || 24; // 기본값 24px
};
const svgSize = getSvgSize(size);
return (jsxs("svg", { width: svgSize, height: svgSize, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, style: combinedStyle, "aria-label": ariaLabel, onClick: onClick, ...props, children: [jsx("path", { d: "M2.49999 2.5H10.8333C11.0543 2.5 11.2663 2.5878 11.4226 2.74408C11.5788 2.90036 11.6667 3.11232 11.6667 3.33333V18.3333H1.66666V3.33333C1.66666 3.11232 1.75446 2.90036 1.91075 2.74408C2.06702 2.5878 2.27897 2.5 2.49999 2.5Z", fill: "#737A83" }), jsx("path", { d: "M12.5 5.83331H17.5C17.721 5.83331 17.933 5.92111 18.0892 6.07739C18.2455 6.23367 18.3333 6.44563 18.3333 6.66665V18.3333H11.6667V6.66665C11.6667 6.44563 11.7545 6.23367 11.9107 6.07739C12.067 5.92111 12.279 5.83331 12.5 5.83331Z", fill: "#C7CED5" }), jsx("path", { d: "M5.62501 4.79169H4.37501C4.14489 4.79169 3.95834 4.97824 3.95834 5.20835V6.45835C3.95834 6.68847 4.14489 6.87502 4.37501 6.87502H5.62501C5.85513 6.87502 6.04168 6.68847 6.04168 6.45835V5.20835C6.04168 4.97824 5.85513 4.79169 5.62501 4.79169Z", fill: "white" }), jsx("path", { d: "M8.95832 4.79169H7.70832C7.47821 4.79169 7.29166 4.97824 7.29166 5.20835V6.45835C7.29166 6.68847 7.47821 6.87502 7.70832 6.87502H8.95832C9.18841 6.87502 9.37499 6.68847 9.37499 6.45835V5.20835C9.37499 4.97824 9.18841 4.79169 8.95832 4.79169Z", fill: "white" }), jsx("path", { d: "M5.62501 8.125H4.37501C4.14489 8.125 3.95834 8.31155 3.95834 8.54167V9.79167C3.95834 10.0217 4.14489 10.2083 4.37501 10.2083H5.62501C5.85513 10.2083 6.04168 10.0217 6.04168 9.79167V8.54167C6.04168 8.31155 5.85513 8.125 5.62501 8.125Z", fill: "white" }), jsx("path", { d: "M8.95832 8.125H7.70832C7.47821 8.125 7.29166 8.31155 7.29166 8.54167V9.79167C7.29166 10.0217 7.47821 10.2083 7.70832 10.2083H8.95832C9.18841 10.2083 9.37499 10.0217 9.37499 9.79167V8.54167C9.37499 8.31155 9.18841 8.125 8.95832 8.125Z", fill: "white" }), jsx("path", { d: "M5.62501 11.4583H4.37501C4.14489 11.4583 3.95834 11.6449 3.95834 11.875V13.125C3.95834 13.3551 4.14489 13.5416 4.37501 13.5416H5.62501C5.85513 13.5416 6.04168 13.3551 6.04168 13.125V11.875C6.04168 11.6449 5.85513 11.4583 5.62501 11.4583Z", fill: "white" }), jsx("path", { d: "M8.95832 11.4583H7.70832C7.47821 11.4583 7.29166 11.6449 7.29166 11.875V13.125C7.29166 13.3551 7.47821 13.5416 7.70832 13.5416H8.95832C9.18841 13.5416 9.37499 13.3551 9.37499 13.125V11.875C9.37499 11.6449 9.18841 11.4583 8.95832 11.4583Z", fill: "white" })] }));
};
/**
* CalendarSelectedIcon 아이콘 컴포넌트
*
* @param props - 아이콘 속성
* @returns JSX 엘리먼트
*/
const CalendarSelectedIcon = ({ size = 24, color = 'currentColor', className, style, 'aria-label': ariaLabel, onClick, ...props }) => {
const combinedStyle = {
width: typeof size === 'number' ? `${size}px` : size,
height: typeof size === 'number' ? `${size}px` : size,
color,
...style,
};
// SVG의 width/height 속성은 숫자나 픽셀 값만 허용하므로 토큰을 변환
const getSvgSize = (size) => {
if (typeof size === 'number')
return size;
// 토큰을 픽셀 값으로 변환
const tokenToPixel = {
'xxsm': 12,
'xsm': 14,
'sm': 16,
'md': 20,
'lg': 24,
'xl': 32,
'xxl': 40
};
return tokenToPixel[size] || 24; // 기본값 24px
};
const svgSize = getSvgSize(size);
return (jsxs("svg", { width: svgSize, height: svgSize, viewBox: "0 0 29 28", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, style: combinedStyle, "aria-label": ariaLabel, onClick: onClick, ...props, children: [jsx("path", { d: "M22.85 4.68945H5.34998C4.06132 4.68945 3.01665 5.73412 3.01665 7.02279V22.1894C3.01665 23.4781 4.06132 24.5228 5.34998 24.5228H22.85C24.1387 24.5228 25.1833 23.4781 25.1833 22.1894V7.02279C25.1833 5.73412 24.1387 4.68945 22.85 4.68945Z", fill: "#009FE9" }), jsx("path", { d: "M9.99333 3.52283H8.84998C8.52782 3.52283 8.26665 3.784 8.26665 4.10616V6.43949C8.26665 6.76166 8.52782 7.02283 8.84998 7.02283H9.99333C10.3155 7.02283 10.5767 6.76166 10.5767 6.43949V4.10616C10.5767 3.784 10.3155 3.52283 9.99333 3.52283Z", fill: "white" }), jsx("path", { d: "M10.2969 11.0834H8.54692C8.22475 11.0834 7.96358 11.3445 7.96358 11.6667V13.4167C7.96358 13.7388 8.22475 14 8.54692 14H10.2969C10.6191 14 10.8803 13.7388 10.8803 13.4167V11.6667C10.8803 11.3445 10.6191 11.0834 10.2969 11.0834Z", fill: "white" }), jsx("path", { d: "M14.975 11.0834H13.225C12.9029 11.0834 12.6416 11.3445 12.6416 11.6667V13.4167C12.6416 13.7388 12.9029 14 13.225 14H14.975C15.2971 14 15.5583 13.7388 15.5583 13.4167V11.6667C15.5583 11.3445 15.2971 11.0834 14.975 11.0834Z", fill: "white" }), jsx("path", { d: "M19.6531 11.0834H17.9031C17.5808 11.0834 17.3197 11.3445 17.3197 11.6667V13.4167C17.3197 13.7388 17.5808 14 17.9031 14H19.6531C19.9752 14 20.2364 13.7388 20.2364 13.4167V11.6667C20.2364 11.3445 19.9752 11.0834 19.6531 11.0834Z", fill: "white" }), jsx("path", { d: "M19.35 3.52283H18.1833C17.8612 3.52283 17.6 3.784 17.6 4.10616V6.43949C17.6 6.76166 17.8612 7.02283 18.1833 7.02283H19.35C19.6721 7.02283 19.9333 6.76166 19.9333 6.43949V4.10616C19.9333 3.784 19.6721 3.52283 19.35 3.52283Z", fill: "white" }), jsx("path", { d: "M10.2969 16.3334H8.54692C8.22475 16.3334 7.96358 16.5946 7.96358 16.9167V18.6667C7.96358 18.9888 8.22475 19.25 8.54692 19.25H10.2969C10.6191 19.25 10.8803 18.9888 10.8803 18.6667V16.9167C10.8803 16.5946 10.6191 16.3334 10.2969 16.3334Z", fill: "white" }), jsx("path", { d: "M14.975 16.3334H13.225C12.9029 16.3334 12.6416 16.5946 12.6416 16.9167V18.6667C12.6416 18.9888 12.9029 19.25 13.225 19.25H14.975C15.2971 19.25 15.5583 18.9888 15.5583 18.6667V16.9167C15.5583 16.5946 15.2971 16.3334 14.975 16.3334Z", fill: "white" }), jsx("path", { d: "M19.6531 16.3334H17.9031C17.5808 16.3334 17.3197 16.5946 17.3197 16.9167V18.6667C17.3197 18.9888 17.5808 19.25 17.9031 19.25H19.6531C19.9752 19.25 20.2364 18.9888 20.2364 18.6667V16.9167C20.2364 16.5946 19.9752 16.3334 19.6531 16.3334Z", fill: "white" })] }));
};
/**
* CalendarUnselectedIcon 아이콘 컴포넌트
*
* @param props - 아이콘 속성
* @returns JSX 엘리먼트
*/
const CalendarUnselectedIcon = ({ size = 24, color = 'currentColor', className, style, 'aria-label': ariaLabel, onClick, ...props }) => {
const combinedStyle = {
width: typeof size === 'number' ? `${size}px` : size,
height: typeof size === 'number' ? `${size}px` : size,
color,
...style,
};
// SVG의 width/height 속성은 숫자나 픽셀 값만 허용하므로 토큰을 변환
const getSvgSize = (size) => {
if (typeof size === 'number')
return size;
// 토큰을 픽셀 값으로 변환
const tokenToPixel = {
'xxsm': 12,
'xsm': 14,
'sm': 16,
'md': 20,
'lg': 24,
'xl': 32,
'xxl': 40
};
return tokenToPixel[size] || 24; // 기본값 24px
};
const svgSize = getSvgSize(size);
return (jsxs("svg", { width: svgSize, height: svgSize, viewBox: "0 0 29 28", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, style: combinedStyle, "aria-label": ariaLabel, onClick: onClick, ...props, children: [jsx("path", { d: "M22.8502 4.68945H5.35018C4.06151 4.68945 3.01685 5.73412 3.01685 7.02279V22.1894C3.01685 23.4781 4.06151 24.5228 5.35018 24.5228H22.8502C24.1389 24.5228 25.1835 23.4781 25.1835 22.1894V7.02279C25.1835 5.73412 24.1389 4.68945 22.8502 4.68945Z", fill: "#E0E0E0" }), jsx("path", { d: "M9.99352 3.52283H8.85018C8.52802 3.52283 8.26685 3.784 8.26685 4.10616V6.43949C8.26685 6.76166 8.52802 7.02283 8.85018 7.02283H9.99352C10.3157 7.02283 10.5769 6.76166 10.5769 6.43949V4.10616C10.5769 3.784 10.3157 3.52283 9.99352 3.52283Z", fill: "#C2C2C2" }), jsx("path", { d: "M10.297 11.0834H8.54696C8.22479 11.0834 7.96362 11.3445 7.96362 11.6667V13.4167C7.96362 13.7388 8.22479 14 8.54696 14H10.297C10.6191 14 10.8803 13.7388 10.8803 13.4167V11.6667C10.8803 11.3445 10.6191 11.0834 10.297 11.0834Z", fill: "#C2C2C2" }), jsx("path", { d: "M14.9752 11.0834H13.2252C12.9031 11.0834 12.6418 11.3445 12.6418 11.6667V13.4167C12.6418 13.7388 12.9031 14 13.2252 14H14.9752C15.2973 14 15.5585 13.7388 15.5585 13.4167V11.6667C15.5585 11.3445 15.2973 11.0834 14.9752 11.0834Z", fill: "#C2C2C2" }), jsx("path", { d: "M19.6532 11.0834H17.9032C17.5809 11.0834 17.3198 11.3445 17.3198 11.6667V13.4167C17.3198 13.7388 17.5809 14 17.9032 14H19.6532C19.9753 14 20.2365 13.7388 20.2365 13.4167V11.6667C20.2365 11.3445 19.9753 11.0834 19.6532 11.0834Z", fill: "#C2C2C2" }), jsx("path", { d: "M19.3501 3.52283H18.1834C17.8613 3.52283 17.6001 3.784 17.6001 4.10616V6.43949C17.6001 6.76166 17.8613 7.02283 18.1834 7.02283H19.3501C19.6722 7.02283 19.9334 6.76166 19.9334 6.43949V4.10616C19.9334 3.784 19.6722 3.52283 19.3501 3.52283Z", fill: "#C2C2C2" }), jsx("path", { d: "M10.297 16.3334H8.54696C8.22479 16.3334 7.96362 16.5946 7.96362 16.9167V18.6667C7.96362 18.9888 8.22479 19.25 8.54696 19.25H10.297C10.6191 19.25 10.8803 18.9888 10.8803 18.6667V16.9167C10.8803 16.5946 10.6191 16.3334 10.297 16.3334Z", fill: "#C2C2C2" }), jsx("path", { d: "M14.9752 16.3334H13.2252C12.9031 16.3334 12.6418 16.5946 12.6418 16.9167V18.6667C12.6418 18.9888 12.9031 19.25 13.2252 19.25H14.9752C15.2973 19.25 15.5585 18.9888 15.5585 18.6667V16.9167C15.5585 16.5946 15.2973 16.3334 14.9752 16.3334Z", fill: "#C2C2C2" }), jsx("path", { d: "M19.6532 16.3334H17.9032C17.5809 16.3334 17.3198 16.5946 17.3198 16.9167V18.6667C17.3198 18.9888 17.5809 19.25 17.9032 19.25H19.6532C19.9753 19.25 20.2365 18.9888 20.2365 18.6667V16.9167C20.2365 16.5946 19.9753 16.3334 19.6532 16.3334Z", fill: "#C2C2C2" })] }));
};
/**
* CalendarIcon 아이콘 컴포넌트
*
* @param props - 아이콘 속성
* @returns JSX 엘리먼트
*/
const CalendarIcon = ({ size = 24, color = 'currentColor', className, style, 'aria-label': ariaLabel, onClick, ...props }) => {
const combinedStyle = {
width: typeof size === 'number' ? `${size}px` : size,
height: typeof size === 'number' ? `${size}px` : size,
color,
...style,
};
// SVG의 width/height 속성은 숫자나 픽셀 값만 허용하므로 토큰을 변환
const getSvgSize = (size) => {
if (typeof size === 'number')
return size;
// 토큰을 픽셀 값으로 변환
const tokenToPixel = {
'xxsm': 12,
'xsm': 14,
'sm': 16,
'md': 20,
'lg': 24,
'xl': 32,
'xxl': 40
};
return tokenToPixel[size] || 24; // 기본값 24px
};
const svgSize = getSvgSize(size);
return (jsxs("svg", { width: svgSize, height: svgSize, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, style: combinedStyle, "aria-label": ariaLabel, onClick: onClick, ...props, children: [jsx("path", { d: "M16.25 3.34961H3.75001C2.82954 3.34961 2.08334 4.0958 2.08334 5.01628V15.8496C2.08334 16.7701 2.82954 17.5163 3.75001 17.5163H16.25C17.1705 17.5163 17.9167 16.7701 17.9167 15.8496V5.01628C17.9167 4.0958 17.1705 3.34961 16.25 3.34961Z", fill: "#F4868F" }), jsx("path", { d: "M7.06669 2.5163H6.25001C6.01989 2.5163 5.83334 2.70285 5.83334 2.93296V4.59963C5.83334 4.82975 6.01989 5.0163 6.25001 5.0163H7.06669C7.2968 5.0163 7.48335 4.82975 7.48335 4.59963V2.93296C7.48335 2.70285 7.2968 2.5163 7.06669 2.5163Z", fill: "#707070" }), jsx("path", { d: "M7.28352 7.91669H6.03352C5.8034 7.91669 5.61685 8.10324 5.61685 8.33335V9.58335C5.61685 9.81344 5.8034 10 6.03352 10H7.28352C7.51364 10 7.70018 9.81344 7.70018 9.58335V8.33335C7.70018 8.10324 7.51364 7.91669 7.28352 7.91669Z", fill: "white" }), jsx("path", { d: "M10.625 7.91669H9.37501C9.14493 7.91669 8.95834 8.10324 8.95834 8.33335V9.58335C8.95834 9.81344 9.14493 10 9.37501 10H10.625C10.8551 10 11.0417 9.81344 11.0417 9.58335V8.33335C11.0417 8.10324 10.8551 7.91669 10.625 7.91669Z", fill: "white" }), jsx("path", { d: "M13.9665 7.91669H12.7165C12.4863 7.91669 12.2998 8.10324 12.2998 8.33335V9.58335C12.2998 9.81344 12.4863 10 12.7165 10H13.9665C14.1966 10 14.3832 9.81344 14.3832 9.58335V8.33335C14.3832 8.10324 14.1966 7.91669 13.9665 7.91669Z", fill: "white" }), jsx("path", { d: "M13.75 2.5163H12.9167C12.6866 2.5163 12.5 2.70285 12.5 2.93296V4.59963C12.5 4.82975 12.6866 5.0163 12.9167 5.0163H13.75C13.9801 5.0163 14.1667 4.82975 14.1667 4.59963V2.93296C14.1667 2.70285 13.9801 2.5163 13.75 2.5163Z", fill: "#707070" }), jsx("path", { d: "M7.28352 11.6667H6.03352C5.8034 11.6667 5.61685 11.8533 5.61685 12.0834V13.3334C5.61685 13.5634 5.8034 13.75 6.03352 13.75H7.28352C7.51364 13.75 7.70018 13.5634 7.70018 13.3334V12.0834C7.70018 11.8533 7.51364 11.6667 7.28352 11.6667Z", fill: "white" }), jsx("path", { d: "M10.625 11.6667H9.37501C9.14493 11.6667 8.95834 11.8533 8.95834 12.0834V13.3334C8.95834 13.5634 9.14493 13.75 9.37501 13.75H10.625C10.8551 13.75 11.0417 13.5634 11.0417 13.3334V12.0834C11.0417 11.8533 10.8551 11.6667 10.625 11.6667Z", fill: "white" }), jsx("path", { d: "M13.9665 11.6667H12.7165C12.4863 11.6667 12.2998 11.8533 12.2998 12.0834V13.3334C12.2998 13.5634 12.4863 13.75 12.7165 13.75H13.966