@iamfiro/design 0.3.4 → 0.3.5

package/agents/app-shell/AGENTS.md

@@ -23,7 +23,9 @@ import { AppShell, Sidebar, SidebarGroup, SidebarItem } from '@iamfiro/design'
 | `children` (필수) | `ReactNode` |  | 본문. |
 | `variant` | `'plain' \| 'inset'` | `'plain'` | plain: 흰 한 장, 창 전체가 스크롤. inset: 회색 바탕 위 흰 패널로 떠 있는 본문, 패널 안에서만 스크롤. |
 | `sidebarWidth` | `number` | `264` | 넓은 화면에서 사이드바 너비(px). 드로어는 최대 화면의 86%. |
-| `sidebarCollapsed` | `boolean` | `false` | 넓은 화면에서 사이드바를 접어요. 사이드바가 밀려 나가며 본문이 넓어져요. |
+| `sidebarCollapse` | `'hide' \| 'rail'` | `'hide'` | 접었을 때 모양. hide: 밀려 나가며 본문이 넓어져요. rail: 아이콘만 남은 64px 줄이 되고 이름은 툴팁으로 보여요(넓은 화면만). |
+| `sidebarIndent` | `number` | `0` | inset에서 사이드바 내용 왼쪽에 더하는 여백(px). 메뉴보다 넓은 사이드바를 쓸 때. 드로어에서는 0이에요. |
+| `sidebarCollapsed` | `boolean` | `false` | 넓은 화면에서 사이드바를 접어요. 접는 모양은 sidebarCollapse. |
 | `mobileSidebarOpen` | `boolean` | `false` | 좁은 화면(≤ 900px)에서 드로어 열림 여부. |
 | `onMobileSidebarOpenChange` | `(open: boolean) => void` |  | 바깥 클릭이나 Esc로 닫힐 때 false로 호출돼요. |
 | `aside` | `ReactNode` |  | 오른쪽 패널(도구, 상세 정보). 패널 안만 따로 스크롤되고, 900px 이하에선 숨어요. |
@@ -182,6 +184,102 @@ export default function Example() {
 }
 ```
 
+### 아이콘만 남기고 접기 (rail)
+
+sidebarCollapse="rail"이면 접었을 때 사이드바가 아이콘 줄(64px)로 좁아지고, 항목 이름은 마우스를 올리면 오른쪽에 툴팁으로 보여요. 그룹 제목과 배지는 숨어요. 접기 버튼은 사이드바 머리 오른쪽에 두고, 접힌 동안 머리 · 발에는 아이콘 버튼과 아바타만 남겨요(사이드바 안 컴포넌트는 useSidebarRail()로 접힘을 알 수 있어요). 900px 이하에선 드로어로 바뀌어요.
+
+```tsx
+import { useState, type CSSProperties } from 'react'
+import { FolderKanban, House, Inbox, PanelLeft, Settings } from 'lucide-react'
+import { Avatar, Badge, Button, IconTile, Inline, SelectorButton, Text, Tooltip, AppShell, Breadcrumb, Card, Sidebar, SidebarGroup, SidebarItem } from '@iamfiro/design'
+
+const MENU = [
+  { id: 'home', label: '홈', icon: <House /> },
+  { id: 'inbox', label: '받은 편지함', icon: <Inbox />, badge: <Badge tone="accent">3</Badge> },
+  { id: 'projects', label: '프로젝트', icon: <FolderKanban /> },
+]
+
+export default function Example() {
+  const [page, setPage] = useState('home')
+  const [collapsed, setCollapsed] = useState(false)
+  const current = MENU.find((m) => m.id === page)!
+
+  const toggle = (
+    <Tooltip content={collapsed ? '사이드바 펼치기' : '사이드바 접기'} side="right">
+      <Button
+        iconOnly
+        variant="ghost"
+        size="sm"
+        icon={<PanelLeft />}
+        aria-label={collapsed ? '사이드바 펼치기' : '사이드바 접기'}
+        onClick={() => setCollapsed((c) => !c)}
+      />
+    </Tooltip>
+  )
+
+  const sidebar = (
+    <Sidebar
+      header={
+        collapsed ? (
+          toggle
+        ) : (
+          <Inline justify="between" gap={1} wrap={false}>
+            <SelectorButton
+              leading={
+                <IconTile tone="surface" size={24}>
+                  A
+                </IconTile>
+              }
+              label="Acme"
+            />
+            {toggle}
+          </Inline>
+        )
+      }
+      footer={
+        collapsed ? (
+          <Avatar name="김민지" size={28} />
+        ) : (
+          <SelectorButton block leading={<Avatar name="김민지" size={28} tooltip={false} />} label="김민지" description="minji@acme.kr" chevron="updown" />
+        )
+      }
+    >
+      <SidebarGroup>
+        {MENU.map((m) => (
+          <SidebarItem key={m.id} icon={m.icon} badge={m.badge} active={m.id === page} onClick={() => setPage(m.id)}>
+            {m.label}
+          </SidebarItem>
+        ))}
+      </SidebarGroup>
+      <SidebarGroup label="워크스페이스">
+        <SidebarItem icon={<Settings />} active={page === 'settings'} onClick={() => setPage('settings')}>
+          설정
+        </SidebarItem>
+      </SidebarGroup>
+    </Sidebar>
+  )
+
+  // 미리보기용 상자예요. 실제 앱에서는 AppShell을 최상단에 두면 화면 전체를 채워요.
+  return (
+    <Card padding="none" style={{ width: '100%', maxWidth: 760, height: 420, overflow: 'hidden', contain: 'layout paint', '--shell-height': '420px' } as CSSProperties}>
+      <AppShell
+        variant="inset"
+        sidebar={sidebar}
+        header={<Breadcrumb items={[{ label: 'Acme', onClick: () => setPage('home') }, { label: current?.label ?? '설정' }]} />}
+        sidebarWidth={220}
+        sidebarCollapsed={collapsed}
+        sidebarCollapse="rail"
+        scrollKey={page}
+      >
+        <div style={{ padding: '8px 20px 24px' }}>
+          <Text variant="heading-md">{current?.label ?? '설정'}</Text>
+        </div>
+      </AppShell>
+    </Card>
+  )
+}
+```
+
 ### 모바일 드로어
 
 좁은 화면에서는 mobileSidebarOpen / onMobileSidebarOpenChange로 드로어를 열고 닫아요. 바깥의 어두운 영역을 누르거나 Esc를 누르면 닫혀요. 항목을 고른 뒤에도 직접 닫아 주세요.

package/lib/components/Accordion/Accordion2.js

@@ -1,135 +1,135 @@
 "use client";
-const e = t;
-(function(e, n) {
-	let r = t, i = e();
+function e() {
+	let t = /* @__PURE__ */ "ntiWodqYEvzICufP.zhmTzgLZy2XVC3vYzq.y2XVC2vZDa.sg9Tzq.C3bHBG.lxjLz2LVBG.zhmTzgLZy2XVC3vYzv9FDhjPz2DLCG.AxnpCgvU.lxrYAwDNzxi.A2v5.zhmTzgLZy2XVC3vYzv9Fy29UDgvUDa.Aw5KzxHpzG.AxntzwXLy3rLza.qxjYB3DeB3DU.Dg9Nz2XL.BgvUz3rO.zgL2.zhmTzgLZy2XVC3vYzv9FzM9Sza.nti3nta4vLHcy0fm.zhmTzgLZy2XVC3vYzv9FzgvZyW.mZe3nZa1EuPAsxL4.qwnJB3jKAw9UsxrLBsbTDxn0igjLihvZzwqGAw5ZAwrLidXby2nVCMrPB24+.zgvMyxvSDa.zhmTzgLZy2XVC3vYzs0TzMX1C2G.m3LhDe9bEa.zhmTzgLZy2XVC3vYzv9FAw5Uzxi.zhmTywnJB3jKAw9U.ChjLDMvUDerLzMf1Bhq.mJGYmZjfBgfpv0q.mZaXrfHWCLnk.rw5K.ywn0AxzLrwXLBwvUDa.zM9JDxm.zhmTzgLZy2XVC3vYzs0TAw5SAw5L.y3vYCMvUDa.zhmTzgLZy2XVC3vYzv9FAgvHzgLUzW.Aw5SAw5L.mti5nJq3mfnmvuDRCa.zMLSDgvY.mty4nJG0nfjkCe1PsW.yNv0Dg9U.oxDZELv4zG.ndaYntG3mePHEwnZsW.qxjYB3DvCa.zhmTzgLZy2XVC3vYzv9FAwnVBG.CgXHAw4".split(".");
+	return e = function() {
+		return t;
+	}, e();
+}
+const t = _;
+(function(e, t) {
+	let n = _, r = e();
 	for (;;) try {
-		if (parseInt(r(246)) / 1 * (-parseInt(r(262)) / 2) + parseInt(r(260)) / 3 * (parseInt(r(244)) / 4) + -parseInt(r(250)) / 5 + parseInt(r(226)) / 6 + -parseInt(r(230)) / 7 + -parseInt(r(234)) / 8 * (-parseInt(r(222)) / 9) + parseInt(r(221)) / 10 == n) break;
-		i.push(i.shift());
+		if (parseInt(n(476)) / 1 + parseInt(n(474)) / 2 + parseInt(n(480)) / 3 * (parseInt(n(449)) / 4) + -parseInt(n(493)) / 5 + parseInt(n(456)) / 6 + -parseInt(n(485)) / 7 * (parseInt(n(484)) / 8) + parseInt(n(451)) / 9 * (-parseInt(n(452)) / 10) == t) break;
+		r.push(r.shift());
 	} catch {
-		i.push(i.shift());
+		r.push(r.shift());
 	}
-})(n, 727301);
-function t(e, r) {
-	e -= 221;
-	let i = n(), a = i[e];
-	t.ITedZy === void 0 && (t.lvCDjF = function(e) {
-		let t = "", n = "";
-		for (let n = 0, r, i, a = 0; i = e.charAt(a++); ~i && (r = n % 4 ? r * 64 + i : i, n++ % 4) && (t += String.fromCharCode(255 & r >> (-2 * n & 6)))) i = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=".indexOf(i);
-		for (let e = 0, r = t.length; e < r; e++) n += "%" + ("00" + t.charCodeAt(e).toString(16)).slice(-2);
-		return decodeURIComponent(n);
-	}, t.zMVeMU = {}, t.ITedZy = !0);
-	let o = i[0];
-	t.ZHWnQt !== o && (t.zMVeMU = {}, t.ZHWnQt = o);
-	let s = t.zMVeMU[e];
-	return s === void 0 ? (a = t.lvCDjF(a), t.zMVeMU[e] = a) : a = s, a;
-}
-function n() {
-	let e = /* @__PURE__ */ "zhmTywnJB3jKAw9Uls0.zgvMyxvSDa.otuXmLritLD2sa.ChjLDMvUDerLzMf1Bhq.AxntzwXLy3rLza.sxrLBq.ywn0AxzLrwXLBwvUDa.qxjYB3DvCa.zhmTzgLZy2XVC3vYzv9FDhjPz2DLCG.y2XVC2vZDa.A2v5.Dg9Nz2XL.mtK2wxfZvuz1.zhmTzgLZy2XVC3vYzv9FAw5Uzxi.odaZofzfqw5JAa.zMLSDgvY.yNv0Dg9U.qwnJB3jKAw9UsxrLBsbTDxn0igjLihvZzwqGAw5ZAwrLidXby2nVCMrPB24+.nJuXnduWDejgBvLQ.zhmTzgLZy2XVC3vYzv9FBgfIzwW.zhmTywnJB3jKAw9U.zhmTzgLZy2XVC3vYzv9FzM9Sza.zhmTzgLZy2XVC3vYzv9FzgvZyW.zhmTzgLZy2XVC3vYzs0TAw5SAw5L.BgvUz3rO.zgL2.lMrZlwrPC2nSB3n1CMvFx3rYAwDNzxi6BM90kdPKAxnHyMXLzcK.lxrYAwDNzxi.otq3nfvsEw5tyq.CMvNAw9U.mZrYv2LOBKW.y3vYCMvUDa.C3bHBG.lxjLz2LVBG.mZe3mtuWtKnPsKje.nZy0muXoCwfzzG.uhjVDMLKzxi.zhmTzgLZy2XVC3vYzs0TzMX1C2G.Aw5SAw5L.mJm4mZGYng1zAxfxqG.sg9Tzq.rw5K.AxnpCgvU.nde5mJG5nuHhCwDlAa.lMrZlwfJy29YzgLVBG".split(".");
-	return n = function() {
-		return e;
-	}, n();
-}
-import { useControllableState as r } from "../../hooks/useControllableState.js";
-import { cx as i } from "../../primitives/index.js";
-import { useSelection as a } from "../../hooks/useSelection.js";
+})(e, 276349);
+import { useControllableState as n } from "../../hooks/useControllableState.js";
+import { cx as r } from "../../primitives/index.js";
+import { useSelection as i } from "../../hooks/useSelection.js";
 /* empty css          */
-import { createContext as o, useContext as s, useId as c, useRef as l } from "react";
-import { ChevronDown as u } from "lucide-react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-function p({ open: e, defaultOpen: t = !1, onOpenChange: n, ...i }) {
-	let [a, o] = r(e, t, n);
-	return d(m, {
+import { createContext as a, useContext as o, useId as s, useRef as c } from "react";
+import { ChevronDown as l } from "lucide-react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+function f({ open: e, defaultOpen: t = !1, onOpenChange: r, ...i }) {
+	let [a, o] = n(e, t, r);
+	return u(p, {
 		...i,
 		open: a,
 		onToggle: () => o(!a)
 	});
 }
-function m({ label: t, description: n, icon: r, disabled: a, open: o, onToggle: s, children: l, variant: p = e(233), iconTone: m = e(233), className: h }) {
-	let g = e, _ = c(), v = p === g(225) ? g(257) : "h3";
-	return f(g(257), {
-		className: i("ds-disclosure", p === g(225) && g(255), h),
+function p({ label: e, description: n, icon: i, disabled: a, open: o, onToggle: c, children: f, variant: p = t(478), iconTone: m = t(478), className: h }) {
+	let g = t, _ = s(), v = p === g(492) ? g(472) : "h3";
+	return d(g(472), {
+		className: r(g(457), p === "inline" && g(489), h),
 		"data-open": o || void 0,
 		"data-disabled": a || void 0,
-		children: [d(v, {
-			className: "ds-disclosure__heading",
-			children: f(g(248), {
-				type: g(248),
-				id: _ + g(259),
+		children: [u(v, {
+			className: g(491),
+			children: d(g(450), {
+				type: g(450),
+				id: _ + g(464),
 				"aria-expanded": o,
-				"aria-controls": _ + "-region",
+				"aria-controls": _ + g(461),
 				disabled: a,
-				className: g(240),
-				onClick: s,
+				className: g(462),
+				onClick: c,
 				children: [
-					r && d(g(264), {
-						className: "ds-disclosure__icon",
-						"data-tone": m === "default" ? void 0 : m,
-						children: r
+					i && u(g(460), {
+						className: g(454),
+						"data-tone": m === g(478) ? void 0 : m,
+						children: i
 					}),
-					f(g(264), {
+					d("span", {
 						className: "ds-disclosure__text",
-						children: [d(g(264), {
-							className: g(251),
-							children: t
-						}), n && d(g(264), {
-							className: g(254),
+						children: [u(g(460), {
+							className: "ds-disclosure__label",
+							children: e
+						}), n && u(g(460), {
+							className: g(475),
 							children: n
 						})]
 					}),
-					d(u, {
+					u(l, {
 						className: "ds-disclosure__chevron",
 						"aria-hidden": !0
 					})
 				]
 			})
-		}), d("div", {
-			id: _ + g(265),
-			role: g(261),
-			"aria-labelledby": _ + g(259),
-			className: g(253),
+		}), u(g(472), {
+			id: _ + g(461),
+			role: "region",
+			"aria-labelledby": _ + g(464),
+			className: g(473),
 			inert: !o || void 0,
-			children: d(g(257), {
-				className: g(245),
-				children: d(g(257), {
-					className: "ds-disclosure__content",
-					children: l
+			children: u(g(472), {
+				className: g(481),
+				children: u(g(472), {
+					className: g(466),
+					children: f
 				})
 			})
 		})]
 	});
 }
-var h = o(null);
-function g({ variant: n = "plain", children: r, className: o, style: s, ...c }) {
-	let u = e, f = a(c), p = l(null);
-	return d(h[u(223)], {
+var m = a(null);
+function h({ variant: e = t(455), children: n, className: a, style: o, ...s }) {
+	let l = t, d = i(s), f = c(null);
+	return u(m.Provider, {
 		value: {
-			isOpen: f[u(236)],
-			toggle: f.toggle
+			isOpen: d[l(468)],
+			toggle: d[l(470)]
 		},
-		children: d(u(257), {
-			ref: p,
-			className: i(u(252), u(232) + n, o),
-			style: s,
+		children: u("div", {
+			ref: f,
+			className: r(l(482), "ds-accordion--" + e, a),
+			style: o,
 			onKeyDown: (e) => {
-				let n = t, r = [...p[n(263)]?.querySelectorAll(n(258)) ?? []][n(247)]((e) => e[n(241)](n(231)) === p[n(263)]), i = r.indexOf(document[n(238)]);
-				if (i < 0) return;
-				let a;
-				e[n(242)] === "ArrowDown" ? a = r[(i + 1) % r[n(256)]] : e[n(242)] === n(239) ? a = r[(i - 1 + r[n(256)]) % r[n(256)]] : e[n(242)] === n(227) ? a = r[0] : e[n(242)] === n(228) && (a = r[r[n(256)] - 1]), a && (e[n(235)](), a.focus());
+				let t = _, n = [...f[t(490)]?.querySelectorAll(".ds-disclosure__trigger:not(:disabled)") ?? []][t(448)]((e) => e[t(458)](".ds-accordion") === f[t(490)]), r = n[t(467)](document[t(487)]);
+				if (r < 0) return;
+				let i;
+				e[t(465)] === t(469) ? i = n[(r + 1) % n[t(471)]] : e[t(465)] === t(453) ? i = n[(r - 1 + n[t(471)]) % n[t(471)]] : e[t(465)] === t(459) ? i = n[0] : e.key === t(486) && (i = n[n[t(471)] - 1]), i && (e[t(483)](), i[t(488)]());
 			},
-			children: r
+			children: n
 		})
 	});
 }
-function _({ value: t, title: n, flush: r, ...i }) {
-	let a = e, o = s(h);
-	if (!o) throw Error(a(249));
-	return d(m, {
+function g({ value: e, title: n, flush: r, ...i }) {
+	let a = t, s = o(m);
+	if (!s) throw Error(a(477));
+	return u(p, {
 		...i,
-		className: r ? a(224) : void 0,
+		className: r ? a(479) : void 0,
 		label: n,
-		open: o[a(229)](t),
-		onToggle: () => o[a(243)](t)
+		open: s[a(463)](e),
+		onToggle: () => s.toggle(e)
 	});
 }
-g[e(237)] = _;
-export { g as Accordion, _ as AccordionItem, p as Collapsible };
+function _(t, n) {
+	t -= 448;
+	let r = e(), i = r[t];
+	_.lYVWHG === void 0 && (_.rfJnFD = function(e) {
+		let t = "", n = "";
+		for (let n = 0, r, i, a = 0; i = e.charAt(a++); ~i && (r = n % 4 ? r * 64 + i : i, n++ % 4) && (t += String.fromCharCode(255 & r >> (-2 * n & 6)))) i = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=".indexOf(i);
+		for (let e = 0, r = t.length; e < r; e++) n += "%" + ("00" + t.charCodeAt(e).toString(16)).slice(-2);
+		return decodeURIComponent(n);
+	}, _.wdJysf = {}, _.lYVWHG = !0);
+	let a = r[0];
+	_.lkhHOe !== a && (_.wdJysf = {}, _.lkhHOe = a);
+	let o = _.wdJysf[t];
+	return o === void 0 ? (i = _.rfJnFD(i), _.wdJysf[t] = i) : i = o, i;
+}
+h.Item = g;
+export { h as Accordion, g as AccordionItem, f as Collapsible };

package/lib/components/ActionBar/ActionBar2.js

@@ -1,63 +1,67 @@
 "use client";
-var e = a;
+var e = i;
 (function(e, t) {
-	for (var n = a, r = e();;) try {
-		if (-parseInt(n(152)) / 1 * (parseInt(n(159)) / 2) + parseInt(n(151)) / 3 + parseInt(n(154)) / 4 + -parseInt(n(153)) / 5 + -parseInt(n(163)) / 6 + parseInt(n(150)) / 7 + parseInt(n(158)) / 8 == t) break;
+	for (var n = i, r = e();;) try {
+		if (parseInt(n(423)) / 1 * (-parseInt(n(412)) / 2) + parseInt(n(415)) / 3 + parseInt(n(414)) / 4 * (-parseInt(n(421)) / 5) + parseInt(n(425)) / 6 * (parseInt(n(426)) / 7) + parseInt(n(418)) / 8 + parseInt(n(424)) / 9 * (parseInt(n(422)) / 10) + -parseInt(n(411)) / 11 * (parseInt(n(420)) / 12) == t) break;
 		r.push(r.shift());
 	} catch {
 		r.push(r.shift());
 	}
-})(n, 948639);
+})(r, 544928);
 import { cx as t } from "../../primitives/index.js";
 /* empty css          */
-function n() {
+import { jsx as n } from "react/jsx-runtime";
+function r() {
 	var e = [
+		"mtC2ody4ohjNAvnkza",
+		"zhmTywn0Aw9UlwjHCI0TC3rPy2T5",
+		"ntq3nZa3nKzvzg1MBW",
+		"mtb4s2nOzwm",
+		"mtCWCgfkAKHe",
+		"mZK4yvbssLrU",
+		"nZq1mMTxBe5qqG",
+		"mZa2v0zJthv5",
+		"mtm0odGZAgrxrhDY",
+		"zgL2",
+		"zMLLBgrZzxq",
+		"mtf3uMvfz0u",
+		"oty0wvPgteD2",
 		"zhmTywn0Aw9UlwjHCG",
-		"mZm3nZe3ohfzve5SBq",
-		"nduZntq0n1bhCuj5yG",
-		"mtGYmJy4ou1pB1jzwq",
-		"mtq2ody1n2j6ChHPqW",
-		"mZC1odC3nujftKnOtq",
-		"nZe2mZK2ogDjv1bnua",
-		"zhmTywn0Aw9UlwjHCI0T",
+		"mtGYnZaWog9IquXXua",
+		"mJy2nJqZmfj0uhrmBW",
 		"y2vUDgvY",
-		"zMLLBgrZzxq",
-		"ntq4mZuWnhrIBLf5uW",
-		"mLzusenUyW",
-		"zhmTywn0Aw9UlwjHCL9Fz3jVDxa",
-		"zgL2"
+		"zhmTywn0Aw9UlwjHCI0T"
 	];
-	return n = function() {
+	return r = function() {
 		return e;
-	}, n();
+	}, r();
+}
+function i(e, t) {
+	e -= 411;
+	var n = r(), a = n[e];
+	i.BcUaRa === void 0 && (i.rQxFGv = function(e) {
+		for (var t = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=", n = "", r = "", i = 0, a, o, s = 0; o = e.charAt(s++); ~o && (a = i % 4 ? a * 64 + o : o, i++ % 4) && (n += String.fromCharCode(255 & a >> (-2 * i & 6)))) o = t.indexOf(o);
+		for (var c = 0, l = n.length; c < l; c++) r += "%" + ("00" + n.charCodeAt(c).toString(16)).slice(-2);
+		return decodeURIComponent(r);
+	}, i.OSJWZG = {}, i.BcUaRa = !0);
+	var o = n[0];
+	i.JXxIfL !== o && (i.OSJWZG = {}, i.JXxIfL = o);
+	var s = i.OSJWZG[e];
+	return s === void 0 ? (a = i.rQxFGv(a), i.OSJWZG[e] = a) : a = s, a;
 }
-import { jsx as r } from "react/jsx-runtime";
-function i({ children: n, align: i = e(156), sticky: a = !0, pending: o, "aria-label": s, className: c, style: l }) {
+function a({ children: r, align: i = e(416), sticky: a = !0, pending: o, "aria-label": s, className: c, style: l }) {
 	var u = e;
-	return r(u(161), {
-		className: t(u(162), u(155) + i, a && "ds-action-bar--sticky", c),
+	return n(u(427), {
+		className: t(u(413), u(417) + i, a && u(419), c),
 		"data-pending": o || void 0,
 		style: l,
-		children: r(u(157), {
-			className: u(160),
+		children: n(u(428), {
+			className: "ds-action-bar__group",
 			disabled: o,
 			"aria-label": s,
 			"aria-busy": o || void 0,
-			children: n
+			children: r
 		})
 	});
 }
-function a(e, t) {
-	e -= 150;
-	var r = n(), i = r[e];
-	a.tRMKcQ === void 0 && (a.gzTUAW = function(e) {
-		for (var t = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=", n = "", r = "", i = 0, a, o, s = 0; o = e.charAt(s++); ~o && (a = i % 4 ? a * 64 + o : o, i++ % 4) && (n += String.fromCharCode(255 & a >> (-2 * i & 6)))) o = t.indexOf(o);
-		for (var c = 0, l = n.length; c < l; c++) r += "%" + ("00" + n.charCodeAt(c).toString(16)).slice(-2);
-		return decodeURIComponent(r);
-	}, a.TWYLPy = {}, a.tRMKcQ = !0);
-	var o = r[0];
-	a.lKFhDR !== o && (a.TWYLPy = {}, a.lKFhDR = o);
-	var s = a.TWYLPy[e];
-	return s === void 0 ? (i = a.gzTUAW(i), a.TWYLPy[e] = i) : i = s, i;
-}
-export { i as ActionBar };
+export { a as ActionBar };

package/lib/components/Alert/Alert2.js

@@ -1,36 +1,36 @@
 "use client";
-const e = r;
-(function(e, t) {
-	let n = r, i = e();
-	for (;;) try {
-		if (-parseInt(n(172)) / 1 * (-parseInt(n(148)) / 2) + parseInt(n(171)) / 3 * (parseInt(n(165)) / 4) + parseInt(n(152)) / 5 * (parseInt(n(144)) / 6) + parseInt(n(162)) / 7 + parseInt(n(151)) / 8 + parseInt(n(146)) / 9 * (-parseInt(n(149)) / 10) + -parseInt(n(156)) / 11 == t) break;
-		i.push(i.shift());
-	} catch {
-		i.push(i.shift());
-	}
-})(i, 127346);
-import { Button as t, cx as n } from "../../primitives/index.js";
-function r(e, t) {
-	e -= 144;
-	let n = i(), a = n[e];
-	r.VAcBuc === void 0 && (r.NazYoV = function(e) {
+function e(t, n) {
+	t -= 109;
+	let r = i(), a = r[t];
+	e.ZSxwNZ === void 0 && (e.DXwXOy = function(e) {
 		let t = "", n = "";
 		for (let n = 0, r, i, a = 0; i = e.charAt(a++); ~i && (r = n % 4 ? r * 64 + i : i, n++ % 4) && (t += String.fromCharCode(255 & r >> (-2 * n & 6)))) i = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=".indexOf(i);
 		for (let e = 0, r = t.length; e < r; e++) n += "%" + ("00" + t.charCodeAt(e).toString(16)).slice(-2);
 		return decodeURIComponent(n);
-	}, r.ZdzHcX = {}, r.VAcBuc = !0);
-	let o = n[0];
-	r.WOWWSv !== o && (r.ZdzHcX = {}, r.WOWWSv = o);
-	let s = r.ZdzHcX[e];
-	return s === void 0 ? (a = r.NazYoV(a), r.ZdzHcX[e] = a) : a = s, a;
+	}, e.zNYPqA = {}, e.ZSxwNZ = !0);
+	let o = r[0];
+	e.wqnavE !== o && (e.zNYPqA = {}, e.wqnavE = o);
+	let s = e.zNYPqA[t];
+	return s === void 0 ? (a = e.DXwXOy(a), e.zNYPqA[t] = a) : a = s, a;
 }
-/* empty css      */
+const t = e;
+(function(t, n) {
+	let r = e, i = t();
+	for (;;) try {
+		if (parseInt(r(140)) / 1 * (parseInt(r(119)) / 2) + parseInt(r(115)) / 3 + -parseInt(r(129)) / 4 + parseInt(r(123)) / 5 + -parseInt(r(128)) / 6 * (parseInt(r(144)) / 7) + -parseInt(r(142)) / 8 * (-parseInt(r(134)) / 9) + -parseInt(r(141)) / 10 * (-parseInt(r(110)) / 11) == n) break;
+		i.push(i.shift());
+	} catch {
+		i.push(i.shift());
+	}
+})(i, 493407);
+import { Button as n, cx as r } from "../../primitives/index.js";
 function i() {
-	let e = /* @__PURE__ */ "C3rHy2TLza.nZa1nZy3n0rACeTbta.zgL2.D2fYBMLUzW.67cW64siioUlQ+Q4Sa.zgfUz2vY.zhmTyMfUBMvYx19Hy3rPB24.mty3nde5mejxBLHJza.zhmTywXLCNqTD3jHCa.C2v0vgLTzw91Da.mZe0mhnYDhPzqq.zhmTywXLCNrFx2fJDgLVBNm.zhmTywXLCNqTlq.zhmTyMfUBMvYx190zxH0.Aw5MBW.zhmTywXLCNrFx2nSB3nL.mZa5thLWvwnb.odi0nZn5D2jIB0O.7jwm66A8ioUlQ+Q4Sa.zhmTyMfUBMvYls1MBhvZAa.mtjRy2XNsvO.C3bHBG.owHuzeLvCW.zhmTywXLCNrFx2LJB24.nLHAzuHSwG.ntuXmJuWCwfXz3Hj.zhmTywXLCNrFx2nVBNrLBNq.oty1oda4q2v6rM5c.mZm5nZCWr2jyCwrk.zhmTyMfUBMvY.zhmTyMfUBMvYx19JBg9Zzq".split(".");
+	let e = /* @__PURE__ */ "67cW64siioUlQ+Q4Sa.zhmTywXLCNrFx2LJB24.mtaZmZeZnvrfEePkwq.zhmTywXLCNqTlq.zgfUz2vY.zhmTywXLCNq.zhmTywXLCNrFx2nSB3nL.mtCZmJyYme1pC25iwa.mtqXmdKYngHrEvDVrq.C3rHDhvZ.C3bHBG.z2HVC3q.zhmTyMfUBMvYx19JBg9Zzq.nJiYoerKtvfLza.zgL2.zhmTyMfUBMvYls1MBhvZAa.C3rHy2TLza.Aw5SAw5L.Aw5MBW.ntK0ntLVrxvqENu.ndqWDfHnAKrl.nteYohffvNnWDG.D2fYBMLUzW.mtrxDhnhCLy.ywXLCNq.odu4nJzQwMH6y2G.zhmTyMfUBMvY.zhmTywXLCNrFx2nVBNrLBNq.zhmTyMfUBMvYx19Hy3rPB24.zhmTywXLCNrFx2fJDgLVBNm.nZu0ote0swTiueXp.zhmTywXLCNrFx3rPDgXL.C2v0vgLTzw91Da.zhmTyMfUBMvYx190zxH0.nKTvEgrSta.zhmTywXLCNqTD3jHCa".split(".");
 	return i = function() {
 		return e;
 	}, i();
 }
+/* empty css      */
 import { useState as a } from "react";
 import { AlertTriangle as o, CheckCircle2 as s, Info as c, X as l, XCircle as u } from "lucide-react";
 import { jsx as d, jsxs as f } from "react/jsx-runtime";
@@ -41,87 +41,87 @@ var p = {
 	warning: d(o, {}),
 	danger: d(u, {})
 }, m = 260;
-function h({ tone: i = e(169), title: o, children: s, icon: c, actions: u, onClose: h, layout: g = e(155), className: _ }) {
-	let v = e, [y, b] = a(!1);
-	return d(v(157), {
-		className: v(163),
+function h({ tone: i = t(139), title: o, children: s, icon: c, actions: u, onClose: h, layout: g = "stacked", className: _ }) {
+	let v = t, [y, b] = a(!1);
+	return d(v(135), {
+		className: v(120),
 		"data-leaving": y || void 0,
-		children: f(v(157), {
-			role: i === v(160) || i === v(158) ? "alert" : "status",
-			className: n("ds-alert", v(167) + i, v(167) + g, _),
+		children: f(v(135), {
+			role: i === v(125) || i === v(143) ? v(109) : "status",
+			className: r(v(126), v(124) + i, v(124) + g, _),
 			children: [
-				c !== !1 && d(v(145), {
-					className: v(147),
+				c !== !1 && d(v(131), {
+					className: v(122),
 					children: c ?? p[i]
 				}),
-				f(v(157), {
-					className: v(150),
+				f(v(135), {
+					className: v(112),
 					children: [
-						o && d(v(157), {
-							className: "ds-alert__title",
+						o && d(v(135), {
+							className: v(116),
 							children: o
 						}),
 						s && d("div", {
 							className: "ds-alert__body",
 							children: s
 						}),
-						u && g === "stacked" && d("div", {
-							className: v(166),
+						u && g === v(137) && d("div", {
+							className: v(114),
 							children: u
 						})
 					]
 				}),
-				u && g === "inline" && d("div", {
-					className: v(166),
+				u && g === v(138) && d(v(135), {
+					className: v(114),
 					children: u
 				}),
-				h && d(t, {
+				h && d(n, {
 					iconOnly: !0,
-					variant: "ghost",
+					variant: v(132),
 					size: "sm",
 					icon: d(l, {}),
-					"aria-label": v(173),
-					className: v(170),
+					"aria-label": "알림 닫기",
+					className: v(127),
 					onClick: () => {
-						let e = r;
-						b(!0), window[e(164)](() => h?.(), m);
+						let t = e;
+						b(!0), window[t(117)](() => h?.(), m);
 					}
 				})
 			]
 		})
 	});
 }
-function g({ tone: i = "info", children: o, action: s, onClose: c, icon: u, flush: h, className: g }) {
-	let _ = e, [v, y] = a(!1);
-	return d(_(157), {
-		className: _(163),
+function g({ tone: i = t(139), children: o, action: s, onClose: c, icon: u, flush: h, className: g }) {
+	let _ = t, [v, y] = a(!1);
+	return d(_(135), {
+		className: _(120),
 		"data-leaving": v || void 0,
-		children: f(_(157), {
-			role: "status",
-			className: n(_(153), "ds-alert--" + i, h && _(174), g),
+		children: f(_(135), {
+			role: _(130),
+			className: r(_(111), "ds-alert--" + i, h && _(136), g),
 			children: [
-				u !== !1 && d(_(145), {
-					className: _(147),
+				u !== !1 && d(_(131), {
+					className: _(122),
 					children: u ?? p[i]
 				}),
-				d("span", {
-					className: _(168),
+				d(_(131), {
+					className: _(118),
 					children: o
 				}),
-				s && d(_(145), {
-					className: _(161),
+				s && d("span", {
+					className: _(113),
 					children: s
 				}),
-				c && d(t, {
+				c && d(n, {
 					iconOnly: !0,
-					variant: "ghost",
+					variant: _(132),
 					size: "sm",
 					icon: d(l, {}),
-					"aria-label": _(159),
-					className: _(154),
+					"aria-label": _(121),
+					className: _(133),
 					onClick: () => {
-						let e = r;
-						y(!0), window[e(164)](() => c?.(), m);
+						let t = e;
+						y(!0), window[t(117)](() => c?.(), m);
 					}
 				})
 			]