starlight-cannoli-plugins 2.5.1 → 2.5.2

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.
@@ -14,6 +14,126 @@ import {
14
14
  } from "fs/promises";
15
15
  import { resolve, relative, dirname } from "path";
16
16
  import { minimatch } from "minimatch";
17
+ var css = String.raw;
18
+ var pageSrcStyles = css`
19
+ .page-src-banner {
20
+ position: fixed;
21
+ top: 0;
22
+ left: 0;
23
+ right: 0;
24
+ z-index: 9999;
25
+ padding: 12px 24px;
26
+ text-align: center;
27
+ font-size: 14px;
28
+ font-family: inherit;
29
+ transform: translateY(-100%);
30
+ transition: transform 0.25s ease;
31
+ }
32
+
33
+ .page-src-banner--success {
34
+ background: #2da44e;
35
+ color: #fff;
36
+ }
37
+
38
+ .page-src-banner--error {
39
+ background: #cf222e;
40
+ color: #fff;
41
+ }
42
+
43
+ .page-src-banner--visible {
44
+ transform: translateY(0);
45
+ }
46
+
47
+ .page-src-h1-wrapper {
48
+ position: relative;
49
+ }
50
+
51
+ @keyframes page-src-spin {
52
+ to {
53
+ transform: rotate(360deg);
54
+ }
55
+ }
56
+
57
+ .page-src-action-bar {
58
+ position: absolute;
59
+ top: -30px;
60
+ right: -5px;
61
+ }
62
+
63
+ .page-src-action-bar__btn {
64
+ position: relative;
65
+ width: 2rem;
66
+ height: 2rem;
67
+ padding: 0;
68
+ border: 1px solid var(--sl-color-hairline);
69
+ border-radius: 6px;
70
+ background: transparent;
71
+ color: var(--sl-color-text);
72
+ cursor: pointer;
73
+ font-size: 16px;
74
+ font-family: inherit;
75
+ display: flex;
76
+ align-items: center;
77
+ justify-content: center;
78
+ }
79
+
80
+ .page-src-action-bar__btn:hover {
81
+ background: var(--sl-color-bg-nav);
82
+ }
83
+
84
+ .page-src-action-bar__btn--loading {
85
+ cursor: default;
86
+ pointer-events: none;
87
+ color: transparent;
88
+ }
89
+
90
+ .page-src-action-bar__btn--loading::after {
91
+ content: "";
92
+ position: absolute;
93
+ width: 12px;
94
+ height: 12px;
95
+ border: 2px solid var(--sl-color-text);
96
+ border-top-color: transparent;
97
+ border-radius: 50%;
98
+ animation: page-src-spin 0.6s linear infinite;
99
+ }
100
+
101
+ .page-src-action-bar__menu {
102
+ display: none;
103
+ position: absolute;
104
+ top: calc(100% + 4px);
105
+ right: 0;
106
+ min-width: 160px;
107
+ border: 1px solid var(--sl-color-hairline);
108
+ border-radius: 6px;
109
+ background: var(--sl-color-bg);
110
+ box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
111
+ z-index: 1000;
112
+ overflow: hidden;
113
+ }
114
+
115
+ .page-src-action-bar__menu--open {
116
+ display: block;
117
+ }
118
+
119
+ .page-src-action-bar__menu-item {
120
+ display: block;
121
+ width: 100%;
122
+ padding: 6px 16px;
123
+ border: none;
124
+ background: transparent;
125
+ color: var(--sl-color-text);
126
+ text-align: left;
127
+ cursor: pointer;
128
+ font-size: inherit;
129
+ font-family: inherit;
130
+ line-height: 1.5;
131
+ }
132
+
133
+ .page-src-action-bar__menu-item:hover {
134
+ background: var(--sl-color-bg-nav);
135
+ }
136
+ `;
17
137
  var DEFAULT_SRC_DIR = "src/content/docs";
18
138
  var DEFAULT_PUBLIC_DIR = "public";
19
139
  function validateOptions(options) {
@@ -145,6 +265,14 @@ function syncDocsToPublic(options) {
145
265
  "astro:config:setup": ({ injectScript }) => {
146
266
  validateOptions(options);
147
267
  if (exposePageSrcButton) {
268
+ injectScript(
269
+ "page",
270
+ `
271
+ const s = document.createElement('style');
272
+ s.textContent = ${JSON.stringify(pageSrcStyles)};
273
+ document.head.appendChild(s);
274
+ `
275
+ );
148
276
  const currentFile = fileURLToPath(import.meta.url);
149
277
  let pageScriptUrl;
150
278
  if (currentFile.endsWith(".ts")) {
@@ -4,11 +4,15 @@ import {
4
4
  ExpressiveCodeAnnotation
5
5
  } from "@expressive-code/core";
6
6
  import { h } from "@expressive-code/core/hast";
7
+ var css = String.raw;
7
8
  var EmphasisAnnotation = class extends ExpressiveCodeAnnotation {
8
9
  render({ nodesToTransform }) {
9
- return nodesToTransform.map((node) => h("span.bold-supreme", [node]));
10
+ return nodesToTransform.map((node) => h("span.fw-supreme", [node]));
10
11
  }
11
12
  };
13
+ function escapeRegex(s) {
14
+ return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
15
+ }
12
16
  function parseEmphTerms(meta) {
13
17
  const match = meta.match(/\bemph="([^"]+)"/);
14
18
  if (!match) return [];
@@ -17,25 +21,34 @@ function parseEmphTerms(meta) {
17
21
  function expressiveCodeEmphasis() {
18
22
  return definePlugin({
19
23
  name: "expressiveCodeEmphasis",
24
+ baseStyles: css`
25
+ @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@700;800&display=swap");
26
+
27
+ .fw-supreme {
28
+ font-family: "Open Sans", sans-serif;
29
+ font-weight: 800;
30
+ }
31
+
32
+ html:not([data-theme="light"]) .fw-supreme > span {
33
+ color: var(--sl-color-white);
34
+ }
35
+ `,
20
36
  hooks: {
21
37
  preprocessCode: (context) => {
22
38
  const terms = parseEmphTerms(context.codeBlock.meta);
23
39
  if (terms.length === 0) return;
24
40
  for (const line of context.codeBlock.getLines()) {
25
41
  for (const term of terms) {
26
- let searchFrom = 0;
27
- while (true) {
28
- const index = line.text.indexOf(term, searchFrom);
29
- if (index === -1) break;
42
+ const regex = new RegExp(`\\b${escapeRegex(term)}\\b`, "g");
43
+ for (const match of line.text.matchAll(regex)) {
30
44
  line.addAnnotation(
31
45
  new EmphasisAnnotation({
32
46
  inlineRange: {
33
- columnStart: index,
34
- columnEnd: index + term.length
47
+ columnStart: match.index,
48
+ columnEnd: match.index + term.length
35
49
  }
36
50
  })
37
51
  );
38
- searchFrom = index + term.length;
39
52
  }
40
53
  }
41
54
  }
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  expressiveCodeEmphasis
3
- } from "./chunk-FQJ4IIDT.js";
3
+ } from "./chunk-XYVZ5MOQ.js";
4
4
  import {
5
5
  starlightIndexOnlySidebar
6
6
  } from "./chunk-N2I2GJW3.js";
@@ -16,7 +16,7 @@ import {
16
16
  import "./chunk-LJWSZSPB.js";
17
17
  import {
18
18
  syncDocsToPublic
19
- } from "./chunk-WZNJ5VFU.js";
19
+ } from "./chunk-TOQ3EKER.js";
20
20
  import "./chunk-IY4A67ZP.js";
21
21
  import {
22
22
  starlightDomPatches
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  syncDocsToPublic
3
- } from "../chunk-WZNJ5VFU.js";
3
+ } from "../chunk-TOQ3EKER.js";
4
4
  import "../chunk-IY4A67ZP.js";
5
5
  import "../chunk-QGM4M3NI.js";
6
6
  export {
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  expressiveCodeEmphasis
3
- } from "../chunk-FQJ4IIDT.js";
3
+ } from "../chunk-XYVZ5MOQ.js";
4
4
  import "../chunk-QGM4M3NI.js";
5
5
  export {
6
6
  expressiveCodeEmphasis
@@ -1,5 +1,3 @@
1
- @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@700;800&display=swap");
2
-
3
1
  /********** Starlight Overrides **********/
4
2
 
5
3
  .sl-container:where(.astro-7nkwcw3z) {
@@ -62,11 +60,6 @@ starlight-toc ul > li {
62
60
  width: 2rem;
63
61
  }
64
62
 
65
- .bold-supreme {
66
- font-family: "Open Sans", sans-serif;
67
- font-weight: 800;
68
- }
69
-
70
63
  /************ Details/Summary Styles ************/
71
64
  .main-pane details {
72
65
  background: rgba(162, 171, 173, 0.071);
@@ -1,4 +1,3 @@
1
1
  @use "variables";
2
2
  @use "starlight";
3
3
  @use "utilities";
4
- @use "page-src-context-menu";
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "starlight-cannoli-plugins",
3
3
  "type": "module",
4
- "version": "2.5.1",
4
+ "version": "2.5.2",
5
5
  "description": "Starlight plugins for automatic sidebar generation and link validation",
6
6
  "license": "ISC",
7
7
  "main": "./dist/index.js",
@@ -1,117 +0,0 @@
1
- .page-src-banner {
2
- position: fixed;
3
- top: 0;
4
- left: 0;
5
- right: 0;
6
- z-index: 9999;
7
- padding: 12px 24px;
8
- text-align: center;
9
- font-size: 14px;
10
- font-family: inherit;
11
- transform: translateY(-100%);
12
- transition: transform 0.25s ease;
13
-
14
- &--success {
15
- background: #2da44e;
16
- color: #fff;
17
- }
18
-
19
- &--error {
20
- background: #cf222e;
21
- color: #fff;
22
- }
23
-
24
- &--visible {
25
- transform: translateY(0);
26
- }
27
- }
28
-
29
- .page-src-h1-wrapper {
30
- position: relative;
31
- }
32
-
33
- @keyframes page-src-spin {
34
- to {
35
- transform: rotate(360deg);
36
- }
37
- }
38
-
39
- .page-src-action-bar {
40
- position: absolute;
41
- top: -30px;
42
- right: -5px;
43
-
44
- &__btn {
45
- position: relative;
46
- width: 2rem;
47
- height: 2rem;
48
- padding: 0;
49
- border: 1px solid var(--sl-color-hairline);
50
- border-radius: 6px;
51
- background: transparent;
52
- color: var(--sl-color-text);
53
- cursor: pointer;
54
- font-size: 16px;
55
- font-family: inherit;
56
- display: flex;
57
- align-items: center;
58
- justify-content: center;
59
-
60
- &:hover {
61
- background: var(--sl-color-bg-nav);
62
- }
63
-
64
- &--loading {
65
- cursor: default;
66
- pointer-events: none;
67
- color: transparent;
68
-
69
- &::after {
70
- content: "";
71
- position: absolute;
72
- width: 12px;
73
- height: 12px;
74
- border: 2px solid var(--sl-color-text);
75
- border-top-color: transparent;
76
- border-radius: 50%;
77
- animation: page-src-spin 0.6s linear infinite;
78
- }
79
- }
80
- }
81
-
82
- &__menu {
83
- display: none;
84
- position: absolute;
85
- top: calc(100% + 4px);
86
- right: 0;
87
- min-width: 160px;
88
- border: 1px solid var(--sl-color-hairline);
89
- border-radius: 6px;
90
- background: var(--sl-color-bg);
91
- box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
92
- z-index: 1000;
93
- overflow: hidden;
94
-
95
- &--open {
96
- display: block;
97
- }
98
- }
99
-
100
- &__menu-item {
101
- display: block;
102
- width: 100%;
103
- padding: 6px 16px;
104
- border: none;
105
- background: transparent;
106
- color: var(--sl-color-text);
107
- text-align: left;
108
- cursor: pointer;
109
- font-size: inherit;
110
- font-family: inherit;
111
- line-height: 1.5;
112
-
113
- &:hover {
114
- background: var(--sl-color-bg-nav);
115
- }
116
- }
117
- }