From 694e870eb3b45817ca3c8af15f9eaf7d5d560c8e Mon Sep 17 00:00:00 2001 From: SmashinFries Date: Sun, 9 Aug 2026 14:52:21 -0500 Subject: [PATCH 1/3] Update elevation color logic in PaperColorAdapter --- .../paper-color-adapter/PaperColorAdapter.ts | 71 +++++-------------- 1 file changed, 17 insertions(+), 54 deletions(-) diff --git a/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts b/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts index c278c01..15c85b8 100644 --- a/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts +++ b/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts @@ -124,6 +124,7 @@ export class PaperColorAdapter implements MD3Colors { this.inversePrimary = data.colorScheme.inversePrimary this.shadow = data.colorScheme.shadow this.scrim = data.colorScheme.scrim + this.elevation = prepareElevations(data.colorScheme.primary, data.colorScheme.surface) // +++++ fix inexistence props +++++ @@ -150,33 +151,6 @@ export class PaperColorAdapter implements MD3Colors { .alpha(0.4) .rgb() .string() - - // can't figure it out - // this.elevation = { - // level0: "transparent", - // level1: blendColor( - // data.primaryPalette.tone(80), - // Color(data.primaryPalette.tone(80)).alpha(0.05).rgb().string(), - // ), - // level2: blendColor( - // data.primaryPalette.tone(80), - // Color(data.primaryPalette.tone(80)).alpha(0.08).rgb().string(), - // ), - // level3: blendColor( - // data.primaryPalette.tone(80), - // Color(data.primaryPalette.tone(80)).alpha(0.11).rgb().string(), - // ), - // level4: blendColor( - // data.primaryPalette.tone(80), - // Color(data.primaryPalette.tone(80)).alpha(0.12).rgb().string(), - // ), - // level5: blendColor( - // data.primaryPalette.tone(80), - // Color(data.primaryPalette.tone(80)).alpha(0.14).rgb().string(), - // ), - // } - - this.elevation = MD3DarkTheme.colors.elevation } else { this.surfaceDisabled = Color(data.neutralPalette.tone(10)) .alpha(0.12) @@ -191,33 +165,6 @@ export class PaperColorAdapter implements MD3Colors { this.scrim = data.neutralPalette.tone(0) this.backdrop = Color(data.neutralVariantPalette.tone(20)).alpha(0.4).rgb().string() - - // can't figure it out - // this.elevation = { - // level0: "transparent", - // level1: blendColor( - // data.primaryPalette.tone(99), - // Color(data.primaryPalette.tone(40)).alpha(0.05).rgb().string(), - // ), - // level2: blendColor( - // data.primaryPalette.tone(99), - // Color(data.primaryPalette.tone(40)).alpha(0.08).rgb().string(), - // ), - // level3: blendColor( - // data.primaryPalette.tone(99), - // Color(data.primaryPalette.tone(40)).alpha(0.11).rgb().string(), - // ), - // level4: blendColor( - // data.primaryPalette.tone(99), - // Color(data.primaryPalette.tone(40)).alpha(0.12).rgb().string(), - // ), - // level5: blendColor( - // data.primaryPalette.tone(99), - // Color(data.primaryPalette.tone(40)).alpha(0.14).rgb().string(), - // ), - // } - - this.elevation = MD3LightTheme.colors.elevation } // ----- fix inexistence props ----- @@ -226,6 +173,22 @@ export class PaperColorAdapter implements MD3Colors { } +const elevationLevels = [0.05, 0.08, 0.11, 0.12, 0.14]; +function prepareElevations(primary: string, surface: string): MD3Colors['elevation'] { + let elevations: Record = { + level0: 'transparent', + } + + for (let i = 0; i < elevationLevels.length; i++) { + elevations[`level${i + 1}`] = Color(surface) + .mix(Color(primary), Number(elevationLevels[i])) + .rgb() + .string() + } + + return elevations as MD3Colors['elevation'] +} + // function blendColor( // backgroundHex: string, // foregroundHex: string, From 80e47919df985dbf370a57c3365c542e8244fc98 Mon Sep 17 00:00:00 2001 From: SmashinFries Date: Sun, 9 Aug 2026 14:55:41 -0500 Subject: [PATCH 2/3] Remove unused paper elevation color code --- .../paper-color-adapter/PaperColorAdapter.ts | 29 ------------------- 1 file changed, 29 deletions(-) diff --git a/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts b/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts index 15c85b8..2e6aada 100644 --- a/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts +++ b/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts @@ -1,10 +1,6 @@ // from react-native-paper import Color from "color" -// import { -// normal as normalBlend, -// } from "color-blend" - import { MD3DarkTheme, MD3LightTheme, @@ -188,28 +184,3 @@ function prepareElevations(primary: string, surface: string): MD3Colors['elevati return elevations as MD3Colors['elevation'] } - -// function blendColor( -// backgroundHex: string, -// foregroundHex: string, -// ) { -// const bg = Color(backgroundHex) -// const fg = Color(foregroundHex) - -// const blended = normalBlend( -// { -// r: bg.red(), -// g: bg.green(), -// b: bg.blue(), -// a: bg.alpha(), -// }, -// { -// r: fg.red(), -// g: fg.green(), -// b: fg.blue(), -// a: fg.alpha(), -// }, -// ) - -// return Color.rgb(blended.r, blended.g, blended.b).string() -// } From c8754ce2f9f8c6ce913b46dc368d7bb33f03da3e Mon Sep 17 00:00:00 2001 From: RakaDoank Date: Mon, 10 Aug 2026 09:12:03 +0700 Subject: [PATCH 3/3] remove unused imported types --- .../modules/paper-color-adapter/PaperColorAdapter.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts b/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts index 2e6aada..0373160 100644 --- a/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts +++ b/package/src/subpaths/react-native-paper/modules/paper-color-adapter/PaperColorAdapter.ts @@ -2,8 +2,6 @@ import Color from "color" import { - MD3DarkTheme, - MD3LightTheme, type MD3Theme, } from "react-native-paper"