comark-file-tree 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.
@@ -112,10 +112,18 @@ const chain = (token, scheme) => {
112
112
  };
113
113
  const resolve = (list, scheme) => list.map((token) => `--_comark-${token[0]}:${chain(token, scheme)}`).join(";");
114
114
  /**
115
+ * `declarations` on `selector` in dark mode: the system's, unless a `.light` class sits on the element or above it, or
116
+ * a `.dark` class there whatever the system says. Either class pins a page's scheme.
117
+ */
118
+ function dark(selector, declarations) {
119
+ return `@media (prefers-color-scheme:dark){:where(:not(.light,.light *)):is(${selector}){${declarations}}}:where(.dark,.dark *):is(${selector}){${declarations}}`;
120
+ }
121
+ /**
115
122
  * Resolves the `--comark-*` tokens on `selector`, falling back to Nuxt UI's variables, then shadcn/ui's, then shadcn's
116
123
  * neutral theme. Nuxt UI's corners are twice its `--ui-radius`, so the radius halves shadcn's to double it back.
117
- * They resolve on the component rather than `:root`, so a `.dark` class anywhere above it switches the theme, and a
118
- * `--comark-*` set on any ancestor still inherits down. `:where()` keeps them at zero specificity.
124
+ * They resolve on the component rather than `:root`, so a `--comark-*` set on any ancestor still inherits down.
125
+ * `:where()` keeps them at zero specificity. The neutral theme follows the system's color mode, and a `.light` or
126
+ * `.dark` class on the component or above it pins one (see `dark()`).
119
127
  *
120
128
  * Every block gets the core tokens. Name `"status"` for `--comark-success`, `-danger`, `-warning`, and `-info`,
121
129
  * `"primary"` for `--comark-primary`, `-primary-foreground`, and `-secondary`, and `"shadow"` for `--comark-shadow`, so
@@ -123,11 +131,8 @@ const resolve = (list, scheme) => list.map((token) => `--_comark-${token[0]}:${c
123
131
  */
124
132
  function theme(selector, ...extras) {
125
133
  const where = `:where(${selector})`;
126
- const added = extras.flatMap((name) => groups[name]);
127
- const list = [...tokens, ...added];
128
- const schemed = added.filter((token) => token[3] !== token[4]);
129
- const classes = schemed.length ? `:where(.light,.light *)${where}{${resolve(schemed, 3)}}:where(.dark,.dark *)${where}{${resolve(schemed, 4)}}` : "";
130
- 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;
134
+ const list = [...tokens, ...extras.flatMap((name) => groups[name])];
135
+ 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));
131
136
  }
132
137
  //#endregion
133
138
  //#region ../../shared/disclosure.ts
package/dist/client.mjs CHANGED
@@ -1 +1 @@
1
- export { t as addStyles, i as css, n as glyphs, r as marks } from "./client-CmwF7cCV.mjs";
1
+ export { t as addStyles, i as css, n as glyphs, r as marks } from "./client-BIVTxse6.mjs";
package/dist/html.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { t as src_default } from "./src-PLku93wQ.mjs";
2
- import { i as css, n as glyphs, r as marks } from "./client-CmwF7cCV.mjs";
2
+ import { i as css, n as glyphs, r as marks } from "./client-BIVTxse6.mjs";
3
3
  import { escapeHtml } from "comark/utils";
4
4
  import { iconHtml, iconStyles } from "comark-icon/html";
5
5
  //#region ../../shared/text.ts
package/dist/react.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { t as src_default } from "./src-PLku93wQ.mjs";
2
- import { n as glyphs, r as marks, t as addStyles } from "./client-CmwF7cCV.mjs";
2
+ import { n as glyphs, r as marks, t as addStyles } from "./client-BIVTxse6.mjs";
3
3
  import { Icon } from "comark-icon/react";
4
4
  import { createElement, useEffect } from "react";
5
5
  //#region src/react.ts
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- @layer comark{@supports (interpolate-size:allow-keywords) and selector(::details-content){@media screen and (prefers-reduced-motion:no-preference){.cft details{interpolate-size:allow-keywords}.cft details::details-content{display:flow-root;block-size:0;opacity:0;overflow-y:clip;transition:block-size .18s cubic-bezier(.23,1,.32,1),opacity .12s ease-in,content-visibility .18s allow-discrete}.cft details[open]::details-content{block-size:auto;opacity:1;transition:block-size .25s cubic-bezier(.23,1,.32,1),opacity .25s cubic-bezier(.23,1,.32,1),content-visibility .25s allow-discrete}}}:where(.cft){--_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-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(.cft){--_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))}}:where(.light,.light *):where(.cft){--_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))}:where(.dark,.dark *):where(.cft){--_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))}:where(.cft){--cft-added:var(--_comark-success);--cft-removed:var(--_comark-danger);--cft-changed:var(--_comark-warning)}.cft{margin:1.5rem 0;padding:.75rem;overflow-x:auto;border:1px solid var(--_comark-border);border-radius:var(--_comark-radius);background:var(--_comark-background);color:var(--_comark-foreground);font:400 .8125rem/1.25rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.cft ul{margin:0!important;padding:0!important;list-style:none!important}.cft ul ul{margin-inline-start:calc(.5rem - .5px)!important;padding-inline-start:.75rem!important;border-inline-start:1px solid var(--_comark-border)}.cft li{margin:0!important;padding:0!important}.cft details{margin:0!important;padding:0!important}.cft summary{display:block;margin:0!important;padding:0!important;list-style:none;border-radius:calc(var(--_comark-radius) - 4px);cursor:pointer}.cft summary::-webkit-details-marker{display:none}.cft summary:hover{background:var(--_comark-accent)}.cft summary:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)}.cft-entry{display:flex;align-items:center;gap:.375rem;padding:.125rem .25rem;white-space:nowrap}.cft-glyph{flex:none;width:1rem;height:1rem;color:var(--_comark-muted)}.cft-entry .ci{flex:none;font-size:1rem}.cft-note{margin-inline-start:.75rem;color:var(--_comark-muted);font-family:var(--_comark-font);white-space:normal}.cft-mark{font-weight:600}.cft [data-state='added']>.cft-entry,.cft [data-state='added']>details>summary>.cft-entry{color:var(--cft-added)}.cft [data-state='removed']>.cft-entry,.cft [data-state='removed']>details>summary>.cft-entry{color:var(--cft-removed)}.cft [data-state='removed'] .cft-name{text-decoration:line-through}.cft [data-state='changed']>.cft-entry,.cft [data-state='changed']>details>summary>.cft-entry{color:var(--cft-changed)}.cft [data-type='more']{padding:0 .25rem;color:var(--_comark-muted)}}
1
+ @layer comark{@supports (interpolate-size:allow-keywords) and selector(::details-content){@media screen and (prefers-reduced-motion:no-preference){.cft details{interpolate-size:allow-keywords}.cft details::details-content{display:flow-root;block-size:0;opacity:0;overflow-y:clip;transition:block-size .18s cubic-bezier(.23,1,.32,1),opacity .12s ease-in,content-visibility .18s allow-discrete}.cft details[open]::details-content{block-size:auto;opacity:1;transition:block-size .25s cubic-bezier(.23,1,.32,1),opacity .25s cubic-bezier(.23,1,.32,1),content-visibility .25s allow-discrete}}}:where(.cft){--_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-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(.cft)){--_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))}}:where(.dark,.dark *):is(:where(.cft)){--_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))}:where(.cft){--cft-added:var(--_comark-success);--cft-removed:var(--_comark-danger);--cft-changed:var(--_comark-warning)}.cft{margin:1.5rem 0;padding:.75rem;overflow-x:auto;border:1px solid var(--_comark-border);border-radius:var(--_comark-radius);background:var(--_comark-background);color:var(--_comark-foreground);font:400 .8125rem/1.25rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.cft ul{margin:0!important;padding:0!important;list-style:none!important}.cft ul ul{margin-inline-start:calc(.5rem - .5px)!important;padding-inline-start:.75rem!important;border-inline-start:1px solid var(--_comark-border)}.cft li{margin:0!important;padding:0!important}.cft details{margin:0!important;padding:0!important}.cft summary{display:block;margin:0!important;padding:0!important;list-style:none;border-radius:calc(var(--_comark-radius) - 4px);cursor:pointer}.cft summary::-webkit-details-marker{display:none}.cft summary:hover{background:var(--_comark-accent)}.cft summary:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)}.cft-entry{display:flex;align-items:center;gap:.375rem;padding:.125rem .25rem;white-space:nowrap}.cft-glyph{flex:none;width:1rem;height:1rem;color:var(--_comark-muted)}.cft-entry .ci{flex:none;font-size:1rem}.cft-note{margin-inline-start:.75rem;color:var(--_comark-muted);font-family:var(--_comark-font);white-space:normal}.cft-mark{font-weight:600}.cft [data-state='added']>.cft-entry,.cft [data-state='added']>details>summary>.cft-entry{color:var(--cft-added)}.cft [data-state='removed']>.cft-entry,.cft [data-state='removed']>details>summary>.cft-entry{color:var(--cft-removed)}.cft [data-state='removed'] .cft-name{text-decoration:line-through}.cft [data-state='changed']>.cft-entry,.cft [data-state='changed']>details>summary>.cft-entry{color:var(--cft-changed)}.cft [data-type='more']{padding:0 .25rem;color:var(--_comark-muted)}}
package/dist/vue.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { t as src_default } from "./src-PLku93wQ.mjs";
2
- import { n as glyphs, r as marks, t as addStyles } from "./client-CmwF7cCV.mjs";
2
+ import { n as glyphs, r as marks, t as addStyles } from "./client-BIVTxse6.mjs";
3
3
  import { defineComponent, h, onMounted } from "vue";
4
4
  import { Icon } from "comark-icon/vue";
5
5
  //#region src/vue.ts
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "comark-file-tree",
3
- "version": "0.8.2",
3
+ "version": "0.9.0",
4
4
  "description": "A project's folders and files from an indented list or pasted tree output, with added, removed, and changed entries marked. A Comark plugin.",
5
5
  "keywords": [
6
6
  "comark",
@@ -45,7 +45,7 @@
45
45
  "provenance": true
46
46
  },
47
47
  "dependencies": {
48
- "comark-icon": "^0.8.2"
48
+ "comark-icon": "^0.9.0"
49
49
  },
50
50
  "devDependencies": {
51
51
  "@comark/html": "^0.8.1",
@@ -58,7 +58,7 @@
58
58
  "react-dom": "^19.3.1",
59
59
  "svelte": "^5.57.2",
60
60
  "vue": "^3.5.44",
61
- "comark-zoom": "0.8.2"
61
+ "comark-zoom": "0.9.0"
62
62
  },
63
63
  "peerDependencies": {
64
64
  "@comark/html": "^0.8.0",