@scalar/code-highlight 0.0.23 → 0.0.25

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/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # @scalar/code-highlight
2
2
 
3
+ ## 0.0.25
4
+
5
+ ### Patch Changes
6
+
7
+ - 632978d: fix(themes): hide summary caret in reset
8
+
9
+ ## 0.0.24
10
+
11
+ ### Patch Changes
12
+
13
+ - 9319c0c: fix: allows alert plugin classes in markdown
14
+ - 9319c0c: feat: updates markdown alert style
15
+
3
16
  ## 0.0.23
4
17
 
5
18
  ### Patch Changes
@@ -64,11 +64,6 @@
64
64
  transform: rotate(90deg);
65
65
  }
66
66
 
67
- /* Fix for Safari displaying default caret next to `<summary>` */
68
- .markdown summary::-webkit-details-marker {
69
- display: none;
70
- }
71
-
72
67
  .markdown img {
73
68
  overflow: hidden;
74
69
  border-radius: var(--scalar-radius);
@@ -304,32 +299,61 @@
304
299
  font-size: var(--scalar-small);
305
300
  gap: 12px;
306
301
  padding: 12px;
302
+ padding-left: 42px;
303
+ position: relative;
307
304
  }
308
- .markdown .markdown-alert .markdown-alert-border {
309
- border-radius: var(--scalar-radius-xl);
310
- min-width: 1.5px;
311
- width: 1.5px;
305
+
306
+ .markdown .markdown-alert::before {
307
+ content: "";
308
+ position: absolute;
309
+ left: 12px;
310
+ top: 12px;
311
+ width: 20px;
312
+ height: 20px;
313
+ background-color: currentColor;
314
+ mask-repeat: no-repeat;
315
+ mask-size: contain;
316
+ mask-position: center;
312
317
  }
313
- .markdown .markdown-alert .markdown-alert-content {
314
- margin: 0;
315
- line-height: 1.5;
318
+
319
+ .markdown .markdown-alert.markdown-alert-note::before,
320
+ .markdown .markdown-alert.markdown-alert-tip::before {
321
+ mask-image: url('data:image/svg+xml,<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 17v-6a.5.5 0 0 0-.5-.5l-.5.001h-1M12 17h-2m2 0h2m-2 5c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10Z" stroke="currentColor" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M10.75 7.5a1 1 0 1 1 2 0 1 1 0 0 1-2 0Z" fill="currentColor"/></svg>');
316
322
  }
317
- .markdown .markdown-alert .markdown-alert-title {
318
- font-weight: var(--scalar-semibold);
323
+
324
+ .markdown .markdown-alert.markdown-alert-important::before,
325
+ .markdown .markdown-alert.markdown-alert-warning::before {
326
+ mask-image: url('data:image/svg+xml,<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 8v4m10 0c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M11 16a1 1 0 1 1 2 0 1 1 0 0 1-2 0Z" fill="currentColor"/></svg>');
319
327
  }
320
- .markdown .markdown-alert.markdown-alert-note .markdown-alert-border {
321
- background-color: var(--scalar-color-blue);
328
+
329
+ .markdown .markdown-alert.markdown-alert-caution::before {
330
+ mask-image: url('data:image/svg+xml,<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 8v4m3.312-10a2 2 0 0 1 1.414.586l4.688 4.688A2 2 0 0 1 22 8.688v6.624a2 2 0 0 1-.586 1.414l-4.688 4.688a2 2 0 0 1-1.414.586H8.688a2 2 0 0 1-1.414-.586l-4.688-4.688A2 2 0 0 1 2 15.312V8.688a2 2 0 0 1 .586-1.414l4.688-4.688A2 2 0 0 1 8.688 2h6.624Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M11 16a1 1 0 1 1 2 0 1 1 0 0 1-2 0Z" fill="currentColor"/></svg>');
331
+ color: var(--scalar-color-red);
322
332
  }
323
- .markdown .markdown-alert.markdown-alert-tip .markdown-alert-border {
324
- background-color: var(--scalar-color-green);
333
+
334
+ .markdown .markdown-alert.markdown-alert-success::before {
335
+ mask-image: url('data:image/svg+xml,<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 9.5 10.5 15 8 12.5m14-.5c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
336
+ color: var(--scalar-color-green);
325
337
  }
326
- .markdown .markdown-alert.markdown-alert-important .markdown-alert-border {
327
- background-color: var(--scalar-color-purple);
338
+
339
+ .markdown .markdown-alert.markdown-alert-note::before {
340
+ color: var(--scalar-color-blue);
328
341
  }
329
- .markdown .markdown-alert.markdown-alert-warning .markdown-alert-border {
330
- background-color: var(--scalar-color-orange);
342
+
343
+ .markdown .markdown-alert.markdown-alert-tip::before {
344
+ color: var(--scalar-color-2);
345
+ }
346
+
347
+ .markdown .markdown-alert.markdown-alert-important::before {
348
+ color: var(--scalar-color-purple);
331
349
  }
332
- .markdown .markdown-alert.markdown-alert-caution .markdown-alert-border {
333
- background-color: var(--scalar-color-red);
350
+
351
+ .markdown .markdown-alert.markdown-alert-warning::before {
352
+ color: var(--scalar-color-orange);
353
+ }
354
+
355
+ .markdown .markdown-alert .markdown-alert-content {
356
+ margin: 0;
357
+ line-height: 1.5;
334
358
  }
335
359
  }
@@ -1 +1 @@
1
- {"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../src/markdown/markdown.ts"],"names":[],"mappings":"AAyCA;;GAEG;AACH,wBAAgB,gBAAgB,CAC9B,QAAQ,EAAE,MAAM,EAChB,OAAO,CAAC,EAAE;IACR,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC9D,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,UAmDF;AASD;;GAEG;AACH,wBAAgB,WAAW,CACzB,QAAQ,EAAE,MAAM,EAChB,KAAK,GAAE,MAAU,GAChB;IACD,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd,EAAE,CAiBF;AAuBD;;GAEG;AACH,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,YAgC5C"}
1
+ {"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../src/markdown/markdown.ts"],"names":[],"mappings":"AAyCA;;GAEG;AACH,wBAAgB,gBAAgB,CAC9B,QAAQ,EAAE,MAAM,EAChB,OAAO,CAAC,EAAE;IACR,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC9D,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,UAqDF;AASD;;GAEG;AACH,wBAAgB,WAAW,CACzB,QAAQ,EAAE,MAAM,EAChB,KAAK,GAAE,MAAU,GAChB;IACD,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd,EAAE,CAiBF;AAuBD;;GAEG;AACH,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,YAgC5C"}
@@ -9,9 +9,9 @@ import remarkRehype from 'remark-rehype';
9
9
  import remarkStringify from 'remark-stringify';
10
10
  import { unified } from 'unified';
11
11
  import { visit, SKIP } from 'unist-util-visit';
12
+ import { rehypeAlert } from '../rehype-alert/rehype-alert.js';
12
13
  import { rehypeHighlight } from '../rehype-highlight/rehype-highlight.js';
13
14
  import { standardLanguages } from '../languages/standard.js';
14
- import { rehypeAlert } from '../rehype-alert/rehype-alert.js';
15
15
 
16
16
  /**
17
17
  * Plugin to transform nodes in a Markdown AST
@@ -44,6 +44,8 @@ function htmlFromMarkdown(markdown, options) {
44
44
  })
45
45
  // Allows any HTML tags
46
46
  .use(remarkRehype, { allowDangerousHtml: true })
47
+ // Adds GitHub alerts
48
+ .use(rehypeAlert)
47
49
  // Creates a HTML AST
48
50
  .use(rehypeRaw)
49
51
  // Removes disallowed tags
@@ -56,6 +58,8 @@ function htmlFromMarkdown(markdown, options) {
56
58
  attributes: {
57
59
  ...defaultSchema.attributes,
58
60
  abbr: ['title'],
61
+ // Allow alert classes
62
+ div: ['class', ['className', /^markdown-alert(-.*)?$/]],
59
63
  },
60
64
  })
61
65
  // Syntax highlighting
@@ -64,8 +68,6 @@ function htmlFromMarkdown(markdown, options) {
64
68
  // Enable auto detection
65
69
  detect: true,
66
70
  })
67
- // Adds GitHub alerts
68
- .use(rehypeAlert)
69
71
  // Adds target="_blank" to external links
70
72
  .use(rehypeExternalLinks, { target: '_blank' })
71
73
  // Formats the HTML
@@ -1 +1 @@
1
- {"version":3,"file":"rehype-alert.d.ts","sourceRoot":"","sources":["../../src/rehype-alert/rehype-alert.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AASjC,wBAAgB,WAAW,WACX,IAAI,UAmGnB"}
1
+ {"version":3,"file":"rehype-alert.d.ts","sourceRoot":"","sources":["../../src/rehype-alert/rehype-alert.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AASjC,wBAAgB,WAAW,WACX,IAAI,UAkFnB"}
@@ -1,6 +1,6 @@
1
1
  import { visit } from 'unist-util-visit';
2
2
 
3
- const ALERT_TYPES = ['note', 'tip', 'important', 'warning', 'caution'];
3
+ const ALERT_TYPES = ['note', 'tip', 'important', 'warning', 'caution', 'success'];
4
4
  // Simple whitespace check function
5
5
  function isWhitespace(node) {
6
6
  return node.type === 'text' && typeof node.value === 'string' && /^\s*$/.test(node.value);
@@ -60,7 +60,6 @@ function rehypeAlert() {
60
60
  // Remove the alert marker if it’s not followed by a newline or a non-whitespace character
61
61
  text.value = text.value.replace(/^\s*\[!.*?\]\s*/, '');
62
62
  }
63
- const capitalizedType = alertType.charAt(0).toUpperCase() + alertType.slice(1);
64
63
  // Extract content from paragraphs to avoid wrapping in <p> tags
65
64
  const contentChildren = [];
66
65
  for (let i = headIndex; i < node.children.length; i++) {
@@ -78,26 +77,11 @@ function rehypeAlert() {
78
77
  tagName: 'div',
79
78
  properties: { className: ['markdown-alert', `markdown-alert-${alertType}`] },
80
79
  children: [
81
- {
82
- type: 'element',
83
- tagName: 'span',
84
- properties: { className: ['markdown-alert-border'] },
85
- children: [],
86
- },
87
80
  {
88
81
  type: 'element',
89
82
  tagName: 'div',
90
83
  properties: { className: ['markdown-alert-content'] },
91
- children: [
92
- {
93
- type: 'element',
94
- tagName: 'span',
95
- properties: { className: ['markdown-alert-title'] },
96
- children: [{ type: 'text', value: `${capitalizedType}:` }],
97
- },
98
- { type: 'text', value: ' ' },
99
- ...contentChildren,
100
- ],
84
+ children: [{ type: 'text', value: ' ' }, ...contentChildren],
101
85
  },
102
86
  ],
103
87
  };
package/package.json CHANGED
@@ -16,7 +16,7 @@
16
16
  "lowlight",
17
17
  "highlightjs"
18
18
  ],
19
- "version": "0.0.23",
19
+ "version": "0.0.25",
20
20
  "engines": {
21
21
  "node": ">=18"
22
22
  },
@@ -90,15 +90,15 @@
90
90
  "unist-util-visit": "^5.0.0"
91
91
  },
92
92
  "devDependencies": {
93
- "@rollup/plugin-typescript": "^11.1.6",
93
+ "@rollup/plugin-typescript": "^12.1.2",
94
94
  "@types/hast": "^3.0.4",
95
95
  "@types/mdast": "^4.0.4",
96
96
  "@types/unist": "^3.0.2",
97
97
  "vfile": "^6.0.1",
98
98
  "vite": "^5.4.10",
99
99
  "vue": "^3.5.12",
100
- "@scalar/build-tooling": "0.1.15",
101
- "@scalar/themes": "0.9.69"
100
+ "@scalar/build-tooling": "0.1.17",
101
+ "@scalar/themes": "0.9.78"
102
102
  },
103
103
  "scripts": {
104
104
  "build": "scalar-build-rollup",