@vegastack/design 0.7.38 → 0.7.40
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/{chunk-32APSUN7.js → chunk-MSLEIFNS.js} +34 -31
- package/dist/create-animated-icon.js +1 -1
- package/dist/icons/index.js +1 -1
- package/dist/index.cjs +34 -31
- package/dist/index.d.cts +20 -20
- package/dist/index.d.ts +20 -20
- package/dist/index.js +1 -1
- package/package.json +1 -1
- package/skills/vegastack-design-system/references/components.md +2 -1
|
@@ -19,51 +19,54 @@ var prose = {
|
|
|
19
19
|
* rather than something prose falls into by accident. A consumer who genuinely wants mono prose
|
|
20
20
|
* still says so on the root, where it reads as a decision.
|
|
21
21
|
*/
|
|
22
|
-
root: "font-sans text-sm text-foreground",
|
|
23
|
-
// Headings
|
|
24
|
-
// `
|
|
25
|
-
//
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
h5: "[&_h5]:mt-
|
|
32
|
-
h6: "[&_h6]:mt-
|
|
33
|
-
|
|
34
|
-
//
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
22
|
+
root: "font-sans text-sm font-normal text-foreground",
|
|
23
|
+
// Headings follow the app's type scale (design.md §Headings), not a document scale: the page
|
|
24
|
+
// title is the only `text-2xl`, so a heading inside rendered text stops at `text-lg` for `#`,
|
|
25
|
+
// the section size (`text-base`) for `##`, and body size for everything below — weight carries
|
|
26
|
+
// the rest. Every heading wears `font-heading` like the app's own titles.
|
|
27
|
+
h1: "[&_h1]:mt-5 [&_h1]:mb-2 [&_h1]:scroll-m-20 [&_h1]:font-heading [&_h1]:text-lg [&_h1]:font-semibold [&_h1]:text-foreground [&_h1]:first:mt-0",
|
|
28
|
+
h2: "[&_h2]:mt-4 [&_h2]:mb-2 [&_h2]:scroll-m-20 [&_h2]:font-heading [&_h2]:text-base [&_h2]:font-semibold [&_h2]:text-foreground [&_h2]:first:mt-0",
|
|
29
|
+
h3: "[&_h3]:mt-4 [&_h3]:mb-1.5 [&_h3]:scroll-m-20 [&_h3]:font-heading [&_h3]:text-sm [&_h3]:font-semibold [&_h3]:text-foreground [&_h3]:first:mt-0",
|
|
30
|
+
h4: "[&_h4]:mt-3 [&_h4]:mb-1.5 [&_h4]:font-heading [&_h4]:text-sm [&_h4]:font-medium [&_h4]:text-foreground [&_h4]:first:mt-0",
|
|
31
|
+
h5: "[&_h5]:mt-3 [&_h5]:mb-1.5 [&_h5]:font-heading [&_h5]:text-sm [&_h5]:font-medium [&_h5]:text-foreground [&_h5]:first:mt-0",
|
|
32
|
+
h6: "[&_h6]:mt-3 [&_h6]:mb-1.5 [&_h6]:font-heading [&_h6]:text-sm [&_h6]:font-medium [&_h6]:text-foreground [&_h6]:first:mt-0",
|
|
33
|
+
// Body text is the app's body text — size, leading and ink inherit from the root, so a paragraph
|
|
34
|
+
// here is indistinguishable from any other `text-sm` paragraph in the product. No prose look.
|
|
35
|
+
p: "[&_p]:my-2 [&_p]:first:mt-0 [&_p]:last:mb-0",
|
|
36
|
+
// Marks. Links are `info` ink per design.md §Colours at body weight; `s` is Tiptap's strike
|
|
37
|
+
// element and `del` is GFM's — the same mark from two producers.
|
|
38
|
+
a: "[&_a]:text-info-text [&_a]:underline [&_a]:underline-offset-4 [&_a]:hover:text-info-text/88",
|
|
39
|
+
strong: "[&_strong]:font-semibold",
|
|
38
40
|
em: "[&_em]:italic",
|
|
39
|
-
del: "[&_del]:
|
|
40
|
-
// Lists.
|
|
41
|
-
//
|
|
42
|
-
//
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
41
|
+
del: "[&_del]:line-through [&_s]:line-through",
|
|
42
|
+
// Lists. Items and markers are body text: family, size and ink inherit (a `::marker` takes the
|
|
43
|
+
// item's font), so `1.` and `•` never read as a second typeface or a second colour. A GFM task
|
|
44
|
+
// list carries `contains-task-list` and its checkbox IS the marker, so the disc goes — expressed
|
|
45
|
+
// as a second, more specific descendant rule rather than a class on the element, which would
|
|
46
|
+
// lose the cascade (see the header).
|
|
47
|
+
ul: "[&_ul]:my-2 [&_ul]:ms-5 [&_ul]:list-disc [&_ul.contains-task-list]:list-none",
|
|
48
|
+
ol: "[&_ol]:my-2 [&_ol]:ms-5 [&_ol]:list-decimal",
|
|
49
|
+
li: "[&_li]:mt-1 [&_li]:marker:font-sans [&_li]:marker:text-foreground [&_li_p]:my-0",
|
|
46
50
|
// Task lists, one shape for both producers: `MarkdownView` tags the GFM list
|
|
47
51
|
// `data-type="taskList"` and each item `data-type="taskItem"` with its body in a
|
|
48
52
|
// `data-slot="task-item-content"` box, which is exactly the DOM Tiptap's `TaskItem` node view
|
|
49
53
|
// renders — so the checkbox IS the marker, the body wraps beside it, and a nested list indents
|
|
50
|
-
// under the body in view and edit alike.
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
blockquote: "[&_blockquote]:my-3 [&_blockquote]:border-s-2 [&_blockquote]:border-border [&_blockquote]:ps-4 [&_blockquote]:text-muted-foreground [&_blockquote]:italic",
|
|
54
|
+
// under the body in view and edit alike.
|
|
55
|
+
taskList: "[&_ul[data-type=taskList]]:ms-0 [&_ul[data-type=taskList]]:list-none [&_li[data-type=taskItem]]:flex [&_li[data-type=taskItem]]:items-start [&_li[data-type=taskItem]]:gap-2 [&_li[data-type=taskItem]_[data-slot=checkbox]]:mt-0.5 [&_li[data-type=taskItem]_[data-slot=checkbox]]:me-0 [&_[data-slot=task-item-content]]:min-w-0 [&_[data-slot=task-item-content]]:flex-1",
|
|
56
|
+
blockquote: "[&_blockquote]:my-2 [&_blockquote]:border-s-2 [&_blockquote]:border-border [&_blockquote]:ps-3",
|
|
54
57
|
// Inline code is a chip. Code inside a `pre` is not: it inherits the panel's ground, so the chip
|
|
55
58
|
// is undone at higher specificity (`[&_pre_code]` is (0,1,2) against the chip's (0,1,1)).
|
|
56
59
|
code: "[&_code]:rounded-sm [&_code]:bg-muted [&_code]:px-1.5 [&_code]:py-0.5 [&_code]:font-mono [&_code]:text-sm [&_code]:text-foreground",
|
|
57
60
|
// A bare `<pre>` wears `CodeBlock`'s surface — the same sunken panel, one vocabulary (B4-09).
|
|
58
61
|
// `CodeBlock`'s own `pre` is excluded: it already sits inside a `figure` carrying the border,
|
|
59
62
|
// radius and ground, and re-applying them here would draw a second panel inside the first.
|
|
60
|
-
pre: "[&_pre:not([data-slot='code-block-pre'])]:my-
|
|
63
|
+
pre: "[&_pre:not([data-slot='code-block-pre'])]:my-2 [&_pre:not([data-slot='code-block-pre'])]:overflow-x-auto [&_pre:not([data-slot='code-block-pre'])]:rounded-lg [&_pre:not([data-slot='code-block-pre'])]:border [&_pre:not([data-slot='code-block-pre'])]:border-border [&_pre:not([data-slot='code-block-pre'])]:bg-muted [&_pre:not([data-slot='code-block-pre'])]:p-4 [&_pre:not([data-slot='code-block-pre'])]:text-foreground",
|
|
61
64
|
preCode: "[&_pre_code]:bg-transparent [&_pre_code]:p-0 [&_pre_code]:font-mono [&_pre_code]:text-sm [&_pre_code]:text-foreground",
|
|
62
|
-
hr: "[&_hr]:my-
|
|
65
|
+
hr: "[&_hr]:my-4 [&_hr]:border-border",
|
|
63
66
|
// GFM tables. The scroll container is structural and belongs to the consumer (MarkdownView wraps
|
|
64
67
|
// the table in an `overflow-x-auto` div); these are the cell and rule tokens.
|
|
65
|
-
table: "[&_table]:w-full [&_table]:border-collapse [&
|
|
66
|
-
img: "[&_img]:my-
|
|
68
|
+
table: "[&_table]:w-full [&_table]:border-collapse [&_thead]:border-b [&_thead]:border-border [&_tr]:border-b [&_tr]:border-border [&_tr]:last:border-0 [&_th]:px-3 [&_th]:py-2 [&_th]:text-start [&_th]:font-medium [&_td]:px-3 [&_td]:py-2 [&_td_p]:my-0 [&_th_p]:my-0",
|
|
69
|
+
img: "[&_img]:my-2 [&_img]:max-w-full [&_img]:rounded-lg [&_img]:border [&_img]:border-border"
|
|
67
70
|
};
|
|
68
71
|
var proseClassName = Object.values(prose).join(" ");
|
|
69
72
|
|
package/dist/icons/index.js
CHANGED
package/dist/index.cjs
CHANGED
|
@@ -48,51 +48,54 @@ var prose = {
|
|
|
48
48
|
* rather than something prose falls into by accident. A consumer who genuinely wants mono prose
|
|
49
49
|
* still says so on the root, where it reads as a decision.
|
|
50
50
|
*/
|
|
51
|
-
root: "font-sans text-sm text-foreground",
|
|
52
|
-
// Headings
|
|
53
|
-
// `
|
|
54
|
-
//
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
h5: "[&_h5]:mt-
|
|
61
|
-
h6: "[&_h6]:mt-
|
|
62
|
-
|
|
63
|
-
//
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
51
|
+
root: "font-sans text-sm font-normal text-foreground",
|
|
52
|
+
// Headings follow the app's type scale (design.md §Headings), not a document scale: the page
|
|
53
|
+
// title is the only `text-2xl`, so a heading inside rendered text stops at `text-lg` for `#`,
|
|
54
|
+
// the section size (`text-base`) for `##`, and body size for everything below — weight carries
|
|
55
|
+
// the rest. Every heading wears `font-heading` like the app's own titles.
|
|
56
|
+
h1: "[&_h1]:mt-5 [&_h1]:mb-2 [&_h1]:scroll-m-20 [&_h1]:font-heading [&_h1]:text-lg [&_h1]:font-semibold [&_h1]:text-foreground [&_h1]:first:mt-0",
|
|
57
|
+
h2: "[&_h2]:mt-4 [&_h2]:mb-2 [&_h2]:scroll-m-20 [&_h2]:font-heading [&_h2]:text-base [&_h2]:font-semibold [&_h2]:text-foreground [&_h2]:first:mt-0",
|
|
58
|
+
h3: "[&_h3]:mt-4 [&_h3]:mb-1.5 [&_h3]:scroll-m-20 [&_h3]:font-heading [&_h3]:text-sm [&_h3]:font-semibold [&_h3]:text-foreground [&_h3]:first:mt-0",
|
|
59
|
+
h4: "[&_h4]:mt-3 [&_h4]:mb-1.5 [&_h4]:font-heading [&_h4]:text-sm [&_h4]:font-medium [&_h4]:text-foreground [&_h4]:first:mt-0",
|
|
60
|
+
h5: "[&_h5]:mt-3 [&_h5]:mb-1.5 [&_h5]:font-heading [&_h5]:text-sm [&_h5]:font-medium [&_h5]:text-foreground [&_h5]:first:mt-0",
|
|
61
|
+
h6: "[&_h6]:mt-3 [&_h6]:mb-1.5 [&_h6]:font-heading [&_h6]:text-sm [&_h6]:font-medium [&_h6]:text-foreground [&_h6]:first:mt-0",
|
|
62
|
+
// Body text is the app's body text — size, leading and ink inherit from the root, so a paragraph
|
|
63
|
+
// here is indistinguishable from any other `text-sm` paragraph in the product. No prose look.
|
|
64
|
+
p: "[&_p]:my-2 [&_p]:first:mt-0 [&_p]:last:mb-0",
|
|
65
|
+
// Marks. Links are `info` ink per design.md §Colours at body weight; `s` is Tiptap's strike
|
|
66
|
+
// element and `del` is GFM's — the same mark from two producers.
|
|
67
|
+
a: "[&_a]:text-info-text [&_a]:underline [&_a]:underline-offset-4 [&_a]:hover:text-info-text/88",
|
|
68
|
+
strong: "[&_strong]:font-semibold",
|
|
67
69
|
em: "[&_em]:italic",
|
|
68
|
-
del: "[&_del]:
|
|
69
|
-
// Lists.
|
|
70
|
-
//
|
|
71
|
-
//
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
70
|
+
del: "[&_del]:line-through [&_s]:line-through",
|
|
71
|
+
// Lists. Items and markers are body text: family, size and ink inherit (a `::marker` takes the
|
|
72
|
+
// item's font), so `1.` and `•` never read as a second typeface or a second colour. A GFM task
|
|
73
|
+
// list carries `contains-task-list` and its checkbox IS the marker, so the disc goes — expressed
|
|
74
|
+
// as a second, more specific descendant rule rather than a class on the element, which would
|
|
75
|
+
// lose the cascade (see the header).
|
|
76
|
+
ul: "[&_ul]:my-2 [&_ul]:ms-5 [&_ul]:list-disc [&_ul.contains-task-list]:list-none",
|
|
77
|
+
ol: "[&_ol]:my-2 [&_ol]:ms-5 [&_ol]:list-decimal",
|
|
78
|
+
li: "[&_li]:mt-1 [&_li]:marker:font-sans [&_li]:marker:text-foreground [&_li_p]:my-0",
|
|
75
79
|
// Task lists, one shape for both producers: `MarkdownView` tags the GFM list
|
|
76
80
|
// `data-type="taskList"` and each item `data-type="taskItem"` with its body in a
|
|
77
81
|
// `data-slot="task-item-content"` box, which is exactly the DOM Tiptap's `TaskItem` node view
|
|
78
82
|
// renders — so the checkbox IS the marker, the body wraps beside it, and a nested list indents
|
|
79
|
-
// under the body in view and edit alike.
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
blockquote: "[&_blockquote]:my-3 [&_blockquote]:border-s-2 [&_blockquote]:border-border [&_blockquote]:ps-4 [&_blockquote]:text-muted-foreground [&_blockquote]:italic",
|
|
83
|
+
// under the body in view and edit alike.
|
|
84
|
+
taskList: "[&_ul[data-type=taskList]]:ms-0 [&_ul[data-type=taskList]]:list-none [&_li[data-type=taskItem]]:flex [&_li[data-type=taskItem]]:items-start [&_li[data-type=taskItem]]:gap-2 [&_li[data-type=taskItem]_[data-slot=checkbox]]:mt-0.5 [&_li[data-type=taskItem]_[data-slot=checkbox]]:me-0 [&_[data-slot=task-item-content]]:min-w-0 [&_[data-slot=task-item-content]]:flex-1",
|
|
85
|
+
blockquote: "[&_blockquote]:my-2 [&_blockquote]:border-s-2 [&_blockquote]:border-border [&_blockquote]:ps-3",
|
|
83
86
|
// Inline code is a chip. Code inside a `pre` is not: it inherits the panel's ground, so the chip
|
|
84
87
|
// is undone at higher specificity (`[&_pre_code]` is (0,1,2) against the chip's (0,1,1)).
|
|
85
88
|
code: "[&_code]:rounded-sm [&_code]:bg-muted [&_code]:px-1.5 [&_code]:py-0.5 [&_code]:font-mono [&_code]:text-sm [&_code]:text-foreground",
|
|
86
89
|
// A bare `<pre>` wears `CodeBlock`'s surface — the same sunken panel, one vocabulary (B4-09).
|
|
87
90
|
// `CodeBlock`'s own `pre` is excluded: it already sits inside a `figure` carrying the border,
|
|
88
91
|
// radius and ground, and re-applying them here would draw a second panel inside the first.
|
|
89
|
-
pre: "[&_pre:not([data-slot='code-block-pre'])]:my-
|
|
92
|
+
pre: "[&_pre:not([data-slot='code-block-pre'])]:my-2 [&_pre:not([data-slot='code-block-pre'])]:overflow-x-auto [&_pre:not([data-slot='code-block-pre'])]:rounded-lg [&_pre:not([data-slot='code-block-pre'])]:border [&_pre:not([data-slot='code-block-pre'])]:border-border [&_pre:not([data-slot='code-block-pre'])]:bg-muted [&_pre:not([data-slot='code-block-pre'])]:p-4 [&_pre:not([data-slot='code-block-pre'])]:text-foreground",
|
|
90
93
|
preCode: "[&_pre_code]:bg-transparent [&_pre_code]:p-0 [&_pre_code]:font-mono [&_pre_code]:text-sm [&_pre_code]:text-foreground",
|
|
91
|
-
hr: "[&_hr]:my-
|
|
94
|
+
hr: "[&_hr]:my-4 [&_hr]:border-border",
|
|
92
95
|
// GFM tables. The scroll container is structural and belongs to the consumer (MarkdownView wraps
|
|
93
96
|
// the table in an `overflow-x-auto` div); these are the cell and rule tokens.
|
|
94
|
-
table: "[&_table]:w-full [&_table]:border-collapse [&
|
|
95
|
-
img: "[&_img]:my-
|
|
97
|
+
table: "[&_table]:w-full [&_table]:border-collapse [&_thead]:border-b [&_thead]:border-border [&_tr]:border-b [&_tr]:border-border [&_tr]:last:border-0 [&_th]:px-3 [&_th]:py-2 [&_th]:text-start [&_th]:font-medium [&_td]:px-3 [&_td]:py-2 [&_td_p]:my-0 [&_th_p]:my-0",
|
|
98
|
+
img: "[&_img]:my-2 [&_img]:max-w-full [&_img]:rounded-lg [&_img]:border [&_img]:border-border"
|
|
96
99
|
};
|
|
97
100
|
var proseClassName = Object.values(prose).join(" ");
|
|
98
101
|
|
package/dist/index.d.cts
CHANGED
|
@@ -55,29 +55,29 @@ declare const prose: {
|
|
|
55
55
|
* rather than something prose falls into by accident. A consumer who genuinely wants mono prose
|
|
56
56
|
* still says so on the root, where it reads as a decision.
|
|
57
57
|
*/
|
|
58
|
-
readonly root: "font-sans text-sm text-foreground";
|
|
59
|
-
readonly h1: "[&_h1]:mt-
|
|
60
|
-
readonly h2: "[&_h2]:mt-
|
|
61
|
-
readonly h3: "[&_h3]:mt-
|
|
62
|
-
readonly h4: "[&_h4]:mt-
|
|
63
|
-
readonly h5: "[&_h5]:mt-
|
|
64
|
-
readonly h6: "[&_h6]:mt-
|
|
65
|
-
readonly p: "[&_p]:my-
|
|
66
|
-
readonly a: "[&_a]:
|
|
67
|
-
readonly strong: "[&_strong]:font-
|
|
58
|
+
readonly root: "font-sans text-sm font-normal text-foreground";
|
|
59
|
+
readonly h1: "[&_h1]:mt-5 [&_h1]:mb-2 [&_h1]:scroll-m-20 [&_h1]:font-heading [&_h1]:text-lg [&_h1]:font-semibold [&_h1]:text-foreground [&_h1]:first:mt-0";
|
|
60
|
+
readonly h2: "[&_h2]:mt-4 [&_h2]:mb-2 [&_h2]:scroll-m-20 [&_h2]:font-heading [&_h2]:text-base [&_h2]:font-semibold [&_h2]:text-foreground [&_h2]:first:mt-0";
|
|
61
|
+
readonly h3: "[&_h3]:mt-4 [&_h3]:mb-1.5 [&_h3]:scroll-m-20 [&_h3]:font-heading [&_h3]:text-sm [&_h3]:font-semibold [&_h3]:text-foreground [&_h3]:first:mt-0";
|
|
62
|
+
readonly h4: "[&_h4]:mt-3 [&_h4]:mb-1.5 [&_h4]:font-heading [&_h4]:text-sm [&_h4]:font-medium [&_h4]:text-foreground [&_h4]:first:mt-0";
|
|
63
|
+
readonly h5: "[&_h5]:mt-3 [&_h5]:mb-1.5 [&_h5]:font-heading [&_h5]:text-sm [&_h5]:font-medium [&_h5]:text-foreground [&_h5]:first:mt-0";
|
|
64
|
+
readonly h6: "[&_h6]:mt-3 [&_h6]:mb-1.5 [&_h6]:font-heading [&_h6]:text-sm [&_h6]:font-medium [&_h6]:text-foreground [&_h6]:first:mt-0";
|
|
65
|
+
readonly p: "[&_p]:my-2 [&_p]:first:mt-0 [&_p]:last:mb-0";
|
|
66
|
+
readonly a: "[&_a]:text-info-text [&_a]:underline [&_a]:underline-offset-4 [&_a]:hover:text-info-text/88";
|
|
67
|
+
readonly strong: "[&_strong]:font-semibold";
|
|
68
68
|
readonly em: "[&_em]:italic";
|
|
69
|
-
readonly del: "[&_del]:
|
|
70
|
-
readonly ul: "[&_ul]:my-
|
|
71
|
-
readonly ol: "[&_ol]:my-
|
|
72
|
-
readonly li: "[&_li]:mt-1
|
|
73
|
-
readonly taskList: "[&_ul[data-type=taskList]]:ms-0 [&_ul[data-type=taskList]]:list-none [&_li[data-type=taskItem]]:flex [&_li[data-type=taskItem]]:items-start [&_li[data-type=taskItem]]:gap-2 [&_li[data-type=taskItem]_[data-slot=checkbox]]:mt-
|
|
74
|
-
readonly blockquote: "[&_blockquote]:my-
|
|
69
|
+
readonly del: "[&_del]:line-through [&_s]:line-through";
|
|
70
|
+
readonly ul: "[&_ul]:my-2 [&_ul]:ms-5 [&_ul]:list-disc [&_ul.contains-task-list]:list-none";
|
|
71
|
+
readonly ol: "[&_ol]:my-2 [&_ol]:ms-5 [&_ol]:list-decimal";
|
|
72
|
+
readonly li: "[&_li]:mt-1 [&_li]:marker:font-sans [&_li]:marker:text-foreground [&_li_p]:my-0";
|
|
73
|
+
readonly taskList: "[&_ul[data-type=taskList]]:ms-0 [&_ul[data-type=taskList]]:list-none [&_li[data-type=taskItem]]:flex [&_li[data-type=taskItem]]:items-start [&_li[data-type=taskItem]]:gap-2 [&_li[data-type=taskItem]_[data-slot=checkbox]]:mt-0.5 [&_li[data-type=taskItem]_[data-slot=checkbox]]:me-0 [&_[data-slot=task-item-content]]:min-w-0 [&_[data-slot=task-item-content]]:flex-1";
|
|
74
|
+
readonly blockquote: "[&_blockquote]:my-2 [&_blockquote]:border-s-2 [&_blockquote]:border-border [&_blockquote]:ps-3";
|
|
75
75
|
readonly code: "[&_code]:rounded-sm [&_code]:bg-muted [&_code]:px-1.5 [&_code]:py-0.5 [&_code]:font-mono [&_code]:text-sm [&_code]:text-foreground";
|
|
76
|
-
readonly pre: "[&_pre:not([data-slot='code-block-pre'])]:my-
|
|
76
|
+
readonly pre: "[&_pre:not([data-slot='code-block-pre'])]:my-2 [&_pre:not([data-slot='code-block-pre'])]:overflow-x-auto [&_pre:not([data-slot='code-block-pre'])]:rounded-lg [&_pre:not([data-slot='code-block-pre'])]:border [&_pre:not([data-slot='code-block-pre'])]:border-border [&_pre:not([data-slot='code-block-pre'])]:bg-muted [&_pre:not([data-slot='code-block-pre'])]:p-4 [&_pre:not([data-slot='code-block-pre'])]:text-foreground";
|
|
77
77
|
readonly preCode: "[&_pre_code]:bg-transparent [&_pre_code]:p-0 [&_pre_code]:font-mono [&_pre_code]:text-sm [&_pre_code]:text-foreground";
|
|
78
|
-
readonly hr: "[&_hr]:my-
|
|
79
|
-
readonly table: "[&_table]:w-full [&_table]:border-collapse [&
|
|
80
|
-
readonly img: "[&_img]:my-
|
|
78
|
+
readonly hr: "[&_hr]:my-4 [&_hr]:border-border";
|
|
79
|
+
readonly table: "[&_table]:w-full [&_table]:border-collapse [&_thead]:border-b [&_thead]:border-border [&_tr]:border-b [&_tr]:border-border [&_tr]:last:border-0 [&_th]:px-3 [&_th]:py-2 [&_th]:text-start [&_th]:font-medium [&_td]:px-3 [&_td]:py-2 [&_td_p]:my-0 [&_th_p]:my-0";
|
|
80
|
+
readonly img: "[&_img]:my-2 [&_img]:max-w-full [&_img]:rounded-lg [&_img]:border [&_img]:border-border";
|
|
81
81
|
};
|
|
82
82
|
/** The element roles the prose recipe covers. */
|
|
83
83
|
type ProseElement = keyof typeof prose;
|
package/dist/index.d.ts
CHANGED
|
@@ -55,29 +55,29 @@ declare const prose: {
|
|
|
55
55
|
* rather than something prose falls into by accident. A consumer who genuinely wants mono prose
|
|
56
56
|
* still says so on the root, where it reads as a decision.
|
|
57
57
|
*/
|
|
58
|
-
readonly root: "font-sans text-sm text-foreground";
|
|
59
|
-
readonly h1: "[&_h1]:mt-
|
|
60
|
-
readonly h2: "[&_h2]:mt-
|
|
61
|
-
readonly h3: "[&_h3]:mt-
|
|
62
|
-
readonly h4: "[&_h4]:mt-
|
|
63
|
-
readonly h5: "[&_h5]:mt-
|
|
64
|
-
readonly h6: "[&_h6]:mt-
|
|
65
|
-
readonly p: "[&_p]:my-
|
|
66
|
-
readonly a: "[&_a]:
|
|
67
|
-
readonly strong: "[&_strong]:font-
|
|
58
|
+
readonly root: "font-sans text-sm font-normal text-foreground";
|
|
59
|
+
readonly h1: "[&_h1]:mt-5 [&_h1]:mb-2 [&_h1]:scroll-m-20 [&_h1]:font-heading [&_h1]:text-lg [&_h1]:font-semibold [&_h1]:text-foreground [&_h1]:first:mt-0";
|
|
60
|
+
readonly h2: "[&_h2]:mt-4 [&_h2]:mb-2 [&_h2]:scroll-m-20 [&_h2]:font-heading [&_h2]:text-base [&_h2]:font-semibold [&_h2]:text-foreground [&_h2]:first:mt-0";
|
|
61
|
+
readonly h3: "[&_h3]:mt-4 [&_h3]:mb-1.5 [&_h3]:scroll-m-20 [&_h3]:font-heading [&_h3]:text-sm [&_h3]:font-semibold [&_h3]:text-foreground [&_h3]:first:mt-0";
|
|
62
|
+
readonly h4: "[&_h4]:mt-3 [&_h4]:mb-1.5 [&_h4]:font-heading [&_h4]:text-sm [&_h4]:font-medium [&_h4]:text-foreground [&_h4]:first:mt-0";
|
|
63
|
+
readonly h5: "[&_h5]:mt-3 [&_h5]:mb-1.5 [&_h5]:font-heading [&_h5]:text-sm [&_h5]:font-medium [&_h5]:text-foreground [&_h5]:first:mt-0";
|
|
64
|
+
readonly h6: "[&_h6]:mt-3 [&_h6]:mb-1.5 [&_h6]:font-heading [&_h6]:text-sm [&_h6]:font-medium [&_h6]:text-foreground [&_h6]:first:mt-0";
|
|
65
|
+
readonly p: "[&_p]:my-2 [&_p]:first:mt-0 [&_p]:last:mb-0";
|
|
66
|
+
readonly a: "[&_a]:text-info-text [&_a]:underline [&_a]:underline-offset-4 [&_a]:hover:text-info-text/88";
|
|
67
|
+
readonly strong: "[&_strong]:font-semibold";
|
|
68
68
|
readonly em: "[&_em]:italic";
|
|
69
|
-
readonly del: "[&_del]:
|
|
70
|
-
readonly ul: "[&_ul]:my-
|
|
71
|
-
readonly ol: "[&_ol]:my-
|
|
72
|
-
readonly li: "[&_li]:mt-1
|
|
73
|
-
readonly taskList: "[&_ul[data-type=taskList]]:ms-0 [&_ul[data-type=taskList]]:list-none [&_li[data-type=taskItem]]:flex [&_li[data-type=taskItem]]:items-start [&_li[data-type=taskItem]]:gap-2 [&_li[data-type=taskItem]_[data-slot=checkbox]]:mt-
|
|
74
|
-
readonly blockquote: "[&_blockquote]:my-
|
|
69
|
+
readonly del: "[&_del]:line-through [&_s]:line-through";
|
|
70
|
+
readonly ul: "[&_ul]:my-2 [&_ul]:ms-5 [&_ul]:list-disc [&_ul.contains-task-list]:list-none";
|
|
71
|
+
readonly ol: "[&_ol]:my-2 [&_ol]:ms-5 [&_ol]:list-decimal";
|
|
72
|
+
readonly li: "[&_li]:mt-1 [&_li]:marker:font-sans [&_li]:marker:text-foreground [&_li_p]:my-0";
|
|
73
|
+
readonly taskList: "[&_ul[data-type=taskList]]:ms-0 [&_ul[data-type=taskList]]:list-none [&_li[data-type=taskItem]]:flex [&_li[data-type=taskItem]]:items-start [&_li[data-type=taskItem]]:gap-2 [&_li[data-type=taskItem]_[data-slot=checkbox]]:mt-0.5 [&_li[data-type=taskItem]_[data-slot=checkbox]]:me-0 [&_[data-slot=task-item-content]]:min-w-0 [&_[data-slot=task-item-content]]:flex-1";
|
|
74
|
+
readonly blockquote: "[&_blockquote]:my-2 [&_blockquote]:border-s-2 [&_blockquote]:border-border [&_blockquote]:ps-3";
|
|
75
75
|
readonly code: "[&_code]:rounded-sm [&_code]:bg-muted [&_code]:px-1.5 [&_code]:py-0.5 [&_code]:font-mono [&_code]:text-sm [&_code]:text-foreground";
|
|
76
|
-
readonly pre: "[&_pre:not([data-slot='code-block-pre'])]:my-
|
|
76
|
+
readonly pre: "[&_pre:not([data-slot='code-block-pre'])]:my-2 [&_pre:not([data-slot='code-block-pre'])]:overflow-x-auto [&_pre:not([data-slot='code-block-pre'])]:rounded-lg [&_pre:not([data-slot='code-block-pre'])]:border [&_pre:not([data-slot='code-block-pre'])]:border-border [&_pre:not([data-slot='code-block-pre'])]:bg-muted [&_pre:not([data-slot='code-block-pre'])]:p-4 [&_pre:not([data-slot='code-block-pre'])]:text-foreground";
|
|
77
77
|
readonly preCode: "[&_pre_code]:bg-transparent [&_pre_code]:p-0 [&_pre_code]:font-mono [&_pre_code]:text-sm [&_pre_code]:text-foreground";
|
|
78
|
-
readonly hr: "[&_hr]:my-
|
|
79
|
-
readonly table: "[&_table]:w-full [&_table]:border-collapse [&
|
|
80
|
-
readonly img: "[&_img]:my-
|
|
78
|
+
readonly hr: "[&_hr]:my-4 [&_hr]:border-border";
|
|
79
|
+
readonly table: "[&_table]:w-full [&_table]:border-collapse [&_thead]:border-b [&_thead]:border-border [&_tr]:border-b [&_tr]:border-border [&_tr]:last:border-0 [&_th]:px-3 [&_th]:py-2 [&_th]:text-start [&_th]:font-medium [&_td]:px-3 [&_td]:py-2 [&_td_p]:my-0 [&_th_p]:my-0";
|
|
80
|
+
readonly img: "[&_img]:my-2 [&_img]:max-w-full [&_img]:rounded-lg [&_img]:border [&_img]:border-border";
|
|
81
81
|
};
|
|
82
82
|
/** The element roles the prose recipe covers. */
|
|
83
83
|
type ProseElement = keyof typeof prose;
|
package/dist/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vegastack/design",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.40",
|
|
4
4
|
"description": "VegaStack design system — cn utility, icon runtime, Tailwind v4 preset, and the vegastack-design CLI (tokens ship separately as @vegastack/design-tokens)",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<!-- GENERATED — do not hand-edit. Regenerated from the design system's component contract,
|
|
4
4
|
which is the authority for membership and counts. -->
|
|
5
5
|
|
|
6
|
-
**
|
|
6
|
+
**127 components**, plus 467 animated-icon items, 13 hooks (`use-animation-replay`, `use-announcer`, `use-async-search`, `use-drag-reorder`, `use-file-drop`, `use-inline-edit`, `use-list-nav`, `use-media-query`, `use-mobile`, `use-modal-inert`, `use-overflow`, `use-platform`, `use-tabs-swipe`), 10 starter blocks (`app-shell-01`, `board-01`, `command-search-01`, `list-page-01`, `login-01`, `notifications-01`, `review-split-01`, `settings-01`, `settings-02`, `status-pages-01`), 68 chart blocks across 7 families, and 3 data libs (`date-time`, `geo-data`, `drag-item`) — 688 registry items in total.
|
|
7
7
|
|
|
8
8
|
Install any of them with `shadcn add @vegastack/<name>`. Animated icons install as
|
|
9
9
|
`@vegastack/icon-<name>`; the bare name is reserved for components, so a component whose name
|
|
@@ -52,6 +52,7 @@ starts with `icon-` is a component and never an icon.
|
|
|
52
52
|
|
|
53
53
|
- **`chip`** — The one labelled pill primitive — 10 decorative hues, two tiers, an optional selection rung, and a real 24x24 remove control. Behind Tag and FilterChip; ComboboxChip is Base UI's own chip, not this primitive.
|
|
54
54
|
- **`code-block`** — A code panel with a language header and copy affordance — the shared code surface for chat transcripts, docs, and examples.
|
|
55
|
+
- **`comments`** — A record's comments: a list with a count, Load earlier, skeleton and empty states, comments with edit/delete/copy link, and a composer.
|
|
55
56
|
- **`meta-line`** — An icon + text meta line under a record title: wrapping facts such as type, date and time, duration and owner, in the muted ink.
|
|
56
57
|
- **`stat`** — A labelled value block — muted label over a value, honest faint empty state, optional delta line. Two scales.
|
|
57
58
|
- **`tag-group`** — Hue-tinted label chips on the 10-hue tag palette, with +N overflow collapsing and removable tags.
|