@x-plat/design-system 0.5.48 → 0.5.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2007,14 +2007,14 @@ var CardTabRoot = (props) => {
2007
2007
  );
2008
2008
  return /* @__PURE__ */ jsxs195("div", { className: clsx_default("lib-xplat-card-tab", size), children: [
2009
2009
  /* @__PURE__ */ jsx304("div", { className: "card-tab-bar", children: tabs.map((tab) => {
2010
- const isActive = tab.value === activeValue;
2010
+ const isActive2 = tab.value === activeValue;
2011
2011
  return /* @__PURE__ */ jsx304(
2012
2012
  "button",
2013
2013
  {
2014
- className: clsx_default("card-tab-trigger", isActive && "active"),
2014
+ className: clsx_default("card-tab-trigger", isActive2 && "active"),
2015
2015
  onClick: () => handleTabClick(tab),
2016
2016
  role: "tab",
2017
- "aria-selected": isActive,
2017
+ "aria-selected": isActive2,
2018
2018
  children: tab.title
2019
2019
  },
2020
2020
  tab.value
@@ -3376,12 +3376,12 @@ import React14 from "react";
3376
3376
  import React13 from "react";
3377
3377
  import { jsx as jsx317 } from "react/jsx-runtime";
3378
3378
  var TabItem = React13.forwardRef((props, ref) => {
3379
- const { isActive, title, onClick } = props;
3379
+ const { isActive: isActive2, title, onClick } = props;
3380
3380
  return /* @__PURE__ */ jsx317(
3381
3381
  "div",
3382
3382
  {
3383
3383
  ref,
3384
- className: clsx_default("tab-item", isActive ? "active" : null),
3384
+ className: clsx_default("tab-item", isActive2 ? "active" : null),
3385
3385
  onClick,
3386
3386
  children: title
3387
3387
  }
@@ -3804,24 +3804,731 @@ var Dropdown = (props) => {
3804
3804
  Dropdown.displayName = "Dropdown";
3805
3805
  var Dropdown_default = Dropdown;
3806
3806
 
3807
- // src/components/EmptyState/EmptyState.tsx
3807
+ // src/components/Editor/Editor.tsx
3808
+ import React21 from "react";
3808
3809
  import { jsx as jsx324, jsxs as jsxs208 } from "react/jsx-runtime";
3810
+ var DEFAULT_TOOLBAR = [
3811
+ "bold",
3812
+ "italic",
3813
+ "underline",
3814
+ "strikethrough",
3815
+ "code",
3816
+ "heading",
3817
+ "list",
3818
+ "ordered-list",
3819
+ "blockquote",
3820
+ "code-block",
3821
+ "link",
3822
+ "image",
3823
+ "divider"
3824
+ ];
3825
+ var ALLOWED_TAGS = /* @__PURE__ */ new Set([
3826
+ "p",
3827
+ "br",
3828
+ "h1",
3829
+ "h2",
3830
+ "h3",
3831
+ "h4",
3832
+ "h5",
3833
+ "h6",
3834
+ "ul",
3835
+ "ol",
3836
+ "li",
3837
+ "blockquote",
3838
+ "pre",
3839
+ "code",
3840
+ "strong",
3841
+ "b",
3842
+ "em",
3843
+ "i",
3844
+ "u",
3845
+ "s",
3846
+ "strike",
3847
+ "del",
3848
+ "a",
3849
+ "img",
3850
+ "hr",
3851
+ "span",
3852
+ "div"
3853
+ ]);
3854
+ var ALLOWED_ATTRS = {
3855
+ a: ["href", "target", "rel"],
3856
+ img: ["src", "alt"]
3857
+ };
3858
+ var sanitizeHtml = (input) => {
3859
+ const doc = new DOMParser().parseFromString(`<div>${input}</div>`, "text/html");
3860
+ const root = doc.body.firstElementChild;
3861
+ if (!root) return "";
3862
+ const walk = (node) => {
3863
+ const children = Array.from(node.children);
3864
+ for (const child of children) {
3865
+ const tag = child.tagName.toLowerCase();
3866
+ if (!ALLOWED_TAGS.has(tag)) {
3867
+ while (child.firstChild) node.insertBefore(child.firstChild, child);
3868
+ node.removeChild(child);
3869
+ continue;
3870
+ }
3871
+ const allowed = ALLOWED_ATTRS[tag] || [];
3872
+ for (const attr of Array.from(child.attributes)) {
3873
+ if (!allowed.includes(attr.name)) {
3874
+ child.removeAttribute(attr.name);
3875
+ }
3876
+ if (attr.name === "href" || attr.name === "src") {
3877
+ const val = attr.value.trim().toLowerCase();
3878
+ if (val.startsWith("javascript:") || val.startsWith("data:text/html")) {
3879
+ child.removeAttribute(attr.name);
3880
+ }
3881
+ }
3882
+ }
3883
+ walk(child);
3884
+ }
3885
+ };
3886
+ walk(root);
3887
+ return root.innerHTML;
3888
+ };
3889
+ var escapeHtml = (text) => {
3890
+ const div = document.createElement("div");
3891
+ div.textContent = text;
3892
+ return div.innerHTML.replace(/\n/g, "<br>");
3893
+ };
3894
+ var SLASH_ITEMS = [
3895
+ { key: "paragraph", label: "\uB2E8\uB77D", hint: "\uAE30\uBCF8 \uD14D\uC2A4\uD2B8" },
3896
+ { key: "heading", label: "\uC81C\uBAA9 1", hint: "\uD070 \uC81C\uBAA9" },
3897
+ { key: "list", label: "\uAE00\uBA38\uB9AC \uAE30\uD638 \uBAA9\uB85D", hint: "\u2022 \uD56D\uBAA9" },
3898
+ { key: "ordered-list", label: "\uBC88\uD638 \uB9E4\uAE30\uAE30 \uBAA9\uB85D", hint: "1. \uD56D\uBAA9" },
3899
+ { key: "blockquote", label: "\uC778\uC6A9", hint: "" },
3900
+ { key: "code-block", label: "\uCF54\uB4DC \uBE14\uB85D", hint: "" },
3901
+ { key: "divider", label: "\uAD6C\uBD84\uC120", hint: "\u2500" },
3902
+ { key: "image", label: "\uC774\uBBF8\uC9C0", hint: "" }
3903
+ ];
3904
+ var Editor = (props) => {
3905
+ const {
3906
+ value = "",
3907
+ onChange,
3908
+ placeholder = "\uB0B4\uC6A9\uC744 \uC785\uB825\uD558\uC138\uC694",
3909
+ readOnly = false,
3910
+ toolbar = DEFAULT_TOOLBAR,
3911
+ enableSlashCommand = true,
3912
+ enableMarkdownShortcuts = true,
3913
+ onImageUpload,
3914
+ minHeight = 200
3915
+ } = props;
3916
+ const editorRef = React21.useRef(null);
3917
+ const lastRangeRef = React21.useRef(null);
3918
+ const composingRef = React21.useRef(false);
3919
+ const [isFocused, setIsFocused] = React21.useState(false);
3920
+ const [isEmpty, setIsEmpty] = React21.useState(!value);
3921
+ const [activeFormats, setActiveFormats] = React21.useState(/* @__PURE__ */ new Set());
3922
+ const [slashOpen, setSlashOpen] = React21.useState(false);
3923
+ const [slashFilter, setSlashFilter] = React21.useState("");
3924
+ const [slashIdx, setSlashIdx] = React21.useState(0);
3925
+ const [slashPos, setSlashPos] = React21.useState({ top: 0, left: 0 });
3926
+ const slashStartRangeRef = React21.useRef(null);
3927
+ const [linkOpen, setLinkOpen] = React21.useState(false);
3928
+ const [linkValue, setLinkValue] = React21.useState("");
3929
+ const [linkPos, setLinkPos] = React21.useState({ top: 0, left: 0 });
3930
+ React21.useEffect(() => {
3931
+ if (!editorRef.current) return;
3932
+ if (editorRef.current.innerHTML !== value) {
3933
+ editorRef.current.innerHTML = sanitizeHtml(value || "");
3934
+ updateEmpty();
3935
+ }
3936
+ }, [value]);
3937
+ const updateEmpty = () => {
3938
+ const el = editorRef.current;
3939
+ if (!el) return;
3940
+ const text = el.textContent || "";
3941
+ const childCount = el.children.length;
3942
+ setIsEmpty(text.length === 0 && childCount <= 1);
3943
+ };
3944
+ const saveSelection = () => {
3945
+ const sel = window.getSelection();
3946
+ if (sel && sel.rangeCount > 0 && editorRef.current?.contains(sel.anchorNode)) {
3947
+ lastRangeRef.current = sel.getRangeAt(0).cloneRange();
3948
+ }
3949
+ };
3950
+ const restoreSelection = () => {
3951
+ if (!lastRangeRef.current) return;
3952
+ const sel = window.getSelection();
3953
+ sel?.removeAllRanges();
3954
+ sel?.addRange(lastRangeRef.current);
3955
+ };
3956
+ const updateActiveFormats = () => {
3957
+ if (!editorRef.current) return;
3958
+ const sel = window.getSelection();
3959
+ if (!sel || !editorRef.current.contains(sel.anchorNode)) return;
3960
+ const next = /* @__PURE__ */ new Set();
3961
+ try {
3962
+ if (document.queryCommandState("bold")) next.add("bold");
3963
+ if (document.queryCommandState("italic")) next.add("italic");
3964
+ if (document.queryCommandState("underline")) next.add("underline");
3965
+ if (document.queryCommandState("strikethrough")) next.add("strikethrough");
3966
+ if (document.queryCommandState("insertUnorderedList")) next.add("list");
3967
+ if (document.queryCommandState("insertOrderedList")) next.add("ordered-list");
3968
+ const block = String(document.queryCommandValue("formatBlock") || "").toLowerCase();
3969
+ if (block) next.add(`block:${block}`);
3970
+ } catch {
3971
+ }
3972
+ setActiveFormats(next);
3973
+ };
3974
+ const exec = (cmd, val) => {
3975
+ document.execCommand(cmd, false, val);
3976
+ editorRef.current?.focus();
3977
+ updateActiveFormats();
3978
+ handleInput();
3979
+ };
3980
+ const setBlock = (tag) => {
3981
+ exec("formatBlock", tag);
3982
+ };
3983
+ const insertDivider = () => {
3984
+ exec("insertHorizontalRule");
3985
+ const el = editorRef.current;
3986
+ if (el && el.lastElementChild?.tagName === "HR") {
3987
+ const p = document.createElement("p");
3988
+ p.innerHTML = "<br>";
3989
+ el.appendChild(p);
3990
+ handleInput();
3991
+ }
3992
+ };
3993
+ const insertImageByUrl = (url) => {
3994
+ if (!url) return;
3995
+ exec("insertImage", url);
3996
+ };
3997
+ const triggerImageUpload = async () => {
3998
+ if (!onImageUpload) {
3999
+ const url = window.prompt("\uC774\uBBF8\uC9C0 URL");
4000
+ if (url) {
4001
+ restoreSelection();
4002
+ insertImageByUrl(url);
4003
+ }
4004
+ return;
4005
+ }
4006
+ const input = document.createElement("input");
4007
+ input.type = "file";
4008
+ input.accept = "image/*";
4009
+ input.onchange = async () => {
4010
+ const file = input.files?.[0];
4011
+ if (!file) return;
4012
+ try {
4013
+ const url = await onImageUpload(file);
4014
+ restoreSelection();
4015
+ insertImageByUrl(url);
4016
+ } catch (err) {
4017
+ console.error("\uC774\uBBF8\uC9C0 \uC5C5\uB85C\uB4DC \uC2E4\uD328:", err);
4018
+ }
4019
+ };
4020
+ input.click();
4021
+ };
4022
+ const openSlashMenu = () => {
4023
+ if (!enableSlashCommand) return;
4024
+ const sel = window.getSelection();
4025
+ if (!sel || sel.rangeCount === 0) return;
4026
+ const range = sel.getRangeAt(0);
4027
+ slashStartRangeRef.current = range.cloneRange();
4028
+ const rect = range.getBoundingClientRect();
4029
+ const editorRect = editorRef.current.getBoundingClientRect();
4030
+ setSlashPos({
4031
+ top: rect.bottom - editorRect.top + 4,
4032
+ left: rect.left - editorRect.left
4033
+ });
4034
+ setSlashFilter("");
4035
+ setSlashIdx(0);
4036
+ setSlashOpen(true);
4037
+ };
4038
+ const closeSlashMenu = () => {
4039
+ setSlashOpen(false);
4040
+ setSlashFilter("");
4041
+ setSlashIdx(0);
4042
+ slashStartRangeRef.current = null;
4043
+ };
4044
+ const filteredSlashItems = React21.useMemo(() => {
4045
+ if (!slashFilter) return SLASH_ITEMS;
4046
+ const f = slashFilter.toLowerCase();
4047
+ return SLASH_ITEMS.filter((it) => it.label.toLowerCase().includes(f) || it.key.includes(f));
4048
+ }, [slashFilter]);
4049
+ const removeSlashTrigger = () => {
4050
+ const sel = window.getSelection();
4051
+ if (!sel || sel.rangeCount === 0) return;
4052
+ const range = sel.getRangeAt(0);
4053
+ const node = range.startContainer;
4054
+ if (node.nodeType === Node.TEXT_NODE) {
4055
+ const text = node.textContent || "";
4056
+ const idx = text.lastIndexOf("/");
4057
+ if (idx >= 0) {
4058
+ node.textContent = text.slice(0, idx) + text.slice(range.startOffset);
4059
+ const newRange = document.createRange();
4060
+ newRange.setStart(node, idx);
4061
+ newRange.collapse(true);
4062
+ sel.removeAllRanges();
4063
+ sel.addRange(newRange);
4064
+ }
4065
+ }
4066
+ };
4067
+ const applySlashItem = (item) => {
4068
+ removeSlashTrigger();
4069
+ closeSlashMenu();
4070
+ switch (item.key) {
4071
+ case "paragraph":
4072
+ setBlock("p");
4073
+ break;
4074
+ case "heading":
4075
+ setBlock("h2");
4076
+ break;
4077
+ case "list":
4078
+ exec("insertUnorderedList");
4079
+ break;
4080
+ case "ordered-list":
4081
+ exec("insertOrderedList");
4082
+ break;
4083
+ case "blockquote":
4084
+ setBlock("blockquote");
4085
+ break;
4086
+ case "code-block":
4087
+ setBlock("pre");
4088
+ break;
4089
+ case "divider":
4090
+ insertDivider();
4091
+ break;
4092
+ case "image":
4093
+ triggerImageUpload();
4094
+ break;
4095
+ default:
4096
+ break;
4097
+ }
4098
+ };
4099
+ const openLinkEditor = () => {
4100
+ saveSelection();
4101
+ const sel = window.getSelection();
4102
+ if (!sel || sel.rangeCount === 0) return;
4103
+ const range = sel.getRangeAt(0);
4104
+ const rect = range.getBoundingClientRect();
4105
+ const editorRect = editorRef.current.getBoundingClientRect();
4106
+ setLinkPos({
4107
+ top: rect.bottom - editorRect.top + 4,
4108
+ left: rect.left - editorRect.left
4109
+ });
4110
+ const anchor = sel.anchorNode?.parentElement?.closest("a");
4111
+ setLinkValue(anchor?.getAttribute("href") || "");
4112
+ setLinkOpen(true);
4113
+ };
4114
+ const applyLink = () => {
4115
+ restoreSelection();
4116
+ if (linkValue) {
4117
+ exec("createLink", linkValue);
4118
+ const sel = window.getSelection();
4119
+ const anchor = sel?.anchorNode?.parentElement?.closest("a");
4120
+ if (anchor) {
4121
+ anchor.setAttribute("target", "_blank");
4122
+ anchor.setAttribute("rel", "noopener noreferrer");
4123
+ }
4124
+ } else {
4125
+ exec("unlink");
4126
+ }
4127
+ setLinkOpen(false);
4128
+ };
4129
+ const tryMarkdownShortcut = () => {
4130
+ if (!enableMarkdownShortcuts) return false;
4131
+ const sel = window.getSelection();
4132
+ if (!sel || sel.rangeCount === 0) return false;
4133
+ const range = sel.getRangeAt(0);
4134
+ const node = range.startContainer;
4135
+ if (node.nodeType !== Node.TEXT_NODE) return false;
4136
+ const text = (node.textContent || "").slice(0, range.startOffset);
4137
+ const patterns = [
4138
+ [/^###\s$/, () => setBlock("h3")],
4139
+ [/^##\s$/, () => setBlock("h2")],
4140
+ [/^#\s$/, () => setBlock("h1")],
4141
+ [/^-\s$/, () => exec("insertUnorderedList")],
4142
+ [/^\*\s$/, () => exec("insertUnorderedList")],
4143
+ [/^1\.\s$/, () => exec("insertOrderedList")],
4144
+ [/^>\s$/, () => setBlock("blockquote")]
4145
+ ];
4146
+ for (const [re, fn] of patterns) {
4147
+ if (re.test(text)) {
4148
+ node.textContent = (node.textContent || "").slice(range.startOffset);
4149
+ const newRange = document.createRange();
4150
+ newRange.setStart(node, 0);
4151
+ newRange.collapse(true);
4152
+ sel.removeAllRanges();
4153
+ sel.addRange(newRange);
4154
+ fn();
4155
+ return true;
4156
+ }
4157
+ }
4158
+ return false;
4159
+ };
4160
+ const handleInput = () => {
4161
+ if (composingRef.current) return;
4162
+ const el = editorRef.current;
4163
+ if (!el) return;
4164
+ onChange?.(el.innerHTML);
4165
+ updateEmpty();
4166
+ updateActiveFormats();
4167
+ if (slashOpen) {
4168
+ const sel = window.getSelection();
4169
+ if (sel && sel.rangeCount > 0) {
4170
+ const range = sel.getRangeAt(0);
4171
+ const node = range.startContainer;
4172
+ if (node.nodeType === Node.TEXT_NODE) {
4173
+ const text = node.textContent || "";
4174
+ const lastSlash = text.lastIndexOf("/", range.startOffset - 1);
4175
+ if (lastSlash >= 0) {
4176
+ const filter = text.slice(lastSlash + 1, range.startOffset);
4177
+ if (filter.includes(" ") || filter.includes("\n")) {
4178
+ closeSlashMenu();
4179
+ } else {
4180
+ setSlashFilter(filter);
4181
+ setSlashIdx(0);
4182
+ }
4183
+ } else {
4184
+ closeSlashMenu();
4185
+ }
4186
+ }
4187
+ }
4188
+ }
4189
+ };
4190
+ const handleKeyDown = (e) => {
4191
+ if (readOnly) return;
4192
+ if (slashOpen) {
4193
+ if (e.key === "ArrowDown") {
4194
+ e.preventDefault();
4195
+ setSlashIdx((i) => Math.min(i + 1, filteredSlashItems.length - 1));
4196
+ return;
4197
+ }
4198
+ if (e.key === "ArrowUp") {
4199
+ e.preventDefault();
4200
+ setSlashIdx((i) => Math.max(i - 1, 0));
4201
+ return;
4202
+ }
4203
+ if (e.key === "Enter") {
4204
+ e.preventDefault();
4205
+ const item = filteredSlashItems[slashIdx];
4206
+ if (item) applySlashItem(item);
4207
+ return;
4208
+ }
4209
+ if (e.key === "Escape") {
4210
+ e.preventDefault();
4211
+ closeSlashMenu();
4212
+ return;
4213
+ }
4214
+ }
4215
+ if ((e.metaKey || e.ctrlKey) && !e.shiftKey && !e.altKey) {
4216
+ const k = e.key.toLowerCase();
4217
+ if (k === "b") {
4218
+ e.preventDefault();
4219
+ exec("bold");
4220
+ return;
4221
+ }
4222
+ if (k === "i") {
4223
+ e.preventDefault();
4224
+ exec("italic");
4225
+ return;
4226
+ }
4227
+ if (k === "u") {
4228
+ e.preventDefault();
4229
+ exec("underline");
4230
+ return;
4231
+ }
4232
+ if (k === "k") {
4233
+ e.preventDefault();
4234
+ openLinkEditor();
4235
+ return;
4236
+ }
4237
+ }
4238
+ if (enableSlashCommand && e.key === "/") {
4239
+ setTimeout(openSlashMenu, 0);
4240
+ }
4241
+ if (enableMarkdownShortcuts && e.key === " ") {
4242
+ if (tryMarkdownShortcut()) {
4243
+ e.preventDefault();
4244
+ }
4245
+ }
4246
+ };
4247
+ const handlePaste = (e) => {
4248
+ if (readOnly) return;
4249
+ e.preventDefault();
4250
+ const html = e.clipboardData.getData("text/html");
4251
+ const text = e.clipboardData.getData("text/plain");
4252
+ const clean = html ? sanitizeHtml(html) : escapeHtml(text);
4253
+ document.execCommand("insertHTML", false, clean);
4254
+ handleInput();
4255
+ };
4256
+ const handleCompositionStart = () => {
4257
+ composingRef.current = true;
4258
+ };
4259
+ const handleCompositionEnd = () => {
4260
+ composingRef.current = false;
4261
+ handleInput();
4262
+ };
4263
+ const handleFocus = () => {
4264
+ setIsFocused(true);
4265
+ updateActiveFormats();
4266
+ };
4267
+ const handleBlur = () => {
4268
+ setIsFocused(false);
4269
+ saveSelection();
4270
+ };
4271
+ const handleSelectionUpdate = () => {
4272
+ updateActiveFormats();
4273
+ };
4274
+ const onToolbarAction = (item) => {
4275
+ switch (item) {
4276
+ case "bold":
4277
+ exec("bold");
4278
+ break;
4279
+ case "italic":
4280
+ exec("italic");
4281
+ break;
4282
+ case "underline":
4283
+ exec("underline");
4284
+ break;
4285
+ case "strikethrough":
4286
+ exec("strikethrough");
4287
+ break;
4288
+ case "code": {
4289
+ const sel = window.getSelection();
4290
+ if (!sel || sel.rangeCount === 0 || sel.isCollapsed) return;
4291
+ const range = sel.getRangeAt(0);
4292
+ const code = document.createElement("code");
4293
+ try {
4294
+ range.surroundContents(code);
4295
+ } catch {
4296
+ const frag = range.extractContents();
4297
+ code.appendChild(frag);
4298
+ range.insertNode(code);
4299
+ }
4300
+ handleInput();
4301
+ break;
4302
+ }
4303
+ case "heading":
4304
+ setBlock("h2");
4305
+ break;
4306
+ case "list":
4307
+ exec("insertUnorderedList");
4308
+ break;
4309
+ case "ordered-list":
4310
+ exec("insertOrderedList");
4311
+ break;
4312
+ case "blockquote":
4313
+ setBlock("blockquote");
4314
+ break;
4315
+ case "code-block":
4316
+ setBlock("pre");
4317
+ break;
4318
+ case "link":
4319
+ openLinkEditor();
4320
+ break;
4321
+ case "image":
4322
+ triggerImageUpload();
4323
+ break;
4324
+ case "divider":
4325
+ insertDivider();
4326
+ break;
4327
+ }
4328
+ };
4329
+ return /* @__PURE__ */ jsxs208("div", { className: clsx_default("lib-xplat-editor", isFocused && "focused", readOnly && "readonly"), children: [
4330
+ !readOnly && /* @__PURE__ */ jsx324(
4331
+ EditorToolbar,
4332
+ {
4333
+ items: toolbar,
4334
+ active: activeFormats,
4335
+ onAction: onToolbarAction
4336
+ }
4337
+ ),
4338
+ /* @__PURE__ */ jsxs208("div", { className: "lib-xplat-editor__content", style: { minHeight }, children: [
4339
+ isEmpty && !isFocused && /* @__PURE__ */ jsx324("div", { className: "lib-xplat-editor__placeholder", children: placeholder }),
4340
+ /* @__PURE__ */ jsx324(
4341
+ "div",
4342
+ {
4343
+ ref: editorRef,
4344
+ contentEditable: !readOnly,
4345
+ suppressContentEditableWarning: true,
4346
+ className: "lib-xplat-editor__editable",
4347
+ onInput: handleInput,
4348
+ onKeyDown: handleKeyDown,
4349
+ onKeyUp: handleSelectionUpdate,
4350
+ onMouseUp: handleSelectionUpdate,
4351
+ onPaste: handlePaste,
4352
+ onCompositionStart: handleCompositionStart,
4353
+ onCompositionEnd: handleCompositionEnd,
4354
+ onFocus: handleFocus,
4355
+ onBlur: handleBlur,
4356
+ spellCheck: true
4357
+ }
4358
+ ),
4359
+ slashOpen && filteredSlashItems.length > 0 && /* @__PURE__ */ jsx324(
4360
+ SlashMenu,
4361
+ {
4362
+ position: slashPos,
4363
+ items: filteredSlashItems,
4364
+ activeIndex: slashIdx,
4365
+ onSelect: applySlashItem,
4366
+ onClose: closeSlashMenu
4367
+ }
4368
+ ),
4369
+ linkOpen && /* @__PURE__ */ jsx324(
4370
+ LinkPopover,
4371
+ {
4372
+ position: linkPos,
4373
+ value: linkValue,
4374
+ onChange: setLinkValue,
4375
+ onConfirm: applyLink,
4376
+ onClose: () => setLinkOpen(false)
4377
+ }
4378
+ )
4379
+ ] })
4380
+ ] });
4381
+ };
4382
+ Editor.displayName = "Editor";
4383
+ var Editor_default = Editor;
4384
+ var TOOLBAR_LABEL = {
4385
+ bold: "B",
4386
+ italic: "I",
4387
+ underline: "U",
4388
+ strikethrough: "S",
4389
+ code: "<>",
4390
+ heading: "H",
4391
+ list: "\u2022",
4392
+ "ordered-list": "1.",
4393
+ blockquote: "\u275D",
4394
+ "code-block": "[ ]",
4395
+ link: "\u{1F517}",
4396
+ image: "\u{1F5BC}",
4397
+ divider: "\u2014"
4398
+ };
4399
+ var TOOLBAR_TITLE = {
4400
+ bold: "\uAD75\uAC8C (\u2318B)",
4401
+ italic: "\uAE30\uC6B8\uC784 (\u2318I)",
4402
+ underline: "\uBC11\uC904 (\u2318U)",
4403
+ strikethrough: "\uCDE8\uC18C\uC120",
4404
+ code: "\uC778\uB77C\uC778 \uCF54\uB4DC",
4405
+ heading: "\uC81C\uBAA9",
4406
+ list: "\uAE00\uBA38\uB9AC \uAE30\uD638 \uBAA9\uB85D",
4407
+ "ordered-list": "\uBC88\uD638 \uB9E4\uAE30\uAE30 \uBAA9\uB85D",
4408
+ blockquote: "\uC778\uC6A9",
4409
+ "code-block": "\uCF54\uB4DC \uBE14\uB85D",
4410
+ link: "\uB9C1\uD06C (\u2318K)",
4411
+ image: "\uC774\uBBF8\uC9C0",
4412
+ divider: "\uAD6C\uBD84\uC120"
4413
+ };
4414
+ var isActive = (item, active) => {
4415
+ if (item === "heading") return active.has("block:h1") || active.has("block:h2") || active.has("block:h3");
4416
+ if (item === "blockquote") return active.has("block:blockquote");
4417
+ if (item === "code-block") return active.has("block:pre");
4418
+ return active.has(item);
4419
+ };
4420
+ var EditorToolbar = ({ items, active, onAction }) => {
4421
+ return /* @__PURE__ */ jsx324("div", { className: "lib-xplat-editor__toolbar", children: items.map((item) => /* @__PURE__ */ jsx324(
4422
+ "button",
4423
+ {
4424
+ type: "button",
4425
+ className: clsx_default("lib-xplat-editor__toolbar-btn", isActive(item, active) && "active"),
4426
+ title: TOOLBAR_TITLE[item],
4427
+ onMouseDown: (e) => {
4428
+ e.preventDefault();
4429
+ onAction(item);
4430
+ },
4431
+ children: TOOLBAR_LABEL[item]
4432
+ },
4433
+ item
4434
+ )) });
4435
+ };
4436
+ var SlashMenu = ({ position, items, activeIndex, onSelect, onClose }) => {
4437
+ React21.useEffect(() => {
4438
+ const handleClickOutside = (e) => {
4439
+ const target = e.target;
4440
+ const menu = document.querySelector(".lib-xplat-editor__slash-menu");
4441
+ if (menu && !menu.contains(target)) onClose();
4442
+ };
4443
+ window.addEventListener("mousedown", handleClickOutside);
4444
+ return () => window.removeEventListener("mousedown", handleClickOutside);
4445
+ }, [onClose]);
4446
+ return /* @__PURE__ */ jsx324(
4447
+ "div",
4448
+ {
4449
+ className: "lib-xplat-editor__slash-menu",
4450
+ style: { top: position.top, left: position.left },
4451
+ children: items.map((item, i) => /* @__PURE__ */ jsxs208(
4452
+ "button",
4453
+ {
4454
+ type: "button",
4455
+ className: clsx_default("lib-xplat-editor__slash-item", i === activeIndex && "active"),
4456
+ onMouseDown: (e) => {
4457
+ e.preventDefault();
4458
+ onSelect(item);
4459
+ },
4460
+ children: [
4461
+ /* @__PURE__ */ jsx324("span", { className: "label", children: item.label }),
4462
+ item.hint && /* @__PURE__ */ jsx324("span", { className: "hint", children: item.hint })
4463
+ ]
4464
+ },
4465
+ item.key
4466
+ ))
4467
+ }
4468
+ );
4469
+ };
4470
+ var LinkPopover = ({ position, value, onChange, onConfirm, onClose }) => {
4471
+ const inputRef = React21.useRef(null);
4472
+ React21.useEffect(() => {
4473
+ inputRef.current?.focus();
4474
+ }, []);
4475
+ return /* @__PURE__ */ jsxs208(
4476
+ "div",
4477
+ {
4478
+ className: "lib-xplat-editor__link-popover",
4479
+ style: { top: position.top, left: position.left },
4480
+ children: [
4481
+ /* @__PURE__ */ jsx324(
4482
+ "input",
4483
+ {
4484
+ ref: inputRef,
4485
+ type: "url",
4486
+ placeholder: "https://",
4487
+ value,
4488
+ onChange: (e) => onChange(e.target.value),
4489
+ onKeyDown: (e) => {
4490
+ if (e.key === "Enter") {
4491
+ e.preventDefault();
4492
+ onConfirm();
4493
+ }
4494
+ if (e.key === "Escape") {
4495
+ e.preventDefault();
4496
+ onClose();
4497
+ }
4498
+ }
4499
+ }
4500
+ ),
4501
+ /* @__PURE__ */ jsx324("button", { type: "button", onMouseDown: (e) => {
4502
+ e.preventDefault();
4503
+ onConfirm();
4504
+ }, children: "\uC801\uC6A9" }),
4505
+ /* @__PURE__ */ jsx324("button", { type: "button", onMouseDown: (e) => {
4506
+ e.preventDefault();
4507
+ onClose();
4508
+ }, children: "\uCDE8\uC18C" })
4509
+ ]
4510
+ }
4511
+ );
4512
+ };
4513
+
4514
+ // src/components/EmptyState/EmptyState.tsx
4515
+ import { jsx as jsx325, jsxs as jsxs209 } from "react/jsx-runtime";
3809
4516
  var EmptyState = (props) => {
3810
4517
  const { icon, title = "\uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4", description, action } = props;
3811
- return /* @__PURE__ */ jsxs208("div", { className: "lib-xplat-empty-state", children: [
3812
- icon && /* @__PURE__ */ jsx324("div", { className: "empty-icon", children: icon }),
3813
- !icon && /* @__PURE__ */ jsx324("div", { className: "empty-icon", children: /* @__PURE__ */ jsx324("svg", { viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx324("path", { d: "M20 6h-8l-2-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10z" }) }) }),
3814
- /* @__PURE__ */ jsx324("p", { className: "empty-title", children: title }),
3815
- description && /* @__PURE__ */ jsx324("p", { className: "empty-description", children: description }),
3816
- action && /* @__PURE__ */ jsx324("div", { className: "empty-action", children: action })
4518
+ return /* @__PURE__ */ jsxs209("div", { className: "lib-xplat-empty-state", children: [
4519
+ icon && /* @__PURE__ */ jsx325("div", { className: "empty-icon", children: icon }),
4520
+ !icon && /* @__PURE__ */ jsx325("div", { className: "empty-icon", children: /* @__PURE__ */ jsx325("svg", { viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx325("path", { d: "M20 6h-8l-2-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10z" }) }) }),
4521
+ /* @__PURE__ */ jsx325("p", { className: "empty-title", children: title }),
4522
+ description && /* @__PURE__ */ jsx325("p", { className: "empty-description", children: description }),
4523
+ action && /* @__PURE__ */ jsx325("div", { className: "empty-action", children: action })
3817
4524
  ] });
3818
4525
  };
3819
4526
  EmptyState.displayName = "EmptyState";
3820
4527
  var EmptyState_default = EmptyState;
3821
4528
 
3822
4529
  // src/components/FileUpload/FileUpload.tsx
3823
- import React21 from "react";
3824
- import { jsx as jsx325, jsxs as jsxs209 } from "react/jsx-runtime";
4530
+ import React22 from "react";
4531
+ import { jsx as jsx326, jsxs as jsxs210 } from "react/jsx-runtime";
3825
4532
  var FileUpload = (props) => {
3826
4533
  const {
3827
4534
  accept,
@@ -3831,8 +4538,8 @@ var FileUpload = (props) => {
3831
4538
  label = "\uD30C\uC77C\uC744 \uB4DC\uB798\uADF8\uD558\uAC70\uB098 \uD074\uB9AD\uD558\uC5EC \uC5C5\uB85C\uB4DC",
3832
4539
  description
3833
4540
  } = props;
3834
- const [isDragOver, setIsDragOver] = React21.useState(false);
3835
- const inputRef = React21.useRef(null);
4541
+ const [isDragOver, setIsDragOver] = React22.useState(false);
4542
+ const inputRef = React22.useRef(null);
3836
4543
  const handleFiles = (fileList) => {
3837
4544
  let files = Array.from(fileList);
3838
4545
  if (maxSize) {
@@ -3862,7 +4569,7 @@ var FileUpload = (props) => {
3862
4569
  handleFiles(e.target.files);
3863
4570
  }
3864
4571
  };
3865
- return /* @__PURE__ */ jsxs209(
4572
+ return /* @__PURE__ */ jsxs210(
3866
4573
  "div",
3867
4574
  {
3868
4575
  className: clsx_default("lib-xplat-file-upload", { "drag-over": isDragOver }),
@@ -3871,7 +4578,7 @@ var FileUpload = (props) => {
3871
4578
  onDragLeave: handleDragLeave,
3872
4579
  onClick: () => inputRef.current?.click(),
3873
4580
  children: [
3874
- /* @__PURE__ */ jsx325(
4581
+ /* @__PURE__ */ jsx326(
3875
4582
  "input",
3876
4583
  {
3877
4584
  ref: inputRef,
@@ -3881,9 +4588,9 @@ var FileUpload = (props) => {
3881
4588
  onChange: handleChange
3882
4589
  }
3883
4590
  ),
3884
- /* @__PURE__ */ jsx325("div", { className: "upload-icon", children: /* @__PURE__ */ jsx325(UploadIcon_default, {}) }),
3885
- /* @__PURE__ */ jsx325("p", { className: "upload-label", children: label }),
3886
- description && /* @__PURE__ */ jsx325("p", { className: "upload-description", children: description })
4591
+ /* @__PURE__ */ jsx326("div", { className: "upload-icon", children: /* @__PURE__ */ jsx326(UploadIcon_default, {}) }),
4592
+ /* @__PURE__ */ jsx326("p", { className: "upload-label", children: label }),
4593
+ description && /* @__PURE__ */ jsx326("p", { className: "upload-description", children: description })
3887
4594
  ]
3888
4595
  }
3889
4596
  );
@@ -3892,10 +4599,10 @@ FileUpload.displayName = "FileUpload";
3892
4599
  var FileUpload_default = FileUpload;
3893
4600
 
3894
4601
  // src/components/HtmlTypeWriter/HtmlTypeWriter.tsx
3895
- import React23 from "react";
4602
+ import React24 from "react";
3896
4603
 
3897
4604
  // src/components/HtmlTypeWriter/utils.ts
3898
- import React22 from "react";
4605
+ import React23 from "react";
3899
4606
  var voidTags = /* @__PURE__ */ new Set([
3900
4607
  "br",
3901
4608
  "img",
@@ -3963,41 +4670,41 @@ var convertNodeToReactWithRange = (node, typedLen, rangeMap) => {
3963
4670
  props[attr.name] = attr.value;
3964
4671
  });
3965
4672
  if (voidTags.has(tag)) {
3966
- return React22.createElement(tag, props);
4673
+ return React23.createElement(tag, props);
3967
4674
  }
3968
4675
  const children = Array.from(element.childNodes).map((child) => convertNodeToReactWithRange(child, typedLen, rangeMap)).filter((n) => n != null);
3969
- return React22.createElement(tag, props, ...children);
4676
+ return React23.createElement(tag, props, ...children);
3970
4677
  };
3971
4678
  var htmlToReactProgressive = (root, typedLen, rangeMap) => {
3972
4679
  const nodes = Array.from(root.childNodes).map((child, idx) => {
3973
4680
  const node = convertNodeToReactWithRange(child, typedLen, rangeMap);
3974
- return node == null ? null : React22.createElement(React22.Fragment, { key: idx }, node);
4681
+ return node == null ? null : React23.createElement(React23.Fragment, { key: idx }, node);
3975
4682
  }).filter(Boolean);
3976
4683
  return nodes.length === 0 ? null : nodes;
3977
4684
  };
3978
4685
 
3979
4686
  // src/components/HtmlTypeWriter/HtmlTypeWriter.tsx
3980
- import { jsx as jsx326 } from "react/jsx-runtime";
4687
+ import { jsx as jsx327 } from "react/jsx-runtime";
3981
4688
  var HtmlTypeWriter = ({
3982
4689
  html,
3983
4690
  duration = 20,
3984
4691
  onDone,
3985
4692
  onChange
3986
4693
  }) => {
3987
- const [typedLen, setTypedLen] = React23.useState(0);
3988
- const doneCalledRef = React23.useRef(false);
3989
- const { doc, rangeMap, totalLength } = React23.useMemo(() => {
4694
+ const [typedLen, setTypedLen] = React24.useState(0);
4695
+ const doneCalledRef = React24.useRef(false);
4696
+ const { doc, rangeMap, totalLength } = React24.useMemo(() => {
3990
4697
  if (typeof window === "undefined") return { doc: null, rangeMap: /* @__PURE__ */ new Map(), totalLength: 0 };
3991
4698
  const decoded = decodeHtmlEntities(html);
3992
4699
  const doc2 = new DOMParser().parseFromString(decoded, "text/html");
3993
4700
  const { rangeMap: rangeMap2, totalLength: totalLength2 } = buildRangeMap(doc2.body);
3994
4701
  return { doc: doc2, rangeMap: rangeMap2, totalLength: totalLength2 };
3995
4702
  }, [html]);
3996
- React23.useEffect(() => {
4703
+ React24.useEffect(() => {
3997
4704
  setTypedLen(0);
3998
4705
  doneCalledRef.current = false;
3999
4706
  }, [html]);
4000
- React23.useEffect(() => {
4707
+ React24.useEffect(() => {
4001
4708
  if (!totalLength) return;
4002
4709
  if (typedLen >= totalLength) return;
4003
4710
  const timer = window.setInterval(() => {
@@ -4005,33 +4712,33 @@ var HtmlTypeWriter = ({
4005
4712
  }, duration);
4006
4713
  return () => window.clearInterval(timer);
4007
4714
  }, [typedLen, totalLength, duration]);
4008
- React23.useEffect(() => {
4715
+ React24.useEffect(() => {
4009
4716
  if (typedLen > 0 && typedLen < totalLength) {
4010
4717
  onChange?.();
4011
4718
  }
4012
4719
  }, [typedLen, totalLength, onChange]);
4013
- React23.useEffect(() => {
4720
+ React24.useEffect(() => {
4014
4721
  if (typedLen === totalLength && totalLength > 0 && !doneCalledRef.current) {
4015
4722
  doneCalledRef.current = true;
4016
4723
  onDone?.();
4017
4724
  }
4018
4725
  }, [typedLen, totalLength, onDone]);
4019
- const parsed = React23.useMemo(
4726
+ const parsed = React24.useMemo(
4020
4727
  () => doc ? htmlToReactProgressive(doc.body, typedLen, rangeMap) : null,
4021
4728
  [doc, typedLen, rangeMap]
4022
4729
  );
4023
- return /* @__PURE__ */ jsx326("div", { className: "lib-xplat-htmlTypewriter", children: parsed });
4730
+ return /* @__PURE__ */ jsx327("div", { className: "lib-xplat-htmlTypewriter", children: parsed });
4024
4731
  };
4025
4732
  HtmlTypeWriter.displayName = "HtmlTypeWriter";
4026
4733
  var HtmlTypeWriter_default = HtmlTypeWriter;
4027
4734
 
4028
4735
  // src/components/ImageSelector/ImageSelector.tsx
4029
- import React24 from "react";
4030
- import { jsx as jsx327, jsxs as jsxs210 } from "react/jsx-runtime";
4736
+ import React25 from "react";
4737
+ import { jsx as jsx328, jsxs as jsxs211 } from "react/jsx-runtime";
4031
4738
  var ImageSelector = (props) => {
4032
4739
  const { value, label, onChange } = props;
4033
- const [previewUrl, setPreviewUrl] = React24.useState();
4034
- React24.useEffect(() => {
4740
+ const [previewUrl, setPreviewUrl] = React25.useState();
4741
+ React25.useEffect(() => {
4035
4742
  if (!value) {
4036
4743
  setPreviewUrl(void 0);
4037
4744
  return;
@@ -4040,7 +4747,7 @@ var ImageSelector = (props) => {
4040
4747
  setPreviewUrl(url);
4041
4748
  return () => URL.revokeObjectURL(url);
4042
4749
  }, [value]);
4043
- const inputRef = React24.useRef(null);
4750
+ const inputRef = React25.useRef(null);
4044
4751
  const handleFileChange = (e) => {
4045
4752
  const selectedFile = e.target.files?.[0];
4046
4753
  if (selectedFile) {
@@ -4053,8 +4760,8 @@ var ImageSelector = (props) => {
4053
4760
  const handleOpenFileDialog = () => {
4054
4761
  inputRef.current?.click();
4055
4762
  };
4056
- return /* @__PURE__ */ jsxs210("div", { className: `lib-xplat-imageselector${value ? "" : " none-value"}`, children: [
4057
- /* @__PURE__ */ jsx327(
4763
+ return /* @__PURE__ */ jsxs211("div", { className: `lib-xplat-imageselector${value ? "" : " none-value"}`, children: [
4764
+ /* @__PURE__ */ jsx328(
4058
4765
  "input",
4059
4766
  {
4060
4767
  type: "file",
@@ -4064,13 +4771,13 @@ var ImageSelector = (props) => {
4064
4771
  ref: inputRef
4065
4772
  }
4066
4773
  ),
4067
- value && /* @__PURE__ */ jsxs210("div", { className: "action-bar", children: [
4068
- /* @__PURE__ */ jsx327("div", { className: "icon-wrapper", onClick: handleOpenFileDialog, children: /* @__PURE__ */ jsx327(UploadIcon_default, {}) }),
4069
- /* @__PURE__ */ jsx327("div", { className: "icon-wrapper", onClick: handleDeleteFile, children: /* @__PURE__ */ jsx327(DeleteIcon_default, {}) })
4774
+ value && /* @__PURE__ */ jsxs211("div", { className: "action-bar", children: [
4775
+ /* @__PURE__ */ jsx328("div", { className: "icon-wrapper", onClick: handleOpenFileDialog, children: /* @__PURE__ */ jsx328(UploadIcon_default, {}) }),
4776
+ /* @__PURE__ */ jsx328("div", { className: "icon-wrapper", onClick: handleDeleteFile, children: /* @__PURE__ */ jsx328(DeleteIcon_default, {}) })
4070
4777
  ] }),
4071
- /* @__PURE__ */ jsx327("div", { className: "content", children: previewUrl ? /* @__PURE__ */ jsx327("img", { src: previewUrl, alt: "preview" }) : /* @__PURE__ */ jsxs210("div", { className: "skeleton", onClick: handleOpenFileDialog, children: [
4072
- /* @__PURE__ */ jsx327("div", { className: "icon-wrapper", children: /* @__PURE__ */ jsx327(ImageIcon_default, {}) }),
4073
- /* @__PURE__ */ jsx327("div", { className: "label", children: label || "\uC774\uBBF8\uC9C0 \uCD94\uAC00\uD558\uAE30" })
4778
+ /* @__PURE__ */ jsx328("div", { className: "content", children: previewUrl ? /* @__PURE__ */ jsx328("img", { src: previewUrl, alt: "preview" }) : /* @__PURE__ */ jsxs211("div", { className: "skeleton", onClick: handleOpenFileDialog, children: [
4779
+ /* @__PURE__ */ jsx328("div", { className: "icon-wrapper", children: /* @__PURE__ */ jsx328(ImageIcon_default, {}) }),
4780
+ /* @__PURE__ */ jsx328("div", { className: "label", children: label || "\uC774\uBBF8\uC9C0 \uCD94\uAC00\uD558\uAE30" })
4074
4781
  ] }) })
4075
4782
  ] });
4076
4783
  };
@@ -4078,7 +4785,7 @@ ImageSelector.displayName = "ImageSelector";
4078
4785
  var ImageSelector_default = ImageSelector;
4079
4786
 
4080
4787
  // src/components/Pagination/Pagination.tsx
4081
- import { jsx as jsx328, jsxs as jsxs211 } from "react/jsx-runtime";
4788
+ import { jsx as jsx329, jsxs as jsxs212 } from "react/jsx-runtime";
4082
4789
  var getPageRange = (current, totalPages, siblingCount) => {
4083
4790
  const totalNumbers = siblingCount * 2 + 5;
4084
4791
  if (totalPages <= totalNumbers) {
@@ -4121,19 +4828,19 @@ var Pagination = (props) => {
4121
4828
  onChange?.(page);
4122
4829
  }
4123
4830
  };
4124
- return /* @__PURE__ */ jsxs211("nav", { className: clsx_default("lib-xplat-pagination", size, type), "aria-label": "\uD398\uC774\uC9C0 \uB124\uBE44\uAC8C\uC774\uC158", children: [
4125
- /* @__PURE__ */ jsx328(
4831
+ return /* @__PURE__ */ jsxs212("nav", { className: clsx_default("lib-xplat-pagination", size, type), "aria-label": "\uD398\uC774\uC9C0 \uB124\uBE44\uAC8C\uC774\uC158", children: [
4832
+ /* @__PURE__ */ jsx329(
4126
4833
  "button",
4127
4834
  {
4128
4835
  className: "page-btn prev",
4129
4836
  disabled: current <= 1,
4130
4837
  onClick: () => handleClick(current - 1),
4131
4838
  "aria-label": "\uC774\uC804 \uD398\uC774\uC9C0",
4132
- children: /* @__PURE__ */ jsx328(ChevronLeftIcon_default, {})
4839
+ children: /* @__PURE__ */ jsx329(ChevronLeftIcon_default, {})
4133
4840
  }
4134
4841
  ),
4135
4842
  pages.map(
4136
- (page, i) => page === "..." ? /* @__PURE__ */ jsx328("span", { className: "dots", children: "..." }, `dots-${i}`) : /* @__PURE__ */ jsx328(
4843
+ (page, i) => page === "..." ? /* @__PURE__ */ jsx329("span", { className: "dots", children: "..." }, `dots-${i}`) : /* @__PURE__ */ jsx329(
4137
4844
  "button",
4138
4845
  {
4139
4846
  className: clsx_default("page-btn", { active: page === current }),
@@ -4144,14 +4851,14 @@ var Pagination = (props) => {
4144
4851
  page
4145
4852
  )
4146
4853
  ),
4147
- /* @__PURE__ */ jsx328(
4854
+ /* @__PURE__ */ jsx329(
4148
4855
  "button",
4149
4856
  {
4150
4857
  className: "page-btn next",
4151
4858
  disabled: current >= totalPages,
4152
4859
  onClick: () => handleClick(current + 1),
4153
4860
  "aria-label": "\uB2E4\uC74C \uD398\uC774\uC9C0",
4154
- children: /* @__PURE__ */ jsx328(ChevronRightIcon_default, {})
4861
+ children: /* @__PURE__ */ jsx329(ChevronRightIcon_default, {})
4155
4862
  }
4156
4863
  )
4157
4864
  ] });
@@ -4160,17 +4867,17 @@ Pagination.displayName = "Pagination";
4160
4867
  var Pagination_default = Pagination;
4161
4868
 
4162
4869
  // src/components/PopOver/PopOver.tsx
4163
- import React25 from "react";
4164
- import { jsx as jsx329, jsxs as jsxs212 } from "react/jsx-runtime";
4870
+ import React26 from "react";
4871
+ import { jsx as jsx330, jsxs as jsxs213 } from "react/jsx-runtime";
4165
4872
  var PopOver = (props) => {
4166
4873
  const { children, isOpen, onClose, PopOverEl } = props;
4167
- const popRef = React25.useRef(null);
4168
- const triggerRef = React25.useRef(null);
4169
- const [localOpen, setLocalOpen] = React25.useState(false);
4170
- const [eventTrigger, setEventTrigger] = React25.useState(false);
4874
+ const popRef = React26.useRef(null);
4875
+ const triggerRef = React26.useRef(null);
4876
+ const [localOpen, setLocalOpen] = React26.useState(false);
4877
+ const [eventTrigger, setEventTrigger] = React26.useState(false);
4171
4878
  useClickOutside_default([popRef, triggerRef], onClose, isOpen);
4172
4879
  const position = useAutoPosition_default(triggerRef, popRef, localOpen);
4173
- React25.useEffect(() => {
4880
+ React26.useEffect(() => {
4174
4881
  if (isOpen) {
4175
4882
  setLocalOpen(isOpen);
4176
4883
  setTimeout(() => {
@@ -4183,7 +4890,7 @@ var PopOver = (props) => {
4183
4890
  }, 200);
4184
4891
  }
4185
4892
  }, [isOpen]);
4186
- return /* @__PURE__ */ jsxs212(
4893
+ return /* @__PURE__ */ jsxs213(
4187
4894
  "div",
4188
4895
  {
4189
4896
  className: "lib-xplat-pop-over",
@@ -4193,7 +4900,7 @@ var PopOver = (props) => {
4193
4900
  },
4194
4901
  children: [
4195
4902
  children,
4196
- localOpen && /* @__PURE__ */ jsx329(Portal_default, { children: /* @__PURE__ */ jsx329(
4903
+ localOpen && /* @__PURE__ */ jsx330(Portal_default, { children: /* @__PURE__ */ jsx330(
4197
4904
  "div",
4198
4905
  {
4199
4906
  className: clsx_default(
@@ -4216,7 +4923,7 @@ PopOver.displayName = "PopOver";
4216
4923
  var PopOver_default = PopOver;
4217
4924
 
4218
4925
  // src/components/Progress/Progress.tsx
4219
- import { jsx as jsx330, jsxs as jsxs213 } from "react/jsx-runtime";
4926
+ import { jsx as jsx331, jsxs as jsxs214 } from "react/jsx-runtime";
4220
4927
  var Progress = (props) => {
4221
4928
  const {
4222
4929
  value,
@@ -4226,8 +4933,8 @@ var Progress = (props) => {
4226
4933
  showLabel = false
4227
4934
  } = props;
4228
4935
  const percentage = Math.min(100, Math.max(0, value / max * 100));
4229
- return /* @__PURE__ */ jsxs213("div", { className: clsx_default("lib-xplat-progress", size, type), children: [
4230
- /* @__PURE__ */ jsx330(
4936
+ return /* @__PURE__ */ jsxs214("div", { className: clsx_default("lib-xplat-progress", size, type), children: [
4937
+ /* @__PURE__ */ jsx331(
4231
4938
  "div",
4232
4939
  {
4233
4940
  className: "track",
@@ -4235,7 +4942,7 @@ var Progress = (props) => {
4235
4942
  "aria-valuenow": value,
4236
4943
  "aria-valuemin": 0,
4237
4944
  "aria-valuemax": max,
4238
- children: /* @__PURE__ */ jsx330(
4945
+ children: /* @__PURE__ */ jsx331(
4239
4946
  "div",
4240
4947
  {
4241
4948
  className: "bar",
@@ -4244,7 +4951,7 @@ var Progress = (props) => {
4244
4951
  )
4245
4952
  }
4246
4953
  ),
4247
- showLabel && /* @__PURE__ */ jsxs213("span", { className: "label", children: [
4954
+ showLabel && /* @__PURE__ */ jsxs214("span", { className: "label", children: [
4248
4955
  Math.round(percentage),
4249
4956
  "%"
4250
4957
  ] })
@@ -4254,17 +4961,17 @@ Progress.displayName = "Progress";
4254
4961
  var Progress_default = Progress;
4255
4962
 
4256
4963
  // src/components/Radio/RadioGroupContext.tsx
4257
- import React26 from "react";
4258
- var RadioGroupContext = React26.createContext(
4964
+ import React27 from "react";
4965
+ var RadioGroupContext = React27.createContext(
4259
4966
  null
4260
4967
  );
4261
4968
  var useRadioGroupContext = () => {
4262
- return React26.useContext(RadioGroupContext);
4969
+ return React27.useContext(RadioGroupContext);
4263
4970
  };
4264
4971
  var RadioGroupContext_default = RadioGroupContext;
4265
4972
 
4266
4973
  // src/components/Radio/Radio.tsx
4267
- import { jsx as jsx331, jsxs as jsxs214 } from "react/jsx-runtime";
4974
+ import { jsx as jsx332, jsxs as jsxs215 } from "react/jsx-runtime";
4268
4975
  var Radio = (props) => {
4269
4976
  const {
4270
4977
  label,
@@ -4282,7 +4989,7 @@ var Radio = (props) => {
4282
4989
  value,
4283
4990
  onChange: rest.onChange
4284
4991
  };
4285
- return /* @__PURE__ */ jsxs214(
4992
+ return /* @__PURE__ */ jsxs215(
4286
4993
  "label",
4287
4994
  {
4288
4995
  className: clsx_default(
@@ -4292,18 +4999,18 @@ var Radio = (props) => {
4292
4999
  localChecked ? "checked" : void 0
4293
5000
  ),
4294
5001
  children: [
4295
- /* @__PURE__ */ jsx331("input", { ...rest, ...inputProps, checked: localChecked, type: "radio" }),
4296
- /* @__PURE__ */ jsx331(
5002
+ /* @__PURE__ */ jsx332("input", { ...rest, ...inputProps, checked: localChecked, type: "radio" }),
5003
+ /* @__PURE__ */ jsx332(
4297
5004
  "div",
4298
5005
  {
4299
5006
  className: clsx_default(
4300
5007
  "circle",
4301
5008
  localChecked ? "checked" : void 0
4302
5009
  ),
4303
- children: localChecked && /* @__PURE__ */ jsx331("div", { className: "inner-circle" })
5010
+ children: localChecked && /* @__PURE__ */ jsx332("div", { className: "inner-circle" })
4304
5011
  }
4305
5012
  ),
4306
- label && /* @__PURE__ */ jsx331("span", { children: label })
5013
+ label && /* @__PURE__ */ jsx332("span", { children: label })
4307
5014
  ]
4308
5015
  }
4309
5016
  );
@@ -4312,28 +5019,28 @@ Radio.displayName = "Radio";
4312
5019
  var Radio_default = Radio;
4313
5020
 
4314
5021
  // src/components/Radio/RadioGroup.tsx
4315
- import { Fragment as Fragment4, jsx as jsx332 } from "react/jsx-runtime";
5022
+ import { Fragment as Fragment4, jsx as jsx333 } from "react/jsx-runtime";
4316
5023
  var RadioGroup = (props) => {
4317
5024
  const { children, ...rest } = props;
4318
- return /* @__PURE__ */ jsx332(Fragment4, { children: /* @__PURE__ */ jsx332(RadioGroupContext_default.Provider, { value: rest, children }) });
5025
+ return /* @__PURE__ */ jsx333(Fragment4, { children: /* @__PURE__ */ jsx333(RadioGroupContext_default.Provider, { value: rest, children }) });
4319
5026
  };
4320
5027
  RadioGroup.displayName = "RadioGroup";
4321
5028
  var RadioGroup_default = RadioGroup;
4322
5029
 
4323
5030
  // src/components/Select/Select.tsx
4324
- import React29 from "react";
5031
+ import React30 from "react";
4325
5032
 
4326
5033
  // src/components/Select/context.ts
4327
- import React27 from "react";
4328
- var SelectContext = React27.createContext(null);
5034
+ import React28 from "react";
5035
+ var SelectContext = React28.createContext(null);
4329
5036
  var context_default = SelectContext;
4330
5037
 
4331
5038
  // src/components/Select/SelectItem.tsx
4332
- import React28 from "react";
4333
- import { jsx as jsx333 } from "react/jsx-runtime";
5039
+ import React29 from "react";
5040
+ import { jsx as jsx334 } from "react/jsx-runtime";
4334
5041
  var SelectItem = (props) => {
4335
5042
  const { children, value, onClick, disabled = false } = props;
4336
- const ctx = React28.useContext(context_default);
5043
+ const ctx = React29.useContext(context_default);
4337
5044
  const handleClick = (e) => {
4338
5045
  e.preventDefault();
4339
5046
  e.stopPropagation();
@@ -4342,7 +5049,7 @@ var SelectItem = (props) => {
4342
5049
  ctx?.close();
4343
5050
  onClick?.();
4344
5051
  };
4345
- return /* @__PURE__ */ jsx333(
5052
+ return /* @__PURE__ */ jsx334(
4346
5053
  "div",
4347
5054
  {
4348
5055
  className: clsx_default("select-item", disabled && "disabled"),
@@ -4363,7 +5070,7 @@ SelectItem.displayName = "Select.Item";
4363
5070
  var SelectItem_default = SelectItem;
4364
5071
 
4365
5072
  // src/components/Select/Select.tsx
4366
- import { jsx as jsx334, jsxs as jsxs215 } from "react/jsx-runtime";
5073
+ import { jsx as jsx335, jsxs as jsxs216 } from "react/jsx-runtime";
4367
5074
  var ANIMATION_DURATION_MS3 = 200;
4368
5075
  var SelectRoot = (props) => {
4369
5076
  const {
@@ -4375,26 +5082,26 @@ var SelectRoot = (props) => {
4375
5082
  error = false,
4376
5083
  size = "md"
4377
5084
  } = props;
4378
- const itemChildren = React29.Children.toArray(children).filter(
4379
- (child) => React29.isValidElement(child) && child.type === SelectItem_default
5085
+ const itemChildren = React30.Children.toArray(children).filter(
5086
+ (child) => React30.isValidElement(child) && child.type === SelectItem_default
4380
5087
  );
4381
5088
  const isControlled = valueProp !== void 0;
4382
- const [isOpen, setOpen] = React29.useState(false);
4383
- const [uncontrolledLabel, setUncontrolledLabel] = React29.useState(null);
4384
- const controlledLabel = React29.useMemo(() => {
5089
+ const [isOpen, setOpen] = React30.useState(false);
5090
+ const [uncontrolledLabel, setUncontrolledLabel] = React30.useState(null);
5091
+ const controlledLabel = React30.useMemo(() => {
4385
5092
  if (!isControlled) return null;
4386
5093
  const match = itemChildren.find((child) => child.props.value === valueProp);
4387
5094
  return match ? match.props.children : null;
4388
5095
  }, [isControlled, valueProp, itemChildren]);
4389
5096
  const selectedLabel = isControlled ? controlledLabel : uncontrolledLabel;
4390
- const triggerRef = React29.useRef(null);
4391
- const contentRef = React29.useRef(null);
4392
- const [mounted, setMounted] = React29.useState(false);
4393
- const [visible, setVisible] = React29.useState(false);
4394
- React29.useEffect(() => {
5097
+ const triggerRef = React30.useRef(null);
5098
+ const contentRef = React30.useRef(null);
5099
+ const [mounted, setMounted] = React30.useState(false);
5100
+ const [visible, setVisible] = React30.useState(false);
5101
+ React30.useEffect(() => {
4395
5102
  if (disabled && isOpen) setOpen(false);
4396
5103
  }, [disabled, isOpen]);
4397
- React29.useEffect(() => {
5104
+ React30.useEffect(() => {
4398
5105
  if (isOpen) {
4399
5106
  setMounted(true);
4400
5107
  const t2 = setTimeout(() => setVisible(true), 1);
@@ -4404,12 +5111,12 @@ var SelectRoot = (props) => {
4404
5111
  const t = setTimeout(() => setMounted(false), ANIMATION_DURATION_MS3);
4405
5112
  return () => clearTimeout(t);
4406
5113
  }, [isOpen]);
4407
- const open = React29.useCallback(() => setOpen(true), []);
4408
- const close = React29.useCallback(() => setOpen(false), []);
4409
- const toggle = React29.useCallback(() => setOpen((prev) => !prev), []);
5114
+ const open = React30.useCallback(() => setOpen(true), []);
5115
+ const close = React30.useCallback(() => setOpen(false), []);
5116
+ const toggle = React30.useCallback(() => setOpen((prev) => !prev), []);
4410
5117
  useClickOutside_default([contentRef, triggerRef], close, isOpen);
4411
5118
  const position = useAutoPosition_default(triggerRef, contentRef, mounted);
4412
- const setSelected = React29.useCallback(
5119
+ const setSelected = React30.useCallback(
4413
5120
  (label, itemValue) => {
4414
5121
  if (!isControlled) {
4415
5122
  setUncontrolledLabel(label);
@@ -4418,7 +5125,7 @@ var SelectRoot = (props) => {
4418
5125
  },
4419
5126
  [isControlled, onChange]
4420
5127
  );
4421
- const ctxValue = React29.useMemo(
5128
+ const ctxValue = React30.useMemo(
4422
5129
  () => ({
4423
5130
  isOpen,
4424
5131
  mounted,
@@ -4439,7 +5146,7 @@ var SelectRoot = (props) => {
4439
5146
  if (disabled) return;
4440
5147
  toggle();
4441
5148
  };
4442
- return /* @__PURE__ */ jsx334(context_default.Provider, { value: ctxValue, children: /* @__PURE__ */ jsxs215(
5149
+ return /* @__PURE__ */ jsx335(context_default.Provider, { value: ctxValue, children: /* @__PURE__ */ jsxs216(
4443
5150
  "div",
4444
5151
  {
4445
5152
  className: clsx_default(
@@ -4450,7 +5157,7 @@ var SelectRoot = (props) => {
4450
5157
  mounted && "is-open"
4451
5158
  ),
4452
5159
  children: [
4453
- /* @__PURE__ */ jsxs215(
5160
+ /* @__PURE__ */ jsxs216(
4454
5161
  "div",
4455
5162
  {
4456
5163
  ref: triggerRef,
@@ -4474,7 +5181,7 @@ var SelectRoot = (props) => {
4474
5181
  }
4475
5182
  },
4476
5183
  children: [
4477
- /* @__PURE__ */ jsx334(
5184
+ /* @__PURE__ */ jsx335(
4478
5185
  "span",
4479
5186
  {
4480
5187
  className: clsx_default(
@@ -4484,25 +5191,25 @@ var SelectRoot = (props) => {
4484
5191
  children: selectedLabel ?? placeholder
4485
5192
  }
4486
5193
  ),
4487
- /* @__PURE__ */ jsx334(
5194
+ /* @__PURE__ */ jsx335(
4488
5195
  "span",
4489
5196
  {
4490
5197
  className: clsx_default("select-trigger-icon", isOpen && "open"),
4491
5198
  "aria-hidden": true,
4492
- children: /* @__PURE__ */ jsx334(ChevronDownIcon_default, {})
5199
+ children: /* @__PURE__ */ jsx335(ChevronDownIcon_default, {})
4493
5200
  }
4494
5201
  )
4495
5202
  ]
4496
5203
  }
4497
5204
  ),
4498
- mounted && /* @__PURE__ */ jsx334(Portal_default, { children: /* @__PURE__ */ jsx334(
5205
+ mounted && /* @__PURE__ */ jsx335(Portal_default, { children: /* @__PURE__ */ jsx335(
4499
5206
  "div",
4500
5207
  {
4501
5208
  className: clsx_default("lib-xplat-select-content", position.direction, stateClass),
4502
5209
  ref: contentRef,
4503
5210
  style: { ...position.position, width: triggerRef.current?.offsetWidth },
4504
5211
  role: "listbox",
4505
- children: /* @__PURE__ */ jsx334(context_default.Provider, { value: ctxValue, children: itemChildren })
5212
+ children: /* @__PURE__ */ jsx335(context_default.Provider, { value: ctxValue, children: itemChildren })
4506
5213
  }
4507
5214
  ) })
4508
5215
  ]
@@ -4516,7 +5223,7 @@ var Select = Object.assign(SelectRoot, {
4516
5223
  var Select_default = Select;
4517
5224
 
4518
5225
  // src/components/Skeleton/Skeleton.tsx
4519
- import { jsx as jsx335 } from "react/jsx-runtime";
5226
+ import { jsx as jsx336 } from "react/jsx-runtime";
4520
5227
  var SIZE_MAP = {
4521
5228
  xs: "var(--spacing-size-1)",
4522
5229
  sm: "var(--spacing-size-2)",
@@ -4532,7 +5239,7 @@ var Skeleton = (props) => {
4532
5239
  ...width != null && { width: SIZE_MAP[width] },
4533
5240
  ...height != null && { height: SIZE_MAP[height] }
4534
5241
  };
4535
- return /* @__PURE__ */ jsx335(
5242
+ return /* @__PURE__ */ jsx336(
4536
5243
  "div",
4537
5244
  {
4538
5245
  className: clsx_default("lib-xplat-skeleton", variant),
@@ -4545,20 +5252,20 @@ Skeleton.displayName = "Skeleton";
4545
5252
  var Skeleton_default = Skeleton;
4546
5253
 
4547
5254
  // src/components/Spinner/Spinner.tsx
4548
- import { jsx as jsx336, jsxs as jsxs216 } from "react/jsx-runtime";
5255
+ import { jsx as jsx337, jsxs as jsxs217 } from "react/jsx-runtime";
4549
5256
  var Spinner = (props) => {
4550
5257
  const {
4551
5258
  size = "md",
4552
5259
  type = "brand"
4553
5260
  } = props;
4554
- return /* @__PURE__ */ jsx336(
5261
+ return /* @__PURE__ */ jsx337(
4555
5262
  "div",
4556
5263
  {
4557
5264
  className: clsx_default("lib-xplat-spinner", size, type),
4558
5265
  role: "status",
4559
5266
  "aria-label": "\uB85C\uB529 \uC911",
4560
- children: /* @__PURE__ */ jsxs216("svg", { viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
4561
- /* @__PURE__ */ jsx336(
5267
+ children: /* @__PURE__ */ jsxs217("svg", { viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
5268
+ /* @__PURE__ */ jsx337(
4562
5269
  "circle",
4563
5270
  {
4564
5271
  className: "track",
@@ -4568,7 +5275,7 @@ var Spinner = (props) => {
4568
5275
  strokeWidth: "3"
4569
5276
  }
4570
5277
  ),
4571
- /* @__PURE__ */ jsx336(
5278
+ /* @__PURE__ */ jsx337(
4572
5279
  "circle",
4573
5280
  {
4574
5281
  className: "indicator",
@@ -4587,20 +5294,20 @@ Spinner.displayName = "Spinner";
4587
5294
  var Spinner_default = Spinner;
4588
5295
 
4589
5296
  // src/components/Steps/Steps.tsx
4590
- import { jsx as jsx337, jsxs as jsxs217 } from "react/jsx-runtime";
5297
+ import { jsx as jsx338, jsxs as jsxs218 } from "react/jsx-runtime";
4591
5298
  var Steps = (props) => {
4592
5299
  const {
4593
5300
  items,
4594
5301
  current,
4595
5302
  type = "brand"
4596
5303
  } = props;
4597
- return /* @__PURE__ */ jsx337("div", { className: clsx_default("lib-xplat-steps", type), children: items.map((item, index) => {
5304
+ return /* @__PURE__ */ jsx338("div", { className: clsx_default("lib-xplat-steps", type), children: items.map((item, index) => {
4598
5305
  const status = index < current ? "completed" : index === current ? "active" : "pending";
4599
- return /* @__PURE__ */ jsxs217("div", { className: clsx_default("step-item", status), children: [
4600
- /* @__PURE__ */ jsx337("div", { className: "step-circle", children: status === "completed" ? /* @__PURE__ */ jsx337(CheckIcon_default, {}) : /* @__PURE__ */ jsx337("span", { children: index + 1 }) }),
4601
- /* @__PURE__ */ jsxs217("div", { className: "step-content", children: [
4602
- /* @__PURE__ */ jsx337("span", { className: "step-title", children: item.title }),
4603
- item.description && /* @__PURE__ */ jsx337("span", { className: "step-description", children: item.description })
5306
+ return /* @__PURE__ */ jsxs218("div", { className: clsx_default("step-item", status), children: [
5307
+ /* @__PURE__ */ jsx338("div", { className: "step-circle", children: status === "completed" ? /* @__PURE__ */ jsx338(CheckIcon_default, {}) : /* @__PURE__ */ jsx338("span", { children: index + 1 }) }),
5308
+ /* @__PURE__ */ jsxs218("div", { className: "step-content", children: [
5309
+ /* @__PURE__ */ jsx338("span", { className: "step-title", children: item.title }),
5310
+ item.description && /* @__PURE__ */ jsx338("span", { className: "step-description", children: item.description })
4604
5311
  ] })
4605
5312
  ] }, index);
4606
5313
  }) });
@@ -4609,8 +5316,8 @@ Steps.displayName = "Steps";
4609
5316
  var Steps_default = Steps;
4610
5317
 
4611
5318
  // src/components/Swiper/Swiper.tsx
4612
- import React30 from "react";
4613
- import { jsx as jsx338, jsxs as jsxs218 } from "react/jsx-runtime";
5319
+ import React31 from "react";
5320
+ import { jsx as jsx339, jsxs as jsxs219 } from "react/jsx-runtime";
4614
5321
  var Swiper = (props) => {
4615
5322
  const {
4616
5323
  auto = false,
@@ -4634,25 +5341,25 @@ var Swiper = (props) => {
4634
5341
  const maxIndex = Math.max(0, totalSlides - viewItemCount);
4635
5342
  const useLoop = loop && canSlide;
4636
5343
  const cloneCount = useLoop ? totalSlides : 0;
4637
- const extendedItems = React30.useMemo(() => {
5344
+ const extendedItems = React31.useMemo(() => {
4638
5345
  if (!useLoop) return items;
4639
5346
  return [...items, ...items, ...items];
4640
5347
  }, [items, useLoop]);
4641
5348
  const initialIdx = Math.max(0, Math.min(indexProp ?? 0, maxIndex));
4642
- const [innerIndex, setInnerIndex] = React30.useState(
5349
+ const [innerIndex, setInnerIndex] = React31.useState(
4643
5350
  useLoop ? cloneCount + initialIdx : initialIdx
4644
5351
  );
4645
- const [isDragging, setIsDragging] = React30.useState(false);
4646
- const [dragOffset, setDragOffset] = React30.useState(0);
4647
- const [animated, setAnimated] = React30.useState(true);
4648
- const [containerWidth, setContainerWidth] = React30.useState(0);
4649
- const containerRef = React30.useRef(null);
4650
- const startXRef = React30.useRef(0);
4651
- const startTimeRef = React30.useRef(0);
4652
- const autoplayTimerRef = React30.useRef(null);
4653
- const resumeTimeoutRef = React30.useRef(null);
4654
- const [paused, setPaused] = React30.useState(false);
4655
- React30.useEffect(() => {
5352
+ const [isDragging, setIsDragging] = React31.useState(false);
5353
+ const [dragOffset, setDragOffset] = React31.useState(0);
5354
+ const [animated, setAnimated] = React31.useState(true);
5355
+ const [containerWidth, setContainerWidth] = React31.useState(0);
5356
+ const containerRef = React31.useRef(null);
5357
+ const startXRef = React31.useRef(0);
5358
+ const startTimeRef = React31.useRef(0);
5359
+ const autoplayTimerRef = React31.useRef(null);
5360
+ const resumeTimeoutRef = React31.useRef(null);
5361
+ const [paused, setPaused] = React31.useState(false);
5362
+ React31.useEffect(() => {
4656
5363
  const el = containerRef.current;
4657
5364
  if (!el) return;
4658
5365
  const ro = new ResizeObserver((entries) => {
@@ -4671,7 +5378,7 @@ var Swiper = (props) => {
4671
5378
  return ((inner - cloneCount) % totalSlides + totalSlides) % totalSlides;
4672
5379
  };
4673
5380
  const realIndex = getRealIndex(innerIndex);
4674
- const moveToInner = React30.useCallback(
5381
+ const moveToInner = React31.useCallback(
4675
5382
  (idx, withAnim = true) => {
4676
5383
  if (!useLoop) {
4677
5384
  setAnimated(withAnim);
@@ -4699,7 +5406,7 @@ var Swiper = (props) => {
4699
5406
  },
4700
5407
  [useLoop, cloneCount, totalSlides]
4701
5408
  );
4702
- const handleTransitionEnd = React30.useCallback(() => {
5409
+ const handleTransitionEnd = React31.useCallback(() => {
4703
5410
  if (!useLoop) return;
4704
5411
  const real = getRealIndex(innerIndex);
4705
5412
  const canonical = cloneCount + real;
@@ -4709,7 +5416,7 @@ var Swiper = (props) => {
4709
5416
  }
4710
5417
  onChange?.(Math.min(real, maxIndex));
4711
5418
  }, [useLoop, innerIndex, cloneCount, totalSlides, maxIndex, onChange]);
4712
- const slideTo = React30.useCallback(
5419
+ const slideTo = React31.useCallback(
4713
5420
  (logicalIndex) => {
4714
5421
  if (!canSlide) return;
4715
5422
  const clamped = useLoop ? logicalIndex : Math.max(0, Math.min(logicalIndex, maxIndex));
@@ -4719,7 +5426,7 @@ var Swiper = (props) => {
4719
5426
  },
4720
5427
  [canSlide, useLoop, cloneCount, maxIndex, onChange, moveToInner]
4721
5428
  );
4722
- const slideNext = React30.useCallback(() => {
5429
+ const slideNext = React31.useCallback(() => {
4723
5430
  if (!canSlide) return;
4724
5431
  const nextInner = innerIndex + slideBy;
4725
5432
  if (useLoop) {
@@ -4728,7 +5435,7 @@ var Swiper = (props) => {
4728
5435
  moveToInner(Math.min(nextInner, maxIndex), true);
4729
5436
  }
4730
5437
  }, [canSlide, useLoop, innerIndex, slideBy, maxIndex, moveToInner]);
4731
- const slidePrev = React30.useCallback(() => {
5438
+ const slidePrev = React31.useCallback(() => {
4732
5439
  if (!canSlide) return;
4733
5440
  const prevInner = innerIndex - slideBy;
4734
5441
  if (useLoop) {
@@ -4737,7 +5444,7 @@ var Swiper = (props) => {
4737
5444
  moveToInner(Math.max(prevInner, 0), true);
4738
5445
  }
4739
5446
  }, [canSlide, useLoop, innerIndex, slideBy, moveToInner]);
4740
- React30.useEffect(() => {
5447
+ React31.useEffect(() => {
4741
5448
  if (indexProp === void 0) return;
4742
5449
  const clamped = Math.max(0, Math.min(indexProp, maxIndex));
4743
5450
  const target = useLoop ? cloneCount + clamped : clamped;
@@ -4745,12 +5452,12 @@ var Swiper = (props) => {
4745
5452
  moveToInner(target, true);
4746
5453
  }
4747
5454
  }, [indexProp]);
4748
- React30.useImperativeHandle(swiperRef, () => ({
5455
+ React31.useImperativeHandle(swiperRef, () => ({
4749
5456
  slidePrev,
4750
5457
  slideNext,
4751
5458
  slideTo
4752
5459
  }));
4753
- React30.useEffect(() => {
5460
+ React31.useEffect(() => {
4754
5461
  if (!auto || !canSlide || paused) return;
4755
5462
  autoplayTimerRef.current = setInterval(slideNext, autoplayDelay);
4756
5463
  return () => {
@@ -4776,7 +5483,7 @@ var Swiper = (props) => {
4776
5483
  resumeTimeoutRef.current = null;
4777
5484
  }, pauseOnInteraction);
4778
5485
  };
4779
- React30.useEffect(() => {
5486
+ React31.useEffect(() => {
4780
5487
  return () => {
4781
5488
  if (resumeTimeoutRef.current) clearTimeout(resumeTimeoutRef.current);
4782
5489
  };
@@ -4794,7 +5501,7 @@ var Swiper = (props) => {
4794
5501
  startXRef.current = getClientX(e);
4795
5502
  startTimeRef.current = Date.now();
4796
5503
  };
4797
- React30.useEffect(() => {
5504
+ React31.useEffect(() => {
4798
5505
  if (!isDragging) return;
4799
5506
  const handleMove = (e) => {
4800
5507
  setDragOffset(getClientX(e) - startXRef.current);
@@ -4833,8 +5540,8 @@ var Swiper = (props) => {
4833
5540
  }, [isDragging, dragOffset, innerIndex, useLoop, maxIndex, slideStep, moveToInner]);
4834
5541
  const slideWidthPercent = 100 / viewItemCount;
4835
5542
  const gapAdjust = spaceBetween * (viewItemCount - 1) / viewItemCount;
4836
- const slideElements = React30.useMemo(
4837
- () => extendedItems.map((item, idx) => /* @__PURE__ */ jsx338(
5543
+ const slideElements = React31.useMemo(
5544
+ () => extendedItems.map((item, idx) => /* @__PURE__ */ jsx339(
4838
5545
  "div",
4839
5546
  {
4840
5547
  className: "lib-xplat-swiper__slide",
@@ -4853,14 +5560,14 @@ var Swiper = (props) => {
4853
5560
  Math.floor(realIndex / slideBy),
4854
5561
  totalSteps - 1
4855
5562
  );
4856
- return /* @__PURE__ */ jsxs218("div", { className: "lib-xplat-swiper", ref: containerRef, children: [
4857
- /* @__PURE__ */ jsx338(
5563
+ return /* @__PURE__ */ jsxs219("div", { className: "lib-xplat-swiper", ref: containerRef, children: [
5564
+ /* @__PURE__ */ jsx339(
4858
5565
  "div",
4859
5566
  {
4860
5567
  className: "lib-xplat-swiper__viewport",
4861
5568
  onMouseDown: handleDragStart,
4862
5569
  onTouchStart: handleDragStart,
4863
- children: /* @__PURE__ */ jsx338(
5570
+ children: /* @__PURE__ */ jsx339(
4864
5571
  "div",
4865
5572
  {
4866
5573
  className: clsx_default(
@@ -4878,7 +5585,7 @@ var Swiper = (props) => {
4878
5585
  )
4879
5586
  }
4880
5587
  ),
4881
- showProgress && canSlide && /* @__PURE__ */ jsx338("div", { className: "lib-xplat-swiper__progress", children: /* @__PURE__ */ jsx338("div", { className: "lib-xplat-swiper__progress-track", children: /* @__PURE__ */ jsx338(
5588
+ showProgress && canSlide && /* @__PURE__ */ jsx339("div", { className: "lib-xplat-swiper__progress", children: /* @__PURE__ */ jsx339("div", { className: "lib-xplat-swiper__progress-track", children: /* @__PURE__ */ jsx339(
4882
5589
  "span",
4883
5590
  {
4884
5591
  className: "lib-xplat-swiper__progress-fill",
@@ -4888,7 +5595,7 @@ var Swiper = (props) => {
4888
5595
  }
4889
5596
  }
4890
5597
  ) }) }),
4891
- canSlide && /* @__PURE__ */ jsx338("div", { className: "lib-xplat-swiper__dots", children: Array.from({ length: totalSteps }, (_, i) => /* @__PURE__ */ jsx338(
5598
+ canSlide && /* @__PURE__ */ jsx339("div", { className: "lib-xplat-swiper__dots", children: Array.from({ length: totalSteps }, (_, i) => /* @__PURE__ */ jsx339(
4892
5599
  "button",
4893
5600
  {
4894
5601
  className: clsx_default(
@@ -4906,8 +5613,8 @@ Swiper.displayName = "Swiper";
4906
5613
  var Swiper_default = Swiper;
4907
5614
 
4908
5615
  // src/components/Switch/Switch.tsx
4909
- import React31 from "react";
4910
- import { jsx as jsx339 } from "react/jsx-runtime";
5616
+ import React32 from "react";
5617
+ import { jsx as jsx340 } from "react/jsx-runtime";
4911
5618
  var KNOB_TRANSITION_MS = 250;
4912
5619
  var Switch = (props) => {
4913
5620
  const {
@@ -4917,9 +5624,9 @@ var Switch = (props) => {
4917
5624
  disabled,
4918
5625
  onChange
4919
5626
  } = props;
4920
- const [isAnimating, setIsAnimating] = React31.useState(false);
4921
- const timeoutRef = React31.useRef(null);
4922
- React31.useEffect(() => {
5627
+ const [isAnimating, setIsAnimating] = React32.useState(false);
5628
+ const timeoutRef = React32.useRef(null);
5629
+ React32.useEffect(() => {
4923
5630
  return () => {
4924
5631
  if (timeoutRef.current) clearTimeout(timeoutRef.current);
4925
5632
  };
@@ -4934,7 +5641,7 @@ var Switch = (props) => {
4934
5641
  timeoutRef.current = null;
4935
5642
  }, KNOB_TRANSITION_MS);
4936
5643
  };
4937
- return /* @__PURE__ */ jsx339(
5644
+ return /* @__PURE__ */ jsx340(
4938
5645
  "div",
4939
5646
  {
4940
5647
  className: clsx_default(
@@ -4947,7 +5654,7 @@ var Switch = (props) => {
4947
5654
  ),
4948
5655
  onClick: handleClick,
4949
5656
  "aria-disabled": disabled || isAnimating,
4950
- children: /* @__PURE__ */ jsx339("div", { className: clsx_default("knob", value ? "checked" : void 0) })
5657
+ children: /* @__PURE__ */ jsx340("div", { className: clsx_default("knob", value ? "checked" : void 0) })
4951
5658
  }
4952
5659
  );
4953
5660
  };
@@ -4955,17 +5662,17 @@ Switch.displayName = "Switch";
4955
5662
  var Switch_default = Switch;
4956
5663
 
4957
5664
  // src/components/Table/TableContext.tsx
4958
- import React32 from "react";
4959
- var TableContext = React32.createContext(null);
5665
+ import React33 from "react";
5666
+ var TableContext = React33.createContext(null);
4960
5667
  var useTableContext = () => {
4961
- const ctx = React32.useContext(TableContext);
5668
+ const ctx = React33.useContext(TableContext);
4962
5669
  if (!ctx) throw new Error("Table components must be used inside <Table>");
4963
5670
  return ctx;
4964
5671
  };
4965
5672
  var TableContext_default = TableContext;
4966
5673
 
4967
5674
  // src/components/Table/Table.tsx
4968
- import { jsx as jsx340 } from "react/jsx-runtime";
5675
+ import { jsx as jsx341 } from "react/jsx-runtime";
4969
5676
  var Table = (props) => {
4970
5677
  const {
4971
5678
  children,
@@ -4975,7 +5682,7 @@ var Table = (props) => {
4975
5682
  headerSticky = false,
4976
5683
  stickyShadow = true
4977
5684
  } = props;
4978
- return /* @__PURE__ */ jsx340("div", { className: `lib-xplat-table-wrapper ${size}`, children: /* @__PURE__ */ jsx340(
5685
+ return /* @__PURE__ */ jsx341("div", { className: `lib-xplat-table-wrapper ${size}`, children: /* @__PURE__ */ jsx341(
4979
5686
  TableContext_default.Provider,
4980
5687
  {
4981
5688
  value: {
@@ -4984,7 +5691,7 @@ var Table = (props) => {
4984
5691
  headerSticky,
4985
5692
  stickyShadow
4986
5693
  },
4987
- children: /* @__PURE__ */ jsx340("table", { className: "lib-xplat-table", children })
5694
+ children: /* @__PURE__ */ jsx341("table", { className: "lib-xplat-table", children })
4988
5695
  }
4989
5696
  ) });
4990
5697
  };
@@ -4992,41 +5699,41 @@ Table.displayName = "Table";
4992
5699
  var Table_default = Table;
4993
5700
 
4994
5701
  // src/components/Table/TableBody.tsx
4995
- import { jsx as jsx341 } from "react/jsx-runtime";
5702
+ import { jsx as jsx342 } from "react/jsx-runtime";
4996
5703
  var TableBody = (props) => {
4997
5704
  const { children } = props;
4998
- return /* @__PURE__ */ jsx341("tbody", { children });
5705
+ return /* @__PURE__ */ jsx342("tbody", { children });
4999
5706
  };
5000
5707
  TableBody.displayName = "TableBody";
5001
5708
  var TableBody_default = TableBody;
5002
5709
 
5003
5710
  // src/components/Table/TableCell.tsx
5004
- import React35 from "react";
5711
+ import React36 from "react";
5005
5712
 
5006
5713
  // src/components/Table/TableHeadContext.tsx
5007
- import React33 from "react";
5008
- var TableHeadContext = React33.createContext(
5714
+ import React34 from "react";
5715
+ var TableHeadContext = React34.createContext(
5009
5716
  null
5010
5717
  );
5011
5718
  var useTableHeadContext = () => {
5012
- const ctx = React33.useContext(TableHeadContext);
5719
+ const ctx = React34.useContext(TableHeadContext);
5013
5720
  return ctx;
5014
5721
  };
5015
5722
  var TableHeadContext_default = TableHeadContext;
5016
5723
 
5017
5724
  // src/components/Table/TableRowContext.tsx
5018
- import React34 from "react";
5019
- var TableRowContext = React34.createContext(null);
5725
+ import React35 from "react";
5726
+ var TableRowContext = React35.createContext(null);
5020
5727
  var useTableRowContext = () => {
5021
- const ctx = React34.useContext(TableRowContext);
5728
+ const ctx = React35.useContext(TableRowContext);
5022
5729
  if (!ctx) throw new Error("Table components must be used inside <Table>");
5023
5730
  return ctx;
5024
5731
  };
5025
5732
  var TableRowContext_default = TableRowContext;
5026
5733
 
5027
5734
  // src/components/Table/TableCell.tsx
5028
- import { jsx as jsx342 } from "react/jsx-runtime";
5029
- var TableCell = React35.memo((props) => {
5735
+ import { jsx as jsx343 } from "react/jsx-runtime";
5736
+ var TableCell = React36.memo((props) => {
5030
5737
  const {
5031
5738
  children,
5032
5739
  align = "center",
@@ -5038,9 +5745,9 @@ var TableCell = React35.memo((props) => {
5038
5745
  const { registerStickyCell, stickyCells } = useTableRowContext();
5039
5746
  const { stickyShadow } = useTableContext();
5040
5747
  const headContext = useTableHeadContext();
5041
- const [left, setLeft] = React35.useState(0);
5042
- const cellRef = React35.useRef(null);
5043
- const calculateLeft = React35.useCallback(() => {
5748
+ const [left, setLeft] = React36.useState(0);
5749
+ const cellRef = React36.useRef(null);
5750
+ const calculateLeft = React36.useCallback(() => {
5044
5751
  if (!cellRef.current) return 0;
5045
5752
  let totalLeft = 0;
5046
5753
  for (const ref of stickyCells) {
@@ -5049,7 +5756,7 @@ var TableCell = React35.memo((props) => {
5049
5756
  }
5050
5757
  return totalLeft;
5051
5758
  }, [stickyCells]);
5052
- React35.useEffect(() => {
5759
+ React36.useEffect(() => {
5053
5760
  if (!isSticky || !cellRef.current) return;
5054
5761
  registerStickyCell(cellRef);
5055
5762
  setLeft(calculateLeft());
@@ -5067,7 +5774,7 @@ var TableCell = React35.memo((props) => {
5067
5774
  const CellTag = cellRef.current?.tagName === "TH" ? "th" : "td";
5068
5775
  const isLastSticky = isSticky && stickyCells[stickyCells.length - 1] === cellRef;
5069
5776
  const enableHover = headContext && headContext.cellHover;
5070
- return /* @__PURE__ */ jsx342(
5777
+ return /* @__PURE__ */ jsx343(
5071
5778
  CellTag,
5072
5779
  {
5073
5780
  ref: cellRef,
@@ -5092,21 +5799,21 @@ TableCell.displayName = "TableCell";
5092
5799
  var TableCell_default = TableCell;
5093
5800
 
5094
5801
  // src/components/Table/TableHead.tsx
5095
- import { jsx as jsx343 } from "react/jsx-runtime";
5802
+ import { jsx as jsx344 } from "react/jsx-runtime";
5096
5803
  var TableHead = ({
5097
5804
  children,
5098
5805
  cellHover = false
5099
5806
  }) => {
5100
5807
  const { headerSticky } = useTableContext();
5101
- return /* @__PURE__ */ jsx343(TableHeadContext_default.Provider, { value: { cellHover }, children: /* @__PURE__ */ jsx343("thead", { className: clsx_default(headerSticky ? "table-sticky" : null), children }) });
5808
+ return /* @__PURE__ */ jsx344(TableHeadContext_default.Provider, { value: { cellHover }, children: /* @__PURE__ */ jsx344("thead", { className: clsx_default(headerSticky ? "table-sticky" : null), children }) });
5102
5809
  };
5103
5810
  TableHead.displayName = "TableHead";
5104
5811
  var TableHead_default = TableHead;
5105
5812
 
5106
5813
  // src/components/Table/TableRow.tsx
5107
- import React36 from "react";
5108
- import { jsx as jsx344 } from "react/jsx-runtime";
5109
- var TableRow = React36.memo((props) => {
5814
+ import React37 from "react";
5815
+ import { jsx as jsx345 } from "react/jsx-runtime";
5816
+ var TableRow = React37.memo((props) => {
5110
5817
  const {
5111
5818
  children,
5112
5819
  type = "secondary",
@@ -5115,14 +5822,14 @@ var TableRow = React36.memo((props) => {
5115
5822
  onClick
5116
5823
  } = props;
5117
5824
  const { rowBorderUse } = useTableContext();
5118
- const [stickyCells, setStickyCells] = React36.useState([]);
5825
+ const [stickyCells, setStickyCells] = React37.useState([]);
5119
5826
  const registerStickyCell = (ref) => {
5120
5827
  setStickyCells((prev) => {
5121
5828
  if (prev.includes(ref)) return prev;
5122
5829
  return [...prev, ref];
5123
5830
  });
5124
5831
  };
5125
- return /* @__PURE__ */ jsx344(TableRowContext_default.Provider, { value: { stickyCells, registerStickyCell }, children: /* @__PURE__ */ jsx344(
5832
+ return /* @__PURE__ */ jsx345(TableRowContext_default.Provider, { value: { stickyCells, registerStickyCell }, children: /* @__PURE__ */ jsx345(
5126
5833
  "tr",
5127
5834
  {
5128
5835
  className: clsx_default(
@@ -5146,7 +5853,7 @@ TableRow.displayName = "TableRow";
5146
5853
  var TableRow_default = TableRow;
5147
5854
 
5148
5855
  // src/components/Tag/Tag.tsx
5149
- import { jsx as jsx345, jsxs as jsxs219 } from "react/jsx-runtime";
5856
+ import { jsx as jsx346, jsxs as jsxs220 } from "react/jsx-runtime";
5150
5857
  var Tag = (props) => {
5151
5858
  const {
5152
5859
  children,
@@ -5156,7 +5863,7 @@ var Tag = (props) => {
5156
5863
  disabled = false,
5157
5864
  colorIndex
5158
5865
  } = props;
5159
- return /* @__PURE__ */ jsxs219(
5866
+ return /* @__PURE__ */ jsxs220(
5160
5867
  "span",
5161
5868
  {
5162
5869
  className: clsx_default(
@@ -5167,8 +5874,8 @@ var Tag = (props) => {
5167
5874
  disabled && "disabled"
5168
5875
  ),
5169
5876
  children: [
5170
- /* @__PURE__ */ jsx345("span", { className: "tag-label", children }),
5171
- onClose && /* @__PURE__ */ jsx345("button", { className: "tag-close", onClick: onClose, "aria-label": "\uC0AD\uC81C", disabled, children: /* @__PURE__ */ jsx345(XIcon_default, {}) })
5877
+ /* @__PURE__ */ jsx346("span", { className: "tag-label", children }),
5878
+ onClose && /* @__PURE__ */ jsx346("button", { className: "tag-close", onClick: onClose, "aria-label": "\uC0AD\uC81C", disabled, children: /* @__PURE__ */ jsx346(XIcon_default, {}) })
5172
5879
  ]
5173
5880
  }
5174
5881
  );
@@ -5177,12 +5884,12 @@ Tag.displayName = "Tag";
5177
5884
  var Tag_default = Tag;
5178
5885
 
5179
5886
  // src/components/TextArea/TextArea.tsx
5180
- import React37 from "react";
5181
- import { jsx as jsx346 } from "react/jsx-runtime";
5182
- var TextArea = React37.forwardRef(
5887
+ import React38 from "react";
5888
+ import { jsx as jsx347 } from "react/jsx-runtime";
5889
+ var TextArea = React38.forwardRef(
5183
5890
  (props, ref) => {
5184
5891
  const { value, onChange, disabled, ...textareaProps } = props;
5185
- const localRef = React37.useRef(null);
5892
+ const localRef = React38.useRef(null);
5186
5893
  const setRefs = (el) => {
5187
5894
  localRef.current = el;
5188
5895
  if (!ref) return;
@@ -5202,21 +5909,21 @@ var TextArea = React37.forwardRef(
5202
5909
  onChange(event);
5203
5910
  }
5204
5911
  };
5205
- React37.useEffect(() => {
5912
+ React38.useEffect(() => {
5206
5913
  const el = localRef.current;
5207
5914
  if (!el) return;
5208
5915
  el.style.height = "0px";
5209
5916
  const nextHeight = Math.min(el.scrollHeight, 400);
5210
5917
  el.style.height = `${nextHeight}px`;
5211
5918
  }, [value]);
5212
- return /* @__PURE__ */ jsx346("div", { className: "lib-xplat-textarea-wrapper", children: /* @__PURE__ */ jsx346(
5919
+ return /* @__PURE__ */ jsx347("div", { className: "lib-xplat-textarea-wrapper", children: /* @__PURE__ */ jsx347(
5213
5920
  "div",
5214
5921
  {
5215
5922
  className: clsx_default(
5216
5923
  "lib-xplat-textarea",
5217
5924
  disabled ? "disabled" : void 0
5218
5925
  ),
5219
- children: /* @__PURE__ */ jsx346(
5926
+ children: /* @__PURE__ */ jsx347(
5220
5927
  "textarea",
5221
5928
  {
5222
5929
  ...textareaProps,
@@ -5234,25 +5941,25 @@ TextArea.displayName = "TextArea";
5234
5941
  var TextArea_default = TextArea;
5235
5942
 
5236
5943
  // src/components/Toast/Toast.tsx
5237
- import React38 from "react";
5944
+ import React39 from "react";
5238
5945
  import { createPortal as createPortal3 } from "react-dom";
5239
- import { jsx as jsx347, jsxs as jsxs220 } from "react/jsx-runtime";
5240
- var ToastContext = React38.createContext(null);
5946
+ import { jsx as jsx348, jsxs as jsxs221 } from "react/jsx-runtime";
5947
+ var ToastContext = React39.createContext(null);
5241
5948
  var useToast = () => {
5242
- const ctx = React38.useContext(ToastContext);
5949
+ const ctx = React39.useContext(ToastContext);
5243
5950
  if (!ctx) throw new Error("useToast must be used within ToastProvider");
5244
5951
  return ctx;
5245
5952
  };
5246
5953
  var EXIT_DURATION = 300;
5247
5954
  var ToastItemComponent = ({ item, isExiting, onClose }) => {
5248
- const ref = React38.useRef(null);
5249
- const [height, setHeight] = React38.useState(void 0);
5250
- React38.useEffect(() => {
5955
+ const ref = React39.useRef(null);
5956
+ const [height, setHeight] = React39.useState(void 0);
5957
+ React39.useEffect(() => {
5251
5958
  if (ref.current && !isExiting) {
5252
5959
  setHeight(ref.current.offsetHeight);
5253
5960
  }
5254
5961
  }, [isExiting]);
5255
- return /* @__PURE__ */ jsx347(
5962
+ return /* @__PURE__ */ jsx348(
5256
5963
  "div",
5257
5964
  {
5258
5965
  className: clsx_default("lib-xplat-toast-wrapper", { exit: isExiting }),
@@ -5260,15 +5967,15 @@ var ToastItemComponent = ({ item, isExiting, onClose }) => {
5260
5967
  maxHeight: isExiting ? 0 : height ?? "none",
5261
5968
  marginBottom: isExiting ? 0 : void 0
5262
5969
  },
5263
- children: /* @__PURE__ */ jsxs220(
5970
+ children: /* @__PURE__ */ jsxs221(
5264
5971
  "div",
5265
5972
  {
5266
5973
  ref,
5267
5974
  className: clsx_default("lib-xplat-toast", item.type, { exit: isExiting }),
5268
5975
  role: "alert",
5269
5976
  children: [
5270
- /* @__PURE__ */ jsx347("span", { className: "message", children: item.message }),
5271
- /* @__PURE__ */ jsx347("button", { className: "close-btn", onClick: onClose, "aria-label": "\uB2EB\uAE30", children: "\xD7" })
5977
+ /* @__PURE__ */ jsx348("span", { className: "message", children: item.message }),
5978
+ /* @__PURE__ */ jsx348("button", { className: "close-btn", onClick: onClose, "aria-label": "\uB2EB\uAE30", children: "\xD7" })
5272
5979
  ]
5273
5980
  }
5274
5981
  )
@@ -5279,13 +5986,13 @@ var ToastProvider = ({
5279
5986
  children,
5280
5987
  position = "top-right"
5281
5988
  }) => {
5282
- const [toasts, setToasts] = React38.useState([]);
5283
- const [removing, setRemoving] = React38.useState(/* @__PURE__ */ new Set());
5284
- const [mounted, setMounted] = React38.useState(false);
5285
- React38.useEffect(() => {
5989
+ const [toasts, setToasts] = React39.useState([]);
5990
+ const [removing, setRemoving] = React39.useState(/* @__PURE__ */ new Set());
5991
+ const [mounted, setMounted] = React39.useState(false);
5992
+ React39.useEffect(() => {
5286
5993
  setMounted(true);
5287
5994
  }, []);
5288
- const remove = React38.useCallback((id) => {
5995
+ const remove = React39.useCallback((id) => {
5289
5996
  setRemoving((prev) => new Set(prev).add(id));
5290
5997
  setTimeout(() => {
5291
5998
  setToasts((prev) => prev.filter((t) => t.id !== id));
@@ -5296,7 +6003,7 @@ var ToastProvider = ({
5296
6003
  });
5297
6004
  }, EXIT_DURATION);
5298
6005
  }, []);
5299
- const toast = React38.useCallback(
6006
+ const toast = React39.useCallback(
5300
6007
  (type, message, duration = 3e3) => {
5301
6008
  const id = `${Date.now()}-${Math.random()}`;
5302
6009
  setToasts((prev) => [...prev, { id, type, message }]);
@@ -5306,10 +6013,10 @@ var ToastProvider = ({
5306
6013
  },
5307
6014
  [remove]
5308
6015
  );
5309
- return /* @__PURE__ */ jsxs220(ToastContext.Provider, { value: { toast }, children: [
6016
+ return /* @__PURE__ */ jsxs221(ToastContext.Provider, { value: { toast }, children: [
5310
6017
  children,
5311
6018
  mounted && createPortal3(
5312
- /* @__PURE__ */ jsx347("div", { className: clsx_default("lib-xplat-toast-container", position), children: toasts.map((t) => /* @__PURE__ */ jsx347(
6019
+ /* @__PURE__ */ jsx348("div", { className: clsx_default("lib-xplat-toast-container", position), children: toasts.map((t) => /* @__PURE__ */ jsx348(
5313
6020
  ToastItemComponent,
5314
6021
  {
5315
6022
  item: t,
@@ -5325,8 +6032,8 @@ var ToastProvider = ({
5325
6032
  ToastProvider.displayName = "ToastProvider";
5326
6033
 
5327
6034
  // src/components/Tooltip/Tooltip.tsx
5328
- import React39 from "react";
5329
- import { Fragment as Fragment5, jsx as jsx348, jsxs as jsxs221 } from "react/jsx-runtime";
6035
+ import React40 from "react";
6036
+ import { Fragment as Fragment5, jsx as jsx349, jsxs as jsxs222 } from "react/jsx-runtime";
5330
6037
  var OFFSET = 12;
5331
6038
  var SHOW_DELAY = 300;
5332
6039
  var Tooltip = (props) => {
@@ -5337,12 +6044,12 @@ var Tooltip = (props) => {
5337
6044
  children,
5338
6045
  disabled = false
5339
6046
  } = props;
5340
- const triggerRef = React39.useRef(null);
5341
- const tooltipRef = React39.useRef(null);
5342
- const [visible, setVisible] = React39.useState(false);
5343
- const [pos, setPos] = React39.useState({ left: 0, top: 0 });
5344
- const delayTimer = React39.useRef(0);
5345
- const calculatePos = React39.useCallback((clientX, clientY) => {
6047
+ const triggerRef = React40.useRef(null);
6048
+ const tooltipRef = React40.useRef(null);
6049
+ const [visible, setVisible] = React40.useState(false);
6050
+ const [pos, setPos] = React40.useState({ left: 0, top: 0 });
6051
+ const delayTimer = React40.useRef(0);
6052
+ const calculatePos = React40.useCallback((clientX, clientY) => {
5346
6053
  const el = tooltipRef.current;
5347
6054
  if (!el) return;
5348
6055
  const w = el.offsetWidth;
@@ -5355,38 +6062,38 @@ var Tooltip = (props) => {
5355
6062
  if (left < 8) left = 8;
5356
6063
  setPos({ left, top });
5357
6064
  }, []);
5358
- const handleMouseEnter = React39.useCallback(() => {
6065
+ const handleMouseEnter = React40.useCallback(() => {
5359
6066
  if (disabled) return;
5360
6067
  delayTimer.current = window.setTimeout(() => {
5361
6068
  setVisible(true);
5362
6069
  }, SHOW_DELAY);
5363
6070
  }, [disabled]);
5364
- const handleMouseMove = React39.useCallback((e) => {
6071
+ const handleMouseMove = React40.useCallback((e) => {
5365
6072
  if (!visible) return;
5366
6073
  calculatePos(e.clientX, e.clientY);
5367
6074
  }, [visible, calculatePos]);
5368
- const handleMouseLeave = React39.useCallback(() => {
6075
+ const handleMouseLeave = React40.useCallback(() => {
5369
6076
  window.clearTimeout(delayTimer.current);
5370
6077
  setVisible(false);
5371
6078
  }, []);
5372
- const handleClick = React39.useCallback(() => {
6079
+ const handleClick = React40.useCallback(() => {
5373
6080
  window.clearTimeout(delayTimer.current);
5374
6081
  setVisible(false);
5375
6082
  }, []);
5376
- const handleFocus = React39.useCallback(() => {
6083
+ const handleFocus = React40.useCallback(() => {
5377
6084
  if (disabled) return;
5378
6085
  setVisible(true);
5379
6086
  }, [disabled]);
5380
- const handleBlur = React39.useCallback(() => {
6087
+ const handleBlur = React40.useCallback(() => {
5381
6088
  setVisible(false);
5382
6089
  }, []);
5383
- React39.useLayoutEffect(() => {
6090
+ React40.useLayoutEffect(() => {
5384
6091
  if (!visible || !triggerRef.current) return;
5385
6092
  const rect = triggerRef.current.getBoundingClientRect();
5386
6093
  calculatePos(rect.right, rect.top);
5387
6094
  }, [visible, calculatePos]);
5388
- if (!title && !description) return /* @__PURE__ */ jsx348(Fragment5, { children });
5389
- return /* @__PURE__ */ jsxs221(
6095
+ if (!title && !description) return /* @__PURE__ */ jsx349(Fragment5, { children });
6096
+ return /* @__PURE__ */ jsxs222(
5390
6097
  "div",
5391
6098
  {
5392
6099
  ref: triggerRef,
@@ -5399,15 +6106,15 @@ var Tooltip = (props) => {
5399
6106
  onBlur: handleBlur,
5400
6107
  children: [
5401
6108
  children,
5402
- visible && /* @__PURE__ */ jsx348(Portal_default, { children: /* @__PURE__ */ jsxs221(
6109
+ visible && /* @__PURE__ */ jsx349(Portal_default, { children: /* @__PURE__ */ jsxs222(
5403
6110
  "div",
5404
6111
  {
5405
6112
  ref: tooltipRef,
5406
6113
  className: clsx_default("lib-xplat-tooltip", type),
5407
6114
  style: { position: "fixed", left: pos.left, top: pos.top },
5408
6115
  children: [
5409
- title && /* @__PURE__ */ jsx348("div", { className: "tooltip-title", children: title }),
5410
- description && /* @__PURE__ */ jsx348("div", { className: "tooltip-desc", children: description })
6116
+ title && /* @__PURE__ */ jsx349("div", { className: "tooltip-title", children: title }),
6117
+ description && /* @__PURE__ */ jsx349("div", { className: "tooltip-desc", children: description })
5411
6118
  ]
5412
6119
  }
5413
6120
  ) })
@@ -5419,11 +6126,11 @@ Tooltip.displayName = "Tooltip";
5419
6126
  var Tooltip_default = Tooltip;
5420
6127
 
5421
6128
  // src/components/Video/Video.tsx
5422
- import React40 from "react";
5423
- import { jsx as jsx349, jsxs as jsxs222 } from "react/jsx-runtime";
5424
- var PipIcon = () => /* @__PURE__ */ jsxs222("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
5425
- /* @__PURE__ */ jsx349("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2" }),
5426
- /* @__PURE__ */ jsx349("rect", { x: "12", y: "11", width: "7", height: "6", rx: "1", fill: "currentColor" })
6129
+ import React41 from "react";
6130
+ import { jsx as jsx350, jsxs as jsxs223 } from "react/jsx-runtime";
6131
+ var PipIcon = () => /* @__PURE__ */ jsxs223("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
6132
+ /* @__PURE__ */ jsx350("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2" }),
6133
+ /* @__PURE__ */ jsx350("rect", { x: "12", y: "11", width: "7", height: "6", rx: "1", fill: "currentColor" })
5427
6134
  ] });
5428
6135
  var formatTime = (sec) => {
5429
6136
  if (!Number.isFinite(sec) || sec < 0) return "0:00";
@@ -5431,7 +6138,7 @@ var formatTime = (sec) => {
5431
6138
  const s = Math.floor(sec % 60);
5432
6139
  return `${m}:${s.toString().padStart(2, "0")}`;
5433
6140
  };
5434
- var Video = React40.forwardRef((props, ref) => {
6141
+ var Video = React41.forwardRef((props, ref) => {
5435
6142
  const {
5436
6143
  src,
5437
6144
  poster,
@@ -5455,21 +6162,21 @@ var Video = React40.forwardRef((props, ref) => {
5455
6162
  children,
5456
6163
  ...rest
5457
6164
  } = props;
5458
- const containerRef = React40.useRef(null);
5459
- const videoRef = React40.useRef(null);
5460
- const [isPlaying, setIsPlaying] = React40.useState(Boolean(autoPlay));
5461
- const [isLoaded, setIsLoaded] = React40.useState(false);
5462
- const [currentTime, setCurrentTime] = React40.useState(0);
5463
- const [duration, setDuration] = React40.useState(0);
5464
- const [buffered, setBuffered] = React40.useState(0);
5465
- const [volume, setVolume] = React40.useState(1);
5466
- const [isMuted, setIsMuted] = React40.useState(Boolean(muted));
5467
- const [isFullscreen, setIsFullscreen] = React40.useState(false);
5468
- const [playbackRate, setPlaybackRate] = React40.useState(1);
5469
- const [rateMenuOpen, setRateMenuOpen] = React40.useState(false);
5470
- const [captionsOn, setCaptionsOn] = React40.useState(false);
5471
- const [isPip, setIsPip] = React40.useState(false);
5472
- const setRefs = React40.useCallback(
6165
+ const containerRef = React41.useRef(null);
6166
+ const videoRef = React41.useRef(null);
6167
+ const [isPlaying, setIsPlaying] = React41.useState(Boolean(autoPlay));
6168
+ const [isLoaded, setIsLoaded] = React41.useState(false);
6169
+ const [currentTime, setCurrentTime] = React41.useState(0);
6170
+ const [duration, setDuration] = React41.useState(0);
6171
+ const [buffered, setBuffered] = React41.useState(0);
6172
+ const [volume, setVolume] = React41.useState(1);
6173
+ const [isMuted, setIsMuted] = React41.useState(Boolean(muted));
6174
+ const [isFullscreen, setIsFullscreen] = React41.useState(false);
6175
+ const [playbackRate, setPlaybackRate] = React41.useState(1);
6176
+ const [rateMenuOpen, setRateMenuOpen] = React41.useState(false);
6177
+ const [captionsOn, setCaptionsOn] = React41.useState(false);
6178
+ const [isPip, setIsPip] = React41.useState(false);
6179
+ const setRefs = React41.useCallback(
5473
6180
  (el) => {
5474
6181
  videoRef.current = el;
5475
6182
  if (typeof ref === "function") ref(el);
@@ -5477,14 +6184,14 @@ var Video = React40.forwardRef((props, ref) => {
5477
6184
  },
5478
6185
  [ref]
5479
6186
  );
5480
- React40.useEffect(() => {
6187
+ React41.useEffect(() => {
5481
6188
  const onFsChange = () => {
5482
6189
  setIsFullscreen(document.fullscreenElement === containerRef.current);
5483
6190
  };
5484
6191
  document.addEventListener("fullscreenchange", onFsChange);
5485
6192
  return () => document.removeEventListener("fullscreenchange", onFsChange);
5486
6193
  }, []);
5487
- React40.useEffect(() => {
6194
+ React41.useEffect(() => {
5488
6195
  const v = videoRef.current;
5489
6196
  if (!v) return;
5490
6197
  const onEnter = () => setIsPip(true);
@@ -5598,13 +6305,13 @@ var Video = React40.forwardRef((props, ref) => {
5598
6305
  const volumePct = (isMuted ? 0 : volume) * 100;
5599
6306
  const VolumeGlyph = isMuted || volume === 0 ? VolumeXIcon_default : volume < 0.5 ? VolumeIcon_default : Volume2Icon_default;
5600
6307
  const pipSupported = typeof document !== "undefined" && "pictureInPictureEnabled" in document && document.pictureInPictureEnabled;
5601
- return /* @__PURE__ */ jsxs222(
6308
+ return /* @__PURE__ */ jsxs223(
5602
6309
  "div",
5603
6310
  {
5604
6311
  ref: containerRef,
5605
6312
  className: clsx_default("lib-xplat-video", showControls && "has-controls"),
5606
6313
  children: [
5607
- /* @__PURE__ */ jsx349(
6314
+ /* @__PURE__ */ jsx350(
5608
6315
  "video",
5609
6316
  {
5610
6317
  ref: setRefs,
@@ -5625,7 +6332,7 @@ var Video = React40.forwardRef((props, ref) => {
5625
6332
  children
5626
6333
  }
5627
6334
  ),
5628
- showCenterPlay && /* @__PURE__ */ jsx349(
6335
+ showCenterPlay && /* @__PURE__ */ jsx350(
5629
6336
  "button",
5630
6337
  {
5631
6338
  type: "button",
@@ -5637,11 +6344,11 @@ var Video = React40.forwardRef((props, ref) => {
5637
6344
  onClick: togglePlay,
5638
6345
  "aria-label": isPlaying ? "\uC77C\uC2DC\uC815\uC9C0" : "\uC7AC\uC0DD",
5639
6346
  tabIndex: -1,
5640
- children: /* @__PURE__ */ jsx349("span", { className: "center-play-icon", children: /* @__PURE__ */ jsx349(PlayCircleIcon_default, {}) })
6347
+ children: /* @__PURE__ */ jsx350("span", { className: "center-play-icon", children: /* @__PURE__ */ jsx350(PlayCircleIcon_default, {}) })
5641
6348
  }
5642
6349
  ),
5643
- showControls && /* @__PURE__ */ jsxs222("div", { className: "controls", onClick: (e) => e.stopPropagation(), children: [
5644
- /* @__PURE__ */ jsx349(
6350
+ showControls && /* @__PURE__ */ jsxs223("div", { className: "controls", onClick: (e) => e.stopPropagation(), children: [
6351
+ /* @__PURE__ */ jsx350(
5645
6352
  "input",
5646
6353
  {
5647
6354
  type: "range",
@@ -5658,29 +6365,29 @@ var Video = React40.forwardRef((props, ref) => {
5658
6365
  }
5659
6366
  }
5660
6367
  ),
5661
- /* @__PURE__ */ jsxs222("div", { className: "controls-row", children: [
5662
- /* @__PURE__ */ jsx349(
6368
+ /* @__PURE__ */ jsxs223("div", { className: "controls-row", children: [
6369
+ /* @__PURE__ */ jsx350(
5663
6370
  "button",
5664
6371
  {
5665
6372
  type: "button",
5666
6373
  className: "control-btn",
5667
6374
  onClick: togglePlay,
5668
6375
  "aria-label": isPlaying ? "\uC77C\uC2DC\uC815\uC9C0" : "\uC7AC\uC0DD",
5669
- children: isPlaying ? /* @__PURE__ */ jsx349(PauseIcon_default, {}) : /* @__PURE__ */ jsx349(PlayIcon_default, {})
6376
+ children: isPlaying ? /* @__PURE__ */ jsx350(PauseIcon_default, {}) : /* @__PURE__ */ jsx350(PlayIcon_default, {})
5670
6377
  }
5671
6378
  ),
5672
- /* @__PURE__ */ jsxs222("div", { className: "volume-group", children: [
5673
- /* @__PURE__ */ jsx349(
6379
+ /* @__PURE__ */ jsxs223("div", { className: "volume-group", children: [
6380
+ /* @__PURE__ */ jsx350(
5674
6381
  "button",
5675
6382
  {
5676
6383
  type: "button",
5677
6384
  className: "control-btn",
5678
6385
  onClick: toggleMute,
5679
6386
  "aria-label": isMuted ? "\uC74C\uC18C\uAC70 \uD574\uC81C" : "\uC74C\uC18C\uAC70",
5680
- children: /* @__PURE__ */ jsx349(VolumeGlyph, {})
6387
+ children: /* @__PURE__ */ jsx350(VolumeGlyph, {})
5681
6388
  }
5682
6389
  ),
5683
- /* @__PURE__ */ jsx349(
6390
+ /* @__PURE__ */ jsx350(
5684
6391
  "input",
5685
6392
  {
5686
6393
  type: "range",
@@ -5695,14 +6402,14 @@ var Video = React40.forwardRef((props, ref) => {
5695
6402
  }
5696
6403
  )
5697
6404
  ] }),
5698
- /* @__PURE__ */ jsxs222("span", { className: "time", children: [
6405
+ /* @__PURE__ */ jsxs223("span", { className: "time", children: [
5699
6406
  formatTime(currentTime),
5700
6407
  " / ",
5701
6408
  formatTime(duration)
5702
6409
  ] }),
5703
- /* @__PURE__ */ jsx349("div", { className: "controls-spacer" }),
5704
- playbackRates && playbackRates.length > 0 && /* @__PURE__ */ jsxs222("div", { className: clsx_default("rate-group", rateMenuOpen && "is-open"), children: [
5705
- /* @__PURE__ */ jsxs222(
6410
+ /* @__PURE__ */ jsx350("div", { className: "controls-spacer" }),
6411
+ playbackRates && playbackRates.length > 0 && /* @__PURE__ */ jsxs223("div", { className: clsx_default("rate-group", rateMenuOpen && "is-open"), children: [
6412
+ /* @__PURE__ */ jsxs223(
5706
6413
  "button",
5707
6414
  {
5708
6415
  type: "button",
@@ -5716,7 +6423,7 @@ var Video = React40.forwardRef((props, ref) => {
5716
6423
  ]
5717
6424
  }
5718
6425
  ),
5719
- rateMenuOpen && /* @__PURE__ */ jsx349("ul", { className: "rate-menu", role: "menu", children: playbackRates.map((r2) => /* @__PURE__ */ jsx349("li", { children: /* @__PURE__ */ jsxs222(
6426
+ rateMenuOpen && /* @__PURE__ */ jsx350("ul", { className: "rate-menu", role: "menu", children: playbackRates.map((r2) => /* @__PURE__ */ jsx350("li", { children: /* @__PURE__ */ jsxs223(
5720
6427
  "button",
5721
6428
  {
5722
6429
  type: "button",
@@ -5730,7 +6437,7 @@ var Video = React40.forwardRef((props, ref) => {
5730
6437
  }
5731
6438
  ) }, r2)) })
5732
6439
  ] }),
5733
- showCaptions && /* @__PURE__ */ jsx349(
6440
+ showCaptions && /* @__PURE__ */ jsx350(
5734
6441
  "button",
5735
6442
  {
5736
6443
  type: "button",
@@ -5738,37 +6445,37 @@ var Video = React40.forwardRef((props, ref) => {
5738
6445
  onClick: toggleCaptions,
5739
6446
  "aria-label": captionsOn ? "\uC790\uB9C9 \uB044\uAE30" : "\uC790\uB9C9 \uCF1C\uAE30",
5740
6447
  "aria-pressed": captionsOn,
5741
- children: /* @__PURE__ */ jsx349(TypeIcon_default, {})
6448
+ children: /* @__PURE__ */ jsx350(TypeIcon_default, {})
5742
6449
  }
5743
6450
  ),
5744
- showPip && pipSupported && /* @__PURE__ */ jsx349(
6451
+ showPip && pipSupported && /* @__PURE__ */ jsx350(
5745
6452
  "button",
5746
6453
  {
5747
6454
  type: "button",
5748
6455
  className: clsx_default("control-btn", isPip && "is-active"),
5749
6456
  onClick: togglePip,
5750
6457
  "aria-label": isPip ? "PIP \uC885\uB8CC" : "PIP",
5751
- children: /* @__PURE__ */ jsx349(PipIcon, {})
6458
+ children: /* @__PURE__ */ jsx350(PipIcon, {})
5752
6459
  }
5753
6460
  ),
5754
- showDownload && /* @__PURE__ */ jsx349(
6461
+ showDownload && /* @__PURE__ */ jsx350(
5755
6462
  "a",
5756
6463
  {
5757
6464
  className: "control-btn",
5758
6465
  href: src,
5759
6466
  download: downloadFileName ?? true,
5760
6467
  "aria-label": "\uB2E4\uC6B4\uB85C\uB4DC",
5761
- children: /* @__PURE__ */ jsx349(DownloadIcon_default, {})
6468
+ children: /* @__PURE__ */ jsx350(DownloadIcon_default, {})
5762
6469
  }
5763
6470
  ),
5764
- /* @__PURE__ */ jsx349(
6471
+ /* @__PURE__ */ jsx350(
5765
6472
  "button",
5766
6473
  {
5767
6474
  type: "button",
5768
6475
  className: "control-btn",
5769
6476
  onClick: toggleFullscreen,
5770
6477
  "aria-label": isFullscreen ? "\uC804\uCCB4\uD654\uBA74 \uC885\uB8CC" : "\uC804\uCCB4\uD654\uBA74",
5771
- children: isFullscreen ? /* @__PURE__ */ jsx349(MinimizeIcon_default, {}) : /* @__PURE__ */ jsx349(MaximizeIcon_default, {})
6478
+ children: isFullscreen ? /* @__PURE__ */ jsx350(MinimizeIcon_default, {}) : /* @__PURE__ */ jsx350(MaximizeIcon_default, {})
5772
6479
  }
5773
6480
  )
5774
6481
  ] })
@@ -5796,6 +6503,7 @@ export {
5796
6503
  Divider_default as Divider,
5797
6504
  Drawer_default as Drawer,
5798
6505
  Dropdown_default as Dropdown,
6506
+ Editor_default as Editor,
5799
6507
  EmptyState_default as EmptyState,
5800
6508
  FileUpload_default as FileUpload,
5801
6509
  HtmlTypeWriter_default as HtmlTypewriter,