@vettvangur/design-system 2.0.76 → 2.0.78

package/dist/index.js

@@ -4112,6 +4112,16 @@ function renderTheme(lines) {
   return `@theme {\n${lines.join('\n')}\n}\n`;
 }
 
+/**
+ * Render utilities.
+ *
+ * @param blocks - Value.
+ * @returns String result.
+ */
+function renderUtilities(blocks) {
+  return blocks.length ? `${blocks.join('\n\n')}\n` : '';
+}
+
 /**
  * Generate shadows.
  *
@@ -4127,19 +4137,21 @@ function renderTheme(lines) {
  */
 async function generateShadows(variableSet, config) {
   message('generating shadows...');
-  const lines = [];
+  const themeLines = [];
+  const utilityBlocks = [];
   for (const [rawKey, token] of Object.entries(variableSet || {})) {
     const key = toShadowKey(rawKey);
     const value = buildShadowValue(token?.effects);
     if (!value) {
       continue;
     }
-    lines.push(`  --${key}: ${value};`);
+    themeLines.push(`  --${key}: ${value};`);
+    utilityBlocks.push(`@utility ${key} {\n  box-shadow: var(--${key});\n}`);
   }
-  const css = `/* AUTO-GENERATED - DO NOT EDIT BY HAND */\n\n${renderTheme(lines)}`;
+  const css = `/* AUTO-GENERATED - DO NOT EDIT BY HAND */\n\n${renderTheme(themeLines)}\n${renderUtilities(utilityBlocks)}`;
   const outPath = path.join(config.paths.styles, 'config', 'shadow.css');
   await fs$1.writeFile(outPath, css, 'utf8');
-  message(`finished generating shadows (${lines.length})`);
+  message(`finished generating shadows (${themeLines.length})`);
 }
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vettvangur/design-system",
-  "version": "2.0.76",
+  "version": "2.0.78",
   "description": "",
   "access": "public",
   "type": "module",