comark-comments 0.8.2 → 0.9.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/html.mjs +1 -1
- package/dist/index.mjs +1 -1
- package/dist/{src-BdYWPXHQ.mjs → src-BZH4pcd9.mjs} +13 -8
- package/dist/style.css +1 -1
- package/package.json +3 -3
package/dist/html.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { a as nativeAttributes, c as childrenOf, d as rawText, i as ROOT, l as isElement, n as css, o as transform, r as DEFERRED, s as wrapParagraphs, t as src_default, u as hash } from "./src-
|
|
1
|
+
import { a as nativeAttributes, c as childrenOf, d as rawText, i as ROOT, l as isElement, n as css, o as transform, r as DEFERRED, s as wrapParagraphs, t as src_default, u as hash } from "./src-BZH4pcd9.mjs";
|
|
2
2
|
import { resolveAttributes } from "comark/render";
|
|
3
3
|
import { escapeHtml } from "comark/utils";
|
|
4
4
|
//#endregion
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { n as css, t as default } from "./src-
|
|
1
|
+
export { n as css, t as default } from "./src-BZH4pcd9.mjs";
|
|
@@ -488,10 +488,18 @@ const chain = (token, scheme) => {
|
|
|
488
488
|
};
|
|
489
489
|
const resolve = (list, scheme) => list.map((token) => `--_comark-${token[0]}:${chain(token, scheme)}`).join(";");
|
|
490
490
|
/**
|
|
491
|
+
* `declarations` on `selector` in dark mode: the system's, unless a `.light` class sits on the element or above it, or
|
|
492
|
+
* a `.dark` class there whatever the system says. Either class pins a page's scheme.
|
|
493
|
+
*/
|
|
494
|
+
function dark(selector, declarations) {
|
|
495
|
+
return `@media (prefers-color-scheme:dark){:where(:not(.light,.light *)):is(${selector}){${declarations}}}:where(.dark,.dark *):is(${selector}){${declarations}}`;
|
|
496
|
+
}
|
|
497
|
+
/**
|
|
491
498
|
* Resolves the `--comark-*` tokens on `selector`, falling back to Nuxt UI's variables, then shadcn/ui's, then shadcn's
|
|
492
499
|
* neutral theme. Nuxt UI's corners are twice its `--ui-radius`, so the radius halves shadcn's to double it back.
|
|
493
|
-
* They resolve on the component rather than `:root`, so a
|
|
494
|
-
*
|
|
500
|
+
* They resolve on the component rather than `:root`, so a `--comark-*` set on any ancestor still inherits down.
|
|
501
|
+
* `:where()` keeps them at zero specificity. The neutral theme follows the system's color mode, and a `.light` or
|
|
502
|
+
* `.dark` class on the component or above it pins one (see `dark()`).
|
|
495
503
|
*
|
|
496
504
|
* Every block gets the core tokens. Name `"status"` for `--comark-success`, `-danger`, `-warning`, and `-info`,
|
|
497
505
|
* `"primary"` for `--comark-primary`, `-primary-foreground`, and `-secondary`, and `"shadow"` for `--comark-shadow`, so
|
|
@@ -499,11 +507,8 @@ const resolve = (list, scheme) => list.map((token) => `--_comark-${token[0]}:${c
|
|
|
499
507
|
*/
|
|
500
508
|
function theme(selector, ...extras) {
|
|
501
509
|
const where = `:where(${selector})`;
|
|
502
|
-
const
|
|
503
|
-
|
|
504
|
-
const schemed = added.filter((token) => token[3] !== token[4]);
|
|
505
|
-
const classes = schemed.length ? `:where(.light,.light *)${where}{${resolve(schemed, 3)}}:where(.dark,.dark *)${where}{${resolve(schemed, 4)}}` : "";
|
|
506
|
-
return `${where}{${resolve(list, 3)};--_comark-radius:var(--comark-radius,calc(var(--ui-radius,calc(var(--radius,.625rem)/2))*2));--_comark-font:var(--comark-font,var(--font-sans,ui-sans-serif,system-ui,sans-serif))}@media (prefers-color-scheme:dark){${where}{${resolve(list, 4)}}}` + classes;
|
|
510
|
+
const list = [...tokens, ...extras.flatMap((name) => groups[name])];
|
|
511
|
+
return `${where}{${resolve(list, 3)};--_comark-radius:var(--comark-radius,calc(var(--ui-radius,calc(var(--radius,.625rem)/2))*2));--_comark-font:var(--comark-font,var(--font-sans,ui-sans-serif,system-ui,sans-serif))}` + dark(where, resolve(list, 4));
|
|
507
512
|
}
|
|
508
513
|
//#endregion
|
|
509
514
|
//#region src/styles.ts
|
|
@@ -517,7 +522,7 @@ const pen = ".cr-sg[data-mark=\"pen\"]";
|
|
|
517
522
|
const css = `@layer comark{${[
|
|
518
523
|
theme(parts, "status", "shadow"),
|
|
519
524
|
`:where(${parts}){--_cr-ins:var(--cr-ins,var(--_comark-success));--_cr-del:var(--cr-del,var(--_comark-danger));--_cr-comment:var(--cr-comment,#f5a524);--_cr-icon:var(--cr-icon,${icon})}`,
|
|
520
|
-
|
|
525
|
+
dark(`:where(${parts})`, "--_cr-comment:var(--cr-comment,#fbbf24)"),
|
|
521
526
|
".cr-sg :is(del,ins)::before,.cr-sg :is(del,ins)::after{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}",
|
|
522
527
|
".cr-sg del::before{content:\" [removed: \"}.cr-sg ins::before{content:\" [added: \"}.cr-sg :is(del,ins)::after{content:\"] \"}",
|
|
523
528
|
".cr-sg,.cr-cm{border-radius:calc(var(--_comark-radius) - 6px);transition:box-shadow .12s}",
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer comark{:where(.cr,.cr-sg,.cr-cm,.cr-bub,.cr-card){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#fff)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#0a0a0a)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#737373)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,#e5e5e5)));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#f5f5f5)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#a1a1a1)));--_comark-success:var(--comark-success,var(--ui-success,var(--success,#259f56)));--_comark-danger:var(--comark-danger,var(--ui-error,var(--destructive,#ee3533)));--_comark-warning:var(--comark-warning,var(--ui-warning,#d97706));--_comark-info:var(--comark-info,var(--ui-info,#2563eb));--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.12));--_comark-radius:var(--comark-radius,calc(var(--ui-radius,calc(var(--radius,.625rem)/2))*2));--_comark-font:var(--comark-font,var(--font-sans,ui-sans-serif,system-ui,sans-serif))}@media (prefers-color-scheme:dark){:where(.cr,.cr-sg,.cr-cm,.cr-bub,.cr-card){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#0a0a0a)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#fafafa)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#a1a1a1)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,rgb(255 255 255/.1))));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#262626)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#737373)));--_comark-success:var(--comark-success,var(--ui-success,var(--success,#59d38c)));--_comark-danger:var(--comark-danger,var(--ui-error,var(--destructive,#fd736d)));--_comark-warning:var(--comark-warning,var(--ui-warning,#fbbf24));--_comark-info:var(--comark-info,var(--ui-info,#60a5fa));--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.5))}}:where(.
|
|
1
|
+
@layer comark{:where(.cr,.cr-sg,.cr-cm,.cr-bub,.cr-card){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#fff)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#0a0a0a)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#737373)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,#e5e5e5)));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#f5f5f5)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#a1a1a1)));--_comark-success:var(--comark-success,var(--ui-success,var(--success,#259f56)));--_comark-danger:var(--comark-danger,var(--ui-error,var(--destructive,#ee3533)));--_comark-warning:var(--comark-warning,var(--ui-warning,#d97706));--_comark-info:var(--comark-info,var(--ui-info,#2563eb));--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.12));--_comark-radius:var(--comark-radius,calc(var(--ui-radius,calc(var(--radius,.625rem)/2))*2));--_comark-font:var(--comark-font,var(--font-sans,ui-sans-serif,system-ui,sans-serif))}@media (prefers-color-scheme:dark){:where(:not(.light,.light *)):is(:where(.cr,.cr-sg,.cr-cm,.cr-bub,.cr-card)){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#0a0a0a)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#fafafa)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#a1a1a1)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,rgb(255 255 255/.1))));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#262626)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#737373)));--_comark-success:var(--comark-success,var(--ui-success,var(--success,#59d38c)));--_comark-danger:var(--comark-danger,var(--ui-error,var(--destructive,#fd736d)));--_comark-warning:var(--comark-warning,var(--ui-warning,#fbbf24));--_comark-info:var(--comark-info,var(--ui-info,#60a5fa));--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.5))}}:where(.dark,.dark *):is(:where(.cr,.cr-sg,.cr-cm,.cr-bub,.cr-card)){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#0a0a0a)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#fafafa)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#a1a1a1)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,rgb(255 255 255/.1))));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#262626)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#737373)));--_comark-success:var(--comark-success,var(--ui-success,var(--success,#59d38c)));--_comark-danger:var(--comark-danger,var(--ui-error,var(--destructive,#fd736d)));--_comark-warning:var(--comark-warning,var(--ui-warning,#fbbf24));--_comark-info:var(--comark-info,var(--ui-info,#60a5fa));--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.5))}:where(.cr,.cr-sg,.cr-cm,.cr-bub,.cr-card){--_cr-ins:var(--cr-ins,var(--_comark-success));--_cr-del:var(--cr-del,var(--_comark-danger));--_cr-comment:var(--cr-comment,#f5a524);--_cr-icon:var(--cr-icon,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.2' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.6 7.1L4 20l1-4.6A8 8 0 1 1 21 12z'/%3E%3C/svg%3E"))}@media (prefers-color-scheme:dark){:where(:not(.light,.light *)):is(:where(.cr,.cr-sg,.cr-cm,.cr-bub,.cr-card)){--_cr-comment:var(--cr-comment,#fbbf24)}}:where(.dark,.dark *):is(:where(.cr,.cr-sg,.cr-cm,.cr-bub,.cr-card)){--_cr-comment:var(--cr-comment,#fbbf24)}.cr-sg :is(del,ins)::before,.cr-sg :is(del,ins)::after{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.cr-sg del::before{content:" [removed: "}.cr-sg ins::before{content:" [added: "}.cr-sg :is(del,ins)::after{content:"] "}.cr-sg,.cr-cm{border-radius:calc(var(--_comark-radius) - 6px);transition:box-shadow .12s}.cr-sg :is(del,ins){padding:.0625rem .1875rem;border-radius:calc(var(--_comark-radius) - 6px);-webkit-box-decoration-break:clone;box-decoration-break:clone}.cr-sg del{color:color-mix(in oklab,var(--_cr-del) 70%,var(--_comark-foreground));background:color-mix(in srgb,var(--_cr-del) 11%,transparent);text-decoration:line-through 1.5px color-mix(in srgb,var(--_cr-del) 75%,transparent)}.cr-sg ins{color:color-mix(in oklab,var(--_cr-ins) 60%,var(--_comark-foreground));background:color-mix(in srgb,var(--_cr-ins) 13%,transparent);text-decoration:none}.cr-sg del+ins{margin-left:.125rem}.cr-sg[data-mark="pen"]{position:relative;display:inline-block;padding-top:1.05em}.cr-keep{white-space:nowrap}.cr-sg[data-mark="pen"] del{position:relative;padding:0;background:none;color:inherit;text-decoration:none}.cr-sg[data-mark="pen"] .cr-strike{position:absolute;left:-.08em;top:50%;width:calc(100% + .16em);height:.7em;transform:translateY(-40%);overflow:visible;fill:none;stroke:var(--_cr-del);stroke-width:2.25;stroke-linecap:round}.cr-sg[data-mark="pen"] .cr-strike path{vector-effect:non-scaling-stroke}.cr-sg[data-mark="pen"] ins{position:absolute;left:0;top:-.05em;margin:0;padding:0;background:none;transform:rotate(-2.5deg);transform-origin:left bottom;white-space:nowrap;color:var(--_cr-del);font:400 1.5em/1 comark-caveat,cursive}.cr-sg[data-mark="pen"][data-kind="insert"] ins{transform:translateX(-50%) rotate(-2.5deg);transform-origin:center}.cr-sg[data-mark="pen"] .cr-caret{display:inline-block;position:relative;width:0}.cr-sg[data-mark="pen"] .cr-caret svg{position:absolute;left:-.32em;top:.18em;width:.64em;height:.5em;overflow:visible;fill:none;stroke:var(--_cr-del);stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}.cr-cm{color:inherit;background:color-mix(in srgb,var(--_cr-comment) 22%,transparent);border-bottom:2px solid color-mix(in srgb,var(--_cr-comment) 80%,transparent);border-radius:calc(var(--_comark-radius) - 8px);padding:0 .0625rem}.cr-bub{display:inline;margin-left:.25em;padding:.25em .5em .25em 1.75em;vertical-align:.1em;border:1px solid var(--_comark-border);border-radius:9999px;background:var(--_comark-background) var(--_cr-icon) no-repeat .42em 50%/1em;color:var(--_comark-muted);font:600 .6875rem/1 var(--_comark-font);font-variant-numeric:tabular-nums;cursor:pointer;transition:color .12s,border-color .12s}.cr-bub:empty{padding-right:.3em}.cr-tg{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}.cr-tg:focus-visible+.cr-bub{outline:2px solid var(--_comark-ring);outline-offset:2px}.cr-tg:checked+.cr-bub,.cr-bub:hover,.cr-bub:has(+.cr-card:hover){color:var(--_comark-foreground);border-color:var(--_comark-ring)}:is(.cr-cm,.cr-sg):has(+.cr-tg:checked,+.cr-tg+.cr-bub:hover,+.cr-tg+.cr-bub+.cr-card:hover){box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-foreground) 12%,transparent)}.cr-card{display:none;box-sizing:border-box;padding:.5rem .75rem;border:1px solid var(--_comark-border);border-radius:var(--_comark-radius);background:var(--_comark-background);color:var(--_comark-foreground);font:400 .8125rem/1.5 var(--_comark-font);text-align:left;text-indent:0;white-space:normal;transition:border-color .12s,box-shadow .12s}.cr-entry{display:block}.cr-entry+.cr-entry{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--_comark-border)}.cr-entry b{margin-right:.375rem;font-weight:600}.cr-av{display:inline-block;overflow:hidden;width:1.125rem;height:1.125rem;margin-right:.375rem;border-radius:9999px;background:color-mix(in oklab,oklch(.7 .12 var(--cr-hue)) 30%,var(--_comark-background));color:color-mix(in oklab,oklch(.55 .14 var(--cr-hue)) 60%,var(--_comark-foreground));font:600 .5625rem/2 var(--_comark-font);text-align:center;vertical-align:calc(.722cap - .5625rem)}img.cr-av{display:inline-block;background:#fff;object-fit:cover;outline:1px solid color-mix(in srgb,var(--_comark-foreground) 12%,transparent);outline-offset:-1px}.cr-tg:checked+.cr-bub+.cr-card{display:block;float:left;clear:both;width:100%;margin:.5rem 0}.cr{container:cr/inline-size;display:flow-root}@container cr (min-width:50rem){.cr>*{margin-right:19.5rem!important}.cr-card,.cr-tg:checked+.cr-bub+.cr-card{display:block;position:relative;float:right;clear:right;width:17.5rem;margin:0 -19.5rem .5rem 0}.cr-tg:checked+.cr-bub+.cr-card,.cr-bub:hover+.cr-card,.cr-card:hover{border-color:var(--_comark-ring);box-shadow:var(--_comark-shadow)}}@media print{.cr>*{margin-right:12.5rem!important}.cr-card{display:block!important;float:right!important;clear:right;width:11.5rem!important;margin:0 -12.5rem .375rem 0!important;font-size:.6875rem;box-shadow:none!important}.cr-av{vertical-align:calc(.611cap - .5625rem)}.cr-bub{display:none}}}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "comark-comments",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.9.0",
|
|
4
4
|
"description": "Suggested edits and comment threads in Markdown, drawn as redlines or a hand-drawn pen with notes in the margin, and no script. A Comark plugin.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"comark",
|
|
@@ -41,8 +41,8 @@
|
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"@comark/html": "^0.8.1",
|
|
43
43
|
"comark": "^0.8.1",
|
|
44
|
-
"comark-
|
|
45
|
-
"comark-
|
|
44
|
+
"comark-zoom": "0.9.0",
|
|
45
|
+
"comark-annotate": "0.9.0"
|
|
46
46
|
},
|
|
47
47
|
"peerDependencies": {
|
|
48
48
|
"@comark/html": "^0.8.0",
|