use-chisel 0.1.3 → 0.1.5
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/README.md +13 -2
- package/bin/chisel.js +81 -8
- package/dist/hosted-entry.d.ts +3 -0
- package/dist/hosted-entry.js +134 -0
- package/dist/review/attachments.d.ts +35 -0
- package/dist/review/comment-ui.d.ts +36 -0
- package/dist/review/content.d.ts +24 -0
- package/dist/review/editor.d.ts +44 -0
- package/dist/review/media-lightbox.d.ts +8 -0
- package/dist/review/media-limits.d.ts +9 -0
- package/dist/review/read-queue.d.ts +4 -0
- package/dist/review/read-state.d.ts +1 -0
- package/dist/review/types.d.ts +21 -0
- package/dist/review-content-entry.d.ts +2 -0
- package/dist/review-content-entry.js +3 -0
- package/dist/review-entry.d.ts +8 -0
- package/dist/review-entry.js +31 -0
- package/dist/workspace/comments.d.ts +6 -0
- package/dist/workspace/workspace.d.ts +6 -0
- package/dist/workspace-entry.js +14 -7
- package/package.json +18 -3
- package/src/review/review-ui.css +60 -0
- package/src/review/workspace-design.css +71 -0
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/* Shared presentation for the owned review UI. */
|
|
2
|
+
.feedback-shell.chisel-review .comment-thread[data-native-ui=true],.feedback-shell.chisel-review .comment-box-native{border:0;border-radius:16px;background:var(--chisel-ui-surface);box-shadow:var(--chisel-ui-popover-shadow)}
|
|
3
|
+
.feedback-shell.chisel-review .comment-thread[data-expanded=false]{border-radius:16px 16px 16px 0}
|
|
4
|
+
.chisel-review-thread-content,.review-thread,.review-comment-content{width:100%;min-width:0}
|
|
5
|
+
.review-comment,.feedback-shell.chisel-review .chisel-review-message{display:flex;align-items:flex-start;gap:12px;padding:12px 20px}
|
|
6
|
+
.review-comment-content,.chisel-review-message-content{flex:1;min-width:0}
|
|
7
|
+
.review-comment-avatar{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;border-radius:50%;overflow:hidden;background:var(--chisel-ui-avatar);color:var(--chisel-ui-avatar-text);font-size:12px}
|
|
8
|
+
.review-comment-avatar img{width:100%;height:100%;object-fit:cover}
|
|
9
|
+
.review-comment-header,.chisel-review-byline{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;line-height:20px;margin-bottom:4px}
|
|
10
|
+
.review-comment-author{font-size:13px;font-weight:500;overflow-wrap:anywhere}
|
|
11
|
+
.review-comment-time{font-size:12px;color:var(--chisel-ui-muted);font-variant-numeric:tabular-nums;white-space:nowrap}
|
|
12
|
+
.review-comment-header{position:relative;padding-right:32px}
|
|
13
|
+
.review-comment-edit{position:absolute;right:-8px;top:-10px;display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:8px;background:transparent;color:var(--chisel-ui-muted);opacity:0;transition:opacity 120ms,background 120ms}
|
|
14
|
+
.review-comment:hover .review-comment-edit,.review-comment:focus-within .review-comment-edit,.review-comment-edit:focus-visible{opacity:1}
|
|
15
|
+
.review-comment-edit:hover{background:var(--chisel-ui-hover);color:var(--chisel-ui-text)}
|
|
16
|
+
@media(hover:none){.review-comment-edit{opacity:1}}
|
|
17
|
+
.review-inline-edit{border:1px solid var(--chisel-ui-border);border-radius:10px;padding:8px}
|
|
18
|
+
.review-inline-edit-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:8px}
|
|
19
|
+
.review-inline-edit-actions button{min-height:32px;padding:0 10px;border:0;border-radius:6px;background:var(--chisel-ui-hover);color:var(--chisel-ui-text)}
|
|
20
|
+
.review-comment-body,.chisel-rich-body{font-size:14px;line-height:21px;white-space:pre-wrap;overflow-wrap:anywhere}
|
|
21
|
+
.review-comment-body p{margin:0;min-height:21px}.review-comment-body p+p{margin-top:8px}
|
|
22
|
+
.review-comment-body a{color:var(--chisel-ui-accent-text);text-decoration:underline;text-underline-offset:3px}
|
|
23
|
+
.review-comment-body code{font:12px/1.5 ui-monospace,SFMono-Regular,monospace;background:var(--chisel-ui-inset);border-radius:4px;padding:2px 4px}
|
|
24
|
+
.review-composer{margin:0}
|
|
25
|
+
.feedback-shell.chisel-review .chisel-review-reply{display:flex;align-items:flex-start;gap:12px;border:0;padding:20px}
|
|
26
|
+
.feedback-shell.chisel-review .chisel-review-reply[hidden]{display:none}
|
|
27
|
+
.feedback-shell.chisel-review .feedback-reply-avatar{width:28px;height:28px;margin-top:8px}
|
|
28
|
+
.feedback-shell.chisel-review .chisel-reply-field{position:relative;flex:1;min-width:0;min-height:48px;border:0;border-radius:12px;background:var(--chisel-ui-raised)}
|
|
29
|
+
.review-composer-editor{min-width:0;min-height:40px;max-height:min(180px,30dvh);overflow:auto;padding:10px 12px;font-size:14px;line-height:21px;overflow-wrap:anywhere;outline:none}
|
|
30
|
+
.review-composer-editor p{margin:0}
|
|
31
|
+
.review-composer-editor>p,.chisel-rich-editor>p{position:relative}
|
|
32
|
+
.feedback-shell.chisel-review .chisel-review-reply :is(.review-composer-editor,.chisel-rich-editor){padding-right:56px}
|
|
33
|
+
.feedback-shell.chisel-review .chisel-reply-submit{position:absolute;right:4px;bottom:4px;display:grid;place-items:center;width:40px;height:40px;min-height:40px;padding:0;border:0;border-radius:8px;background:var(--chisel-ui-action);color:var(--chisel-ui-action-text)}
|
|
34
|
+
.chisel-reply-submit:disabled{opacity:.35}
|
|
35
|
+
.feedback-shell.chisel-review .comment-box-native>form{display:flex;flex-direction:column;flex:1;min-height:0;height:100%}
|
|
36
|
+
.feedback-shell.chisel-review .comment-box-native .comment-box-prompt{align-items:flex-start;padding:8px;gap:0}
|
|
37
|
+
.feedback-shell.chisel-review .comment-box-native .comment-box-footer{border:0;background:var(--chisel-ui-surface)}
|
|
38
|
+
.feedback-shell.chisel-review .comment-box-native .comment-box-element{background:var(--chisel-ui-raised)}
|
|
39
|
+
.feedback-shell.chisel-review .comment-box-native .comment-box-cancel{border:0;border-radius:8px;background:transparent}
|
|
40
|
+
.feedback-shell.chisel-review .comment-box-native .comment-box-cancel:hover{background:var(--chisel-ui-hover)}
|
|
41
|
+
.feedback-shell.chisel-review .comment-box-native .comment-box-submit{border-radius:8px}
|
|
42
|
+
.chisel-composer-input{flex:1;min-width:0;max-height:min(320px,42dvh);overflow:auto}
|
|
43
|
+
.chisel-attachment-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:0 8px;color:var(--chisel-ui-secondary);font-size:12px;line-height:18px}
|
|
44
|
+
.chisel-review-reply .chisel-attachment-controls{padding-right:48px}
|
|
45
|
+
.chisel-attachment-error{color:var(--chisel-ui-danger);line-height:1.5}
|
|
46
|
+
.chisel-attachment-previews,.review-attachments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:8px;max-height:240px;overflow:auto}
|
|
47
|
+
.review-attachments{padding:12px 0 0;max-height:none}
|
|
48
|
+
.feedback-shell.chisel-review .chisel-attachment-preview,.review-attachment{position:relative;min-width:0;margin:0;overflow:hidden;border:0;border-radius:8px;background:var(--chisel-ui-raised)}
|
|
49
|
+
.chisel-attachment-preview>img,.chisel-attachment-preview>video,.review-media-thumbnail img,.review-media-thumbnail video{display:block;width:100%;height:120px;object-fit:contain;background:var(--chisel-ui-inset)}
|
|
50
|
+
.review-attachment figcaption{padding:8px;font-size:12px;line-height:18px;overflow-wrap:anywhere}
|
|
51
|
+
.review-attachment-placeholder{min-height:100px;display:grid;place-items:center;padding:12px;color:var(--chisel-ui-secondary);font-size:12px}
|
|
52
|
+
.chisel-attachment-preview>button:not(.review-media-thumbnail){position:absolute;top:0;right:0;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:0 8px;background:var(--chisel-ui-surface);color:var(--chisel-ui-text)}
|
|
53
|
+
.review-retry-upload{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:var(--chisel-ui-text);font:inherit}
|
|
54
|
+
.review-retry-upload:hover{background:var(--chisel-ui-hover)}
|
|
55
|
+
.chisel-attachment-preview>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:8px;font-size:12px}
|
|
56
|
+
.feedback-shell.chisel-review .chisel-expand-thread{display:inline-flex;align-items:center;margin:0 20px 8px 60px;min-height:40px;padding:0;border:0;background:transparent;color:var(--chisel-ui-secondary);font-size:13px}
|
|
57
|
+
.chisel-review [data-slate-placeholder]{opacity:1!important;color:var(--chisel-ui-secondary)}
|
|
58
|
+
@media(pointer:coarse){.feedback-shell.chisel-review .chisel-reply-submit{width:44px;height:44px}.chisel-review-reply .chisel-attachment-controls{padding-right:52px}.feedback-shell.chisel-review .chisel-reply-field{min-height:52px}.feedback-shell.chisel-review .chisel-review-reply :is(.review-composer-editor,.chisel-rich-editor){padding-right:60px}}
|
|
59
|
+
@media(forced-colors:active){.feedback-shell.chisel-review .comment-thread[data-native-ui=true],.feedback-shell.chisel-review .comment-box-native,.feedback-shell.chisel-review .chisel-reply-field{border:1px solid CanvasText;box-shadow:none}.review-comment-avatar{border:1px solid CanvasText}}
|
|
60
|
+
.review-media-thumbnail{position:relative;display:block;width:100%;padding:0;border:0;background:var(--chisel-ui-inset);cursor:pointer}
|
|
61
|
+
.review-media-thumbnail img,.review-media-thumbnail video{display:block;width:100%;height:120px;object-fit:contain}
|
|
62
|
+
.review-media-play{position:absolute;inset:50% auto auto 50%;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#0009;color:white;transform:translate(-50%,-50%)}
|
|
63
|
+
.review-media-lightbox{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:24px;border:0;background:transparent;color:var(--chisel-ui-text)}
|
|
64
|
+
.review-media-lightbox::backdrop{background:#000b}
|
|
65
|
+
.review-media-lightbox-content{display:flex;flex-direction:column;width:min(100%,1000px);max-height:100%;margin:auto;border-radius:12px;overflow:hidden;background:var(--chisel-ui-surface);box-shadow:0 16px 48px #0006}
|
|
66
|
+
.review-media-lightbox-content header{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 12px 8px 16px}
|
|
67
|
+
.review-media-lightbox-content header span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
|
68
|
+
.review-media-lightbox-content header a{color:var(--chisel-ui-text);font-size:13px}
|
|
69
|
+
.review-media-lightbox-content header button{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--chisel-ui-text)}
|
|
70
|
+
.review-media-lightbox-content header button:hover{background:var(--chisel-ui-hover)}
|
|
71
|
+
.review-media-lightbox-content>img,.review-media-lightbox-content>video{display:block;min-height:0;max-width:100%;max-height:calc(100dvh - 104px);margin:auto;object-fit:contain;background:#000}
|