@kolkrabbi/kol-icons 0.59.0 → 0.60.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolkrabbi/kol-icons",
-  "version": "0.59.0",
+  "version": "0.60.0",
   "description": "The icon loader and icon sets",
   "license": "MIT",
   "type": "module",
@@ -37,4 +37,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
+}

package/src/Icon.jsx

@@ -6,6 +6,7 @@
  *
  * @param {Object} props
  * @param {string} props.name - Icon name (matches SVG filename without extension)
+ * @param {'outline'|'solid'} props.variant - solid renders the name's `-solid` twin when it ships one (default: outline)
  * @param {number|string} props.size - Icon size (default: 16)
  * @param {string} props.className - Additional classes
  * @param {Object} props.style - Inline styles
@@ -154,13 +155,24 @@ const applySizeToMarkup = (markup, sizeValue) => {
   })
 }
 
+/* VARIANT (2026-11-01, user: "ONE cloud storm component with said variants"): a solid twin is the outline's
+ * `variant="solid"` — `<Icon name="cloud-storm" variant="solid" />` renders `cloud-storm-solid`. A name with no
+ * solid twin renders its outline, so a variant never blanks an icon. The `-solid` names keep resolving. */
+const withVariant = (name, variant) => {
+  if (variant !== 'solid' || !name || name.endsWith('-solid')) return name
+  const solid = `${RENAMED_ICONS[name] ?? name}-solid`
+  return setOf(solid) || CUSTOM[solid] ? solid : name
+}
+
 const Icon = ({
-  name,
+  name: baseName,
+  variant = 'outline',
   size = 16,
   className = '',
   style = {},
   children
 }) => {
+  const name = withVariant(baseName, variant)
   const ready = useIconsReady(RENAMED_ICONS[name] ?? name)
 
   // If children are provided, render directly (for custom icons)