@tipp/ui-quill-editor 1.1.2 → 1.2.0
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.
- package/dist/editor.cjs.map +1 -1
- package/dist/editor.d.cts +2 -6
- package/dist/editor.d.ts +2 -6
- package/dist/editor.js +218 -3
- package/dist/editor.js.map +1 -1
- package/dist/read-card.cjs.map +1 -1
- package/dist/read-card.d.cts +1 -2
- package/dist/read-card.d.ts +1 -2
- package/dist/read-card.js +189 -3
- package/dist/read-card.js.map +1 -1
- package/dist/type.cjs +19 -0
- package/dist/type.cjs.map +1 -0
- package/dist/type.d.cts +7 -0
- package/dist/type.d.ts +7 -0
- package/dist/type.js +1 -0
- package/package.json +26 -6
- package/src/editor.tsx +1 -6
- package/src/read-card.tsx +1 -1
- package/src/type.ts +5 -0
- package/dist/chunk-4ULZXT3Z.js +0 -267
- package/dist/chunk-4ULZXT3Z.js.map +0 -1
- package/dist/chunk-5WZL7EM7.js +0 -272
- package/dist/chunk-5WZL7EM7.js.map +0 -1
- package/dist/chunk-63UMKKIY.js +0 -254
- package/dist/chunk-63UMKKIY.js.map +0 -1
- package/dist/chunk-6Z3DIHNP.js +0 -253
- package/dist/chunk-6Z3DIHNP.js.map +0 -1
- package/dist/chunk-7346KRGN.js +0 -224
- package/dist/chunk-7346KRGN.js.map +0 -1
- package/dist/chunk-ACJWK26B.js +0 -272
- package/dist/chunk-ACJWK26B.js.map +0 -1
- package/dist/chunk-AEDRFU3N.js +0 -273
- package/dist/chunk-AEDRFU3N.js.map +0 -1
- package/dist/chunk-CCOIRSYJ.js +0 -258
- package/dist/chunk-CCOIRSYJ.js.map +0 -1
- package/dist/chunk-EQCXRM42.js +0 -253
- package/dist/chunk-EQCXRM42.js.map +0 -1
- package/dist/chunk-EZ2MSXWD.js +0 -211
- package/dist/chunk-EZ2MSXWD.js.map +0 -1
- package/dist/chunk-FFENCIRE.js +0 -254
- package/dist/chunk-FFENCIRE.js.map +0 -1
- package/dist/chunk-HZN6OVD6.js +0 -253
- package/dist/chunk-HZN6OVD6.js.map +0 -1
- package/dist/chunk-ICAKLBT5.js +0 -253
- package/dist/chunk-ICAKLBT5.js.map +0 -1
- package/dist/chunk-IIBNGFLN.mjs +0 -273
- package/dist/chunk-IIBNGFLN.mjs.map +0 -1
- package/dist/chunk-IWRASGLB.js +0 -215
- package/dist/chunk-IWRASGLB.js.map +0 -1
- package/dist/chunk-K4Q6PRQ3.js +0 -272
- package/dist/chunk-K4Q6PRQ3.js.map +0 -1
- package/dist/chunk-KBRYMAW4.js +0 -254
- package/dist/chunk-KBRYMAW4.js.map +0 -1
- package/dist/chunk-KLFBBLJB.js +0 -212
- package/dist/chunk-KLFBBLJB.js.map +0 -1
- package/dist/chunk-KYAHTSA6.js +0 -253
- package/dist/chunk-KYAHTSA6.js.map +0 -1
- package/dist/chunk-MX3IDKDT.js +0 -215
- package/dist/chunk-MX3IDKDT.js.map +0 -1
- package/dist/chunk-NFVMYQC2.js +0 -215
- package/dist/chunk-NFVMYQC2.js.map +0 -1
- package/dist/chunk-NQOX4TPA.js +0 -258
- package/dist/chunk-NQOX4TPA.js.map +0 -1
- package/dist/chunk-OLRR6W3N.js +0 -272
- package/dist/chunk-OLRR6W3N.js.map +0 -1
- package/dist/chunk-PSI2XOKW.js +0 -272
- package/dist/chunk-PSI2XOKW.js.map +0 -1
- package/dist/chunk-PWBZK7KO.js +0 -272
- package/dist/chunk-PWBZK7KO.js.map +0 -1
- package/dist/chunk-QAD3RXYR.js +0 -253
- package/dist/chunk-QAD3RXYR.js.map +0 -1
- package/dist/chunk-QC5RGGRB.js +0 -224
- package/dist/chunk-QC5RGGRB.js.map +0 -1
- package/dist/chunk-QGCFWTOT.js +0 -253
- package/dist/chunk-QGCFWTOT.js.map +0 -1
- package/dist/chunk-QVPYAKUW.js +0 -253
- package/dist/chunk-QVPYAKUW.js.map +0 -1
- package/dist/chunk-RC5DDS52.js +0 -272
- package/dist/chunk-RC5DDS52.js.map +0 -1
- package/dist/chunk-RVTX55MD.js +0 -215
- package/dist/chunk-RVTX55MD.js.map +0 -1
- package/dist/chunk-UE5CSHOY.js +0 -211
- package/dist/chunk-UE5CSHOY.js.map +0 -1
- package/dist/chunk-VWJC7GOO.js +0 -253
- package/dist/chunk-VWJC7GOO.js.map +0 -1
- package/dist/chunk-WITVYZYX.js +0 -211
- package/dist/chunk-WITVYZYX.js.map +0 -1
- package/dist/chunk-WQQTLSPU.js +0 -253
- package/dist/chunk-WQQTLSPU.js.map +0 -1
- package/dist/chunk-WZQACNB7.js +0 -215
- package/dist/chunk-WZQACNB7.js.map +0 -1
- package/dist/chunk-X5ODDFPU.js +0 -272
- package/dist/chunk-X5ODDFPU.js.map +0 -1
- package/dist/chunk-XFOLCHPG.js +0 -257
- package/dist/chunk-XFOLCHPG.js.map +0 -1
- package/dist/chunk-XO4BXXHE.js +0 -258
- package/dist/chunk-XO4BXXHE.js.map +0 -1
- package/dist/chunk-Y7747DJG.js +0 -195
- package/dist/chunk-Y7747DJG.js.map +0 -1
- package/dist/chunk-Z7OJPAOK.js +0 -211
- package/dist/chunk-Z7OJPAOK.js.map +0 -1
- package/dist/chunk-ZJXLAGSA.js +0 -213
- package/dist/chunk-ZJXLAGSA.js.map +0 -1
- package/dist/editor.d.mts +0 -30
- package/dist/editor.mjs +0 -7
- package/dist/index.cjs +0 -477
- package/dist/index.cjs.map +0 -1
- package/dist/index.d.cts +0 -4
- package/dist/index.d.mts +0 -3
- package/dist/index.d.ts +0 -4
- package/dist/index.js +0 -13
- package/dist/index.js.map +0 -1
- package/dist/index.mjs +0 -7
- package/dist/index.mjs.map +0 -1
- package/src/index.tsx +0 -2
- /package/dist/{editor.mjs.map → type.js.map} +0 -0
package/dist/index.cjs
DELETED
|
@@ -1,477 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
7
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
8
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
10
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
11
|
-
var __spreadValues = (a, b) => {
|
|
12
|
-
for (var prop in b || (b = {}))
|
|
13
|
-
if (__hasOwnProp.call(b, prop))
|
|
14
|
-
__defNormalProp(a, prop, b[prop]);
|
|
15
|
-
if (__getOwnPropSymbols)
|
|
16
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
17
|
-
if (__propIsEnum.call(b, prop))
|
|
18
|
-
__defNormalProp(a, prop, b[prop]);
|
|
19
|
-
}
|
|
20
|
-
return a;
|
|
21
|
-
};
|
|
22
|
-
var __objRest = (source, exclude) => {
|
|
23
|
-
var target = {};
|
|
24
|
-
for (var prop in source)
|
|
25
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
26
|
-
target[prop] = source[prop];
|
|
27
|
-
if (source != null && __getOwnPropSymbols)
|
|
28
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
29
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
30
|
-
target[prop] = source[prop];
|
|
31
|
-
}
|
|
32
|
-
return target;
|
|
33
|
-
};
|
|
34
|
-
var __export = (target, all) => {
|
|
35
|
-
for (var name in all)
|
|
36
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
37
|
-
};
|
|
38
|
-
var __copyProps = (to, from, except, desc) => {
|
|
39
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
40
|
-
for (let key of __getOwnPropNames(from))
|
|
41
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
42
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
43
|
-
}
|
|
44
|
-
return to;
|
|
45
|
-
};
|
|
46
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
47
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
48
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
49
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
50
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
51
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
52
|
-
mod
|
|
53
|
-
));
|
|
54
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
55
|
-
var __async = (__this, __arguments, generator) => {
|
|
56
|
-
return new Promise((resolve, reject) => {
|
|
57
|
-
var fulfilled = (value) => {
|
|
58
|
-
try {
|
|
59
|
-
step(generator.next(value));
|
|
60
|
-
} catch (e) {
|
|
61
|
-
reject(e);
|
|
62
|
-
}
|
|
63
|
-
};
|
|
64
|
-
var rejected = (value) => {
|
|
65
|
-
try {
|
|
66
|
-
step(generator.throw(value));
|
|
67
|
-
} catch (e) {
|
|
68
|
-
reject(e);
|
|
69
|
-
}
|
|
70
|
-
};
|
|
71
|
-
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
72
|
-
step((generator = generator.apply(__this, __arguments)).next());
|
|
73
|
-
});
|
|
74
|
-
};
|
|
75
|
-
|
|
76
|
-
// src/index.tsx
|
|
77
|
-
var src_exports = {};
|
|
78
|
-
__export(src_exports, {
|
|
79
|
-
Editor: () => Editor,
|
|
80
|
-
ReadCard: () => ReadCard
|
|
81
|
-
});
|
|
82
|
-
module.exports = __toCommonJS(src_exports);
|
|
83
|
-
|
|
84
|
-
// src/editor.tsx
|
|
85
|
-
var import_react = require("react");
|
|
86
|
-
var import_ui = require("@tipp/ui");
|
|
87
|
-
var import_react_quill = __toESM(require("react-quill"), 1);
|
|
88
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
89
|
-
var Editor = (0, import_react.forwardRef)(
|
|
90
|
-
(props, ref) => {
|
|
91
|
-
const _a = props, {
|
|
92
|
-
defaultAttachedFiles,
|
|
93
|
-
defaultTitle,
|
|
94
|
-
defaultValue,
|
|
95
|
-
onClickSave,
|
|
96
|
-
uploadFile,
|
|
97
|
-
deleteFile,
|
|
98
|
-
isLoading,
|
|
99
|
-
SecondaryButton,
|
|
100
|
-
clearEditor,
|
|
101
|
-
minHeight,
|
|
102
|
-
maxHeight
|
|
103
|
-
} = _a, quillProps = __objRest(_a, [
|
|
104
|
-
"defaultAttachedFiles",
|
|
105
|
-
"defaultTitle",
|
|
106
|
-
"defaultValue",
|
|
107
|
-
"onClickSave",
|
|
108
|
-
"uploadFile",
|
|
109
|
-
"deleteFile",
|
|
110
|
-
"isLoading",
|
|
111
|
-
"SecondaryButton",
|
|
112
|
-
"clearEditor",
|
|
113
|
-
"minHeight",
|
|
114
|
-
"maxHeight"
|
|
115
|
-
]);
|
|
116
|
-
const defaultRef = (0, import_react.useRef)(null);
|
|
117
|
-
const editorRef = ref || defaultRef;
|
|
118
|
-
const [attachedFiles, setAttachedFiles] = (0, import_react.useState)(
|
|
119
|
-
defaultAttachedFiles || []
|
|
120
|
-
);
|
|
121
|
-
const [fileDeleteLoading, setFileDeleteLoading] = (0, import_react.useState)(/* @__PURE__ */ new Set());
|
|
122
|
-
const [title, setTitle] = (0, import_react.useState)(defaultTitle || "");
|
|
123
|
-
const [content, setContent] = (0, import_react.useState)(defaultValue || "");
|
|
124
|
-
const handleOnChangeContent = (0, import_react.useCallback)((value) => {
|
|
125
|
-
setContent(value);
|
|
126
|
-
}, []);
|
|
127
|
-
const handleButtonClick = (0, import_react.useCallback)(() => {
|
|
128
|
-
let input = document.createElement("input");
|
|
129
|
-
input.type = "file";
|
|
130
|
-
input.onchange = (event) => __async(void 0, null, function* () {
|
|
131
|
-
var _a2;
|
|
132
|
-
const file = (_a2 = event.target.files) == null ? void 0 : _a2[0];
|
|
133
|
-
if (!file) {
|
|
134
|
-
import_ui.toast.error("\uD30C\uC77C\uC744 \uC120\uD0DD\uD574\uC8FC\uC138\uC694.");
|
|
135
|
-
return;
|
|
136
|
-
}
|
|
137
|
-
const fileName = file.name;
|
|
138
|
-
const attachment = yield uploadFile == null ? void 0 : uploadFile(file, `hr-notes/${fileName}`);
|
|
139
|
-
if (attachment) {
|
|
140
|
-
setAttachedFiles((prev) => [...prev, attachment]);
|
|
141
|
-
}
|
|
142
|
-
input = null;
|
|
143
|
-
});
|
|
144
|
-
input.click();
|
|
145
|
-
}, [uploadFile]);
|
|
146
|
-
const handleDeleteFile = (0, import_react.useCallback)(
|
|
147
|
-
(fileUrl) => __async(void 0, null, function* () {
|
|
148
|
-
try {
|
|
149
|
-
setFileDeleteLoading((p) => p.add(fileUrl));
|
|
150
|
-
yield deleteFile == null ? void 0 : deleteFile(fileUrl);
|
|
151
|
-
setAttachedFiles(
|
|
152
|
-
(currentFiles) => currentFiles.filter((item) => item.url !== fileUrl)
|
|
153
|
-
);
|
|
154
|
-
} catch (err) {
|
|
155
|
-
import_ui.toast.error("\uD30C\uC77C \uC0AD\uC81C\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4.");
|
|
156
|
-
} finally {
|
|
157
|
-
setFileDeleteLoading((p) => {
|
|
158
|
-
p.delete(fileUrl);
|
|
159
|
-
return p;
|
|
160
|
-
});
|
|
161
|
-
}
|
|
162
|
-
}),
|
|
163
|
-
[deleteFile]
|
|
164
|
-
);
|
|
165
|
-
const renderAttachedFiles = (0, import_react.useCallback)(() => {
|
|
166
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Box, { width: "100%", children: attachedFiles.map((file) => {
|
|
167
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
168
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Separator, { size: "4" }),
|
|
169
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
170
|
-
import_ui.Flex,
|
|
171
|
-
{
|
|
172
|
-
align: "center",
|
|
173
|
-
justify: "between",
|
|
174
|
-
p: "4",
|
|
175
|
-
width: "100%",
|
|
176
|
-
children: [
|
|
177
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Link, { href: file.url, size: "2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ui.Flex, { align: "center", gap: "3", children: [
|
|
178
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.FileIcon, {}),
|
|
179
|
-
file.fileName
|
|
180
|
-
] }) }),
|
|
181
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
182
|
-
import_ui.Button,
|
|
183
|
-
{
|
|
184
|
-
loading: fileDeleteLoading.has(file.url),
|
|
185
|
-
onClick: () => {
|
|
186
|
-
void handleDeleteFile(file.url);
|
|
187
|
-
},
|
|
188
|
-
variant: "ghost",
|
|
189
|
-
children: "\uCCA8\uBD80 \uD30C\uC77C \uC0AD\uC81C"
|
|
190
|
-
}
|
|
191
|
-
)
|
|
192
|
-
]
|
|
193
|
-
},
|
|
194
|
-
`${file.url}_${file.fileName}`
|
|
195
|
-
)
|
|
196
|
-
] });
|
|
197
|
-
}) });
|
|
198
|
-
}, [attachedFiles, fileDeleteLoading, handleDeleteFile]);
|
|
199
|
-
const handleOnChangeTitle = (0, import_react.useCallback)((e) => {
|
|
200
|
-
setTitle(e.target.value);
|
|
201
|
-
}, []);
|
|
202
|
-
const clearEditorState = (0, import_react.useCallback)(() => {
|
|
203
|
-
setContent("");
|
|
204
|
-
setAttachedFiles([]);
|
|
205
|
-
setTitle("");
|
|
206
|
-
}, []);
|
|
207
|
-
const handleSaveClick = (0, import_react.useCallback)(() => {
|
|
208
|
-
onClickSave == null ? void 0 : onClickSave({
|
|
209
|
-
title,
|
|
210
|
-
content,
|
|
211
|
-
files: attachedFiles
|
|
212
|
-
});
|
|
213
|
-
}, [onClickSave, title, content, attachedFiles]);
|
|
214
|
-
if (props.clearEditor) {
|
|
215
|
-
props.clearEditor.current = clearEditorState;
|
|
216
|
-
}
|
|
217
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
218
|
-
"div",
|
|
219
|
-
{
|
|
220
|
-
className: "tipp-ql-wrapper",
|
|
221
|
-
style: {
|
|
222
|
-
minHeight,
|
|
223
|
-
maxHeight
|
|
224
|
-
},
|
|
225
|
-
children: [
|
|
226
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
227
|
-
import_ui.Grid,
|
|
228
|
-
{
|
|
229
|
-
align: "center",
|
|
230
|
-
columns: "auto auto 1fr",
|
|
231
|
-
gap: "2",
|
|
232
|
-
height: "42px",
|
|
233
|
-
pl: "2",
|
|
234
|
-
pr: "3",
|
|
235
|
-
width: "100%",
|
|
236
|
-
children: [
|
|
237
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Box, { pl: "3", pr: "3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Typo, { children: "\uC81C\uBAA9" }) }),
|
|
238
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Separator, { orientation: "vertical", style: { height: "100%" } }),
|
|
239
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
240
|
-
import_ui.TextField.Root,
|
|
241
|
-
{
|
|
242
|
-
className: "editor-title-text-field",
|
|
243
|
-
onChange: handleOnChangeTitle,
|
|
244
|
-
placeholder: "\uC81C\uBAA9\uC744 \uC785\uB825\uD574\uC8FC\uC138\uC694",
|
|
245
|
-
value: title
|
|
246
|
-
}
|
|
247
|
-
)
|
|
248
|
-
]
|
|
249
|
-
}
|
|
250
|
-
),
|
|
251
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
252
|
-
import_react_quill.default,
|
|
253
|
-
__spreadValues({
|
|
254
|
-
className: "tipp-ql-editor write-mode",
|
|
255
|
-
onChange: handleOnChangeContent,
|
|
256
|
-
ref: editorRef,
|
|
257
|
-
theme: "snow",
|
|
258
|
-
value: content
|
|
259
|
-
}, quillProps)
|
|
260
|
-
),
|
|
261
|
-
renderAttachedFiles(),
|
|
262
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Separator, { size: "4" }),
|
|
263
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ui.Flex, { align: "center", justify: "between", p: "2", pl: "4", pr: "4", width: "100%", children: [
|
|
264
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
265
|
-
import_ui.Button,
|
|
266
|
-
{
|
|
267
|
-
color: "gray",
|
|
268
|
-
onClick: handleButtonClick,
|
|
269
|
-
variant: "transparent",
|
|
270
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Link2Icon, { height: 20, width: 20 })
|
|
271
|
-
}
|
|
272
|
-
),
|
|
273
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ui.Flex, { gap: "2", children: [
|
|
274
|
-
clearEditor ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Button, { color: "gray", onClick: clearEditorState, variant: "outline", children: "\uCD08\uAE30\uD654" }) : null,
|
|
275
|
-
SecondaryButton ? SecondaryButton : null,
|
|
276
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Button, { disabled: isLoading, onClick: handleSaveClick, children: "\uC800\uC7A5" })
|
|
277
|
-
] })
|
|
278
|
-
] })
|
|
279
|
-
]
|
|
280
|
-
}
|
|
281
|
-
);
|
|
282
|
-
}
|
|
283
|
-
);
|
|
284
|
-
Editor.displayName = "TIPP-Quill-Editor";
|
|
285
|
-
|
|
286
|
-
// src/read-card.tsx
|
|
287
|
-
var import_react3 = require("react");
|
|
288
|
-
var import_dompurify = __toESM(require("dompurify"), 1);
|
|
289
|
-
var import_ui2 = require("@tipp/ui");
|
|
290
|
-
|
|
291
|
-
// src/html-container.tsx
|
|
292
|
-
var import_react2 = require("react");
|
|
293
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
294
|
-
var QuillHtmlOutputContainer = (0, import_react2.forwardRef)(({ html, className }, ref) => {
|
|
295
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "ql-snow ql-container read-mode", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
296
|
-
"div",
|
|
297
|
-
{
|
|
298
|
-
className: `ql-editor ${className || ""}`,
|
|
299
|
-
dangerouslySetInnerHTML: { __html: html },
|
|
300
|
-
ref
|
|
301
|
-
}
|
|
302
|
-
) });
|
|
303
|
-
});
|
|
304
|
-
QuillHtmlOutputContainer.displayName = "QuillHtmlOutputContainer";
|
|
305
|
-
var html_container_default = QuillHtmlOutputContainer;
|
|
306
|
-
|
|
307
|
-
// src/read-card.tsx
|
|
308
|
-
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
309
|
-
function ReadCard(props) {
|
|
310
|
-
const {
|
|
311
|
-
onClickDelete: propsOnClickDelete,
|
|
312
|
-
onClickEdit: propsOnClickEdit,
|
|
313
|
-
content = "",
|
|
314
|
-
title = "",
|
|
315
|
-
writer,
|
|
316
|
-
createAt,
|
|
317
|
-
files
|
|
318
|
-
} = props;
|
|
319
|
-
const ref = (0, import_react3.useRef)(null);
|
|
320
|
-
const [deleteDialogOpen, setDeleteDialogOpen] = (0, import_react3.useState)(false);
|
|
321
|
-
const safeContent = (0, import_react3.useMemo)(() => {
|
|
322
|
-
return import_dompurify.default.sanitize(content || "");
|
|
323
|
-
}, [content]);
|
|
324
|
-
const optionItems = (0, import_react3.useMemo)(() => {
|
|
325
|
-
const result = [];
|
|
326
|
-
if (propsOnClickEdit) {
|
|
327
|
-
result.push({
|
|
328
|
-
title: "\uC218\uC815\uD558\uAE30",
|
|
329
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Pencil1Icon, {}),
|
|
330
|
-
onClick: propsOnClickEdit
|
|
331
|
-
});
|
|
332
|
-
}
|
|
333
|
-
if (propsOnClickDelete) {
|
|
334
|
-
result.push({
|
|
335
|
-
title: "\uC0AD\uC81C\uD558\uAE30",
|
|
336
|
-
onClick: () => {
|
|
337
|
-
setDeleteDialogOpen(true);
|
|
338
|
-
},
|
|
339
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.TrashIcon, {})
|
|
340
|
-
});
|
|
341
|
-
}
|
|
342
|
-
return result;
|
|
343
|
-
}, [propsOnClickDelete, propsOnClickEdit]);
|
|
344
|
-
const [className, setClassName] = (0, import_react3.useState)("closed");
|
|
345
|
-
const [openBtnVisible, setOpenBtnVisible] = (0, import_react3.useState)(false);
|
|
346
|
-
(0, import_react3.useEffect)(() => {
|
|
347
|
-
if (!ref.current)
|
|
348
|
-
return;
|
|
349
|
-
setOpenBtnVisible(ref.current.clientHeight < ref.current.scrollHeight);
|
|
350
|
-
ref.current.style.height = `${ref.current.clientHeight}px`;
|
|
351
|
-
}, [ref, content]);
|
|
352
|
-
const renderOpenBtns = () => {
|
|
353
|
-
if (openBtnVisible) {
|
|
354
|
-
if (className) {
|
|
355
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
356
|
-
import_ui2.Button,
|
|
357
|
-
{
|
|
358
|
-
color: "gray",
|
|
359
|
-
onClick: () => {
|
|
360
|
-
setClassName(void 0);
|
|
361
|
-
if (ref.current) {
|
|
362
|
-
ref.current.style.height = "initial";
|
|
363
|
-
}
|
|
364
|
-
},
|
|
365
|
-
variant: "outline",
|
|
366
|
-
children: [
|
|
367
|
-
"\uBA54\uBAA8 \uD3BC\uCE58\uAE30",
|
|
368
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.ChevronDownIcon, {})
|
|
369
|
-
]
|
|
370
|
-
}
|
|
371
|
-
);
|
|
372
|
-
}
|
|
373
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
374
|
-
import_ui2.Button,
|
|
375
|
-
{
|
|
376
|
-
color: "gray",
|
|
377
|
-
onClick: () => {
|
|
378
|
-
setClassName("closed");
|
|
379
|
-
},
|
|
380
|
-
variant: "outline",
|
|
381
|
-
children: [
|
|
382
|
-
"\uBA54\uBAA8 \uC811\uAE30",
|
|
383
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.ChevronUpIcon, {})
|
|
384
|
-
]
|
|
385
|
-
}
|
|
386
|
-
);
|
|
387
|
-
}
|
|
388
|
-
return null;
|
|
389
|
-
};
|
|
390
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Card, { size: "2", children: [
|
|
391
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "center", gap: "2", justify: "between", children: [
|
|
392
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "center", gap: "4", children: [
|
|
393
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Heading, { variant: "heading5", weight: "regular", children: title }),
|
|
394
|
-
writer ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Badge, { color: "neutral", size: "small", children: `\uC791\uC131\uC790 : ${writer}` }) : null
|
|
395
|
-
] }),
|
|
396
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "center", gap: "4", children: [
|
|
397
|
-
createAt ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Typo, { children: `\uB4F1\uB85D\uC77C\uC790: ${createAt.toLocaleDateString()} ` }) : null,
|
|
398
|
-
optionItems.length ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.DropdownMenu.Root, { children: [
|
|
399
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.DropdownMenu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.IconButton, { variant: "ghost", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.DotsVerticalIcon, {}) }) }),
|
|
400
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.DropdownMenu.Content, { children: optionItems.map((item) => {
|
|
401
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.DropdownMenu.Item, { onClick: item.onClick, children: [
|
|
402
|
-
item.icon,
|
|
403
|
-
item.title
|
|
404
|
-
] }, item.title);
|
|
405
|
-
}) })
|
|
406
|
-
] }) : null
|
|
407
|
-
] }),
|
|
408
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
409
|
-
import_ui2.AlertDialog.Root,
|
|
410
|
-
{
|
|
411
|
-
onOpenChange: setDeleteDialogOpen,
|
|
412
|
-
open: deleteDialogOpen,
|
|
413
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.AlertDialog.Content, { children: [
|
|
414
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.AlertDialog.Title, { children: "\uB178\uD2B8\uB97C \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?" }),
|
|
415
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.AlertDialog.Description, { children: "\uC0AD\uC81C\uB41C \uB178\uD2B8\uB294 \uBCF5\uAD6C\uD560 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4. \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?" }),
|
|
416
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { gap: "3", justify: "end", children: [
|
|
417
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.AlertDialog.Cancel, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Button, { color: "gray", variant: "outline", children: "\uCDE8\uC18C" }) }),
|
|
418
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.AlertDialog.Action, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Button, { color: "tomato", onClick: propsOnClickDelete, children: "\uC0AD\uC81C" }) })
|
|
419
|
-
] })
|
|
420
|
-
] })
|
|
421
|
-
}
|
|
422
|
-
)
|
|
423
|
-
] }),
|
|
424
|
-
Boolean(files == null ? void 0 : files.length) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Flex, { direction: "column", gap: "1", children: files == null ? void 0 : files.map((file) => {
|
|
425
|
-
var _a;
|
|
426
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
427
|
-
import_ui2.Link,
|
|
428
|
-
{
|
|
429
|
-
download: file.fileName,
|
|
430
|
-
href: file.url,
|
|
431
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
432
|
-
import_ui2.IconButton,
|
|
433
|
-
{
|
|
434
|
-
mt: "3",
|
|
435
|
-
size: "4",
|
|
436
|
-
style: { width: 400, height: 56 },
|
|
437
|
-
variant: "soft",
|
|
438
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { gap: "3", pl: "4", width: "100%", children: [
|
|
439
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Typo, { color: "gray", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.FileIcon, { height: 20, width: 20 }) }),
|
|
440
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
441
|
-
import_ui2.Typo,
|
|
442
|
-
{
|
|
443
|
-
as: "p",
|
|
444
|
-
color: "gray",
|
|
445
|
-
style: { width: "100%", textAlign: "left" },
|
|
446
|
-
children: file.fileName
|
|
447
|
-
}
|
|
448
|
-
)
|
|
449
|
-
] })
|
|
450
|
-
}
|
|
451
|
-
)
|
|
452
|
-
},
|
|
453
|
-
((_a = file.createdAt) == null ? void 0 : _a.valueOf()) + file.fileName
|
|
454
|
-
);
|
|
455
|
-
}) }),
|
|
456
|
-
content ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
|
|
457
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_ui2.Separator, { mb: "4", mt: "4", style: { width: "100%" } }),
|
|
458
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_ui2.Flex, { align: "center", direction: "column", gap: "3", children: [
|
|
459
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
460
|
-
html_container_default,
|
|
461
|
-
{
|
|
462
|
-
className,
|
|
463
|
-
html: safeContent,
|
|
464
|
-
ref
|
|
465
|
-
}
|
|
466
|
-
),
|
|
467
|
-
renderOpenBtns()
|
|
468
|
-
] })
|
|
469
|
-
] }) : null
|
|
470
|
-
] });
|
|
471
|
-
}
|
|
472
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
473
|
-
0 && (module.exports = {
|
|
474
|
-
Editor,
|
|
475
|
-
ReadCard
|
|
476
|
-
});
|
|
477
|
-
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.tsx","../src/editor.tsx","../src/read-card.tsx","../src/html-container.tsx"],"sourcesContent":["export { Editor } from './editor';\nexport { ReadCard } from './read-card';\n","import React, { forwardRef, useCallback, useRef, useState } from 'react';\nimport {\n Box,\n Button,\n Flex,\n Grid,\n Link,\n Separator,\n TextField,\n Typo,\n Link2Icon,\n toast,\n FileIcon,\n} from '@tipp/ui';\nimport type { ReactQuillProps } from 'react-quill';\nimport ReactQuill from 'react-quill';\n\nexport interface Attachment {\n fileName: string;\n url: string;\n createdAt?: Date;\n}\n\nexport interface TippEditorProps extends ReactQuillProps {\n defaultTitle?: string;\n defaultValue?: string;\n defaultAttachedFiles?: Attachment[];\n /** 저장하기 버튼 클릭 시 실행 */\n onClickSave?: (values: {\n title: string;\n content: string;\n files: Attachment[];\n }) => void;\n /** 파일 업로드 버튼 클릭 시 실행 */\n uploadFile?: (\n file: File,\n destination: string\n ) => Promise<Attachment | undefined>;\n deleteFile?: (fileUrl: string) => Promise<void>;\n /** 외부에서 Editor를 빈 상태로 초기화 시켜야 할 때 사용 */\n clearEditor?: React.MutableRefObject<(() => void) | undefined>;\n /** 초기화 버튼말고 다른 버튼 추가시 */\n SecondaryButton?: React.ReactNode;\n /** true인 경우 저장하기 버튼이 비활성 화 됨. 연타 방지 */\n isLoading?: boolean;\n minHeight?: string;\n maxHeight?: string;\n}\n\nexport const Editor = forwardRef<ReactQuill, TippEditorProps>(\n (props, ref): React.ReactNode => {\n const {\n defaultAttachedFiles,\n defaultTitle,\n defaultValue,\n onClickSave,\n uploadFile,\n deleteFile,\n isLoading,\n SecondaryButton,\n clearEditor,\n minHeight,\n maxHeight,\n ...quillProps\n } = props;\n const defaultRef = useRef<ReactQuill>(null);\n const editorRef = ref || defaultRef;\n const [attachedFiles, setAttachedFiles] = useState<Attachment[]>(\n defaultAttachedFiles || []\n );\n const [fileDeleteLoading, setFileDeleteLoading] = useState(new Set());\n\n const [title, setTitle] = useState(defaultTitle || '');\n const [content, setContent] = useState(defaultValue || '');\n\n const handleOnChangeContent = useCallback((value: string) => {\n setContent(value);\n }, []);\n\n const handleButtonClick = useCallback(() => {\n let input: HTMLInputElement | null = document.createElement('input');\n input.type = 'file';\n input.onchange = async (event) => {\n const file = (event.target as HTMLInputElement).files?.[0];\n if (!file) {\n // console.log('DEBUG: no file');\n toast.error('파일을 선택해주세요.');\n return;\n }\n\n const fileName = file.name;\n const attachment = await uploadFile?.(file, `hr-notes/${fileName}`);\n if (attachment) {\n setAttachedFiles((prev) => [...prev, attachment]);\n }\n input = null;\n };\n input.click();\n }, [uploadFile]);\n\n const handleDeleteFile = useCallback(\n async (fileUrl: string) => {\n try {\n setFileDeleteLoading((p) => p.add(fileUrl));\n await deleteFile?.(fileUrl);\n setAttachedFiles((currentFiles) =>\n currentFiles.filter((item) => item.url !== fileUrl)\n );\n } catch (err) {\n toast.error('파일 삭제에 실패했습니다.');\n } finally {\n setFileDeleteLoading((p) => {\n p.delete(fileUrl);\n return p;\n });\n }\n },\n [deleteFile]\n );\n\n const renderAttachedFiles = useCallback(() => {\n return (\n <Box width=\"100%\">\n {attachedFiles.map((file) => {\n return (\n <>\n <Separator size=\"4\" />\n <Flex\n align=\"center\"\n justify=\"between\"\n key={`${file.url}_${file.fileName}`}\n p=\"4\"\n width=\"100%\"\n >\n <Link href={file.url} size=\"2\">\n <Flex align=\"center\" gap=\"3\">\n <FileIcon />\n {file.fileName}\n </Flex>\n </Link>\n <Button\n loading={fileDeleteLoading.has(file.url)}\n onClick={() => {\n void handleDeleteFile(file.url);\n }}\n variant=\"ghost\"\n >\n 첨부 파일 삭제\n </Button>\n </Flex>\n </>\n );\n })}\n </Box>\n );\n }, [attachedFiles, fileDeleteLoading, handleDeleteFile]);\n\n const handleOnChangeTitle = useCallback<\n React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>\n >((e) => {\n setTitle(e.target.value);\n }, []);\n\n const clearEditorState = useCallback(() => {\n setContent('');\n setAttachedFiles([]);\n setTitle('');\n }, []);\n\n const handleSaveClick = useCallback(() => {\n onClickSave?.({\n title,\n content,\n files: attachedFiles,\n });\n }, [onClickSave, title, content, attachedFiles]);\n\n if (props.clearEditor) {\n props.clearEditor.current = clearEditorState;\n }\n\n return (\n <div\n className=\"tipp-ql-wrapper\"\n style={{\n minHeight,\n maxHeight,\n }}\n >\n {/* 제목 입력창 */}\n <Grid\n align=\"center\"\n columns=\"auto auto 1fr\"\n gap=\"2\"\n height=\"42px\"\n pl=\"2\"\n pr=\"3\"\n width=\"100%\"\n >\n <Box pl=\"3\" pr=\"3\">\n <Typo>제목</Typo>\n </Box>\n <Separator orientation=\"vertical\" style={{ height: '100%' }} />\n <TextField.Root\n className=\"editor-title-text-field\"\n onChange={handleOnChangeTitle}\n placeholder=\"제목을 입력해주세요\"\n value={title}\n />\n </Grid>\n <ReactQuill\n className=\"tipp-ql-editor write-mode\"\n onChange={handleOnChangeContent}\n ref={editorRef}\n theme=\"snow\"\n value={content}\n {...quillProps}\n />\n {renderAttachedFiles()}\n <Separator size=\"4\" />\n <Flex align=\"center\" justify=\"between\" p=\"2\" pl=\"4\" pr=\"4\" width=\"100%\">\n <Button\n color=\"gray\"\n onClick={handleButtonClick}\n variant=\"transparent\"\n >\n <Link2Icon height={20} width={20} />\n </Button>\n\n <Flex gap=\"2\">\n {clearEditor ? (\n <Button color=\"gray\" onClick={clearEditorState} variant=\"outline\">\n 초기화\n </Button>\n ) : null}\n {SecondaryButton ? SecondaryButton : null}\n <Button disabled={isLoading} onClick={handleSaveClick}>\n 저장\n </Button>\n </Flex>\n </Flex>\n </div>\n );\n }\n);\n\nEditor.displayName = 'TIPP-Quill-Editor';\n","import React, { useEffect, useMemo, useRef, useState } from 'react';\nimport Dompurify from 'dompurify';\nimport {\n AlertDialog,\n Badge,\n FileIcon,\n Button,\n Card,\n ChevronDownIcon,\n ChevronUpIcon,\n DotsVerticalIcon,\n Flex,\n Heading,\n IconButton,\n Link,\n Typo,\n Separator,\n DropdownMenu,\n Pencil1Icon,\n TrashIcon,\n} from '@tipp/ui';\nimport QuillHtmlOutputContainer from './html-container';\nimport type { Attachment } from './editor';\n\ninterface ReadCardProps {\n onClickDelete?: () => void;\n onClickEdit?: () => void;\n content?: string;\n title?: string;\n writer?: string;\n createAt?: Date;\n files?: Attachment[];\n}\n\nexport function ReadCard(props: ReadCardProps): React.ReactNode {\n const {\n onClickDelete: propsOnClickDelete,\n onClickEdit: propsOnClickEdit,\n content = '',\n title = '',\n writer,\n createAt,\n files,\n } = props;\n const ref = useRef<HTMLDivElement>(null);\n const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);\n\n const safeContent = useMemo(() => {\n return Dompurify.sanitize(content || '');\n }, [content]);\n\n interface OptionItem {\n title: string;\n icon: React.ReactNode;\n onClick: () => void;\n }\n const optionItems = useMemo<OptionItem[]>(() => {\n const result: OptionItem[] = [];\n if (propsOnClickEdit) {\n result.push({\n title: '수정하기',\n icon: <Pencil1Icon />,\n onClick: propsOnClickEdit,\n });\n }\n\n if (propsOnClickDelete) {\n result.push({\n title: '삭제하기',\n onClick: () => {\n setDeleteDialogOpen(true);\n },\n icon: <TrashIcon />,\n });\n }\n\n return result;\n }, [propsOnClickDelete, propsOnClickEdit]);\n\n const [className, setClassName] = useState<undefined | 'closed'>('closed');\n const [openBtnVisible, setOpenBtnVisible] = useState(false);\n\n useEffect(() => {\n if (!ref.current) return;\n setOpenBtnVisible(ref.current.clientHeight < ref.current.scrollHeight);\n ref.current.style.height = `${ref.current.clientHeight}px`;\n }, [ref, content]);\n\n const renderOpenBtns = (): React.ReactNode => {\n if (openBtnVisible) {\n if (className) {\n return (\n <Button\n color=\"gray\"\n onClick={() => {\n setClassName(undefined);\n if (ref.current) {\n ref.current.style.height = 'initial';\n }\n }}\n variant=\"outline\"\n >\n 메모 펼치기\n <ChevronDownIcon />\n </Button>\n );\n }\n return (\n <Button\n color=\"gray\"\n onClick={() => {\n setClassName('closed');\n }}\n variant=\"outline\"\n >\n 메모 접기\n <ChevronUpIcon />\n </Button>\n );\n }\n return null;\n };\n\n return (\n <Card size=\"2\">\n <Flex align=\"center\" gap=\"2\" justify=\"between\">\n <Flex align=\"center\" gap=\"4\">\n <Heading variant=\"heading5\" weight=\"regular\">\n {title}\n </Heading>\n {writer ? (\n <Badge color=\"neutral\" size=\"small\">{`작성자 : ${writer}`}</Badge>\n ) : null}\n </Flex>\n\n <Flex align=\"center\" gap=\"4\">\n {createAt ? (\n <Typo>{`등록일자: ${createAt.toLocaleDateString()} `}</Typo>\n ) : null}\n\n {optionItems.length ? (\n <DropdownMenu.Root>\n <DropdownMenu.Trigger>\n <IconButton variant=\"ghost\">\n <DotsVerticalIcon />\n </IconButton>\n </DropdownMenu.Trigger>\n <DropdownMenu.Content>\n {optionItems.map((item) => {\n return (\n <DropdownMenu.Item key={item.title} onClick={item.onClick}>\n {item.icon}\n {item.title}\n </DropdownMenu.Item>\n );\n })}\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n ) : null}\n </Flex>\n\n <AlertDialog.Root\n onOpenChange={setDeleteDialogOpen}\n open={deleteDialogOpen}\n >\n <AlertDialog.Content>\n <AlertDialog.Title>노트를 삭제하시겠습니까?</AlertDialog.Title>\n <AlertDialog.Description>\n 삭제된 노트는 복구할 수 없습니다. 삭제하시겠습니까?\n </AlertDialog.Description>\n <Flex gap=\"3\" justify=\"end\">\n <AlertDialog.Cancel>\n <Button color=\"gray\" variant=\"outline\">\n 취소\n </Button>\n </AlertDialog.Cancel>\n <AlertDialog.Action>\n <Button color=\"tomato\" onClick={propsOnClickDelete}>\n 삭제\n </Button>\n </AlertDialog.Action>\n </Flex>\n </AlertDialog.Content>\n </AlertDialog.Root>\n </Flex>\n\n {Boolean(files?.length) && (\n <Flex direction=\"column\" gap=\"1\">\n {files?.map((file) => {\n return (\n <Link\n download={file.fileName}\n href={file.url}\n key={file.createdAt?.valueOf() + file.fileName}\n >\n <IconButton\n mt=\"3\"\n size=\"4\"\n style={{ width: 400, height: 56 }}\n variant=\"soft\"\n >\n <Flex gap=\"3\" pl=\"4\" width=\"100%\">\n <Typo color=\"gray\">\n <FileIcon height={20} width={20} />\n </Typo>\n <Typo\n as=\"p\"\n color=\"gray\"\n style={{ width: '100%', textAlign: 'left' }}\n >\n {file.fileName}\n </Typo>\n </Flex>\n </IconButton>\n </Link>\n );\n })}\n </Flex>\n )}\n\n {content ? (\n <>\n <Separator mb=\"4\" mt=\"4\" style={{ width: '100%' }} />\n\n <Flex align=\"center\" direction=\"column\" gap=\"3\">\n <QuillHtmlOutputContainer\n className={className}\n html={safeContent}\n ref={ref}\n />\n {renderOpenBtns()}\n </Flex>\n </>\n ) : null}\n </Card>\n );\n}\n","import React, { forwardRef } from 'react';\n\ninterface QuillHtmlOutputContainerProps {\n html: string;\n className?: string;\n}\n\nconst QuillHtmlOutputContainer = forwardRef<\n HTMLDivElement,\n QuillHtmlOutputContainerProps\n>(({ html, className }, ref): React.ReactNode => {\n return (\n <div className=\"ql-snow ql-container read-mode\">\n <div\n className={`ql-editor ${className || ''}`}\n dangerouslySetInnerHTML={{ __html: html }}\n ref={ref}\n />\n </div>\n );\n});\n\nQuillHtmlOutputContainer.displayName = 'QuillHtmlOutputContainer';\n\nexport default QuillHtmlOutputContainer;\n"],"mappings":"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","names":["_a","ReactQuill","import_react","import_ui","import_react","import_jsx_runtime","import_jsx_runtime","Dompurify"]}
|
package/dist/index.d.cts
DELETED
package/dist/index.d.mts
DELETED
package/dist/index.d.ts
DELETED
package/dist/index.js
DELETED
package/dist/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
package/dist/index.mjs
DELETED
package/dist/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
package/src/index.tsx
DELETED
|
File without changes
|