boottent-design 0.1.271 → 0.1.273

package/dist/{lecturer-card-DaAD77e-.js → lecturer-card-h44ZjbBL.js}

@@ -1,6 +1,6 @@
 import { jsxs as o, jsx as e } from "react/jsx-runtime";
-import { useRef as O, useState as l, useLayoutEffect as R } from "react";
-import { useReducedMotion as $, motion as k } from "framer-motion";
+import { useRef as k, useState as l, useLayoutEffect as O } from "react";
+import { useReducedMotion as R, motion as $ } from "framer-motion";
 import { c as h } from "./common-zQ5XY0UN.js";
 import "./ui/accordion.es.js";
 import "./ui/alert-dialog.es.js";
@@ -48,26 +48,26 @@ function Le({
   lecturer: i,
   roleLabel: x,
   description: c,
-  numberOfLecturers: N,
-  imagePriority: v,
-  imageLoading: w,
+  numberOfLecturers: w,
+  imagePriority: N,
+  imageLoading: v,
   imageFetchPriority: y,
   imageDecoding: A
 }) {
-  const d = `${n}-name`, p = `${n}-srdesc`, u = `${n}-content`, f = O(null), [r, C] = l(!1), [a, I] = l(!1), [L, H] = l(m), T = $();
-  R(() => {
-    const t = f.current;
-    if (!t) return;
+  const d = `${n}-name`, p = `${n}-srdesc`, u = `${n}-content`, f = k(null), [t, C] = l(!1), [a, I] = l(!1), [L, H] = l(m), T = R();
+  O(() => {
+    const r = f.current;
+    if (!r) return;
     const s = () => {
-      H(t.scrollHeight), I(t.scrollHeight > m + 1);
+      H(r.scrollHeight), I(r.scrollHeight > m + 1);
     };
     s();
     const g = new ResizeObserver(s);
-    return g.observe(t), () => g.disconnect();
+    return g.observe(r), () => g.disconnect();
   }, [c]);
   const j = E({
-    imagePriority: v,
-    imageLoading: w,
+    imagePriority: N,
+    imageLoading: v,
     imageFetchPriority: y,
     imageDecoding: A
   });
@@ -77,7 +77,7 @@ function Le({
       "aria-labelledby": d,
       className: h(
         "bt-ds-surface bt-ds-radius-10 flex h-full w-full items-start gap-5 rounded-[10px] border border-grey-200 bg-background px-[30px] py-5",
-        N === 1 && "col-span-2"
+        w === 1 && "col-span-2"
       ),
       children: [
         /* @__PURE__ */ e("div", { className: "shrink-0", children: i.imageUrl ? /* @__PURE__ */ e("div", { className: "bt-ds-surface bt-ds-radius-full relative flex aspect-square w-[60px] items-center justify-center overflow-hidden rounded-full border border-grey-200", children: /* @__PURE__ */ e(
@@ -96,19 +96,19 @@ function Le({
             children: /* @__PURE__ */ e(b.Profile, { size: "32", fill: "#A2A3A4", "aria-hidden": "true" })
           }
         ) }),
-        /* @__PURE__ */ o("div", { className: "flex w-full flex-col gap-2 text-regular14 text-grey-800", children: [
+        /* @__PURE__ */ o("div", { className: "flex w-full min-w-0 flex-col gap-2 text-regular14 text-grey-800", children: [
           /* @__PURE__ */ o("header", { className: "flex items-center gap-2 text-semibold16", children: [
             /* @__PURE__ */ e("span", { id: d, children: i.lecturerName }),
             /* @__PURE__ */ e(z, { variant: "solid-secondary-100", size: "sm", className: "px-1 py-0.5", children: x })
           ] }),
           /* @__PURE__ */ e("span", { className: "sr-only", id: p, children: "강사 소개를 목록으로 안내한다." }),
           /* @__PURE__ */ o(
-            k.div,
+            $.div,
             {
               initial: !1,
-              animate: { height: a ? r ? L : m : "auto" },
+              animate: { height: a ? t ? L : m : "auto" },
               transition: { duration: T ? 0 : 0.35, ease: [0.4, 0, 0.2, 1] },
-              className: "relative overflow-hidden",
+              className: "relative min-w-0 overflow-hidden",
               children: [
                 /* @__PURE__ */ e(
                   "ul",
@@ -116,12 +116,12 @@ function Le({
                     ref: f,
                     id: u,
                     "aria-describedby": p,
-                    "aria-expanded": a ? r : void 0,
-                    className: "flex w-full flex-col whitespace-pre-wrap break-keep text-grey-600",
-                    children: c.map((t, s) => /* @__PURE__ */ e("li", { children: t }, s))
+                    "aria-expanded": a ? t : void 0,
+                    className: "flex w-full min-w-0 flex-col whitespace-pre-wrap break-words break-keep text-grey-600",
+                    children: c.map((r, s) => /* @__PURE__ */ e("li", { children: r }, s))
                   }
                 ),
-                a && !r && /* @__PURE__ */ e(
+                a && !t && /* @__PURE__ */ e(
                   "span",
                   {
                     "aria-hidden": "true",
@@ -135,19 +135,19 @@ function Le({
             "button",
             {
               type: "button",
-              onClick: () => C((t) => !t),
-              "aria-expanded": r,
+              onClick: () => C((r) => !r),
+              "aria-expanded": t,
               "aria-controls": u,
               className: "flex items-center gap-0.5 self-end text-main-600",
               children: [
-                r ? "정보 숨기기" : "정보 더보기",
+                t ? "정보 숨기기" : "정보 더보기",
                 /* @__PURE__ */ e(
                   b.ArrowDown2,
                   {
                     size: "16",
                     fill: "currentColor",
                     "aria-hidden": "true",
-                    className: h("shrink-0 transition-transform duration-200", r && "rotate-180")
+                    className: h("shrink-0 transition-transform duration-200", t && "rotate-180")
                   }
                 )
               ]

package/dist/question-card-C2xeKRcv.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("react/jsx-runtime"),x=require("react"),u=require("class-variance-authority"),m=require("./common-DeneXo5X.cjs");function p(r){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(a,t,n.get?n:{enumerable:!0,get:()=>r[t]})}}return a.default=r,Object.freeze(a)}const g=p(x),h=u.cva("group flex h-full w-full flex-col gap-2.5 rounded-lg transition-colors hover:bg-grey-50"),d=g.forwardRef(function({question:a,className:t},n){const{categoryTags:c=[],answerPreviews:i=[],answerCount:o=0}=a;return e.jsxs("div",{ref:n,className:m.cn(h(),t),children:[c.length>0&&e.jsx("ul",{className:"flex flex-wrap items-center gap-1.5",children:c.map((s,l)=>e.jsx("li",{children:e.jsx("span",{className:"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-2 py-1 text-xs",style:{color:s.color,backgroundColor:s.background},children:s.text})},l))}),e.jsxs("p",{className:"flex gap-1.5 text-semibold15 text-grey-800 transition-colors group-hover:text-main-700 md:text-semibold16",children:[e.jsx("span",{className:"shrink-0 font-bold text-main-600",children:"Q."}),e.jsx("span",{className:"line-clamp-2",children:a.question})]}),i.length>0&&e.jsxs(e.Fragment,{children:[e.jsx("hr",{className:"border-grey-100"}),e.jsx("ul",{className:"flex flex-col gap-2",children:i.map((s,l)=>e.jsxs("li",{className:"flex items-start gap-2 overflow-hidden",children:[s.profileImage?e.jsx("img",{src:s.profileImage,alt:s.name||"답변자",width:24,height:24,className:"mt-0.5 aspect-square w-6 shrink-0 rounded-full object-cover"}):e.jsx("span",{className:"mt-1 shrink-0 text-grey-400","aria-hidden":"true",children:"↳"}),e.jsxs("div",{className:"flex min-w-0 flex-col",children:[e.jsxs("span",{className:"flex items-center gap-1.5 text-regular12",children:[s.name&&e.jsx("span",{className:"font-medium text-grey-700",children:s.name}),s.job&&e.jsx("span",{className:"rounded bg-grey-100 px-1.5 py-0.5 text-regular12 text-grey-600",children:s.job})]}),e.jsx("span",{className:"truncate text-regular13 text-grey-500",children:s.answer})]})]},l))})]}),o>0&&e.jsxs("div",{className:"mt-auto flex items-center justify-between pt-0.5 text-regular13 text-grey-500",children:[e.jsxs("span",{children:["답변 ",o,"개"]}),e.jsx("span",{className:"text-grey-400 transition-transform group-hover:translate-x-0.5","aria-hidden":"true",children:"→"})]})]})});d.displayName="QuestionCard";exports.QuestionCard=d;

package/dist/question-card-DzMummZs.js

@@ -0,0 +1,57 @@
+import { jsxs as a, jsx as e, Fragment as d } from "react/jsx-runtime";
+import * as m from "react";
+import { cva as p } from "class-variance-authority";
+import { c as x } from "./common-zQ5XY0UN.js";
+const h = p(
+  "group flex h-full w-full flex-col gap-2.5 rounded-lg transition-colors hover:bg-grey-50"
+), g = m.forwardRef(function({ question: l, className: i }, o) {
+  const { categoryTags: t = [], answerPreviews: n = [], answerCount: c = 0 } = l;
+  return /* @__PURE__ */ a("div", { ref: o, className: x(h(), i), children: [
+    t.length > 0 && /* @__PURE__ */ e("ul", { className: "flex flex-wrap items-center gap-1.5", children: t.map((r, s) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
+      "span",
+      {
+        className: "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-2 py-1 text-xs",
+        style: { color: r.color, backgroundColor: r.background },
+        children: r.text
+      }
+    ) }, s)) }),
+    /* @__PURE__ */ a("p", { className: "flex gap-1.5 text-semibold15 text-grey-800 transition-colors group-hover:text-main-700 md:text-semibold16", children: [
+      /* @__PURE__ */ e("span", { className: "shrink-0 font-bold text-main-600", children: "Q." }),
+      /* @__PURE__ */ e("span", { className: "line-clamp-2", children: l.question })
+    ] }),
+    n.length > 0 && /* @__PURE__ */ a(d, { children: [
+      /* @__PURE__ */ e("hr", { className: "border-grey-100" }),
+      /* @__PURE__ */ e("ul", { className: "flex flex-col gap-2", children: n.map((r, s) => /* @__PURE__ */ a("li", { className: "flex items-start gap-2 overflow-hidden", children: [
+        r.profileImage ? /* @__PURE__ */ e(
+          "img",
+          {
+            src: r.profileImage,
+            alt: r.name || "답변자",
+            width: 24,
+            height: 24,
+            className: "mt-0.5 aspect-square w-6 shrink-0 rounded-full object-cover"
+          }
+        ) : /* @__PURE__ */ e("span", { className: "mt-1 shrink-0 text-grey-400", "aria-hidden": "true", children: "↳" }),
+        /* @__PURE__ */ a("div", { className: "flex min-w-0 flex-col", children: [
+          /* @__PURE__ */ a("span", { className: "flex items-center gap-1.5 text-regular12", children: [
+            r.name && /* @__PURE__ */ e("span", { className: "font-medium text-grey-700", children: r.name }),
+            r.job && /* @__PURE__ */ e("span", { className: "rounded bg-grey-100 px-1.5 py-0.5 text-regular12 text-grey-600", children: r.job })
+          ] }),
+          /* @__PURE__ */ e("span", { className: "truncate text-regular13 text-grey-500", children: r.answer })
+        ] })
+      ] }, s)) })
+    ] }),
+    c > 0 && /* @__PURE__ */ a("div", { className: "mt-auto flex items-center justify-between pt-0.5 text-regular13 text-grey-500", children: [
+      /* @__PURE__ */ a("span", { children: [
+        "답변 ",
+        c,
+        "개"
+      ] }),
+      /* @__PURE__ */ e("span", { className: "text-grey-400 transition-transform group-hover:translate-x-0.5", "aria-hidden": "true", children: "→" })
+    ] })
+  ] });
+});
+g.displayName = "QuestionCard";
+export {
+  g as Q
+};

package/dist/story-preview-card-BiknUNLs.js

@@ -0,0 +1,92 @@
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import * as p from "react";
+import { cva as h } from "class-variance-authority";
+import { c as x } from "./common-zQ5XY0UN.js";
+const v = h(
+  "mx-auto flex w-[270px] flex-col items-start gap-2 overflow-hidden rounded-xl text-grey-800 transition-colors"
+), w = p.forwardRef(function({ card: g, horizontalOnMobile: s = !1, className: u }, f) {
+  const { userName: t, major: i, age: d, totalDuration: c, preview: a, imageUrl: n, imageAlt: o, jobTag: l } = g, m = l ? /* @__PURE__ */ e(
+    "span",
+    {
+      className: "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-2 py-0.5 text-xs",
+      style: { color: l.color, backgroundColor: l.background },
+      children: l.text
+    }
+  ) : null;
+  return /* @__PURE__ */ r("div", { ref: f, className: x("w-full", u), children: [
+    s && /* @__PURE__ */ r(
+      "div",
+      {
+        "data-testid": "story-preview-card-horizontal",
+        className: "flex w-full flex-row gap-3 rounded-xl text-grey-800 transition-colors xs:hidden",
+        children: [
+          /* @__PURE__ */ e(
+            "img",
+            {
+              src: n,
+              alt: o ?? t,
+              className: "aspect-square w-24 shrink-0 rounded-lg object-cover"
+            }
+          ),
+          /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
+            /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-col items-start gap-1.5", children: [
+              /* @__PURE__ */ e("p", { className: "truncate text-semibold14 text-grey-800", children: t }),
+              m
+            ] }),
+            /* @__PURE__ */ r("p", { className: "text-regular13 text-grey-500", children: [
+              /* @__PURE__ */ e("span", { className: "text-grey-700", children: i }),
+              ` · ${d}세 · ${c}`
+            ] }),
+            /* @__PURE__ */ e("p", { className: "line-clamp-2 text-regular13 text-grey-600", children: a })
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ r(
+      "div",
+      {
+        "data-testid": "story-preview-card-vertical",
+        className: x(v(), s && "hidden xs:flex"),
+        children: [
+          /* @__PURE__ */ r("div", { className: "mb-1 flex w-full flex-row items-center justify-start gap-3", children: [
+            /* @__PURE__ */ e(
+              "img",
+              {
+                src: n,
+                alt: o ?? t,
+                className: "aspect-square w-12 shrink-0 rounded-lg object-cover md:w-14"
+              }
+            ),
+            /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-col items-start gap-1.5", children: [
+              /* @__PURE__ */ e("p", { className: "truncate text-semibold14 text-grey-800 md:text-semibold15", children: t }),
+              m
+            ] })
+          ] }),
+          /* @__PURE__ */ r("div", { className: "grid h-fit w-full shrink-0 grid-cols-[56px_1fr] gap-x-3 gap-y-1.5 overflow-hidden rounded-lg bg-grey-100 p-3 text-regular13 text-grey-500 md:text-regular14", children: [
+            /* @__PURE__ */ e("div", { children: "전공" }),
+            /* @__PURE__ */ e("div", { className: "w-full truncate text-medium14 text-grey-800", children: i }),
+            /* @__PURE__ */ e("div", { children: "취업나이" }),
+            /* @__PURE__ */ r("div", { className: "text-medium14 text-grey-800", children: [
+              d,
+              "세"
+            ] }),
+            /* @__PURE__ */ e("div", { children: "취준기간" }),
+            /* @__PURE__ */ e("div", { className: "truncate text-medium14 text-grey-800", children: c })
+          ] }),
+          /* @__PURE__ */ e(
+            "div",
+            {
+              className: "h-full w-full rounded-lg bg-grey-100 p-3 text-regular13 text-grey-600 md:p-4 md:text-regular14",
+              title: a,
+              children: /* @__PURE__ */ e("span", { className: "line-clamp-4 w-full", children: a })
+            }
+          )
+        ]
+      }
+    )
+  ] });
+});
+w.displayName = "StoryPreviewCard";
+export {
+  w as S
+};

package/dist/story-preview-card-vNGsyl3L.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("react/jsx-runtime"),j=require("react"),h=require("class-variance-authority"),g=require("./common-DeneXo5X.cjs");function y(r){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const l=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(s,t,l.get?l:{enumerable:!0,get:()=>r[t]})}}return s.default=r,Object.freeze(s)}const v=y(j),w=h.cva("mx-auto flex w-[270px] flex-col items-start gap-2 overflow-hidden rounded-xl text-grey-800 transition-colors"),f=v.forwardRef(function({card:s,horizontalOnMobile:t=!1,className:l},p){const{userName:a,major:n,age:d,totalDuration:o,preview:c,imageUrl:x,imageAlt:m,jobTag:i}=s,u=i?e.jsx("span",{className:"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-2 py-0.5 text-xs",style:{color:i.color,backgroundColor:i.background},children:i.text}):null;return e.jsxs("div",{ref:p,className:g.cn("w-full",l),children:[t&&e.jsxs("div",{"data-testid":"story-preview-card-horizontal",className:"flex w-full flex-row gap-3 rounded-xl text-grey-800 transition-colors xs:hidden",children:[e.jsx("img",{src:x,alt:m??a,className:"aspect-square w-24 shrink-0 rounded-lg object-cover"}),e.jsxs("div",{className:"flex min-w-0 flex-1 flex-col gap-1.5",children:[e.jsxs("div",{className:"flex min-w-0 flex-col items-start gap-1.5",children:[e.jsx("p",{className:"truncate text-semibold14 text-grey-800",children:a}),u]}),e.jsxs("p",{className:"text-regular13 text-grey-500",children:[e.jsx("span",{className:"text-grey-700",children:n}),` · ${d}세 · ${o}`]}),e.jsx("p",{className:"line-clamp-2 text-regular13 text-grey-600",children:c})]})]}),e.jsxs("div",{"data-testid":"story-preview-card-vertical",className:g.cn(w(),t&&"hidden xs:flex"),children:[e.jsxs("div",{className:"mb-1 flex w-full flex-row items-center justify-start gap-3",children:[e.jsx("img",{src:x,alt:m??a,className:"aspect-square w-12 shrink-0 rounded-lg object-cover md:w-14"}),e.jsxs("div",{className:"flex min-w-0 flex-col items-start gap-1.5",children:[e.jsx("p",{className:"truncate text-semibold14 text-grey-800 md:text-semibold15",children:a}),u]})]}),e.jsxs("div",{className:"grid h-fit w-full shrink-0 grid-cols-[56px_1fr] gap-x-3 gap-y-1.5 overflow-hidden rounded-lg bg-grey-100 p-3 text-regular13 text-grey-500 md:text-regular14",children:[e.jsx("div",{children:"전공"}),e.jsx("div",{className:"w-full truncate text-medium14 text-grey-800",children:n}),e.jsx("div",{children:"취업나이"}),e.jsxs("div",{className:"text-medium14 text-grey-800",children:[d,"세"]}),e.jsx("div",{children:"취준기간"}),e.jsx("div",{className:"truncate text-medium14 text-grey-800",children:o})]}),e.jsx("div",{className:"h-full w-full rounded-lg bg-grey-100 p-3 text-regular13 text-grey-600 md:p-4 md:text-regular14",title:c,children:e.jsx("span",{className:"line-clamp-4 w-full",children:c})})]})]})});f.displayName="StoryPreviewCard";exports.StoryPreviewCard=f;