github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-09-10 22:19:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

🐛 Fix theme problem after update (#9955)

Browse Source
This commit is contained in:
Alonso Torres 2026-06-09 11:17:06 +02:00 committed by GitHub
parent facea16444
commit d249fd106a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 37 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
plugins/apps/colors-to-tokens-plugin/src/app/app.component.ts
View File

@ -1,6 +1,5 @@
import { Component, effect, inject, linkedSignal } from '@angular/core'; import { Component, effect, linkedSignal } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop'; import { toSignal } from '@angular/core/rxjs-interop';
import { ActivatedRoute } from '@angular/router';
import type { import type {
PluginMessageEvent, PluginMessageEvent,
PluginUIEvent, PluginUIEvent,
@ -8,7 +7,7 @@ import type {
SetColorsPluginEvent, SetColorsPluginEvent,
TokenFileExtraData, TokenFileExtraData,
} from '../model'; } from '../model';
import { filter, fromEvent, map, merge, take } from 'rxjs'; import { filter, fromEvent, map, merge, of } from 'rxjs';
import { transformToToken } from './utils/transform-to-token'; import { transformToToken } from './utils/transform-to-token';
import { SvgComponent } from './components/svg.component'; import { SvgComponent } from './components/svg.component';
@ -70,14 +69,11 @@ import { SvgComponent } from './components/svg.component';
}, },
}) })
export class AppComponent { export class AppComponent {
route = inject(ActivatedRoute);
messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message'); messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message');
initialTheme$ = this.route.queryParamMap.pipe( initialTheme$ = of(
map((params) => params.get('theme')), new URLSearchParams(window.location.search).get('theme'),
filter((theme) => !!theme), ).pipe(filter((theme) => !!theme));
take(1),
);
theme = toSignal( theme = toSignal(
merge( merge(

19
plugins/apps/contrast-plugin/src/app/app.component.ts
View File

@ -1,17 +1,11 @@
import { import { ChangeDetectionStrategy, Component, computed } from '@angular/core';
ChangeDetectionStrategy,
Component,
computed,
inject,
} from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop'; import { toSignal } from '@angular/core/rxjs-interop';
import { ActivatedRoute } from '@angular/router';
import type { import type {
PluginMessageEvent, PluginMessageEvent,
PluginUIEvent, PluginUIEvent,
ThemePluginEvent, ThemePluginEvent,
} from '../model'; } from '../model';
import { filter, fromEvent, map, merge, take } from 'rxjs'; import { filter, fromEvent, map, merge, of } from 'rxjs';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { Shape } from '@penpot/plugin-types'; import { Shape } from '@penpot/plugin-types';
@ -118,14 +112,11 @@ import { Shape } from '@penpot/plugin-types';
changeDetection: ChangeDetectionStrategy.OnPush, changeDetection: ChangeDetectionStrategy.OnPush,
}) })
export class AppComponent { export class AppComponent {
#route = inject(ActivatedRoute);
#messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message'); #messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message');
#initialTheme$ = this.#route.queryParamMap.pipe( #initialTheme$ = of(
map((params) => params.get('theme')), new URLSearchParams(window.location.search).get('theme'),
filter((theme) => !!theme), ).pipe(filter((theme) => !!theme));
take(1),
);
selection = toSignal( selection = toSignal(
this.#messages$.pipe( this.#messages$.pipe(

15
plugins/apps/icons-plugin/src/app/app.component.ts
View File

@ -1,10 +1,10 @@
import { Component, inject, signal } from '@angular/core'; import { Component, signal } from '@angular/core';
import { ActivatedRoute, RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { FeatherIconNames, icons } from 'feather-icons'; import { FeatherIconNames, icons } from 'feather-icons';
import { IconButtonComponent } from './components/icon-button/icon-button.component'; import { IconButtonComponent } from './components/icon-button/icon-button.component';
import { IconSearchComponent } from './components/icon-search/icon-search.component'; import { IconSearchComponent } from './components/icon-search/icon-search.component';
import { toSignal } from '@angular/core/rxjs-interop'; import { toSignal } from '@angular/core/rxjs-interop';
import { filter, fromEvent, map, merge, take } from 'rxjs'; import { filter, fromEvent, map, merge, of } from 'rxjs';
import { PluginMessageEvent } from '../model'; import { PluginMessageEvent } from '../model';
@Component({ @Component({
@ -36,7 +36,6 @@ import { PluginMessageEvent } from '../model';
}, },
}) })
export class AppComponent { export class AppComponent {
public route = inject(ActivatedRoute);
public icons = signal(icons); public icons = signal(icons);
public iconKeys = signal(Object.keys(icons) as FeatherIconNames[]); public iconKeys = signal(Object.keys(icons) as FeatherIconNames[]);
public messages$ = fromEvent<MessageEvent<PluginMessageEvent>>( public messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(
@ -44,11 +43,9 @@ export class AppComponent {
'message', 'message',
); );
public initialTheme$ = this.route.queryParamMap.pipe( public initialTheme$ = of(
map((params) => params.get('theme')), new URLSearchParams(window.location.search).get('theme'),
filter((theme) => !!theme), ).pipe(filter((theme) => !!theme));
take(1),
);
public theme = toSignal( public theme = toSignal(
merge( merge(

14
plugins/apps/lorem-ipsum-plugin/src/app/app.component.ts
View File

@ -1,13 +1,12 @@
import { Component, inject } from '@angular/core'; import { Component } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop'; import { toSignal } from '@angular/core/rxjs-interop';
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
import { ActivatedRoute } from '@angular/router';
import type { import type {
GenerationTypes, GenerationTypes,
PluginMessageEvent, PluginMessageEvent,
PluginUIEvent, PluginUIEvent,
} from '../model'; } from '../model';
import { filter, fromEvent, map, merge, take } from 'rxjs'; import { filter, fromEvent, map, merge, of } from 'rxjs';
@Component({ @Component({
imports: [ReactiveFormsModule], imports: [ReactiveFormsModule],
@ -67,14 +66,11 @@ import { filter, fromEvent, map, merge, take } from 'rxjs';
}, },
}) })
export class AppComponent { export class AppComponent {
route = inject(ActivatedRoute);
messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message'); messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message');
initialTheme$ = this.route.queryParamMap.pipe( initialTheme$ = of(
map((params) => params.get('theme')), new URLSearchParams(window.location.search).get('theme'),
filter((theme) => !!theme), ).pipe(filter((theme) => !!theme));
take(1),
);
theme = toSignal( theme = toSignal(
merge( merge(

15
plugins/apps/poc-tokens-plugin/src/app/app.component.ts
View File

@ -1,7 +1,6 @@
import { Component, inject } from '@angular/core'; import { Component } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop'; import { toSignal } from '@angular/core/rxjs-interop';
import { ActivatedRoute } from '@angular/router'; import { fromEvent, map, filter, merge, of } from 'rxjs';
import { fromEvent, map, filter, take, merge } from 'rxjs';
import { PluginMessageEvent, PluginUIEvent } from '../model'; import { PluginMessageEvent, PluginUIEvent } from '../model';
type TokenTheme = { type TokenTheme = {
@ -39,18 +38,14 @@ type TokensGroup = [string, Token[]];
}, },
}) })
export class AppComponent { export class AppComponent {
public route = inject(ActivatedRoute);
public messages$ = fromEvent<MessageEvent<PluginMessageEvent>>( public messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(
window, window,
'message', 'message',
); );
public initialTheme$ = this.route.queryParamMap.pipe( public initialTheme$ = of(
map((params) => params.get('theme')), new URLSearchParams(window.location.search).get('theme'),
filter((theme) => !!theme), ).pipe(filter((theme) => !!theme));
take(1),
);
public theme = toSignal( public theme = toSignal(
merge( merge(

15
plugins/apps/rename-layers-plugin/src/app/app.component.ts
View File

@ -1,5 +1,5 @@
import { Component, ElementRef, ViewChild, inject } from '@angular/core'; import { Component, ElementRef, ViewChild } from '@angular/core';
import { ActivatedRoute, RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { toSignal } from '@angular/core/rxjs-interop'; import { toSignal } from '@angular/core/rxjs-interop';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import type { import type {
@ -7,7 +7,7 @@ import type {
ReplaceText, ReplaceText,
ThemePluginEvent, ThemePluginEvent,
} from '../app/model'; } from '../app/model';
import { filter, fromEvent, map, merge, take } from 'rxjs'; import { filter, fromEvent, map, merge, of } from 'rxjs';
import { FormsModule } from '@angular/forms'; import { FormsModule } from '@angular/forms';
import { Shape } from '@penpot/plugin-types'; import { Shape } from '@penpot/plugin-types';
@ -24,7 +24,6 @@ export class AppComponent {
@ViewChild('searchElement') public searchElement!: ElementRef; @ViewChild('searchElement') public searchElement!: ElementRef;
@ViewChild('addElement') public addElement!: ElementRef; @ViewChild('addElement') public addElement!: ElementRef;
route = inject(ActivatedRoute);
messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message'); messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message');
public textToReplace: ReplaceText = { public textToReplace: ReplaceText = {
search: '', search: '',
@ -38,11 +37,9 @@ export class AppComponent {
this.sendMessage({ type: 'ready' }); this.sendMessage({ type: 'ready' });
} }
initialTheme$ = this.route.queryParamMap.pipe( initialTheme$ = of(
map((params) => params.get('theme')), new URLSearchParams(window.location.search).get('theme'),
filter((theme) => !!theme), ).pipe(filter((theme) => !!theme));
take(1),
);
theme = toSignal( theme = toSignal(
merge( merge(

13
plugins/apps/table-plugin/src/app/app.component.ts
View File

@ -1,5 +1,5 @@
import { Component, inject } from '@angular/core'; import { Component, inject } from '@angular/core';
import { ActivatedRoute, RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop'; import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
import type { import type {
@ -8,7 +8,7 @@ import type {
TableConfigEvent, TableConfigEvent,
TableOptions, TableOptions,
} from '../app/model'; } from '../app/model';
import { filter, fromEvent, map, merge, take } from 'rxjs'; import { filter, fromEvent, map, merge, of, take } from 'rxjs';
import { FormBuilder, ReactiveFormsModule, FormGroup } from '@angular/forms'; import { FormBuilder, ReactiveFormsModule, FormGroup } from '@angular/forms';
@Component({ @Component({
@ -37,14 +37,11 @@ export class AppComponent {
alternateRows: [false], alternateRows: [false],
}); });
route = inject(ActivatedRoute);
messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message'); messages$ = fromEvent<MessageEvent<PluginMessageEvent>>(window, 'message');
initialTheme$ = this.route.queryParamMap.pipe( initialTheme$ = of(
map((params) => params.get('theme')), new URLSearchParams(window.location.search).get('theme'),
filter((theme) => !!theme), ).pipe(filter((theme) => !!theme));
take(1),
);
theme = toSignal( theme = toSignal(
merge( merge(