@richhtmleditor/comments 1.0.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/styles.js ADDED
@@ -0,0 +1,62 @@
1
+ /** Shared comment UI styles injected once per editor host. */
2
+ export const COMMENT_UI_STYLES = `
3
+ .de-comments-panel{position:absolute;top:0;right:0;width:min(280px,100%);max-height:100%;overflow:auto;
4
+ background:var(--de-surface,#fff);border-left:1px solid var(--de-border,#e2e8f0);padding:12px;
5
+ font:13px/1.45 system-ui,sans-serif;z-index:4;box-shadow:-4px 0 16px rgba(15,23,42,.06)}
6
+ .de-comments-panel__head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px}
7
+ .de-comments-panel__title{margin:0;font-size:14px;font-weight:600}
8
+ .de-comments-panel__close{border:0;background:transparent;cursor:pointer;font-size:18px;line-height:1;padding:2px 6px}
9
+ .de-comments-panel__empty{color:var(--de-muted,#64748b);margin:0}
10
+ .de-comments-thread{border:1px solid var(--de-border,#e2e8f0);border-radius:8px;padding:8px;margin:0 0 8px;cursor:pointer}
11
+ .de-comments-thread--resolved{opacity:.65}
12
+ .de-comments-thread--active{border-color:#2563eb;box-shadow:0 0 0 1px #2563eb33}
13
+ .de-comments-thread__excerpt{margin:0 0 6px;font-size:12px;color:var(--de-muted,#64748b)}
14
+ .de-comments-thread__msg{margin:0 0 4px}
15
+ .de-comments-thread__meta{font-size:11px;color:var(--de-muted,#94a3b8)}
16
+ .de-comments-thread__actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
17
+ .de-comments-thread__btn{font-size:11px;border:1px solid var(--de-border,#cbd5e1);background:#f8fafc;border-radius:6px;padding:3px 8px;cursor:pointer}
18
+ .de-comments-thread__reply{display:flex;flex-direction:column;gap:6px;margin-top:8px}
19
+ .de-comments-thread__reply textarea{min-height:48px;resize:vertical;border:1px solid var(--de-border,#cbd5e1);border-radius:8px;padding:6px 8px;font:inherit}
20
+ .de-comments-compose{display:flex;flex-direction:column;gap:6px;margin-top:10px}
21
+ .de-comments-compose textarea{min-height:64px;resize:vertical;border:1px solid var(--de-border,#cbd5e1);border-radius:8px;padding:8px;font:inherit}
22
+ .de-comments-compose button{align-self:flex-start;border:0;background:#2563eb;color:#fff;border-radius:8px;padding:6px 12px;cursor:pointer;font:inherit}
23
+ .de-comments-compose{position:relative}
24
+ .de-comments-mentions{position:absolute;left:0;right:0;bottom:calc(100% + 4px);background:#fff;border:1px solid var(--de-border,#cbd5e1);border-radius:8px;box-shadow:0 8px 20px rgba(15,23,42,.12);padding:4px;z-index:6}
25
+ .de-comments-mentions__item{display:block;width:100%;text-align:left;border:0;background:transparent;padding:6px 8px;border-radius:6px;cursor:pointer;font:inherit}
26
+ .de-comments-mentions__item:hover{background:#f1f5f9}
27
+ .de-content .de-comment-anchor,
28
+ .de-comment-anchor{background:rgba(251,191,36,.38)!important;border-bottom:2px solid #f59e0b!important;border-radius:2px;cursor:pointer}
29
+ .de-content .de-comment-anchor--resolved,
30
+ .de-comment-anchor--resolved{background:rgba(148,163,184,.22)!important;border-bottom-color:#94a3b8!important}
31
+ .de-selection-comment-chip{position:absolute;display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:8px;
32
+ border:1px solid #f59e0b;background:#fffbf0;box-shadow:0 4px 14px rgba(245,158,11,.18);z-index:23;
33
+ font:600 12px/1.2 system-ui,sans-serif;color:#ea580c;cursor:pointer}
34
+ .de-selection-comment-chip:hover{background:#fef3c7}
35
+ .de-selection-comment-chip__icon{font-size:13px;line-height:1}
36
+ .de-comment-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.28);display:flex;align-items:center;justify-content:center;
37
+ padding:16px;z-index:30;box-sizing:border-box}
38
+ .de-comment-modal{width:min(420px,100%);padding:16px 18px 18px;border-radius:12px;border:1px solid #e2e8f0;background:#fff;
39
+ box-shadow:0 20px 48px rgba(15,23,42,.2);font:13px/1.45 system-ui,sans-serif}
40
+ .de-comment-modal__head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 12px}
41
+ .de-comment-modal__title{margin:0;font-size:16px;font-weight:700;color:#0f172a}
42
+ .de-comment-modal__close{border:0;background:transparent;cursor:pointer;font-size:22px;line-height:1;color:#94a3b8;padding:2px 6px}
43
+ .de-comment-modal__quote{display:flex;align-items:stretch;gap:10px;margin:0 0 14px;padding:10px 12px;background:#f1f5f9;border-radius:8px}
44
+ .de-comment-modal__quote-bar{flex:0 0 4px;border-radius:4px;background:#0d9488}
45
+ .de-comment-modal__quote-text{font-size:14px;color:#334155;line-height:1.45;word-break:break-word}
46
+ .de-comment-modal__label{display:block;margin:0 0 8px;font-size:14px;font-weight:700;color:#0f172a}
47
+ .de-comment-modal__input{display:block;width:100%;min-height:96px;resize:vertical;border:1px solid #0f172a;border-radius:8px;
48
+ padding:10px 12px;font:inherit;box-sizing:border-box}
49
+ .de-comment-modal__input:focus{outline:2px solid #0d9488;outline-offset:1px}
50
+ .de-comment-modal__actions{display:flex;justify-content:flex-end;margin-top:14px}
51
+ .de-comment-modal__btn{border-radius:8px;padding:8px 16px;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
52
+ .de-comment-modal__btn--submit{border:0;background:#0d9488;color:#fff}
53
+ .de-comment-hover-tip{position:absolute;width:min(280px,calc(100% - 16px));padding:10px 12px;border-radius:8px;
54
+ border:1px solid #f59e0b;background:#fffbeb;box-shadow:0 10px 28px rgba(15,23,42,.14);
55
+ z-index:22;font:12px/1.45 system-ui,sans-serif;pointer-events:auto}
56
+ .de-comment-hover-tip--resolved{border-color:#94a3b8;background:#f8fafc}
57
+ .de-comment-hover-tip__title{margin:0 0 4px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#64748b}
58
+ .de-comment-hover-tip__highlight{margin:0 0 8px;padding:6px 8px;border-radius:6px;background:rgba(251,191,36,.35);
59
+ border-bottom:2px solid #f59e0b;font-size:13px;font-weight:600;color:#0f172a;word-break:break-word}
60
+ .de-comment-hover-tip__msg{margin:0 0 4px;color:#0f172a}
61
+ `.trim();
62
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA,8DAA8D;AAC9D,MAAM,CAAC,MAAM,iBAAiB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DhC,CAAC,IAAI,EAAE,CAAC"}
@@ -0,0 +1,22 @@
1
+ export type CommentStatus = "open" | "resolved";
2
+ export type CommentThread = {
3
+ id: string;
4
+ excerpt: string;
5
+ status: CommentStatus;
6
+ /** Links to a <span data-de-comment-id> anchor in document HTML when present. */
7
+ anchorId?: string;
8
+ messages: Array<{
9
+ id: string;
10
+ author: string;
11
+ body: string;
12
+ createdAt: string;
13
+ }>;
14
+ };
15
+ export type CommentsPluginOptions = {
16
+ author?: string;
17
+ initialThreads?: CommentThread[];
18
+ onChange?: (threads: CommentThread[]) => void;
19
+ /** Users available for @mention autocomplete in the compose box. */
20
+ mentionUsers?: string[];
21
+ };
22
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,UAAU,CAAC;AAEhD,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,aAAa,CAAC;IACtB,iFAAiF;IACjF,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAClF,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,aAAa,EAAE,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IAC9C,oEAAoE;IACpE,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;CACzB,CAAC"}
package/dist/types.js ADDED
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}
package/package.json ADDED
@@ -0,0 +1,39 @@
1
+ {
2
+ "name": "@richhtmleditor/comments",
3
+ "version": "1.0.0",
4
+ "description": "Review and comments workflow plugin for Rich HTML Editor (enterprise).",
5
+ "type": "module",
6
+ "main": "./dist/index.js",
7
+ "types": "./dist/index.d.ts",
8
+ "exports": {
9
+ ".": {
10
+ "types": "./dist/index.d.ts",
11
+ "import": "./dist/index.js",
12
+ "default": "./dist/index.js"
13
+ }
14
+ },
15
+ "files": [
16
+ "dist",
17
+ "README.md"
18
+ ],
19
+ "scripts": {
20
+ "build": "tsc -p tsconfig.json",
21
+ "prepack": "node ../../scripts/assert-pack-ready.mjs"
22
+ },
23
+ "dependencies": {
24
+ "@richhtmleditor/core": "^1.0.0"
25
+ },
26
+ "keywords": [
27
+ "richhtmleditor",
28
+ "comments",
29
+ "review",
30
+ "enterprise"
31
+ ],
32
+ "license": "MIT",
33
+ "publishConfig": {
34
+ "access": "public"
35
+ },
36
+ "engines": {
37
+ "node": ">=18"
38
+ }
39
+ }