generator-chisel 2.3.1 → 2.3.2

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 <!-- INSERT-NEW-ENTRIES-HERE -->
 
+## <small>2.3.2 (2025-12-16)</small>
+
+- make icons module optional ([94e4c6c](https://github.com/xfiveco/generator-chisel/commit/94e4c6c))
+
 ## <small>2.3.1 (2025-12-16)</small>
 
 - add wp interactivity api support, optimize css build, refactor webpack config ([319d822](https://github.com/xfiveco/generator-chisel/commit/319d822))

package/lib/commands/create/creators/app/chisel-starter-theme/inc/Helpers/ThemeHelpers.php

@@ -59,6 +59,15 @@ final class ThemeHelpers {
 		return (string) get_bloginfo( 'name' );
 	}
 
+	/**
+	 * Check if icons module should be used.
+	 *
+	 * @return bool
+	 */
+	public static function should_use_icons_module(): bool {
+		return defined( 'CHISEL_USE_ICONS_MODULE' ) && CHISEL_USE_ICONS_MODULE;
+	}
+
 	/**
 	 * Generate BEM class names with modifiers
 	 *

package/lib/commands/create/creators/app/chisel-starter-theme/inc/WP/Twig.php

@@ -81,6 +81,7 @@ final class Twig implements InstanceInterface, HooksInterface {
 		$this->register_function( $twig, 'bem', array( $this, 'bem' ) );
 		$this->register_function( $twig, 'breadcrumbs', array( $this, 'breadcrumbs' ) );
 		$this->register_function( $twig, 'get_icon', array( $this, 'get_icon' ) );
+		$this->register_function( $twig, 'should_use_icons_module', array( $this, 'should_use_icons_module' ) );
 
 		return $twig;
 	}
@@ -318,4 +319,13 @@ final class Twig implements InstanceInterface, HooksInterface {
 	public function get_icon( array $args ): string {
 		return Components::get_icon( $args );
 	}
+
+	/**
+	 * Check if icons module should be used
+	 *
+	 * @return bool
+	 */
+	public function should_use_icons_module(): bool {
+		return ThemeHelpers::should_use_icons_module();
+	}
 }

package/lib/commands/create/creators/app/chisel-starter-theme/package.chisel-tpl.json

@@ -10,6 +10,7 @@
     "devcontainer:up": "npm run --silent devcontainer -- up --workspace-folder ../../..",
     "devcontainer:enter": "/usr/bin/env bash ../../../.devcontainer/exec bash",
     "devcontainer:start": "/usr/bin/env bash ../../../.devcontainer/exec npm run --silent start",
+    "//icons-module": "Add --use-icons-module to start and build-scripts jobs to enable icons module. Also requires scss and wp-config configuration.",
     "start": "chisel-scripts start --experimental-modules",
     "dev": "npm run --silent start",
     "build-scripts": "chisel-scripts build --experimental-modules",
@@ -24,11 +25,11 @@
     "twigcs": "cross-env vendor/bin/twigcs --config=twig_cs.php"
   },
   "dependencies": {
-    "swiper": "^11.1.10"
+    "swiper": "^11.1.10",
+    "@wordpress/interactivity": "^6.36.0"
   },
   "devDependencies": {
     "@wordpress/scripts": "^31.1.0",
-    "@wordpress/interactivity": "^6.36.0",
     "chisel-scripts": "*",
     "cross-env": "^7.0.3"
   },

package/lib/commands/create/creators/app/chisel-starter-theme/src/design/settings/_icon-settings.scss

@@ -0,0 +1 @@
+/* Must be present for icons module config, whether enabled or not */

package/lib/commands/create/creators/app/chisel-starter-theme/src/design/settings/_index.scss

@@ -1,7 +1,14 @@
 @use '../tools/theme' as *;
 
+/*
+ * Settings
+ */
 $scrollbar-width: 15px;
 $root-font-size: 16px;
+
+/*
+ * Layout settings
+ */
 $breakpoints: (
   small: 480px,
   msmall: 640px,
@@ -22,5 +29,13 @@ $gaps: (
   'xlarge': get-gap('xlarge'),
   'big': get-gap('big'),
 );
+
+/*
+ * Icons
+ */
 $static-icons: ('minus', 'plus', 'arrow-right', 'arrow-left');
 $animated-icons: ('loader');
+$multicolor-icons: ();
+
+// Icons module. Also requires packacke.json and wp-config configuration.
+$use-icons-module: false;

package/lib/commands/create/creators/app/chisel-starter-theme/src/design/tools/_icon.scss

@@ -1,5 +1,7 @@
 @use 'sass:map';
+@use 'sass:list';
 @use '../settings/icon-settings' as *;
+@use '../settings/' as *;
 
 @mixin icon-svg($name, $multicolor: false, $animated: false) {
   display: block;
@@ -8,17 +10,31 @@
   content: '';
 
   $icons-path: '../../assets/icons';
+  $icon-path: null;
+
+  @if $use-icons-module {
+    $icon-path: '#{$icons-path}/icons.svg#icon-#{$name}-view';
+  } @else {
+    $icon-path: '#{$icons-path}-source/#{$name}.svg';
+  }
 
   @if $multicolor {
-    background-image: url('#{$icons-path}/icons.svg#icon-#{$name}-view');
+    @if list.index($multicolor-icons, $name) {
+      background-image: url($icon-path);
+    }
+
     background-repeat: no-repeat;
     background-size: contain;
   } @else {
     background-color: var(--o-icon-color, currentcolor);
     @if $animated {
-      mask: url('#{$icons-path}/animated/#{$name}.svg');
+      @if list.index($animated-icons, $name) {
+        mask: url('#{$icons-path}/animated/#{$name}.svg');
+      }
     } @else {
-      mask: url('#{$icons-path}/icons.svg#icon-#{$name}-view');
+      @if list.index($static-icons, $name) {
+        mask: url($icon-path);
+      }
     }
 
     mask-repeat: no-repeat;
@@ -26,7 +42,7 @@
     mask-size: contain;
   }
 
-  @if map.has-key($o-icon-icons, 'icon-#{$name}') {
+  @if $use-icons-module and map.has-key($o-icon-icons, 'icon-#{$name}') {
     width: map.get($o-icon-icons, 'icon-#{$name}') * 1em;
   } @else {
     width: 1em;

package/lib/commands/create/creators/app/chisel-starter-theme/src/styles/objects/_icon.scss

@@ -31,9 +31,11 @@ $_animated-icons: settings.$animated-icons;
     display: inline-flex;
   }
 
-  @each $icon, $width-ratio in $o-icon-icons {
-    &--#{$icon} {
-      width: $width-ratio * 1em;
+  @if settings.$use-icons-module {
+    @each $icon, $width-ratio in $o-icon-icons {
+      &--#{$icon} {
+        width: $width-ratio * 1em;
+      }
     }
   }
 

package/lib/commands/create/creators/app/chisel-starter-theme/views/objects/icon.twig

@@ -14,9 +14,15 @@ color: string // css color for the icon
 {% set inline_class = inline ? 'o-icon--inline' : '' %}
 {% set icon_variant_class = is_color ? 'o-icon--color' : 'o-icon--mono' %}
 {% set rectangle_class = rectangle ? 'o-icon--icon-' ~ name : '' %}
-{% set icon_prefix = 'icon-' %}
-{% set icon_name = icon_prefix ~ name %}
-{% set icon_path = fn('get_template_directory_uri') ~ '/assets/icons/icons.svg' ~ '#' ~ icon_name ~ '-view' %}
+
+{% if should_use_icons_module() %}
+  {% set icon_prefix = 'icon-' %}
+  {% set icon_name = icon_prefix ~ name %}
+  {% set icon_path = fn('get_template_directory_uri') ~ '/assets/icons/icons.svg' ~ '#' ~ icon_name ~ '-view' %}
+{% else %}
+  {% set icon_path = fn('get_template_directory_uri') ~ '/assets/icons-source/' ~ name ~ '.svg' %}
+{% endif %}
+
 {% set bg_style_variant = is_color ? 'background-image' : 'mask-image' %}
 {% set color_style_variant = is_css ? 'color' : 'color' %}
 {% set color_style = color ? color_style_variant ~ ': ' ~ color ~ ';' : '' %}

package/lib/commands/create/packages-versions.js

@@ -1,5 +1,5 @@
 module.exports = {
-  'chisel-scripts': '2.1.1',
+  'chisel-scripts': '2.1.2',
   'chisel-shared-utils': '2.0.0-alpha.1',
-  'generator-chisel': '2.3.1',
+  'generator-chisel': '2.3.2',
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "generator-chisel",
-  "version": "2.3.1",
+  "version": "2.3.2",
   "description": "A generator for scaffolding front-end and WordPress projects",
   "bin": {
     "chisel": "bin/chisel.js"
@@ -37,5 +37,5 @@
     "tinyqueue": "^2.0.3",
     "update-notifier": "^4.1.0"
   },
-  "gitHead": "eeef8803f7213be257ef9a48b02a1dc1790d2409"
+  "gitHead": "54768b8dd93e3773c3659f28445c9c6d76a2819c"
 }