@unkn0wndo3s/nova-design-system 0.1.0 → 0.2.0

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.
Files changed (143) hide show
  1. package/LICENSE.md +46 -46
  2. package/README.md +159 -165
  3. package/package.json +28 -28
  4. package/src/components/Button/_button.scss +36 -36
  5. package/src/components/Button/button.astro +14 -14
  6. package/src/components/Icons/Arrow2/Arrow2.astro +45 -45
  7. package/src/components/Icons/Arrow2/svgs/arrow2-16-down.svg +3 -3
  8. package/src/components/Icons/Arrow2/svgs/arrow2-16-left.svg +3 -3
  9. package/src/components/Icons/Arrow2/svgs/arrow2-16-right.svg +3 -3
  10. package/src/components/Icons/Arrow2/svgs/arrow2-16-up.svg +3 -3
  11. package/src/components/Icons/Arrow2/svgs/arrow2-24-down.svg +3 -3
  12. package/src/components/Icons/Arrow2/svgs/arrow2-24-left.svg +3 -3
  13. package/src/components/Icons/Arrow2/svgs/arrow2-24-right.svg +3 -3
  14. package/src/components/Icons/Arrow2/svgs/arrow2-24-up.svg +3 -3
  15. package/src/components/Icons/Arrow2/svgs/arrow2-32-down.svg +3 -3
  16. package/src/components/Icons/Arrow2/svgs/arrow2-32-left.svg +3 -3
  17. package/src/components/Icons/Arrow2/svgs/arrow2-32-right.svg +3 -3
  18. package/src/components/Icons/Arrow2/svgs/arrow2-32-up.svg +3 -3
  19. package/src/components/Icons/bin/bin.astro +26 -26
  20. package/src/components/Icons/bin/svgs/bin-16.svg +3 -3
  21. package/src/components/Icons/bin/svgs/bin-24.svg +3 -3
  22. package/src/components/Icons/bin/svgs/bin-32.svg +3 -3
  23. package/src/components/Icons/burger/burger.astro +26 -26
  24. package/src/components/Icons/burger/svgs/burger-16.svg +3 -3
  25. package/src/components/Icons/burger/svgs/burger-24.svg +3 -3
  26. package/src/components/Icons/burger/svgs/burger-32.svg +3 -3
  27. package/src/components/Icons/calendar/calendar.astro +26 -26
  28. package/src/components/Icons/calendar/svgs/calendar-16.svg +3 -3
  29. package/src/components/Icons/calendar/svgs/calendar-24.svg +3 -3
  30. package/src/components/Icons/calendar/svgs/calendar-32.svg +3 -3
  31. package/src/components/Icons/check/check.astro +26 -26
  32. package/src/components/Icons/check/svgs/check-16.svg +3 -3
  33. package/src/components/Icons/check/svgs/check-24.svg +3 -3
  34. package/src/components/Icons/check/svgs/check-32.svg +3 -3
  35. package/src/components/Icons/close/close.astro +27 -27
  36. package/src/components/Icons/close/svgs/close-16.svg +3 -3
  37. package/src/components/Icons/close/svgs/close-24.svg +3 -3
  38. package/src/components/Icons/close/svgs/close-32.svg +3 -3
  39. package/src/components/Icons/code/code.astro +26 -26
  40. package/src/components/Icons/code/svgs/code-16.svg +3 -3
  41. package/src/components/Icons/code/svgs/code-24.svg +3 -3
  42. package/src/components/Icons/code/svgs/code-32.svg +3 -3
  43. package/src/components/Icons/cube/cube.astro +26 -26
  44. package/src/components/Icons/cube/svgs/cube-16.svg +3 -3
  45. package/src/components/Icons/cube/svgs/cube-24.svg +3 -3
  46. package/src/components/Icons/cube/svgs/cube-32.svg +3 -3
  47. package/src/components/Icons/download/download.astro +26 -26
  48. package/src/components/Icons/download/svgs/download-16.svg +5 -5
  49. package/src/components/Icons/download/svgs/download-24.svg +4 -4
  50. package/src/components/Icons/download/svgs/download-32.svg +4 -4
  51. package/src/components/Icons/filter/filter.astro +26 -26
  52. package/src/components/Icons/filter/svgs/filter-16.svg +3 -3
  53. package/src/components/Icons/filter/svgs/filter-24.svg +3 -3
  54. package/src/components/Icons/filter/svgs/filter-32.svg +3 -3
  55. package/src/components/Icons/help/help.astro +26 -26
  56. package/src/components/Icons/help/svgs/help-16.svg +5 -5
  57. package/src/components/Icons/help/svgs/help-24.svg +5 -5
  58. package/src/components/Icons/help/svgs/help-32.svg +3 -3
  59. package/src/components/Icons/home/home.astro +26 -26
  60. package/src/components/Icons/home/svgs/home-16.svg +3 -3
  61. package/src/components/Icons/home/svgs/home-24.svg +3 -3
  62. package/src/components/Icons/home/svgs/home-32.svg +3 -3
  63. package/src/components/Icons/index.ts +25 -25
  64. package/src/components/Icons/link/link.astro +26 -26
  65. package/src/components/Icons/link/svgs/link-16.svg +3 -3
  66. package/src/components/Icons/link/svgs/link-24.svg +3 -3
  67. package/src/components/Icons/link/svgs/link-32.svg +3 -3
  68. package/src/components/Icons/minus/minus.astro +26 -26
  69. package/src/components/Icons/minus/svgs/minus-16.svg +3 -3
  70. package/src/components/Icons/minus/svgs/minus-24.svg +3 -3
  71. package/src/components/Icons/minus/svgs/minus-32.svg +3 -3
  72. package/src/components/Icons/more/more.astro +26 -26
  73. package/src/components/Icons/more/svgs/more-16.svg +3 -3
  74. package/src/components/Icons/more/svgs/more-24.svg +3 -3
  75. package/src/components/Icons/more/svgs/more-32.svg +3 -3
  76. package/src/components/Icons/overview/overview.astro +26 -26
  77. package/src/components/Icons/overview/svgs/overview-16.svg +3 -3
  78. package/src/components/Icons/overview/svgs/overview-24.svg +3 -3
  79. package/src/components/Icons/overview/svgs/overview-32.svg +3 -3
  80. package/src/components/Icons/plus/plus.astro +26 -26
  81. package/src/components/Icons/plus/svgs/plus-16.svg +3 -3
  82. package/src/components/Icons/plus/svgs/plus-24.svg +3 -3
  83. package/src/components/Icons/plus/svgs/plus-32.svg +3 -3
  84. package/src/components/Icons/profile/profile.astro +27 -27
  85. package/src/components/Icons/profile/svgs/profile-16.svg +3 -3
  86. package/src/components/Icons/profile/svgs/profile-24.svg +3 -3
  87. package/src/components/Icons/profile/svgs/profile-32.svg +3 -3
  88. package/src/components/Icons/search/search.astro +27 -27
  89. package/src/components/Icons/search/svgs/search-16.svg +3 -3
  90. package/src/components/Icons/search/svgs/search-24.svg +3 -3
  91. package/src/components/Icons/search/svgs/search-32.svg +3 -3
  92. package/src/components/Icons/settings/settings.astro +26 -26
  93. package/src/components/Icons/settings/svgs/settings-16.svg +3 -3
  94. package/src/components/Icons/settings/svgs/settings-24.svg +3 -3
  95. package/src/components/Icons/settings/svgs/settings-32.svg +3 -3
  96. package/src/components/Icons/share/share.astro +27 -27
  97. package/src/components/Icons/share/svgs/share-16.svg +3 -3
  98. package/src/components/Icons/share/svgs/share-24.svg +3 -3
  99. package/src/components/Icons/share/svgs/share-32.svg +3 -3
  100. package/src/components/Icons/shield/shield.astro +26 -26
  101. package/src/components/Icons/shield/svgs/shield-16.svg +3 -3
  102. package/src/components/Icons/shield/svgs/shield-24.svg +3 -3
  103. package/src/components/Icons/shield/svgs/shield-32.svg +3 -3
  104. package/src/components/Icons/sort/sort.astro +38 -38
  105. package/src/components/Icons/sort/svgs/sort-16-ascend.svg +4 -4
  106. package/src/components/Icons/sort/svgs/sort-16-default.svg +3 -3
  107. package/src/components/Icons/sort/svgs/sort-16-descend.svg +4 -4
  108. package/src/components/Icons/sort/svgs/sort-24-ascend.svg +4 -4
  109. package/src/components/Icons/sort/svgs/sort-24-default.svg +3 -3
  110. package/src/components/Icons/sort/svgs/sort-24-descend.svg +4 -4
  111. package/src/components/Icons/sort/svgs/sort-32-ascend.svg +4 -4
  112. package/src/components/Icons/sort/svgs/sort-32-default.svg +3 -3
  113. package/src/components/Icons/sort/svgs/sort-32-descend.svg +4 -4
  114. package/src/components/Icons/stats/stats.astro +26 -26
  115. package/src/components/Icons/stats/svgs/stats-16.svg +3 -3
  116. package/src/components/Icons/stats/svgs/stats-24.svg +3 -3
  117. package/src/components/Icons/stats/svgs/stats-32.svg +3 -3
  118. package/src/components/Icons/upload/svgs/upload-16.svg +3 -3
  119. package/src/components/Icons/upload/svgs/upload-24.svg +3 -3
  120. package/src/components/Icons/upload/svgs/upload-32.svg +3 -3
  121. package/src/components/Icons/upload/upload.astro +27 -27
  122. package/src/components/Link/_link.scss +29 -29
  123. package/src/components/Link/link.astro +15 -15
  124. package/src/components/ListItem/_listItem.scss +69 -20
  125. package/src/components/ListItem/listItem.astro +14 -14
  126. package/src/components/ListItem/listItemSubtitle.astro +6 -6
  127. package/src/components/ListItem/listItemTitle.astro +6 -6
  128. package/src/components/Notifications/_notification.scss +61 -61
  129. package/src/components/Notifications/notification.astro +22 -22
  130. package/src/components/Tabs/_tab.scss +32 -32
  131. package/src/components/Tabs/tab.astro +53 -53
  132. package/src/components/Tabs/tabContent.astro +20 -20
  133. package/src/components/Tabs/tabItem.astro +40 -40
  134. package/src/components/Toggle/_toggle.scss +33 -33
  135. package/src/components/Toggle/toggle.astro +61 -61
  136. package/src/components/index.ts +13 -10
  137. package/src/index.ts +1 -1
  138. package/src/layouts/Layout.astro +29 -29
  139. package/src/pages/index.astro +338 -338
  140. package/src/styles/index.scss +10 -10
  141. package/src/styles/tokens/_colors.scss +69 -69
  142. package/src/styles/tokens/_spacing.scss +32 -32
  143. package/src/styles/tokens/_typography.scss +50 -50
@@ -1,26 +1,26 @@
1
- ---
2
- import check16 from './svgs/check-16.svg?raw';
3
- import check24 from './svgs/check-24.svg?raw';
4
- import check32 from './svgs/check-32.svg?raw';
5
-
6
- export interface Props {
7
- size: 16 | 24 | 32;
8
- label?: string;
9
- class?: string;
10
- }
11
-
12
- const { size = 24, label, class: className } = Astro.props;
13
-
14
- let raw: string;
15
- if (size === 16) raw = check16;
16
- else if (size === 24) raw = check24;
17
- else if (size === 32) raw = check32;
18
- else raw = '';
19
-
20
- const classes = ['nds-icon-check', className].filter(Boolean).join(' ');
21
- const svg = raw
22
- .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
- .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
- ---
25
-
26
- <Fragment set:html={svg} />
1
+ ---
2
+ import check16 from './svgs/check-16.svg?raw';
3
+ import check24 from './svgs/check-24.svg?raw';
4
+ import check32 from './svgs/check-32.svg?raw';
5
+
6
+ export interface Props {
7
+ size: 16 | 24 | 32;
8
+ label?: string;
9
+ class?: string;
10
+ }
11
+
12
+ const { size = 24, label, class: className } = Astro.props;
13
+
14
+ let raw: string;
15
+ if (size === 16) raw = check16;
16
+ else if (size === 24) raw = check24;
17
+ else if (size === 32) raw = check32;
18
+ else raw = '';
19
+
20
+ const classes = ['nds-icon-check', className].filter(Boolean).join(' ');
21
+ const svg = raw
22
+ .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
+ .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
+ ---
25
+
26
+ <Fragment set:html={svg} />
@@ -1,3 +1,3 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M6.41997 10.0451L11.9006 4.56449C12.03 4.43515 12.1809 4.37048 12.3533 4.37048C12.5258 4.37048 12.6767 4.43515 12.806 4.56449C12.9353 4.69383 13 4.84752 13 5.02558C13 5.20363 12.9353 5.35711 12.806 5.48602L6.87265 11.4355C6.74332 11.5649 6.59242 11.6295 6.41997 11.6295C6.24752 11.6295 6.09663 11.5649 5.96729 11.4355L3.18654 8.65478C3.05721 8.52544 2.99512 8.37196 3.0003 8.19434C3.00547 8.01671 3.07294 7.86302 3.20271 7.73325C3.33248 7.60348 3.48618 7.53881 3.6638 7.53924C3.84142 7.53967 3.9949 7.60434 4.12424 7.73325L6.41997 10.0451Z" fill="#F4F2EF"/>
3
- </svg>
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M6.41997 10.0451L11.9006 4.56449C12.03 4.43515 12.1809 4.37048 12.3533 4.37048C12.5258 4.37048 12.6767 4.43515 12.806 4.56449C12.9353 4.69383 13 4.84752 13 5.02558C13 5.20363 12.9353 5.35711 12.806 5.48602L6.87265 11.4355C6.74332 11.5649 6.59242 11.6295 6.41997 11.6295C6.24752 11.6295 6.09663 11.5649 5.96729 11.4355L3.18654 8.65478C3.05721 8.52544 2.99512 8.37196 3.0003 8.19434C3.00547 8.01671 3.07294 7.86302 3.20271 7.73325C3.33248 7.60348 3.48618 7.53881 3.6638 7.53924C3.84142 7.53967 3.9949 7.60434 4.12424 7.73325L6.41997 10.0451Z" fill="#F4F2EF"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M9.15595 15.6813L19.0211 5.81607C19.2539 5.58326 19.5256 5.46686 19.836 5.46686C20.1464 5.46686 20.418 5.58326 20.6508 5.81607C20.8836 6.04888 21 6.32553 21 6.64602C21 6.96652 20.8836 7.24279 20.6508 7.47482L9.97077 18.1839C9.73797 18.4167 9.46636 18.5331 9.15595 18.5331C8.84554 18.5331 8.57393 18.4167 8.34113 18.1839L3.33578 13.1786C3.10297 12.9458 2.99122 12.6695 3.00054 12.3498C3.00985 12.0301 3.1313 11.7534 3.36488 11.5198C3.59846 11.2863 3.87512 11.1698 4.19484 11.1706C4.51456 11.1714 4.79082 11.2878 5.02363 11.5198L9.15595 15.6813Z" fill="#F4F2EF"/>
3
- </svg>
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M9.15595 15.6813L19.0211 5.81607C19.2539 5.58326 19.5256 5.46686 19.836 5.46686C20.1464 5.46686 20.418 5.58326 20.6508 5.81607C20.8836 6.04888 21 6.32553 21 6.64602C21 6.96652 20.8836 7.24279 20.6508 7.47482L9.97077 18.1839C9.73797 18.4167 9.46636 18.5331 9.15595 18.5331C8.84554 18.5331 8.57393 18.4167 8.34113 18.1839L3.33578 13.1786C3.10297 12.9458 2.99122 12.6695 3.00054 12.3498C3.00985 12.0301 3.1313 11.7534 3.36488 11.5198C3.59846 11.2863 3.87512 11.1698 4.19484 11.1706C4.51456 11.1714 4.79082 11.2878 5.02363 11.5198L9.15595 15.6813Z" fill="#F4F2EF"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M11.8919 21.3174L26.1416 7.06765C26.4779 6.73137 26.8702 6.56323 27.3186 6.56323C27.767 6.56323 28.1593 6.73137 28.4956 7.06765C28.8319 7.40392 29 7.80353 29 8.26647C29 8.72941 28.8319 9.12846 28.4956 9.46362L13.0689 24.9323C12.7326 25.2686 12.3403 25.4368 11.8919 25.4368C11.4436 25.4368 11.0512 25.2686 10.715 24.9323L3.48501 17.7024C3.14874 17.3661 2.98732 16.9671 3.00078 16.5052C3.01423 16.0434 3.18965 15.6438 3.52705 15.3064C3.86445 14.969 4.26406 14.8009 4.72588 14.802C5.18769 14.8031 5.58674 14.9713 5.92302 15.3064L11.8919 21.3174Z" fill="#F4F2EF"/>
3
- </svg>
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M11.8919 21.3174L26.1416 7.06765C26.4779 6.73137 26.8702 6.56323 27.3186 6.56323C27.767 6.56323 28.1593 6.73137 28.4956 7.06765C28.8319 7.40392 29 7.80353 29 8.26647C29 8.72941 28.8319 9.12846 28.4956 9.46362L13.0689 24.9323C12.7326 25.2686 12.3403 25.4368 11.8919 25.4368C11.4436 25.4368 11.0512 25.2686 10.715 24.9323L3.48501 17.7024C3.14874 17.3661 2.98732 16.9671 3.00078 16.5052C3.01423 16.0434 3.18965 15.6438 3.52705 15.3064C3.86445 14.969 4.26406 14.8009 4.72588 14.802C5.18769 14.8031 5.58674 14.9713 5.92302 15.3064L11.8919 21.3174Z" fill="#F4F2EF"/>
3
+ </svg>
@@ -1,27 +1,27 @@
1
- ---
2
- import close16 from './svgs/close-16.svg?raw';
3
- import close24 from './svgs/close-24.svg?raw';
4
- import close32 from './svgs/close-32.svg?raw';
5
-
6
- export interface Props {
7
- size: 16 | 24 | 32;
8
- label?: string;
9
- class?: string;
10
- }
11
-
12
- const { size = 24, label, class: className } = Astro.props;
13
-
14
- let raw: string;
15
- if (size === 16 ) raw = close16;
16
- else if (size === 24 ) raw = close24;
17
- else if (size === 32 ) raw = close32;
18
- else raw = ''; // Fallback to a blank string if no match is found, though this should not happen due to the type constraints on size.
19
-
20
-
21
- const classes = ['nds-icon-close', className].filter(Boolean).join(' ');
22
- const svg = raw
23
- .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
24
- .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
25
- ---
26
-
27
- <Fragment set:html={svg} />
1
+ ---
2
+ import close16 from './svgs/close-16.svg?raw';
3
+ import close24 from './svgs/close-24.svg?raw';
4
+ import close32 from './svgs/close-32.svg?raw';
5
+
6
+ export interface Props {
7
+ size: 16 | 24 | 32;
8
+ label?: string;
9
+ class?: string;
10
+ }
11
+
12
+ const { size = 24, label, class: className } = Astro.props;
13
+
14
+ let raw: string;
15
+ if (size === 16 ) raw = close16;
16
+ else if (size === 24 ) raw = close24;
17
+ else if (size === 32 ) raw = close32;
18
+ else raw = ''; // Fallback to a blank string if no match is found, though this should not happen due to the type constraints on size.
19
+
20
+
21
+ const classes = ['nds-icon-close', className].filter(Boolean).join(' ');
22
+ const svg = raw
23
+ .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
24
+ .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
25
+ ---
26
+
27
+ <Fragment set:html={svg} />
@@ -1,3 +1,3 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M13 3L3 13M13 13L3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M13 3L3 13M13 13L3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M21 3L3 21M21 21L3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M21 3L3 21M21 21L3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M29 3L3 29M29 29L3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M29 3L3 29M29 29L3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,26 +1,26 @@
1
- ---
2
- import code16 from './svgs/code-16.svg?raw';
3
- import code24 from './svgs/code-24.svg?raw';
4
- import code32 from './svgs/code-32.svg?raw';
5
-
6
- export interface Props {
7
- size: 16 | 24 | 32;
8
- label?: string;
9
- class?: string;
10
- }
11
-
12
- const { size = 24, label, class: className } = Astro.props;
13
-
14
- let raw: string;
15
- if (size === 16) raw = code16;
16
- else if (size === 24) raw = code24;
17
- else if (size === 32) raw = code32;
18
- else raw = '';
19
-
20
- const classes = ['nds-icon-code', className].filter(Boolean).join(' ');
21
- const svg = raw
22
- .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
- .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
- ---
25
-
26
- <Fragment set:html={svg} />
1
+ ---
2
+ import code16 from './svgs/code-16.svg?raw';
3
+ import code24 from './svgs/code-24.svg?raw';
4
+ import code32 from './svgs/code-32.svg?raw';
5
+
6
+ export interface Props {
7
+ size: 16 | 24 | 32;
8
+ label?: string;
9
+ class?: string;
10
+ }
11
+
12
+ const { size = 24, label, class: className } = Astro.props;
13
+
14
+ let raw: string;
15
+ if (size === 16) raw = code16;
16
+ else if (size === 24) raw = code24;
17
+ else if (size === 32) raw = code32;
18
+ else raw = '';
19
+
20
+ const classes = ['nds-icon-code', className].filter(Boolean).join(' ');
21
+ const svg = raw
22
+ .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
+ .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
+ ---
25
+
26
+ <Fragment set:html={svg} />
@@ -1,3 +1,3 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M5.22222 5.77778L3 8L5.22222 10.2222M10.7778 5.77778L13 8L10.7778 10.2222M9.11111 3.55556L6.88889 12.4444" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M5.22222 5.77778L3 8L5.22222 10.2222M10.7778 5.77778L13 8L10.7778 10.2222M9.11111 3.55556L6.88889 12.4444" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M7 8L3 12L7 16M17 8L21 12L17 16M14 4L10 20" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M7 8L3 12L7 16M17 8L21 12L17 16M14 4L10 20" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M8.77778 10.2222L3 16L8.77778 21.7778M23.2222 10.2222L29 16L23.2222 21.7778M18.8889 4.44444L13.1111 27.5556" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M8.77778 10.2222L3 16L8.77778 21.7778M23.2222 10.2222L29 16L23.2222 21.7778M18.8889 4.44444L13.1111 27.5556" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,26 +1,26 @@
1
- ---
2
- import cube16 from './svgs/cube-16.svg?raw';
3
- import cube24 from './svgs/cube-24.svg?raw';
4
- import cube32 from './svgs/cube-32.svg?raw';
5
-
6
- export interface Props {
7
- size: 16 | 24 | 32;
8
- label?: string;
9
- class?: string;
10
- }
11
-
12
- const { size = 24, label, class: className } = Astro.props;
13
-
14
- let raw: string;
15
- if (size === 16) raw = cube16;
16
- else if (size === 24) raw = cube24;
17
- else if (size === 32) raw = cube32;
18
- else raw = '';
19
-
20
- const classes = ['nds-icon-cube', className].filter(Boolean).join(' ');
21
- const svg = raw
22
- .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
- .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
- ---
25
-
26
- <Fragment set:html={svg} />
1
+ ---
2
+ import cube16 from './svgs/cube-16.svg?raw';
3
+ import cube24 from './svgs/cube-24.svg?raw';
4
+ import cube32 from './svgs/cube-32.svg?raw';
5
+
6
+ export interface Props {
7
+ size: 16 | 24 | 32;
8
+ label?: string;
9
+ class?: string;
10
+ }
11
+
12
+ const { size = 24, label, class: className } = Astro.props;
13
+
14
+ let raw: string;
15
+ if (size === 16) raw = cube16;
16
+ else if (size === 24) raw = cube24;
17
+ else if (size === 32) raw = cube32;
18
+ else raw = '';
19
+
20
+ const classes = ['nds-icon-cube', className].filter(Boolean).join(' ');
21
+ const svg = raw
22
+ .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
+ .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
+ ---
25
+
26
+ <Fragment set:html={svg} />
@@ -1,3 +1,3 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"ntColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M8.9024 0.210691L14.7691 2.93523C15.1362 3.10556 15.4469 3.37628 15.6649 3.71571C15.8829 4.05515 15.9991 4.44926 16 4.85194V11.1597C15.9991 11.5624 15.8829 11.9565 15.6649 12.2959C15.4469 12.6354 15.1362 12.9061 14.7691 13.0764L8.9024 15.801C8.61985 15.9321 8.31182 16 8 16C7.68818 16 7.38015 15.9321 7.0976 15.801L1.23093 13.0764C0.8638 12.9061 0.553063 12.6354 0.335075 12.2959C0.117087 11.9565 0.000863304 11.5624 0 11.1597V4.85194C0 4.44803 0.1152 4.0526 0.333867 3.707C0.552533 3.3614 0.862933 3.09425 1.23093 2.92356L7.0976 0.19903C7.38015 0.0679377 7.68818 0 8 0C8.31182 0 8.61985 0.0679377 8.9024 0.19903V0.210691ZM1.0624 4.85406V11.1618C1.06243 11.3635 1.12035 11.561 1.22937 11.7312C1.33838 11.9013 1.49397 12.037 1.67787 12.1223L7.4592 14.8044V7.55315L1.08053 4.62719C1.06453 4.70176 1.05666 4.77782 1.05707 4.85406H1.0624ZM14.9291 4.62825L8.5504 7.55421V14.8055L14.3317 12.1234C14.5158 12.038 14.6715 11.9021 14.7805 11.7318C14.8896 11.5615 14.9474 11.3637 14.9472 11.1618V4.85406C14.9472 4.77814 14.939 4.70243 14.9227 4.62825H14.9291ZM7.56907 1.17223L1.87307 3.81195L8.01707 6.6319L14.1611 3.81195L8.46507 1.17223C8.32379 1.10668 8.16978 1.07271 8.01387 1.07271C7.85796 1.07271 7.70394 1.10668 7.56267 1.17223H7.56907Z" fill="#F4F2EF"/>
3
- </svg>
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"ntColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M8.9024 0.210691L14.7691 2.93523C15.1362 3.10556 15.4469 3.37628 15.6649 3.71571C15.8829 4.05515 15.9991 4.44926 16 4.85194V11.1597C15.9991 11.5624 15.8829 11.9565 15.6649 12.2959C15.4469 12.6354 15.1362 12.9061 14.7691 13.0764L8.9024 15.801C8.61985 15.9321 8.31182 16 8 16C7.68818 16 7.38015 15.9321 7.0976 15.801L1.23093 13.0764C0.8638 12.9061 0.553063 12.6354 0.335075 12.2959C0.117087 11.9565 0.000863304 11.5624 0 11.1597V4.85194C0 4.44803 0.1152 4.0526 0.333867 3.707C0.552533 3.3614 0.862933 3.09425 1.23093 2.92356L7.0976 0.19903C7.38015 0.0679377 7.68818 0 8 0C8.31182 0 8.61985 0.0679377 8.9024 0.19903V0.210691ZM1.0624 4.85406V11.1618C1.06243 11.3635 1.12035 11.561 1.22937 11.7312C1.33838 11.9013 1.49397 12.037 1.67787 12.1223L7.4592 14.8044V7.55315L1.08053 4.62719C1.06453 4.70176 1.05666 4.77782 1.05707 4.85406H1.0624ZM14.9291 4.62825L8.5504 7.55421V14.8055L14.3317 12.1234C14.5158 12.038 14.6715 11.9021 14.7805 11.7318C14.8896 11.5615 14.9474 11.3637 14.9472 11.1618V4.85406C14.9472 4.77814 14.939 4.70243 14.9227 4.62825H14.9291ZM7.56907 1.17223L1.87307 3.81195L8.01707 6.6319L14.1611 3.81195L8.46507 1.17223C8.32379 1.10668 8.16978 1.07271 8.01387 1.07271C7.85796 1.07271 7.70394 1.10668 7.56267 1.17223H7.56907Z" fill="#F4F2EF"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M13.3536 0.316037L22.1536 4.40284C22.7043 4.65834 23.1704 5.06442 23.4974 5.57357C23.8244 6.08272 23.9987 6.67389 24 7.27791V16.7396C23.9987 17.3436 23.8244 17.9348 23.4974 18.4439C23.1704 18.9531 22.7043 19.3592 22.1536 19.6147L13.3536 23.7015C12.9298 23.8981 12.4677 24 12 24C11.5323 24 11.0702 23.8981 10.6464 23.7015L1.8464 19.6147C1.2957 19.3592 0.829595 18.9531 0.502613 18.4439C0.175631 17.9348 0.00129496 17.3436 0 16.7396V7.27791C0 6.67205 0.1728 6.07891 0.5008 5.5605C0.8288 5.0421 1.2944 4.64137 1.8464 4.38535L10.6464 0.298544C11.0702 0.101907 11.5323 0 12 0C12.4677 0 12.9298 0.101907 13.3536 0.298544V0.316037ZM1.5936 7.28109V16.7428C1.59364 17.0453 1.68052 17.3416 1.84405 17.5968C2.00757 17.852 2.24096 18.0555 2.5168 18.1835L11.1888 22.2067V11.3297L1.6208 6.94079C1.59679 7.05264 1.58499 7.16673 1.5856 7.28109H1.5936ZM22.3936 6.94238L12.8256 11.3313V22.2083L21.4976 18.1851C21.7737 18.057 22.0072 17.8532 22.1708 17.5977C22.3343 17.3422 22.4211 17.0456 22.4208 16.7428V7.28109C22.4208 7.16721 22.4084 7.05365 22.384 6.94238H22.3936ZM11.3536 1.75834L2.8096 5.71793L12.0256 9.94785L21.2416 5.71793L12.6976 1.75834C12.4857 1.66003 12.2547 1.60907 12.0208 1.60907C11.7869 1.60907 11.5559 1.66003 11.344 1.75834H11.3536Z" fill="#F4F2EF"/>
3
- </svg>
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M13.3536 0.316037L22.1536 4.40284C22.7043 4.65834 23.1704 5.06442 23.4974 5.57357C23.8244 6.08272 23.9987 6.67389 24 7.27791V16.7396C23.9987 17.3436 23.8244 17.9348 23.4974 18.4439C23.1704 18.9531 22.7043 19.3592 22.1536 19.6147L13.3536 23.7015C12.9298 23.8981 12.4677 24 12 24C11.5323 24 11.0702 23.8981 10.6464 23.7015L1.8464 19.6147C1.2957 19.3592 0.829595 18.9531 0.502613 18.4439C0.175631 17.9348 0.00129496 17.3436 0 16.7396V7.27791C0 6.67205 0.1728 6.07891 0.5008 5.5605C0.8288 5.0421 1.2944 4.64137 1.8464 4.38535L10.6464 0.298544C11.0702 0.101907 11.5323 0 12 0C12.4677 0 12.9298 0.101907 13.3536 0.298544V0.316037ZM1.5936 7.28109V16.7428C1.59364 17.0453 1.68052 17.3416 1.84405 17.5968C2.00757 17.852 2.24096 18.0555 2.5168 18.1835L11.1888 22.2067V11.3297L1.6208 6.94079C1.59679 7.05264 1.58499 7.16673 1.5856 7.28109H1.5936ZM22.3936 6.94238L12.8256 11.3313V22.2083L21.4976 18.1851C21.7737 18.057 22.0072 17.8532 22.1708 17.5977C22.3343 17.3422 22.4211 17.0456 22.4208 16.7428V7.28109C22.4208 7.16721 22.4084 7.05365 22.384 6.94238H22.3936ZM11.3536 1.75834L2.8096 5.71793L12.0256 9.94785L21.2416 5.71793L12.6976 1.75834C12.4857 1.66003 12.2547 1.60907 12.0208 1.60907C11.7869 1.60907 11.5559 1.66003 11.344 1.75834H11.3536Z" fill="#F4F2EF"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor"ntColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M17.8048 0.421382L29.5381 5.87045C30.2724 6.21112 30.8939 6.75256 31.3299 7.43143C31.7658 8.1103 31.9983 8.89852 32 9.70388V22.3194C31.9983 23.1248 31.7658 23.913 31.3299 24.5919C30.8939 25.2708 30.2724 25.8122 29.5381 26.1529L17.8048 31.6019C17.2397 31.8641 16.6236 32 16 32C15.3764 32 14.7603 31.8641 14.1952 31.6019L2.46187 26.1529C1.7276 25.8122 1.10613 25.2708 0.670151 24.5919C0.234175 23.913 0.00172661 23.1248 0 22.3194V9.70388C0 8.89606 0.2304 8.10521 0.667733 7.414C1.10507 6.7228 1.72587 6.18849 2.46187 5.84713L14.1952 0.398059C14.7603 0.135875 15.3764 0 16 0C16.6236 0 17.2397 0.135875 17.8048 0.398059V0.421382ZM2.1248 9.70813V22.3237C2.12485 22.7271 2.2407 23.1221 2.45873 23.4624C2.67677 23.8026 2.98794 24.074 3.35573 24.2446L14.9184 29.6089V15.1063L2.16107 9.25439C2.12905 9.40352 2.11332 9.55564 2.11413 9.70813H2.1248ZM29.8581 9.25651L17.1008 15.1084V29.611L28.6635 24.2468C29.0316 24.076 29.343 23.8043 29.561 23.4636C29.7791 23.1229 29.8948 22.7274 29.8944 22.3237V9.70813C29.8944 9.55627 29.8779 9.40487 29.8453 9.25651H29.8581ZM15.1381 2.34446L3.74613 7.62391L16.0341 13.2638L28.3221 7.62391L16.9301 2.34446C16.6476 2.21337 16.3396 2.14543 16.0277 2.14543C15.7159 2.14543 15.4079 2.21337 15.1253 2.34446H15.1381Z" fill="#F4F2EF"/>
3
- </svg>
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor"ntColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M17.8048 0.421382L29.5381 5.87045C30.2724 6.21112 30.8939 6.75256 31.3299 7.43143C31.7658 8.1103 31.9983 8.89852 32 9.70388V22.3194C31.9983 23.1248 31.7658 23.913 31.3299 24.5919C30.8939 25.2708 30.2724 25.8122 29.5381 26.1529L17.8048 31.6019C17.2397 31.8641 16.6236 32 16 32C15.3764 32 14.7603 31.8641 14.1952 31.6019L2.46187 26.1529C1.7276 25.8122 1.10613 25.2708 0.670151 24.5919C0.234175 23.913 0.00172661 23.1248 0 22.3194V9.70388C0 8.89606 0.2304 8.10521 0.667733 7.414C1.10507 6.7228 1.72587 6.18849 2.46187 5.84713L14.1952 0.398059C14.7603 0.135875 15.3764 0 16 0C16.6236 0 17.2397 0.135875 17.8048 0.398059V0.421382ZM2.1248 9.70813V22.3237C2.12485 22.7271 2.2407 23.1221 2.45873 23.4624C2.67677 23.8026 2.98794 24.074 3.35573 24.2446L14.9184 29.6089V15.1063L2.16107 9.25439C2.12905 9.40352 2.11332 9.55564 2.11413 9.70813H2.1248ZM29.8581 9.25651L17.1008 15.1084V29.611L28.6635 24.2468C29.0316 24.076 29.343 23.8043 29.561 23.4636C29.7791 23.1229 29.8948 22.7274 29.8944 22.3237V9.70813C29.8944 9.55627 29.8779 9.40487 29.8453 9.25651H29.8581ZM15.1381 2.34446L3.74613 7.62391L16.0341 13.2638L28.3221 7.62391L16.9301 2.34446C16.6476 2.21337 16.3396 2.14543 16.0277 2.14543C15.7159 2.14543 15.4079 2.21337 15.1253 2.34446H15.1381Z" fill="#F4F2EF"/>
3
+ </svg>
@@ -1,26 +1,26 @@
1
- ---
2
- import download16 from './svgs/download-16.svg?raw';
3
- import download24 from './svgs/download-24.svg?raw';
4
- import download32 from './svgs/download-32.svg?raw';
5
-
6
- export interface Props {
7
- size: 16 | 24 | 32;
8
- label?: string;
9
- class?: string;
10
- }
11
-
12
- const { size = 24, label, class: className } = Astro.props;
13
-
14
- let raw: string;
15
- if (size === 16) raw = download16;
16
- else if (size === 24) raw = download24;
17
- else if (size === 32) raw = download32;
18
- else raw = '';
19
-
20
- const classes = ['nds-icon-download', className].filter(Boolean).join(' ');
21
- const svg = raw
22
- .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
- .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
- ---
25
-
26
- <Fragment set:html={svg} />
1
+ ---
2
+ import download16 from './svgs/download-16.svg?raw';
3
+ import download24 from './svgs/download-24.svg?raw';
4
+ import download32 from './svgs/download-32.svg?raw';
5
+
6
+ export interface Props {
7
+ size: 16 | 24 | 32;
8
+ label?: string;
9
+ class?: string;
10
+ }
11
+
12
+ const { size = 24, label, class: className } = Astro.props;
13
+
14
+ let raw: string;
15
+ if (size === 16) raw = download16;
16
+ else if (size === 24) raw = download24;
17
+ else if (size === 32) raw = download32;
18
+ else raw = '';
19
+
20
+ const classes = ['nds-icon-download', className].filter(Boolean).join(' ');
21
+ const svg = raw
22
+ .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
+ .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
+ ---
25
+
26
+ <Fragment set:html={svg} />
@@ -1,5 +1,5 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M8.00001 3H9.67067V8.01199H11.759L8.00001 11.771M8.00001 3H6.32934V8.01199H4.24101L8.00001 11.771" fill="#F4F2EF"/>
3
- <path d="M8.00001 3H9.67067V8.01199H11.759L8.00001 11.771L4.24101 8.01199H6.32934V3H8.00001Z" stroke="currentColor" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
4
- <path d="M4.72905 13.5H11.271" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
5
- </svg>
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M8.00001 3H9.67067V8.01199H11.759L8.00001 11.771M8.00001 3H6.32934V8.01199H4.24101L8.00001 11.771" fill="#F4F2EF"/>
3
+ <path d="M8.00001 3H9.67067V8.01199H11.759L8.00001 11.771L4.24101 8.01199H6.32934V3H8.00001Z" stroke="currentColor" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
4
+ <path d="M4.72905 13.5H11.271" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
5
+ </svg>
@@ -1,4 +1,4 @@
1
- <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M12 4.5H13.7778V10.7857H16L12 15.5M12 4.5H10.2222V10.7857H8L12 15.5" fill="#F4F2EF" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
- <path d="M7 19.5H17" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
4
- </svg>
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M12 4.5H13.7778V10.7857H16L12 15.5M12 4.5H10.2222V10.7857H8L12 15.5" fill="#F4F2EF" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
+ <path d="M7 19.5H17" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
4
+ </svg>
@@ -1,4 +1,4 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor"ntColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M16 4.5H19.1111V14.2143H23L16 21.5M16 4.5H12.8889V14.2143H9L16 21.5" fill="#F4F2EF" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
- <path d="M9.5 27.5H22.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
4
- </svg>
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor"ntColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M16 4.5H19.1111V14.2143H23L16 21.5M16 4.5H12.8889V14.2143H9L16 21.5" fill="#F4F2EF" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
+ <path d="M9.5 27.5H22.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
4
+ </svg>
@@ -1,26 +1,26 @@
1
- ---
2
- import filter16 from './svgs/filter-16.svg?raw';
3
- import filter24 from './svgs/filter-24.svg?raw';
4
- import filter32 from './svgs/filter-32.svg?raw';
5
-
6
- export interface Props {
7
- size: 16 | 24 | 32;
8
- label?: string;
9
- class?: string;
10
- }
11
-
12
- const { size = 24, label, class: className } = Astro.props;
13
-
14
- let raw: string;
15
- if (size === 16) raw = filter16;
16
- else if (size === 24) raw = filter24;
17
- else if (size === 32) raw = filter32;
18
- else raw = '';
19
-
20
- const classes = ['nds-icon-filter', className].filter(Boolean).join(' ');
21
- const svg = raw
22
- .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
- .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
- ---
25
-
26
- <Fragment set:html={svg} />
1
+ ---
2
+ import filter16 from './svgs/filter-16.svg?raw';
3
+ import filter24 from './svgs/filter-24.svg?raw';
4
+ import filter32 from './svgs/filter-32.svg?raw';
5
+
6
+ export interface Props {
7
+ size: 16 | 24 | 32;
8
+ label?: string;
9
+ class?: string;
10
+ }
11
+
12
+ const { size = 24, label, class: className } = Astro.props;
13
+
14
+ let raw: string;
15
+ if (size === 16) raw = filter16;
16
+ else if (size === 24) raw = filter24;
17
+ else if (size === 32) raw = filter32;
18
+ else raw = '';
19
+
20
+ const classes = ['nds-icon-filter', className].filter(Boolean).join(' ');
21
+ const svg = raw
22
+ .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
+ .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
+ ---
25
+
26
+ <Fragment set:html={svg} />
@@ -1,3 +1,3 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M3 4.66667H13M4.66667 8H11.3333M6.66667 11.3333H9.33333" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M3 4.66667H13M4.66667 8H11.3333M6.66667 11.3333H9.33333" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M3 6H21M6 12H18M9.6 18H14.4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M3 6H21M6 12H18M9.6 18H14.4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,3 +1,3 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M3 7.33333H29M7.33333 16H24.6667M12.5333 24.6667H19.4667" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
- </svg>
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M3 7.33333H29M7.33333 16H24.6667M12.5333 24.6667H19.4667" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -1,26 +1,26 @@
1
- ---
2
- import help16 from './svgs/help-16.svg?raw';
3
- import help24 from './svgs/help-24.svg?raw';
4
- import help32 from './svgs/help-32.svg?raw';
5
-
6
- export interface Props {
7
- size: 16 | 24 | 32;
8
- label?: string;
9
- class?: string;
10
- }
11
-
12
- const { size = 24, label, class: className } = Astro.props;
13
-
14
- let raw: string;
15
- if (size === 16) raw = help16;
16
- else if (size === 24) raw = help24;
17
- else if (size === 32) raw = help32;
18
- else raw = '';
19
-
20
- const classes = ['nds-icon-help', className].filter(Boolean).join(' ');
21
- const svg = raw
22
- .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
- .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
- ---
25
-
26
- <Fragment set:html={svg} />
1
+ ---
2
+ import help16 from './svgs/help-16.svg?raw';
3
+ import help24 from './svgs/help-24.svg?raw';
4
+ import help32 from './svgs/help-32.svg?raw';
5
+
6
+ export interface Props {
7
+ size: 16 | 24 | 32;
8
+ label?: string;
9
+ class?: string;
10
+ }
11
+
12
+ const { size = 24, label, class: className } = Astro.props;
13
+
14
+ let raw: string;
15
+ if (size === 16) raw = help16;
16
+ else if (size === 24) raw = help24;
17
+ else if (size === 32) raw = help32;
18
+ else raw = '';
19
+
20
+ const classes = ['nds-icon-help', className].filter(Boolean).join(' ');
21
+ const svg = raw
22
+ .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
23
+ .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
24
+ ---
25
+
26
+ <Fragment set:html={svg} />
@@ -1,5 +1,5 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M8 13C10.7614 13 13 10.7614 13 8C13 5.23858 10.7614 3 8 3C5.23858 3 3 5.23858 3 8C3 10.7614 5.23858 13 8 13Z" stroke="currentColor"/>
3
- <path d="M8 10C9.10457 10 10 9.10457 10 8C10 6.89543 9.10457 6 8 6C6.89543 6 6 6.89543 6 8C6 9.10457 6.89543 10 8 10Z" stroke="currentColor" stroke-width="1.5"/>
4
- <path d="M9.5 6.5L11.5 4.5M4.5 11.5L6.5 9.5M6.5 6.5L4.5 4.5M11.5 11.5L9.5 9.5" stroke="currentColor"/>
5
- </svg>
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M8 13C10.7614 13 13 10.7614 13 8C13 5.23858 10.7614 3 8 3C5.23858 3 3 5.23858 3 8C3 10.7614 5.23858 13 8 13Z" stroke="currentColor"/>
3
+ <path d="M8 10C9.10457 10 10 9.10457 10 8C10 6.89543 9.10457 6 8 6C6.89543 6 6 6.89543 6 8C6 9.10457 6.89543 10 8 10Z" stroke="currentColor" stroke-width="1.5"/>
4
+ <path d="M9.5 6.5L11.5 4.5M4.5 11.5L6.5 9.5M6.5 6.5L4.5 4.5M11.5 11.5L9.5 9.5" stroke="currentColor"/>
5
+ </svg>
@@ -1,5 +1,5 @@
1
- <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z" stroke="currentColor" stroke-width="1.5"/>
3
- <path d="M12 15.6C13.9882 15.6 15.6 13.9882 15.6 12C15.6 10.0118 13.9882 8.4 12 8.4C10.0118 8.4 8.39999 10.0118 8.39999 12C8.39999 13.9882 10.0118 15.6 12 15.6Z" stroke="currentColor" stroke-width="1.5"/>
4
- <path d="M14.7 9.3L18.3 5.7M5.7 18.3L9.3 14.7M9.3 9.3L5.7 5.7M18.3 18.3L14.7 14.7" stroke="currentColor" stroke-width="1.5"/>
5
- </svg>
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z" stroke="currentColor" stroke-width="1.5"/>
3
+ <path d="M12 15.6C13.9882 15.6 15.6 13.9882 15.6 12C15.6 10.0118 13.9882 8.4 12 8.4C10.0118 8.4 8.39999 10.0118 8.39999 12C8.39999 13.9882 10.0118 15.6 12 15.6Z" stroke="currentColor" stroke-width="1.5"/>
4
+ <path d="M14.7 9.3L18.3 5.7M5.7 18.3L9.3 14.7M9.3 9.3L5.7 5.7M18.3 18.3L14.7 14.7" stroke="currentColor" stroke-width="1.5"/>
5
+ </svg>
@@ -1,4 +1,4 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M16 29C23.1797 29 29 23.1797 29 16C29 8.8203 23.1797 3 16 3C8.8203 3 3 8.8203 3 16C3 23.1797 8.8203 29 16 29Z" stroke="currentColor" stroke-width="1.5"/>
3
- <path d="M16 21.2C18.8719 21.2 21.2 18.8719 21.2 16C21.2 13.1281 18.8719 10.8 16 10.8C13.1281 10.8 10.8 13.1281 10.8 16C10.8 18.8719 13.1281 21.2 16 21.2Z" stroke="currentColor" stroke-width="1.5"/>
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M16 29C23.1797 29 29 23.1797 29 16C29 8.8203 23.1797 3 16 3C8.8203 3 3 8.8203 3 16C3 23.1797 8.8203 29 16 29Z" stroke="currentColor" stroke-width="1.5"/>
3
+ <path d="M16 21.2C18.8719 21.2 21.2 18.8719 21.2 16C21.2 13.1281 18.8719 10.8 16 10.8C13.1281 10.8 10.8 13.1281 10.8 16C10.8 18.8719 13.1281 21.2 16 21.2Z" stroke="currentColor" stroke-width="1.5"/>
4
4
  <path d="M19.9 12.1L25.1 6.89999M6.89999 25.1L12.1 19.9M12.1 12.1L6.89999 6.89999M25.1 25.1L19.9 19.9" stroke="currentColor" stroke-width="1.5"/>