Add lush shadow from https://www.joshwcomeau.com/shadow-palette/

README.md

@@ -30,7 +30,6 @@ It supports non-px units like `rem`, 3 shadow types, `inset` shadows, and any co
 
 ---
 
-
 ## Usage
 
 **Step 1:** Install plugin:
@@ -60,7 +59,7 @@ module.exports = {
 
 ### CSS API
 
-The plugins supports 3 shadows types. You can try them on [`smoothshadows.com`](https://smoothshadows.com).
+The plugins supports 3 shadows types from [`smoothshadows.com`](https://smoothshadows.com).
 
 ```css
 .soft {
@@ -82,6 +81,25 @@ It also supports `inset` shadows:
 }
 ```
 
+It supports lush shadows generation from [`joshwcomeau.com/shadow-palette`](https://www.joshwcomeau.com/shadow-palette/)
+
+```css
+.low {
+  box-shadow: --lush-shadow(low -0.25 -0.5 0.5 0.5 0.75 oklch(0 0 0 / 15%));
+}
+.medium {
+  box-shadow: --lush-shadow(medium -0.25 -0.5 0.5 0.5 0.75 oklch(0 0 0 / 15%));
+}
+.high {
+  box-shadow: --lush-shadow(high -0.25 -0.5 0.5 0.5 0.75 oklch(0 0 0 / 15%));
+}
+.inset {
+  box-shadow: --lush-shadow(
+    medium inset -0.25 -0.5 0.5 0.5 0.75 oklch(0 0 0 / 15%)
+  );
+}
+```
+
 ### JS API
 
 There is low-level JS API:
@@ -92,3 +110,43 @@ import { renderShadows } from 'postcss-smooth-shadow'
 renderShadows('soft', false, '0', '0.5rem', '1rem', 'oklch(0 0 0 / 10%)')
 // => ["calc(0.111 * 0.5rem) calc(0.111 * 1rem) …", …]
 ```
+
+API for lush shadows
+
+```ts
+import { renderLushShadows } from 'postcss-smooth-shadow'
+
+const [low, medium, high] = renderLushShadows(
+  false, // inset
+  -0.25, // light-x
+  -0.5, // light-y
+  0.5, // oomph
+  0.5, // crispy
+  0.75, // resolution
+  'oklch(0 0 0 / 15%)' // color
+)
+
+low = [
+  ['0.3px 0.5px 0.7px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['0.4px 0.8px 1px -1.2px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['1px 2px 2.5px -2.5px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)']
+]
+
+medium = [
+  ['0.3px 0.5px 0.7px hsl(from oklch(0 0 0 / 15%) h s l / 0.11)'],
+  ['0.8px 1.6px 2px -0.8px hsl(from oklch(0 0 0 / 15%) h s l / 0.11)'],
+  ['2.1px 4.1px 5.2px -1.7px hsl(from oklch(0 0 0 / 15%) h s l / 0.11)'],
+  ['5px 10px 12.6px -2.5px hsl(from oklch(0 0 0 / 15%) h s l / 0.11)']
+]
+
+high = [
+  ['0.3px 0.5px 0.7px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['1.5px 2.9px 3.7px -0.4px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['2.7px 5.4px 6.8px -0.7px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['4.5px 8.9px 11.2px -1.1px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['7.1px 14.3px 18px -1.4px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['11.2px 22.3px 28.1px -1.8px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['17px 33.9px 42.7px -2.1px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)'],
+  ['25px 50px 62.9px -2.5px hsl(from oklch(0 0 0 / 15%) h s l / 0.1)']
+]
+```

index.d.ts

@@ -9,6 +9,16 @@ export function renderShadows(
   color: string
 ): string
 
+export function renderLushShadows(
+  inset: boolean,
+  lightX: number,
+  lightY: number,
+  oomph: number,
+  crispy: number,
+  resolution: number,
+  color: string
+): [string[], string[], string[]]
+
 declare const plugin: PluginCreator<{}>
 
 export default plugin

index.js

@@ -1,3 +1,5 @@
+import { renderLushShadows, replaceLushFunctions } from './src/lush.js'
+
 function easeInQuad(x) {
   return x * x
 }
@@ -121,10 +123,6 @@ function replaceFunctions(decl, func) {
   let result = decl.value
   let currentIndex = 0
 
-  if (!result.includes(searchPattern)) {
-    return
-  }
-
   let startIndex = result.indexOf(searchPattern, currentIndex)
   while (startIndex !== -1) {
     let openParenIndex = startIndex + searchPattern.length - 1
@@ -193,15 +191,27 @@ function findClosingParenAndParseParams(text, openParenIndex) {
 let plugin = () => {
   return {
     Declaration(decl) {
-      if (decl.value.includes('-shadow(')) {
+      if (decl.value.includes('--sharp-shadow(')) {
         replaceFunctions(decl, 'sharp')
+      }
+
+      if (decl.value.includes('--soft-shadow(')) {
         replaceFunctions(decl, 'soft')
+      }
+
+      if (decl.value.includes('--linear-shadow(')) {
         replaceFunctions(decl, 'linear')
       }
+
+      if (decl.value.includes('--lush-shadow(')) {
+        replaceLushFunctions(decl)
+      }
     },
     postcssPlugin: 'postcss-smooth-shadow'
   }
 }
 plugin.postcss = true
 
 export default plugin
+
+export { renderLushShadows }

package.json

@@ -49,6 +49,7 @@
     "eslint": "^9.37.0",
     "multiocular": "^0.8.1",
     "postcss": "^8.5.6",
+    "postcss-value-parser": "^4.2.0",
     "vite": "^7.1.10"
   },
   "prettier": {