@hyvor/design 2.1.11 → 2.1.12

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.
@@ -11,8 +11,11 @@
11
11
  <script>
12
12
  // to prevent white screen on page load
13
13
  // until the dark mode is initialized from the store
14
- const isDarkMode = !!localStorage.getItem('hds-dark');
15
- if (isDarkMode) {
14
+ var hdsStored = localStorage.getItem('hds-dark');
15
+ var hsdIsDarkMode = hdsStored
16
+ ? !!hdsStored
17
+ : window.matchMedia('(prefers-color-scheme: dark)').matches;
18
+ if (hsdIsDarkMode) {
16
19
  document.documentElement.classList.add('dark');
17
20
  }
18
21
  </script>
@@ -16,6 +16,7 @@ export { highlightCode } from './CodeBlock/getCode.js';
16
16
  export { default as TabbedCodeBlock } from './CodeBlock/TabbedCodeBlock.svelte';
17
17
  export { default as ColorPicker } from './ColorPicker/ColorPicker.svelte';
18
18
  export { default as ConsoleLoader } from './ConsoleLoader/ConsoleLoader.svelte';
19
+ export { confetti } from './Confetti/confetti.js';
19
20
  export { default as DarkProvider } from './Dark/DarkProvider.svelte';
20
21
  export { default as DarkToggle } from './Dark/DarkToggle.svelte';
21
22
  export { default as DetailCard } from './DetailCard/DetailCard.svelte';
@@ -16,6 +16,7 @@ export { highlightCode } from './CodeBlock/getCode.js';
16
16
  export { default as TabbedCodeBlock } from './CodeBlock/TabbedCodeBlock.svelte';
17
17
  export { default as ColorPicker } from './ColorPicker/ColorPicker.svelte';
18
18
  export { default as ConsoleLoader } from './ConsoleLoader/ConsoleLoader.svelte';
19
+ export { confetti } from './Confetti/confetti.js';
19
20
  export { default as DarkProvider } from './Dark/DarkProvider.svelte';
20
21
  export { default as DarkToggle } from './Dark/DarkToggle.svelte';
21
22
  export { default as DetailCard } from './DetailCard/DetailCard.svelte';
@@ -38,19 +38,21 @@
38
38
 
39
39
  const headings = contentEl.querySelectorAll<HTMLElement>('h2[id], h3[id], h4[id]');
40
40
  for (const h of headings) {
41
+ if (h.querySelector(':scope > a.heading-anchor')) continue;
42
+
43
+ const id = h.getAttribute('id');
44
+ const link = document.createElement('a');
45
+ link.className = 'heading-anchor';
46
+ link.setAttribute('href', '#' + id);
47
+ link.append(...h.childNodes);
48
+
41
49
  const icon = document.createElement('a');
42
50
  icon.className = 'heading-anchor-link';
43
51
  icon.innerHTML =
44
52
  '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-link-45deg" viewBox="0 0 16 16"><path d="M4.715 6.542 3.343 7.914a3 3 0 1 0 4.243 4.243l1.828-1.829A3 3 0 0 0 8.586 5.5L8 6.086a1.002 1.002 0 0 0-.154.199 2 2 0 0 1 .861 3.337L6.88 11.45a2 2 0 1 1-2.83-2.83l.793-.792a4.018 4.018 0 0 1-.128-1.287z"/><path d="M6.586 4.672A3 3 0 0 0 7.414 9.5l.775-.776a2 2 0 0 1-.896-3.346L9.12 3.55a2 2 0 1 1 2.83 2.83l-.793.792c.112.42.155.855.128 1.287l1.372-1.372a3 3 0 1 0-4.243-4.243L6.586 4.672z"/></svg>';
45
53
  icon.tabIndex = -1;
46
- h.appendChild(icon);
47
54
 
48
- const id = h.getAttribute('id');
49
- const link = document.createElement('a');
50
- link.className = 'heading-anchor';
51
- link.setAttribute('href', '#' + id);
52
- link.innerHTML = h.innerHTML;
53
- h.innerHTML = link.outerHTML;
55
+ h.replaceChildren(link, icon);
54
56
  }
55
57
  }
56
58
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hyvor/design",
3
- "version": "2.1.11",
3
+ "version": "2.1.12",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "repository": {