@kolkrabbi/kol-icons 0.59.0 → 0.61.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.
- package/package.json +2 -2
- package/src/Icon.jsx +13 -1
- package/src/kol-icon-set-interface/design/highlighter.svg +3 -0
- package/src/kol-icon-set-interface/files/inbox.svg +3 -0
- package/src/kol-icon-set-interface/shapes/diamond-plus.svg +3 -0
- package/src/kol-icon-set-interface/typography/lockup.svg +3 -0
package/package.json
CHANGED
package/src/Icon.jsx
CHANGED
|
@@ -6,6 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* @param {Object} props
|
|
8
8
|
* @param {string} props.name - Icon name (matches SVG filename without extension)
|
|
9
|
+
* @param {'outline'|'solid'} props.variant - solid renders the name's `-solid` twin when it ships one (default: outline)
|
|
9
10
|
* @param {number|string} props.size - Icon size (default: 16)
|
|
10
11
|
* @param {string} props.className - Additional classes
|
|
11
12
|
* @param {Object} props.style - Inline styles
|
|
@@ -154,13 +155,24 @@ const applySizeToMarkup = (markup, sizeValue) => {
|
|
|
154
155
|
})
|
|
155
156
|
}
|
|
156
157
|
|
|
158
|
+
/* VARIANT (2026-11-01, user: "ONE cloud storm component with said variants"): a solid twin is the outline's
|
|
159
|
+
* `variant="solid"` — `<Icon name="cloud-storm" variant="solid" />` renders `cloud-storm-solid`. A name with no
|
|
160
|
+
* solid twin renders its outline, so a variant never blanks an icon. The `-solid` names keep resolving. */
|
|
161
|
+
const withVariant = (name, variant) => {
|
|
162
|
+
if (variant !== 'solid' || !name || name.endsWith('-solid')) return name
|
|
163
|
+
const solid = `${RENAMED_ICONS[name] ?? name}-solid`
|
|
164
|
+
return setOf(solid) || CUSTOM[solid] ? solid : name
|
|
165
|
+
}
|
|
166
|
+
|
|
157
167
|
const Icon = ({
|
|
158
|
-
name,
|
|
168
|
+
name: baseName,
|
|
169
|
+
variant = 'outline',
|
|
159
170
|
size = 16,
|
|
160
171
|
className = '',
|
|
161
172
|
style = {},
|
|
162
173
|
children
|
|
163
174
|
}) => {
|
|
175
|
+
const name = withVariant(baseName, variant)
|
|
164
176
|
const ready = useIconsReady(RENAMED_ICONS[name] ?? name)
|
|
165
177
|
|
|
166
178
|
// If children are provided, render directly (for custom icons)
|
|
@@ -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="M13.25 9.5H18.25M13.25 12H18.25M13.25 14.5H17M6.375 7.625H10.75V16.375H6.375V7.625Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
3
|
+
</svg>
|