boottent-design 0.1.233 → 0.1.235

package/README.md

@@ -7,6 +7,7 @@
 - [시작하기](#시작하기)
   - [설치](#설치)
   - [빠른 사용법 (Tailwind 설정 불필요)](#빠른-사용법-tailwind-설정-불필요)
+  - [Tailwind 앱 권장 사용법](#tailwind-앱-권장-사용법)
   - [성능 권장 import](#성능-권장-import)
   - [모듈 import 경로](#모듈-import-경로)
 - [제작 및 배포](#제작-및-배포)
@@ -36,6 +37,9 @@ npm install boottent-design@latest
 Tailwind를 직접 설치하거나 `tailwind.config`를 수정하지 않아도 됩니다.
 라이브러리에서 미리 빌드된 CSS를 함께 제공하므로, 아래 2단계만 하면 동작합니다.
 
+이 방식은 Tailwind를 쓰지 않는 앱이나 빠른 프로토타이핑에 적합합니다.
+Tailwind를 직접 운영하는 앱에서는 아래의 `Tailwind 앱 권장 사용법`을 사용하세요.
+
 1. 앱 엔트리에서 스타일 1회 임포트
 
 ```tsx
@@ -61,6 +65,39 @@ export function Sample() {
 }
 ```
 
+### Tailwind 앱 권장 사용법
+
+Tailwind를 직접 운영하는 앱에서는 `styles.css` 대신 `foundation.css`와 `tailwind-preset`을 사용하세요.
+이 방식은 유틸 클래스를 앱 CSS에서 한 번만 생성하게 만들어, 디자인시스템 CSS와 앱 CSS 간 우선순위 충돌을 막습니다.
+
+1. 앱 엔트리에서 foundation CSS 1회 임포트
+
+```tsx
+import "boottent-design/foundation.css";
+import "./index.css";
+```
+
+2. `tailwind.config`에서 preset과 content를 추가
+
+```ts
+const boottentDesignTailwindPreset = require("boottent-design/tailwind-preset");
+
+module.exports = {
+  content: ["./src/**/*.{ts,tsx}", "./node_modules/boottent-design/dist/**/*.{js,cjs,mjs}"],
+  presets: [boottentDesignTailwindPreset],
+};
+```
+
+3. 필요한 모듈 import 후 바로 사용
+
+```tsx
+import { EventCard } from "boottent-design/components";
+
+export function Sample() {
+  return <EventCard {...props} />;
+}
+```
+
 ### 성능 권장 import
 
 소비자 앱 빌드 시간을 줄이려면 배럴 import보다 deep import를 권장합니다.
@@ -83,11 +120,15 @@ export function Sample() {
 - `boottent-design/ui`
 - `boottent-design/ui/*`
 - `boottent-design/tokens`
+- `boottent-design/components`
+- `boottent-design/components/*`
+- `boottent-design/foundation.css`
+- `boottent-design/tailwind-preset`
 
 ### 참고
 
-- 기존처럼 소비자 프로젝트에서 Tailwind를 직접 운영해도 됩니다.
-- 다만 `boottent-design`을 사용하기 위해 Tailwind 설정이 필수는 아닙니다.
+- Tailwind를 직접 운영하는 소비자 앱은 `styles.css` 대신 `foundation.css + tailwind-preset` 조합을 권장합니다.
+- `styles.css`는 Tailwind 미사용 소비자를 위한 올인원 엔트리로 계속 유지됩니다.
 
 ## 제작 및 배포
 

package/dist/DESIGN.md

@@ -2,8 +2,8 @@
 
 > [!WARNING]
 > **자동 생성된 파일 — 직접 수정 금지**
-> 생성 일시: 2026. 4. 28. 오후 4:35:08
-> 원본 소스: boottent-design v0.1.232
+> 생성 일시: 2026. 5. 4. 오전 10:50:49
+> 원본 소스: boottent-design v0.1.234
 
 ## 1. 개요 (Overview)
 
@@ -97,28 +97,12 @@ Stitch(AI 디자인 도구)와 Claude Code(AI 코딩 에이전트)는 이 파일
 
 ### 2.2 타이포그래피 (Typography)
 ```javascript
-{
-  bold30: ["30px", { lineHeight: "38px", fontWeight: "700" }],
-  bold24: ["24px", { lineHeight: "32px", fontWeight: "700" }],
-  bold20: ["20px", { lineHeight: "28px", fontWeight: "700" }],
-  semibold18: ["18px", { lineHeight: "26px", fontWeight: "600" }],
-  semibold16: ["16px", { lineHeight: "24px", fontWeight: "600" }],
-  semibold15: ["15px", { lineHeight: "23px", fontWeight: "600" }],
-  semibold14: ["14px", { lineHeight: "20px", fontWeight: "600" }],
-  semibold13: ["13px", { lineHeight: "19px", fontWeight: "600" }],
-  semibold12: ["12px", { lineHeight: "16px", fontWeight: "600" }],
-  medium16: ["16px", { lineHeight: "24px", fontWeight: "500" }],
-  medium14: ["14px", { lineHeight: "20px", fontWeight: "500" }],
-  regular16: ["16px", { lineHeight: "24px", fontWeight: "400" }],
-  regular14: ["14px", { lineHeight: "20px", fontWeight: "400" }],
-  regular13: ["13px", { lineHeight: "19px", fontWeight: "400" }],
-  regular12: ["12px", { lineHeight: "16px", fontWeight: "400" }],
-}
+{}
 ```
 
 ### 2.3 기타 토큰
-- **Border Radius**: `{ lg: "var(--radius)", md: "calc(var(--radius) - 2px)", sm: "calc(var(--radius) - 4px)", }`
-- **Screens**: `{ "2xl": "1400px", }`
+- **Border Radius**: `default Tailwind radius`
+- **Screens**: `default Tailwind screens`
 - **Spacing**: 기본 Tailwind Spacing 스케일 사용 (4px 단위)
 
 ---
@@ -1643,9 +1627,10 @@ import { cn }
 {
     // size : padding, border-radius, 텍스트 크기
     size: {
-      sm: "px-2 py-1 text-xs font-normal rounded",
+      sm: "px-2 py-1 text-xs font-normal rounded-sm",
       md: "px-2.5 py-1 text-sm font-normal rounded-md",
       lg: "px-3.5 py-1.5 text-base font-medium rounded-lg",
+      ad: "absolute top-0 right-0 px-2.5 py-1 rounded-t-none rounded-br-none rounded-bl-xl text-sm font-normal",
     },
     // shape : round, square, adCard
     shape: {
@@ -1654,7 +1639,7 @@ import { cn }
     },
     // variant : solid과 outline을 결합하여 하나의 값으로 처리
     variant: {
-      ad: "rounded-t-none rounded-br-none rounded-bl-xl text-sm font-normal px-2.5 py-1 absolute top-0 right-0 bg-grey-800 text-white",
+      ad: "bg-grey-800 text-white",
       "solid-primary-50": "bg-main-50 text-main-600",
       "solid-primary-100": "bg-main-100 text-main-600",
       "solid-primary-600": "bg-main-600 text-main-50",

package/dist/components/event-card.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../event-card-P9DJCupH.cjs");exports.EventCard=e.EventCard;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../event-card-DwnP_Qsj.cjs");exports.EventCard=e.EventCard;

package/dist/components/event-card.es.js

@@ -1,5 +1,5 @@
 "use client";
-import { E as t } from "../event-card-DeIzR5uk.js";
+import { E as t } from "../event-card-DCs6nu0G.js";
 export {
   t as EventCard
 };

package/dist/components/premium-card.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../premium-card-BbkNnfVA.cjs");exports.PremiumCard=e.PremiumCard;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../premium-card-Dk-pTOyb.cjs");exports.PremiumCard=e.PremiumCard;

package/dist/components/premium-card.es.js

@@ -1,5 +1,5 @@
 "use client";
-import { P as m } from "../premium-card-B0RyOTbr.js";
+import { P as m } from "../premium-card-BOlG7ZZG.js";
 export {
   m as PremiumCard
 };

package/dist/components/title-tag-card.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../title-tag-card-C-pn0u7P.cjs");exports.TitleTagCard=e.TitleTagCard;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../title-tag-card-kzgE6S3R.cjs");exports.TitleTagCard=e.TitleTagCard;

package/dist/components/title-tag-card.es.js

@@ -1,5 +1,5 @@
 "use client";
-import { T as r } from "../title-tag-card-CoPGtka1.js";
+import { T as r } from "../title-tag-card-CCInX94f.js";
 export {
   r as TitleTagCard
 };

package/dist/components.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./event-card-P9DJCupH.cjs"),r=require("./main-banner-image-Ce2c6ODO.cjs"),t=require("./premium-card-BbkNnfVA.cjs"),n=require("./title-tag-card-C-pn0u7P.cjs"),a=require("./article-asset-card-CuTpHnoq.cjs"),s=require("./environment-asset-photo-DMSQ1Ext.cjs"),i=require("./event-asset-banner-I7Wv47iX.cjs"),o=require("./lecturer-card-DLMnM4fU.cjs"),d=require("./portfolio-asset-card-DVhoypCN.cjs");exports.EventCard=e.EventCard;exports.MainBannerImage=r.MainBannerImage;exports.PremiumCard=t.PremiumCard;exports.TitleTagCard=n.TitleTagCard;exports.ArticleAssetCard=a.ArticleAssetCard;exports.EnvironmentAssetPhoto=s.EnvironmentAssetPhoto;exports.EventAssetBanner=i.EventAssetBanner;exports.LecturerCard=o.LecturerCard;exports.PortfolioAssetCard=d.PortfolioAssetCard;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./event-card-DwnP_Qsj.cjs"),r=require("./main-banner-image-Ce2c6ODO.cjs"),t=require("./premium-card-Dk-pTOyb.cjs"),n=require("./title-tag-card-kzgE6S3R.cjs"),a=require("./article-asset-card-CuTpHnoq.cjs"),s=require("./environment-asset-photo-DMSQ1Ext.cjs"),i=require("./event-asset-banner-I7Wv47iX.cjs"),o=require("./lecturer-card-DLMnM4fU.cjs"),d=require("./portfolio-asset-card-DVhoypCN.cjs");exports.EventCard=e.EventCard;exports.MainBannerImage=r.MainBannerImage;exports.PremiumCard=t.PremiumCard;exports.TitleTagCard=n.TitleTagCard;exports.ArticleAssetCard=a.ArticleAssetCard;exports.EnvironmentAssetPhoto=s.EnvironmentAssetPhoto;exports.EventAssetBanner=i.EventAssetBanner;exports.LecturerCard=o.LecturerCard;exports.PortfolioAssetCard=d.PortfolioAssetCard;

package/dist/components.es.js

@@ -1,8 +1,8 @@
 "use client";
-import { E as o } from "./event-card-DeIzR5uk.js";
+import { E as o } from "./event-card-DCs6nu0G.js";
 import { M as a } from "./main-banner-image-Cwwt6xKE.js";
-import { P as m } from "./premium-card-B0RyOTbr.js";
-import { T as f } from "./title-tag-card-CoPGtka1.js";
+import { P as m } from "./premium-card-BOlG7ZZG.js";
+import { T as f } from "./title-tag-card-CCInX94f.js";
 import { A as x } from "./article-asset-card-B30fjI_9.js";
 import { E as d } from "./environment-asset-photo-Dk8pKTD3.js";
 import { E as C } from "./event-asset-banner-DLK5HF29.js";

package/dist/{event-card-DeIzR5uk.js → event-card-DCs6nu0G.js}

@@ -1,8 +1,8 @@
-import { jsx as e, jsxs as m } from "react/jsx-runtime";
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
 import { a as t } from "./index-DWvwbdTU.js";
-import { c } from "./common-C3JaD1vJ.js";
 import "./ui/accordion.es.js";
 import "./ui/alert-dialog.es.js";
+import { c } from "./common-C3JaD1vJ.js";
 import "@radix-ui/react-aspect-ratio";
 import "./ui/avatar.es.js";
 import "./ui/badge.es.js";
@@ -27,7 +27,7 @@ import "./ui/radio-group.es.js";
 import "./ui/scroll-area.es.js";
 import "./ui/select.es.js";
 import "./ui/separator.es.js";
-import { Skeleton as l } from "./ui/skeleton.es.js";
+import { Skeleton as a } from "./ui/skeleton.es.js";
 import "@radix-ui/react-slider";
 import "react";
 import "./ui/switch.es.js";
@@ -42,11 +42,11 @@ import "./ui/tooltip.es.js";
 import { g as v, a as b, b as y } from "./utils-DMV7dwIW.js";
 function se({
   adProduct: r,
-  logo: i,
+  logo: m,
   title: o,
   batchName: p = "",
   adTitle: n,
-  startDate: a,
+  startDate: l,
   tuition: d,
   nbCardRequired: f,
   isLoading: x = !1,
@@ -55,11 +55,11 @@ function se({
 }) {
   if (x)
     return /* @__PURE__ */ e(N, { className: s });
-  const h = `${v(a)} 개강 · ${b(d, f)}`;
+  const h = `${v(l)} 개강 · ${b(d, f)}`;
   return /* @__PURE__ */ e(
     w,
     {
-      logo: i,
+      logo: m,
       title: `${o} ${p}`,
       adTitle: n,
       footerText: h,
@@ -71,14 +71,14 @@ function se({
 }
 function w({
   adProduct: r,
-  logo: i,
+  logo: m,
   title: o,
   adTitle: p,
   footerText: n,
-  regEndDate: a,
+  regEndDate: l,
   className: d
 }) {
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ i(
     "div",
     {
       className: c(
@@ -90,15 +90,16 @@ function w({
           u,
           {
             variant: "ad",
+            size: "ad",
             style: {
               background: t.event.background,
               color: t.event.color
             },
-            children: r === t.dDay.value && a ? y(a) : t.event.value.toUpperCase()
+            children: r === t.dDay.value && l ? y(l) : t.event.value.toUpperCase()
           }
         ),
-        /* @__PURE__ */ e("img", { src: i, alt: `${o} 로고`, className: "h-4 object-contain", loading: "lazy" }),
-        /* @__PURE__ */ m("div", { className: "flex w-full flex-col items-start gap-2", children: [
+        /* @__PURE__ */ e("img", { src: m, alt: `${o} 로고`, className: "h-4 object-contain", loading: "lazy" }),
+        /* @__PURE__ */ i("div", { className: "flex w-full flex-col items-start gap-2", children: [
           /* @__PURE__ */ e("h3", { className: "line-clamp-2 h-auto text-sm font-normal md:text-base lg:h-12", title: o, children: o }),
           /* @__PURE__ */ e("p", { className: "line-clamp-2 h-auto w-full break-keep rounded bg-grey-100 px-2 py-1 text-[13px] font-semibold text-grey-600 md:h-[54px] md:text-[15px] md:text-grey-800", children: p }),
           /* @__PURE__ */ e("div", { className: "text-[13px] leading-[19px] text-grey-600", children: n })
@@ -108,8 +109,8 @@ function w({
   );
 }
 function N({ className: r }) {
-  return /* @__PURE__ */ m(
-    l,
+  return /* @__PURE__ */ i(
+    a,
     {
       type: "background",
       className: c(
@@ -129,12 +130,12 @@ function N({ className: r }) {
             children: ""
           }
         ),
-        /* @__PURE__ */ e(l, { className: "h-4 w-1/2" }),
-        /* @__PURE__ */ m("div", { className: "flex flex-col items-start gap-2", children: [
-          /* @__PURE__ */ e("div", { className: "h-10 w-full", children: /* @__PURE__ */ e(l, { className: "h-5 w-4/5" }) }),
-          /* @__PURE__ */ e(l, { className: "h-14 w-full" })
+        /* @__PURE__ */ e(a, { className: "h-4 w-1/2" }),
+        /* @__PURE__ */ i("div", { className: "flex flex-col items-start gap-2", children: [
+          /* @__PURE__ */ e("div", { className: "h-10 w-full", children: /* @__PURE__ */ e(a, { className: "h-5 w-4/5" }) }),
+          /* @__PURE__ */ e(a, { className: "h-14 w-full" })
         ] }),
-        /* @__PURE__ */ e(l, { className: "mt-2 h-[19px] w-2/3" })
+        /* @__PURE__ */ e(a, { className: "mt-2 h-[19px] w-2/3" })
       ]
     }
   );

package/dist/event-card-DwnP_Qsj.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("react/jsx-runtime"),r=require("./index-B8SY6s5B.cjs");require("./ui/accordion.cjs.js");require("./ui/alert-dialog.cjs.js");const x=require("./common-Ds1lanOg.cjs");require("@radix-ui/react-aspect-ratio");require("./ui/avatar.cjs.js");require("./ui/badge.cjs.js");require("./ui/button.cjs.js");require("./ui/calendar.cjs.js");require("./ui/callout.cjs.js");require("./ui/card.cjs.js");require("./ui/checkbox.cjs.js");require("lucide-react");require("./ui/command.cjs.js");require("./ui/dialog.cjs.js");require("./ui/dropdown-menu.cjs.js");require("./ui/file-uploader.cjs.js");require("./ui/form.cjs.js");require("./ui/input.cjs.js");require("./ui/label.cjs.js");require("./ui/month-picker.cjs.js");require("./ui/multi-select.cjs.js");require("./ui/navigation-menu.cjs.js");require("./ui/popover.cjs.js");require("./ui/radio-group.cjs.js");require("./ui/scroll-area.cjs.js");require("./ui/select.cjs.js");require("./ui/separator.cjs.js");const i=require("./ui/skeleton.cjs.js");require("@radix-ui/react-slider");require("react");require("./ui/switch.cjs.js");require("./ui/tabs.cjs.js");const q=require("./ui/tag.cjs.js");require("./ui/text.cjs.js");require("./ui/textarea.cjs.js");require("./ui/toast.cjs.js");require("./ui/toggle.cjs.js");require("./ui/toggle-group.cjs.js");require("./ui/tooltip.cjs.js");const o=require("./utils-CQ8Ml7W5.cjs");function h({adProduct:t,logo:s,title:l,batchName:a="",adTitle:n,startDate:u,tuition:d,nbCardRequired:m,isLoading:g=!1,regEndDate:p,className:c}){if(g)return e.jsx(j,{className:c});const f=`${o.getCampDateText(u)} 개강 · ${o.getEventCampCostValue(d,m)}`;return e.jsx(v,{logo:s,title:`${l} ${a}`,adTitle:n,footerText:f,regEndDate:p,className:c,adProduct:t})}function v({adProduct:t,logo:s,title:l,adTitle:a,footerText:n,regEndDate:u,className:d}){return e.jsxs("div",{className:x.cn("relative z-10 flex h-full w-full flex-col items-start justify-between gap-2 overflow-hidden rounded-xl border border-grey-200 bg-white p-4 text-grey-800 md:p-5 lg:p-6",d),children:[e.jsx(q.Tag,{variant:"ad",size:"ad",style:{background:r.adProducts.event.background,color:r.adProducts.event.color},children:t===r.adProducts.dDay.value&&u?o.getCampDdayText(u):r.adProducts.event.value.toUpperCase()}),e.jsx("img",{src:s,alt:`${l} 로고`,className:"h-4 object-contain",loading:"lazy"}),e.jsxs("div",{className:"flex w-full flex-col items-start gap-2",children:[e.jsx("h3",{className:"line-clamp-2 h-auto text-sm font-normal md:text-base lg:h-12",title:l,children:l}),e.jsx("p",{className:"line-clamp-2 h-auto w-full break-keep rounded bg-grey-100 px-2 py-1 text-[13px] font-semibold text-grey-600 md:h-[54px] md:text-[15px] md:text-grey-800",children:a}),e.jsx("div",{className:"text-[13px] leading-[19px] text-grey-600",children:n})]})]})}function j({className:t}){return e.jsxs(i.Skeleton,{type:"background",className:x.cn("relative z-10 flex h-full w-full flex-col justify-between gap-2 overflow-hidden rounded-xl p-4 md:p-5 lg:p-6",t),children:[e.jsx(q.Tag,{variant:"ad",style:{background:r.adProducts.event.background,color:r.adProducts.event.color},className:"h-7 w-20 animate-pulse rounded-bl-lg rounded-br-none rounded-tl-none rounded-tr-lg px-2 py-1 text-sm",children:""}),e.jsx(i.Skeleton,{className:"h-4 w-1/2"}),e.jsxs("div",{className:"flex flex-col items-start gap-2",children:[e.jsx("div",{className:"h-10 w-full",children:e.jsx(i.Skeleton,{className:"h-5 w-4/5"})}),e.jsx(i.Skeleton,{className:"h-14 w-full"})]}),e.jsx(i.Skeleton,{className:"mt-2 h-[19px] w-2/3"})]})}exports.EventCard=h;

package/dist/foundation.css

@@ -0,0 +1,89 @@
+@font-face {
+  font-family: "Pretendard";
+  src:
+    url("https://cdn.jsdelivr.net/npm/pretendard/dist/web/static/pretendard.woff2") format("woff2"),
+    url("https://cdn.jsdelivr.net/npm/pretendard/dist/web/static/pretendard.woff") format("woff");
+  font-weight: 100 900;
+  font-display: swap;
+}
+
+:root {
+  --background: #ffffff;
+  --foreground: #26282a;
+  --card: 0 0% 100%;
+  --card-foreground: 224 71.4% 4.1%;
+  --popover: 0 0% 100%;
+  --popover-foreground: 224 71.4% 4.1%;
+  --primary: #7344e3;
+  --primary-foreground: #ffffff;
+  --secondary: #26282a;
+  --secondary-foreground: #ffffff;
+  --muted: #a2a3a4;
+  --muted-foreground: #ffffff;
+  --muted-border: #dde2e6;
+  --accent: #3a8af1;
+  --accent-foreground: 220.9 39.3% 11%;
+  --destructive: #e91927;
+  --destructive-foreground: 210 20% 98%;
+  --border: #dde2e6;
+  --input: 220 13% 91%;
+  --ring: 224 71.4% 4.1%;
+  --radius: 0.5rem;
+}
+
+.dark {
+  --background: 224 71.4% 4.1%;
+  --foreground: 210 20% 98%;
+  --card: 224 71.4% 4.1%;
+  --card-foreground: 210 20% 98%;
+  --popover: 224 71.4% 4.1%;
+  --popover-foreground: 210 20% 98%;
+  --primary: 210 20% 98%;
+  --primary-foreground: 220.9 39.3% 11%;
+  --secondary: 215 27.9% 16.9%;
+  --secondary-foreground: 210 20% 98%;
+  --muted: 215 27.9% 16.9%;
+  --muted-foreground: 217.9 10.6% 64.9%;
+  --accent: 215 27.9% 16.9%;
+  --accent-foreground: 210 20% 98%;
+  --destructive: 0 62.8% 30.6%;
+  --destructive-foreground: 210 20% 98%;
+  --border: 215 27.9% 16.9%;
+  --input: 215 27.9% 16.9%;
+  --ring: 216 12.2% 83.9%;
+}
+
+.scrollbar-hidden {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+.scrollbar-hidden::-webkit-scrollbar {
+  display: none;
+}
+
+.truncate-none {
+  overflow: visible;
+  display: block;
+}
+
+.truncate1,
+.truncate2,
+.truncate3 {
+  width: 100%;
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+}
+
+.truncate1 {
+  -webkit-line-clamp: 1;
+}
+
+.truncate2 {
+  -webkit-line-clamp: 2;
+}
+
+.truncate3 {
+  -webkit-line-clamp: 3;
+}

package/dist/{premium-card-B0RyOTbr.js → premium-card-BOlG7ZZG.js}

@@ -1,8 +1,8 @@
 import { jsxs as e, jsx as r } from "react/jsx-runtime";
 import { a as d } from "./index-DWvwbdTU.js";
-import { c as n } from "./common-C3JaD1vJ.js";
 import "./ui/accordion.es.js";
 import "./ui/alert-dialog.es.js";
+import { c as n } from "./common-C3JaD1vJ.js";
 import "@radix-ui/react-aspect-ratio";
 import "./ui/avatar.es.js";
 import "./ui/badge.es.js";
@@ -39,12 +39,12 @@ import "./ui/toast.es.js";
 import "./ui/toggle.es.js";
 import "./ui/toggle-group.es.js";
 import "./ui/tooltip.es.js";
-function ir({
-  logo: i,
+function lr({
+  logo: l,
   title: a,
   subtitle: o,
   thumbnail: p,
-  batchTitle: l,
+  batchTitle: i,
   batchName: s = "",
   brandName: c,
   tag: x,
@@ -65,6 +65,7 @@ function ir({
         /* @__PURE__ */ r(
           u,
           {
+            size: "ad",
             variant: "ad",
             style: {
               background: d.premiumCard.background,
@@ -77,9 +78,9 @@ function ir({
         t ? /* @__PURE__ */ r(w, {}) : /* @__PURE__ */ r(
           h,
           {
-            logo: i,
+            logo: l,
             brandName: c,
-            batchTitle: l,
+            batchTitle: i,
             batchName: s,
             subtitle: o,
             thumbnail: p
@@ -90,15 +91,15 @@ function ir({
   );
 }
 function h({
-  logo: i,
+  logo: l,
   brandName: a,
   batchTitle: o,
   batchName: p,
-  subtitle: l,
+  subtitle: i,
   thumbnail: s
 }) {
   return /* @__PURE__ */ e("div", { className: "flex h-full flex-col items-start justify-start gap-2", children: [
-    /* @__PURE__ */ r("img", { src: i, alt: `${a} 로고`, className: "h-4 object-contain", loading: "lazy" }),
+    /* @__PURE__ */ r("img", { src: l, alt: `${a} 로고`, className: "h-4 object-contain", loading: "lazy" }),
     /* @__PURE__ */ e("div", { className: "flex w-full flex-row items-start justify-between gap-6", children: [
       /* @__PURE__ */ e("div", { className: "flex h-full grow flex-col items-start justify-between gap-2 pb-2", children: [
         /* @__PURE__ */ e("h3", { className: "line-clamp-2 h-auto text-sm font-normal md:h-12 md:text-base", children: [
@@ -110,8 +111,8 @@ function h({
           "h4",
           {
             className: "line-clamp-2 max-h-[56px] w-full break-keep rounded bg-grey-100 px-2 py-1 text-[13px] font-semibold text-grey-600 md:text-[15px] md:text-grey-800",
-            title: l,
-            children: l
+            title: i,
+            children: i
           }
         )
       ] }),
@@ -140,5 +141,5 @@ function w() {
   ] });
 }
 export {
-  ir as P
+  lr as P
 };

package/dist/premium-card-Dk-pTOyb.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("react/jsx-runtime"),x=require("./index-B8SY6s5B.cjs");require("./ui/accordion.cjs.js");require("./ui/alert-dialog.cjs.js");const d=require("./common-Ds1lanOg.cjs");require("@radix-ui/react-aspect-ratio");require("./ui/avatar.cjs.js");require("./ui/badge.cjs.js");require("./ui/button.cjs.js");require("./ui/calendar.cjs.js");require("./ui/callout.cjs.js");require("./ui/card.cjs.js");require("./ui/checkbox.cjs.js");require("lucide-react");require("./ui/command.cjs.js");require("./ui/dialog.cjs.js");require("./ui/dropdown-menu.cjs.js");require("./ui/file-uploader.cjs.js");require("./ui/form.cjs.js");require("./ui/input.cjs.js");require("./ui/label.cjs.js");require("./ui/month-picker.cjs.js");require("./ui/multi-select.cjs.js");require("./ui/navigation-menu.cjs.js");require("./ui/popover.cjs.js");require("./ui/radio-group.cjs.js");require("./ui/scroll-area.cjs.js");require("./ui/select.cjs.js");require("./ui/separator.cjs.js");const s=require("./ui/skeleton.cjs.js");require("@radix-ui/react-slider");require("react");require("./ui/switch.cjs.js");require("./ui/tabs.cjs.js");const p=require("./ui/tag.cjs.js");require("./ui/text.cjs.js");require("./ui/textarea.cjs.js");require("./ui/toast.cjs.js");require("./ui/toggle.cjs.js");require("./ui/toggle-group.cjs.js");require("./ui/tooltip.cjs.js");function h({logo:u,title:t,subtitle:i,thumbnail:a,batchTitle:l,batchName:n="",brandName:c,tag:m,isLoading:r=!1,className:o}){const q=r?s.Skeleton:"div";return e.jsxs(q,{title:t,type:"background",className:d.cn("relative z-10 box-border h-[154px] w-full max-w-[720px] cursor-pointer overflow-hidden rounded-xl bg-white p-4 xs:h-full md:h-[174px] md:max-w-[592px] md:p-5 lg:h-[174px] lg:p-6 xl:h-[174px]",r?"":"border border-grey-200",o),children:[e.jsx(p.Tag,{size:"ad",variant:"ad",style:{background:x.adProducts.premiumCard.background,color:x.adProducts.premiumCard.color},className:d.cn("rounded-bl-xl",r&&"h-7 w-28 animate-pulse"),children:r?"":m}),r?e.jsx(j,{}):e.jsx(f,{logo:u,brandName:c,batchTitle:l,batchName:n,subtitle:i,thumbnail:a})]})}function f({logo:u,brandName:t,batchTitle:i,batchName:a,subtitle:l,thumbnail:n}){return e.jsxs("div",{className:"flex h-full flex-col items-start justify-start gap-2",children:[e.jsx("img",{src:u,alt:`${t} 로고`,className:"h-4 object-contain",loading:"lazy"}),e.jsxs("div",{className:"flex w-full flex-row items-start justify-between gap-6",children:[e.jsxs("div",{className:"flex h-full grow flex-col items-start justify-between gap-2 pb-2",children:[e.jsxs("h3",{className:"line-clamp-2 h-auto text-sm font-normal md:h-12 md:text-base",children:[i," ",a]}),e.jsx("h4",{className:"line-clamp-2 max-h-[56px] w-full break-keep rounded bg-grey-100 px-2 py-1 text-[13px] font-semibold text-grey-600 md:text-[15px] md:text-grey-800",title:l,children:l})]}),e.jsx("img",{src:n,alt:`${i} 썸네일`,className:"h-[86px] w-[86px] shrink-0 grow-0 rounded-xl border border-grey-200 object-cover md:h-[96px] md:w-[96px]",loading:"lazy"})]})]})}function j(){return e.jsxs("div",{className:"flex h-full flex-col items-start justify-center gap-2",children:[e.jsx(s.Skeleton,{className:"h-4 w-1/2"}),e.jsxs("div",{className:"flex w-full items-start justify-between gap-6",children:[e.jsxs("div",{className:"flex h-full w-full flex-col items-start justify-between gap-2 pb-2",children:[e.jsx(s.Skeleton,{className:"h-5 w-4/5 lg:h-12"}),e.jsx(s.Skeleton,{className:"h-5 w-4/5"})]}),e.jsx(s.Skeleton,{className:"h-[86px] w-[86px] shrink-0 grow-0 rounded-xl md:h-[96px] md:w-[96px]"})]})]})}exports.PremiumCard=h;