comark-file-tree 0.10.0 → 0.10.1
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/{client-BrIeR0kc.mjs → client-DR85vQ8l.mjs} +5 -3
- package/dist/client.mjs +1 -1
- package/dist/html.mjs +2 -2
- package/dist/react.d.mts +1 -0
- package/dist/react.mjs +5 -2
- package/dist/style.css +1 -1
- package/dist/svelte/FileTree.svelte +1 -1
- package/dist/vue.mjs +5 -2
- package/package.json +3 -3
|
@@ -120,7 +120,9 @@ function dark(selector, declarations) {
|
|
|
120
120
|
}
|
|
121
121
|
/**
|
|
122
122
|
* Resolves the `--comark-*` tokens on `selector`, falling back to Nuxt UI's variables, then shadcn/ui's, then shadcn's
|
|
123
|
-
* neutral theme. Nuxt UI's corners are twice its `--ui-radius`, so the radius halves shadcn's to double it back.
|
|
123
|
+
* neutral theme. Nuxt UI's corners are twice its `--ui-radius`, so the radius halves shadcn's to double it back. The
|
|
124
|
+
* halving sits in the `var()` fallback without a `calc()` of its own, which reads the same once the fallback is
|
|
125
|
+
* substituted, because postcss-calc, which cssnano runs, can't parse a `calc()` there.
|
|
124
126
|
* They resolve on the component rather than `:root`, so a `--comark-*` set on any ancestor still inherits down.
|
|
125
127
|
* `:where()` keeps them at zero specificity. The neutral theme follows the system's color mode, and a `.light` or
|
|
126
128
|
* `.dark` class on the component or above it pins one (see `dark()`).
|
|
@@ -132,13 +134,13 @@ function dark(selector, declarations) {
|
|
|
132
134
|
function theme(selector, ...extras) {
|
|
133
135
|
const where = `:where(${selector})`;
|
|
134
136
|
const list = [...tokens, ...extras.flatMap((name) => groups[name])];
|
|
135
|
-
return `${where}{${resolve(list, 3)};--_comark-radius:var(--comark-radius,calc(var(--ui-radius,
|
|
137
|
+
return `${where}{${resolve(list, 3)};--_comark-radius:var(--comark-radius,calc(var(--ui-radius,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));
|
|
136
138
|
}
|
|
137
139
|
//#endregion
|
|
138
140
|
//#region ../../shared/disclosure.ts
|
|
139
141
|
const opening = ".25s cubic-bezier(.23,1,.32,1)";
|
|
140
142
|
const closing = ".18s cubic-bezier(.23,1,.32,1)";
|
|
141
|
-
const disclosureMotion = (selector, rules = "") => `@supports (interpolate-size:allow-keywords)
|
|
143
|
+
const disclosureMotion = (selector, rules = "") => `@supports selector(::details-content) and (interpolate-size:allow-keywords){@media screen and (prefers-reduced-motion:no-preference){${selector}{interpolate-size:allow-keywords}${selector}::details-content{display:flow-root;block-size:0;opacity:0;overflow-y:clip;transition:block-size ${closing},opacity .12s ease-in,content-visibility .18s allow-discrete}${selector}[open]::details-content{block-size:auto;opacity:1;transition:block-size ${opening},opacity ${opening},content-visibility .25s allow-discrete}${rules}}}`;
|
|
142
144
|
//#endregion
|
|
143
145
|
//#region src/styles.ts
|
|
144
146
|
/**
|
package/dist/client.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { t as addStyles, i as css, n as glyphs, r as marks } from "./client-
|
|
1
|
+
export { t as addStyles, i as css, n as glyphs, r as marks } from "./client-DR85vQ8l.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-
|
|
2
|
+
import { i as css, n as glyphs, r as marks } from "./client-DR85vQ8l.mjs";
|
|
3
3
|
import { escapeHtml } from "comark/utils";
|
|
4
4
|
import { iconHtml, iconStyles } from "comark-icon/html";
|
|
5
5
|
//#region ../../shared/text.ts
|
|
@@ -28,7 +28,7 @@ const hasIcon = (node) => Array.isArray(node) && (Boolean(node[1]?.icon) || node
|
|
|
28
28
|
const fileTree = async (node, state) => {
|
|
29
29
|
const styles = styled.has(state.context) ? "" : `<style data-comark-file-tree>${css}</style>`;
|
|
30
30
|
styled.add(state.context);
|
|
31
|
-
return `${styles}${hasIcon(node) ? iconStyles(state) : ""}<div class="cft"><ul>${await state.flow(node, state)}</ul></div>`;
|
|
31
|
+
return `${styles}${hasIcon(node) ? iconStyles(state) : ""}<div class="cft" data-comark-frame><ul>${await state.flow(node, state)}</ul></div>`;
|
|
32
32
|
};
|
|
33
33
|
const item = async (node, state) => {
|
|
34
34
|
const [, attrs] = node;
|
package/dist/react.d.mts
CHANGED
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-
|
|
2
|
+
import { n as glyphs, r as marks, t as addStyles } from "./client-DR85vQ8l.mjs";
|
|
3
3
|
import { Icon } from "comark-icon/react";
|
|
4
4
|
import { createElement, useEffect } from "react";
|
|
5
5
|
//#region src/react.ts
|
|
@@ -18,7 +18,10 @@ const glyph = (d) => createElement("svg", {
|
|
|
18
18
|
/** `::file-tree` for `@comark/react`. */
|
|
19
19
|
function FileTree({ children }) {
|
|
20
20
|
useEffect(addStyles, []);
|
|
21
|
-
return createElement("div", {
|
|
21
|
+
return createElement("div", {
|
|
22
|
+
className: "cft",
|
|
23
|
+
"data-comark-frame": ""
|
|
24
|
+
}, createElement("ul", null, children));
|
|
22
25
|
}
|
|
23
26
|
/** Each entry of a `::file-tree` for `@comark/react`. */
|
|
24
27
|
function FileTreeItem({ type, name, state, note, icon, children }) {
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer comark{@supports (interpolate-size:allow-keywords)
|
|
1
|
+
@layer comark{@supports selector(::details-content) and (interpolate-size:allow-keywords){@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,#d57506));--_comark-info:var(--comark-info,var(--ui-info,#2563eb));--_comark-radius:var(--comark-radius,calc(var(--ui-radius,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-
|
|
2
|
+
import { n as glyphs, r as marks, t as addStyles } from "./client-DR85vQ8l.mjs";
|
|
3
3
|
import { defineComponent, h, onMounted } from "vue";
|
|
4
4
|
import { Icon } from "comark-icon/vue";
|
|
5
5
|
//#region src/vue.ts
|
|
@@ -21,7 +21,10 @@ const FileTree = defineComponent({
|
|
|
21
21
|
inheritAttrs: false,
|
|
22
22
|
setup(_, { slots }) {
|
|
23
23
|
onMounted(addStyles);
|
|
24
|
-
return () => h("div", {
|
|
24
|
+
return () => h("div", {
|
|
25
|
+
class: "cft",
|
|
26
|
+
"data-comark-frame": ""
|
|
27
|
+
}, [h("ul", slots.default?.())]);
|
|
25
28
|
}
|
|
26
29
|
});
|
|
27
30
|
/** Each entry of a `::file-tree` for `@comark/vue`. */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "comark-file-tree",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.1",
|
|
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.10.
|
|
48
|
+
"comark-icon": "^0.10.1"
|
|
49
49
|
},
|
|
50
50
|
"devDependencies": {
|
|
51
51
|
"@comark/html": "^0.9.0",
|
|
@@ -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.10.
|
|
61
|
+
"comark-zoom": "0.10.1"
|
|
62
62
|
},
|
|
63
63
|
"peerDependencies": {
|
|
64
64
|
"@comark/html": "^0.9.0",
|