@kolkrabbi/kol-icons 0.5.0 → 0.6.1
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/README.md +8 -0
- package/package.json +1 -1
- package/src/Icon.jsx +14 -15
- package/src/kol-icon-set-v1/playback/pause.svg +4 -0
- package/src/kol-icon-set-v1/playback/play.svg +3 -0
- package/src/kol-icon-set-v1/playback/skip-back.svg +3 -0
- package/src/kol-icon-set-v1/playback/skip-end.svg +3 -0
- package/src/kol-icon-set-v1/playback/skip-forward.svg +3 -0
- package/src/kol-icon-set-v1/playback/skip-start.svg +3 -0
- package/src/kol-icon-set-v1/shape-primitives/star-solid.svg +3 -0
- package/src/kol-icon-set-v1/tools/mode-toggle-01.svg +1 -1
- package/src/kol-icon-set-v1/tools/mode-toggle-02.svg +1 -1
package/README.md
CHANGED
|
@@ -39,3 +39,11 @@ registerIcons(import.meta.glob('./icons/**/*.svg', { eager: true, query: '?raw',
|
|
|
39
39
|
```
|
|
40
40
|
|
|
41
41
|
Registered icons are keyed by filename (basename), win over the packaged set (add **or** override), and resolve synchronously. Author them with `currentColor` so they theme.
|
|
42
|
+
|
|
43
|
+
## Tailwind v4 consumers
|
|
44
|
+
|
|
45
|
+
`Icon`'s wrapper uses Tailwind utilities (`inline-block`, `inline-flex items-center justify-center`), and Tailwind skips `node_modules` when scanning — so point it at this package's source or icon alignment breaks:
|
|
46
|
+
|
|
47
|
+
```css
|
|
48
|
+
@source "../node_modules/@kolkrabbi/kol-icons/src";
|
|
49
|
+
```
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kolkrabbi/kol-icons",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.1",
|
|
4
4
|
"description": "KOL icons — <Icon/>, the curated kol-icon-set-v1 + registerIcons (bring-your-own), and the legacy inventory. Vite-only (import.meta.glob).",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
package/src/Icon.jsx
CHANGED
|
@@ -105,22 +105,21 @@ const normalizeSize = (value) => {
|
|
|
105
105
|
return '16px'
|
|
106
106
|
}
|
|
107
107
|
|
|
108
|
+
/* Size the ROOT <svg> tag only. The old unanchored regex rewrote the first
|
|
109
|
+
* `width="…"` anywhere in the markup — on a cleaned (viewBox-only) SVG that
|
|
110
|
+
* was a path's `stroke-width`, turning the glyph into a solid blob. The
|
|
111
|
+
* lookbehind keeps `stroke-width` untouched even on the root tag. */
|
|
108
112
|
const applySizeToMarkup = (markup, sizeValue) => {
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
} else {
|
|
120
|
-
updated = updated.replace('<svg', `<svg height="${sizeValue}"`)
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
return updated
|
|
113
|
+
return markup.replace(/<svg\b[^>]*>/i, (tag) => {
|
|
114
|
+
let t = tag
|
|
115
|
+
t = /(?<![-\w])width="/i.test(t)
|
|
116
|
+
? t.replace(/(?<![-\w])width="[^"]*"/i, `width="${sizeValue}"`)
|
|
117
|
+
: t.replace('<svg', `<svg width="${sizeValue}"`)
|
|
118
|
+
t = /(?<![-\w])height="/i.test(t)
|
|
119
|
+
? t.replace(/(?<![-\w])height="[^"]*"/i, `height="${sizeValue}"`)
|
|
120
|
+
: t.replace('<svg', `<svg height="${sizeValue}"`)
|
|
121
|
+
return t
|
|
122
|
+
})
|
|
124
123
|
}
|
|
125
124
|
|
|
126
125
|
const Icon = ({
|
|
@@ -0,0 +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="M12 3L14.4 8.7L20.5 9.3L15.8 13.4L17.2 19.5L12 16.3L6.8 19.5L8.2 13.4L3.5 9.3L9.6 8.7L12 3Z" fill="currentColor" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
3
|
+
</svg>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<svg
|
|
1
|
+
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
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" stroke-linecap="round" stroke-linejoin="round"/>
|
|
3
3
|
<path d="M12 3V21" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
4
4
|
<path d="M12 8.00073H4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<svg
|
|
1
|
+
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<path d="M12 20.5C16.6944 20.5 20.5 16.6944 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5C7.30558 3.5 3.5 7.30558 3.5 12C3.5 16.6944 7.30558 20.5 12 20.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
3
3
|
<path d="M12 3.5V20.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
4
4
|
<path d="M12 7.5C13.1935 7.5 14.3381 7.97411 15.182 8.81802C16.0259 9.66193 16.5 10.8065 16.5 12C16.5 13.1935 16.0259 14.3381 15.182 15.182C14.3381 16.0259 13.1935 16.5 12 16.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|