@guajiritos/theme-picker 18.0.2 → 18.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/README.md +24 -24
  2. package/esm2022/lib/material-theme-picker.component.mjs +134 -134
  3. package/esm2022/lib/models/models.mjs +13 -1
  4. package/esm2022/public-api.mjs +1 -1
  5. package/fesm2022/guajiritos-theme-picker.mjs +145 -133
  6. package/fesm2022/guajiritos-theme-picker.mjs.map +1 -1
  7. package/lib/models/models.d.ts +3 -1
  8. package/package.json +1 -1
  9. package/palettes.scss +608 -540
  10. package/theme.scss +129 -111
package/fesm2022/guajiritos-theme-picker.mjs CHANGED
@@ -39,6 +39,8 @@ var GUAJIRITOS_PALETTE;
39
39
  GUAJIRITOS_PALETTE["JELLY_BEAN_BLUE"] = "jelly-bean-blue";
40
40
  GUAJIRITOS_PALETTE["GUAJIPAY"] = "guajipay";
41
41
  GUAJIRITOS_PALETTE["DARK"] = "dark";
42
+ GUAJIRITOS_PALETTE["LIGHT_MAGENTA"] = "light-magenta";
43
+ GUAJIRITOS_PALETTE["DARK_GRAY"] = "dark-gray";
42
44
  })(GUAJIRITOS_PALETTE || (GUAJIRITOS_PALETTE = {}));
43
45
  const PALETTES = [
44
46
  {
@@ -120,6 +122,16 @@ const PALETTES = [
120
122
  name: 'Guajipay',
121
123
  palette: GUAJIRITOS_PALETTE.GUAJIPAY,
122
124
  show: true
125
+ },
126
+ {
127
+ name: 'Light Magenta',
128
+ palette: GUAJIRITOS_PALETTE.LIGHT_MAGENTA,
129
+ show: true
130
+ },
131
+ {
132
+ name: 'Dark Gray',
133
+ palette: GUAJIRITOS_PALETTE.DARK_GRAY,
134
+ show: true
123
135
  }
124
136
  ];
125
137
 
@@ -141,64 +153,64 @@ class GuajiritosThemePickerMenu {
141
153
  selectPalette(palette) {
142
154
  this.paletteChanged.emit(palette);
143
155
  }
144
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: GuajiritosThemePickerMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
145
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: GuajiritosThemePickerMenu, isStandalone: true, selector: "guajiritos-theme-picker-menu", inputs: { color: "color", activePalettes: "activePalettes" }, outputs: { paletteChanged: "paletteChanged" }, ngImport: i0, template: `
146
- <button mat-icon-button [matMenuTriggerFor]="menu" aria-label="theme picker" [color]="color">
147
- <mat-icon>format_color_fill</mat-icon>
148
- </button>
149
- <mat-menu #menu="matMenu">
150
- @for (palette of menuPalettes(); track palette.palette) {
151
- @if (palette.show) {
152
- <button mat-menu-item (click)="selectPalette(palette)">
153
- <div class="guajiritos-theme-item">
154
- <span>{{ palette.name }}</span>
155
- <svg width="80" height="80" viewBox="0 0 80 80" [class]="palette.palette">
156
- <path
157
- d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
158
- fill="#fffbff"></path>
159
- <path
160
- d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
161
- fill="" class="svg-color"></path>
162
- <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
163
- </svg>
164
- </div>
165
- </button>
166
- }
167
- }
168
- </mat-menu>
156
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuajiritosThemePickerMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
157
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: GuajiritosThemePickerMenu, isStandalone: true, selector: "guajiritos-theme-picker-menu", inputs: { color: "color", activePalettes: "activePalettes" }, outputs: { paletteChanged: "paletteChanged" }, ngImport: i0, template: `
158
+ <button mat-icon-button [matMenuTriggerFor]="menu" aria-label="theme picker" [color]="color">
159
+ <mat-icon>format_color_fill</mat-icon>
160
+ </button>
161
+ <mat-menu #menu="matMenu">
162
+ @for (palette of menuPalettes(); track palette.palette) {
163
+ @if (palette.show) {
164
+ <button mat-menu-item (click)="selectPalette(palette)">
165
+ <div class="guajiritos-theme-item">
166
+ <span>{{ palette.name }}</span>
167
+ <svg width="80" height="80" viewBox="0 0 80 80" [class]="palette.palette">
168
+ <path
169
+ d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
170
+ fill="#fffbff"></path>
171
+ <path
172
+ d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
173
+ fill="" class="svg-color"></path>
174
+ <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
175
+ </svg>
176
+ </div>
177
+ </button>
178
+ }
179
+ }
180
+ </mat-menu>
169
181
  `, isInline: true, styles: [".guajiritos-theme-item{display:flex;justify-content:space-between;align-items:center;gap:1rem}.guajiritos-theme-item svg{width:24px;height:24px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }] }); }
170
182
  }
171
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: GuajiritosThemePickerMenu, decorators: [{
183
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuajiritosThemePickerMenu, decorators: [{
172
184
  type: Component,
173
185
  args: [{ selector: 'guajiritos-theme-picker-menu', standalone: true, imports: [
174
186
  CommonModule,
175
187
  MatIconModule,
176
188
  MatMenuModule,
177
189
  MatButtonModule
178
- ], template: `
179
- <button mat-icon-button [matMenuTriggerFor]="menu" aria-label="theme picker" [color]="color">
180
- <mat-icon>format_color_fill</mat-icon>
181
- </button>
182
- <mat-menu #menu="matMenu">
183
- @for (palette of menuPalettes(); track palette.palette) {
184
- @if (palette.show) {
185
- <button mat-menu-item (click)="selectPalette(palette)">
186
- <div class="guajiritos-theme-item">
187
- <span>{{ palette.name }}</span>
188
- <svg width="80" height="80" viewBox="0 0 80 80" [class]="palette.palette">
189
- <path
190
- d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
191
- fill="#fffbff"></path>
192
- <path
193
- d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
194
- fill="" class="svg-color"></path>
195
- <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
196
- </svg>
197
- </div>
198
- </button>
199
- }
200
- }
201
- </mat-menu>
190
+ ], template: `
191
+ <button mat-icon-button [matMenuTriggerFor]="menu" aria-label="theme picker" [color]="color">
192
+ <mat-icon>format_color_fill</mat-icon>
193
+ </button>
194
+ <mat-menu #menu="matMenu">
195
+ @for (palette of menuPalettes(); track palette.palette) {
196
+ @if (palette.show) {
197
+ <button mat-menu-item (click)="selectPalette(palette)">
198
+ <div class="guajiritos-theme-item">
199
+ <span>{{ palette.name }}</span>
200
+ <svg width="80" height="80" viewBox="0 0 80 80" [class]="palette.palette">
201
+ <path
202
+ d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
203
+ fill="#fffbff"></path>
204
+ <path
205
+ d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
206
+ fill="" class="svg-color"></path>
207
+ <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
208
+ </svg>
209
+ </div>
210
+ </button>
211
+ }
212
+ }
213
+ </mat-menu>
202
214
  `, styles: [".guajiritos-theme-item{display:flex;justify-content:space-between;align-items:center;gap:1rem}.guajiritos-theme-item svg{width:24px;height:24px}\n"] }]
203
215
  }], propDecorators: { color: [{
204
216
  type: Input
@@ -249,56 +261,56 @@ class GuajiritosThemePicker {
249
261
  this.propagateChange(this.emitOnlyPalette ? $event.option.value?.palette : $event.option.value);
250
262
  }
251
263
  }
252
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: GuajiritosThemePicker, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
253
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: GuajiritosThemePicker, isStandalone: true, selector: "guajiritos-theme-picker", inputs: { appearance: "appearance", color: "color", subscriptSizing: "subscriptSizing", floatLabelType: "floatLabelType", requireSelection: "requireSelection", label: "label", height: "height", width: "width", emitOnlyPalette: "emitOnlyPalette" }, providers: [
264
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuajiritosThemePicker, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
265
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: GuajiritosThemePicker, isStandalone: true, selector: "guajiritos-theme-picker", inputs: { appearance: "appearance", color: "color", subscriptSizing: "subscriptSizing", floatLabelType: "floatLabelType", requireSelection: "requireSelection", label: "label", height: "height", width: "width", emitOnlyPalette: "emitOnlyPalette" }, providers: [
254
266
  {
255
267
  provide: NG_VALUE_ACCESSOR,
256
268
  useExisting: forwardRef(() => GuajiritosThemePicker),
257
269
  multi: true
258
270
  }
259
- ], ngImport: i0, template: `
260
- <div class="guajiritos-theme-picker">
261
- <mat-form-field class="w-100" [appearance]="appearance" [color]="color" [floatLabel]="floatLabelType"
262
- [subscriptSizing]="subscriptSizing">
263
- <mat-label>{{ label | translate }}</mat-label>
264
- <input type="text" matInput [formControl]="form" [matAutocomplete]="auto">
265
- <mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn" (optionSelected)="optionSelected($event)"
266
- [requireSelection]="requireSelection">
267
- @for (palette of PALETTES; track palette.palette) {
268
- <mat-option [value]="palette">
269
- <div class="guajiritos-theme-item w-100">
270
- <svg width="80" height="80" viewBox="0 0 80 80" [class]="palette.palette">
271
- <path
272
- d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
273
- fill="#fffbff"></path>
274
- <path
275
- d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
276
- fill="" class="svg-color"></path>
277
- <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
278
- </svg>
279
- <span>{{ palette.name }}</span>
280
- </div>
281
- </mat-option>
282
- }
283
- </mat-autocomplete>
284
- </mat-form-field>
285
-
286
- @if (form.value?.palette) {
287
- <svg width="80" height="80" viewBox="0 0 80 80" [class]="form.value.palette"
288
- [ngStyle]="{'width': width, 'height': height}" id="activePalette">
289
- <path
290
- d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
291
- fill="#fffbff"></path>
292
- <path
293
- d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
294
- fill="" class="svg-color"></path>
295
- <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
296
- </svg>
297
- }
298
- </div>
271
+ ], ngImport: i0, template: `
272
+ <div class="guajiritos-theme-picker">
273
+ <mat-form-field class="w-100" [appearance]="appearance" [color]="color" [floatLabel]="floatLabelType"
274
+ [subscriptSizing]="subscriptSizing">
275
+ <mat-label>{{ label | translate }}</mat-label>
276
+ <input type="text" matInput [formControl]="form" [matAutocomplete]="auto">
277
+ <mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn" (optionSelected)="optionSelected($event)"
278
+ [requireSelection]="requireSelection">
279
+ @for (palette of PALETTES; track palette.palette) {
280
+ <mat-option [value]="palette">
281
+ <div class="guajiritos-theme-item w-100">
282
+ <svg width="80" height="80" viewBox="0 0 80 80" [class]="palette.palette">
283
+ <path
284
+ d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
285
+ fill="#fffbff"></path>
286
+ <path
287
+ d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
288
+ fill="" class="svg-color"></path>
289
+ <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
290
+ </svg>
291
+ <span>{{ palette.name }}</span>
292
+ </div>
293
+ </mat-option>
294
+ }
295
+ </mat-autocomplete>
296
+ </mat-form-field>
297
+
298
+ @if (form.value?.palette) {
299
+ <svg width="80" height="80" viewBox="0 0 80 80" [class]="form.value.palette"
300
+ [ngStyle]="{'width': width, 'height': height}" id="activePalette">
301
+ <path
302
+ d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
303
+ fill="#fffbff"></path>
304
+ <path
305
+ d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
306
+ fill="" class="svg-color"></path>
307
+ <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
308
+ </svg>
309
+ }
310
+ </div>
299
311
  `, isInline: true, styles: [".w-100{width:100%}.guajiritos-theme-picker{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem}.guajiritos-theme-item{display:flex;justify-content:space-between;align-items:center;gap:1rem}.guajiritos-theme-item svg{width:24px;height:24px}#activePalette{border-radius:4px;margin-bottom:2px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i6.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i6.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i8.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i10.TranslatePipe, name: "translate" }] }); }
300
312
  }
301
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: GuajiritosThemePicker, decorators: [{
313
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuajiritosThemePicker, decorators: [{
302
314
  type: Component,
303
315
  args: [{ selector: 'guajiritos-theme-picker', standalone: true, imports: [
304
316
  CommonModule,
@@ -307,46 +319,46 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImpor
307
319
  ReactiveFormsModule,
308
320
  MatInputModule,
309
321
  TranslateModule
310
- ], template: `
311
- <div class="guajiritos-theme-picker">
312
- <mat-form-field class="w-100" [appearance]="appearance" [color]="color" [floatLabel]="floatLabelType"
313
- [subscriptSizing]="subscriptSizing">
314
- <mat-label>{{ label | translate }}</mat-label>
315
- <input type="text" matInput [formControl]="form" [matAutocomplete]="auto">
316
- <mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn" (optionSelected)="optionSelected($event)"
317
- [requireSelection]="requireSelection">
318
- @for (palette of PALETTES; track palette.palette) {
319
- <mat-option [value]="palette">
320
- <div class="guajiritos-theme-item w-100">
321
- <svg width="80" height="80" viewBox="0 0 80 80" [class]="palette.palette">
322
- <path
323
- d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
324
- fill="#fffbff"></path>
325
- <path
326
- d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
327
- fill="" class="svg-color"></path>
328
- <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
329
- </svg>
330
- <span>{{ palette.name }}</span>
331
- </div>
332
- </mat-option>
333
- }
334
- </mat-autocomplete>
335
- </mat-form-field>
336
-
337
- @if (form.value?.palette) {
338
- <svg width="80" height="80" viewBox="0 0 80 80" [class]="form.value.palette"
339
- [ngStyle]="{'width': width, 'height': height}" id="activePalette">
340
- <path
341
- d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
342
- fill="#fffbff"></path>
343
- <path
344
- d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
345
- fill="" class="svg-color"></path>
346
- <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
347
- </svg>
348
- }
349
- </div>
322
+ ], template: `
323
+ <div class="guajiritos-theme-picker">
324
+ <mat-form-field class="w-100" [appearance]="appearance" [color]="color" [floatLabel]="floatLabelType"
325
+ [subscriptSizing]="subscriptSizing">
326
+ <mat-label>{{ label | translate }}</mat-label>
327
+ <input type="text" matInput [formControl]="form" [matAutocomplete]="auto">
328
+ <mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn" (optionSelected)="optionSelected($event)"
329
+ [requireSelection]="requireSelection">
330
+ @for (palette of PALETTES; track palette.palette) {
331
+ <mat-option [value]="palette">
332
+ <div class="guajiritos-theme-item w-100">
333
+ <svg width="80" height="80" viewBox="0 0 80 80" [class]="palette.palette">
334
+ <path
335
+ d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
336
+ fill="#fffbff"></path>
337
+ <path
338
+ d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
339
+ fill="" class="svg-color"></path>
340
+ <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
341
+ </svg>
342
+ <span>{{ palette.name }}</span>
343
+ </div>
344
+ </mat-option>
345
+ }
346
+ </mat-autocomplete>
347
+ </mat-form-field>
348
+
349
+ @if (form.value?.palette) {
350
+ <svg width="80" height="80" viewBox="0 0 80 80" [class]="form.value.palette"
351
+ [ngStyle]="{'width': width, 'height': height}" id="activePalette">
352
+ <path
353
+ d="M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z"
354
+ fill="#fffbff"></path>
355
+ <path
356
+ d="M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z"
357
+ fill="" class="svg-color"></path>
358
+ <path d="M0 0h80v17.24H0V0z" class="svg-color" fill=""></path>
359
+ </svg>
360
+ }
361
+ </div>
350
362
  `, providers: [
351
363
  {
352
364
  provide: NG_VALUE_ACCESSOR,
package/fesm2022/guajiritos-theme-picker.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"guajiritos-theme-picker.mjs","sources":["../../../projects/material-theme-picker/src/lib/models/models.ts","../../../projects/material-theme-picker/src/lib/material-theme-picker.component.ts","../../../projects/material-theme-picker/src/public-api.ts","../../../projects/material-theme-picker/src/guajiritos-theme-picker.ts"],"sourcesContent":["export enum GUAJIRITOS_PALETTE {\r\n OCEAN_GREEN = 'ocean-green',\r\n BRIGHT_YELLOW = 'bright-yellow',\r\n APPLE = 'apple',\r\n GREEN = 'green',\r\n DOUBAN_BLUE = 'douban-blue',\r\n BLIZZARD_BLUE = 'blizzard-blue',\r\n SASQUATCH_SOCKS = 'sasquatch-socks',\r\n SAPPHIRE = 'sapphire',\r\n ATENEO_BLUE = 'ateneo-blue',\r\n BRILLIANT_AZURE = 'brilliant-azure',\r\n DEEP_CARMINE_PINK = 'deep-carmine-pink',\r\n MUSTARD_YELLOW = 'mustard-yellow',\r\n BLUE_BOLT = 'blue-bolt',\r\n DARK_TURQUOISE = 'dark-turquoise',\r\n JELLY_BEAN_BLUE = 'jelly-bean-blue',\r\n GUAJIPAY = 'guajipay',\r\n DARK = 'dark',\r\n}\r\n\r\nexport interface GuajiritosPalette {\r\n name: string;\r\n palette: GUAJIRITOS_PALETTE;\r\n show?: boolean;\r\n}\r\n\r\nexport const PALETTES: GuajiritosPalette[] = [\r\n {\r\n name: 'Ocean Green',\r\n palette: GUAJIRITOS_PALETTE.OCEAN_GREEN,\r\n show: true\r\n },\r\n {\r\n name: 'Bright Yellow',\r\n palette: GUAJIRITOS_PALETTE.BRIGHT_YELLOW,\r\n show: true\r\n },\r\n {\r\n name: 'Apple',\r\n palette: GUAJIRITOS_PALETTE.APPLE,\r\n show: true\r\n },\r\n {\r\n name: 'Green',\r\n palette: GUAJIRITOS_PALETTE.GREEN,\r\n show: true\r\n },\r\n {\r\n name: 'Douban Blue',\r\n palette: GUAJIRITOS_PALETTE.DOUBAN_BLUE,\r\n show: true\r\n },\r\n {\r\n name: 'Blizzard Blue',\r\n palette: GUAJIRITOS_PALETTE.BLIZZARD_BLUE,\r\n show: true\r\n },\r\n {\r\n name: 'Sasquatch Socks',\r\n palette: GUAJIRITOS_PALETTE.SASQUATCH_SOCKS,\r\n show: true\r\n },\r\n {\r\n name: 'Sapphire',\r\n palette: GUAJIRITOS_PALETTE.SAPPHIRE,\r\n show: true\r\n },\r\n {\r\n name: 'Ateneo Blue',\r\n palette: GUAJIRITOS_PALETTE.ATENEO_BLUE,\r\n show: true\r\n },\r\n {\r\n name: 'Brilliant Azure',\r\n palette: GUAJIRITOS_PALETTE.BRILLIANT_AZURE,\r\n show: true\r\n },\r\n {\r\n name: 'Deep Carmine Pink',\r\n palette: GUAJIRITOS_PALETTE.DEEP_CARMINE_PINK,\r\n show: true\r\n },\r\n {\r\n name: 'Mustard Yellow',\r\n palette: GUAJIRITOS_PALETTE.MUSTARD_YELLOW,\r\n show: true\r\n },\r\n {\r\n name: 'Blue Bolt',\r\n palette: GUAJIRITOS_PALETTE.BLUE_BOLT,\r\n show: true\r\n },\r\n {\r\n name: 'Dark Turquoise',\r\n palette: GUAJIRITOS_PALETTE.DARK_TURQUOISE,\r\n show: true\r\n },\r\n {\r\n name: 'Jelly Bean Blue',\r\n palette: GUAJIRITOS_PALETTE.JELLY_BEAN_BLUE,\r\n show: true\r\n },\r\n {\r\n name: 'Guajipay',\r\n palette: GUAJIRITOS_PALETTE.GUAJIPAY,\r\n show: true\r\n }\r\n];\r\n","import {Component, EventEmitter, forwardRef, Input, Output, signal, WritableSignal} from '@angular/core';\r\nimport {MatIconModule} from \"@angular/material/icon\";\r\nimport {CommonModule} from \"@angular/common\";\r\nimport {MatMenuModule} from \"@angular/material/menu\";\r\nimport {MatButtonModule} from \"@angular/material/button\";\r\nimport {ThemePalette} from \"@angular/material/core\";\r\nimport {\r\n FloatLabelType,\r\n MatFormFieldAppearance,\r\n MatFormFieldModule,\r\n SubscriptSizing\r\n} from \"@angular/material/form-field\";\r\nimport {MatAutocompleteModule} from \"@angular/material/autocomplete\";\r\nimport {ControlValueAccessor, NG_VALUE_ACCESSOR, ReactiveFormsModule, UntypedFormControl} from \"@angular/forms\";\r\nimport {MatInputModule} from \"@angular/material/input\";\r\nimport {TranslateModule} from \"@ngx-translate/core\";\r\n\r\nimport {GUAJIRITOS_PALETTE, GuajiritosPalette, PALETTES} from './models/models';\r\n\r\n@Component({\r\n selector: 'guajiritos-theme-picker-menu',\r\n standalone: true,\r\n imports: [\r\n CommonModule,\r\n MatIconModule,\r\n MatMenuModule,\r\n MatButtonModule\r\n ],\r\n template: `\r\n <button mat-icon-button [matMenuTriggerFor]=\"menu\" aria-label=\"theme picker\" [color]=\"color\">\r\n <mat-icon>format_color_fill</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n @for (palette of menuPalettes(); track palette.palette) {\r\n @if (palette.show) {\r\n <button mat-menu-item (click)=\"selectPalette(palette)\">\r\n <div class=\"guajiritos-theme-item\">\r\n <span>{{ palette.name }}</span>\r\n <svg width=\"80\" height=\"80\" viewBox=\"0 0 80 80\" [class]=\"palette.palette\">\r\n <path\r\n d=\"M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z\"\r\n fill=\"#fffbff\"></path>\r\n <path\r\n d=\"M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z\"\r\n fill=\"\" class=\"svg-color\"></path>\r\n <path d=\"M0 0h80v17.24H0V0z\" class=\"svg-color\" fill=\"\"></path>\r\n </svg>\r\n </div>\r\n </button>\r\n }\r\n }\r\n </mat-menu>\r\n `,\r\n styles: `\r\n .guajiritos-theme-item {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: 1rem;\r\n\r\n svg {\r\n width: 24px;\r\n height: 24px;\r\n }\r\n }\r\n `\r\n})\r\nexport class GuajiritosThemePickerMenu {\r\n public menuPalettes: WritableSignal<GuajiritosPalette[]> = signal((PALETTES));\r\n\r\n @Input() color: ThemePalette;\r\n\r\n @Input() set activePalettes(palettes: GUAJIRITOS_PALETTE[]) {\r\n if (palettes?.length) {\r\n this.menuPalettes.update((patts: GuajiritosPalette[]) => {\r\n patts.forEach((palette: GuajiritosPalette): void => {\r\n palette.show = palettes.includes(palette.palette);\r\n })\r\n return patts;\r\n })\r\n }\r\n }\r\n\r\n @Output() paletteChanged = new EventEmitter<GuajiritosPalette>();\r\n\r\n public selectPalette(palette: GuajiritosPalette): void {\r\n this.paletteChanged.emit(palette);\r\n }\r\n}\r\n\r\n@Component({\r\n selector: 'guajiritos-theme-picker',\r\n standalone: true,\r\n imports: [\r\n CommonModule,\r\n MatFormFieldModule,\r\n MatAutocompleteModule,\r\n ReactiveFormsModule,\r\n MatInputModule,\r\n TranslateModule\r\n ],\r\n template: `\r\n <div class=\"guajiritos-theme-picker\">\r\n <mat-form-field class=\"w-100\" [appearance]=\"appearance\" [color]=\"color\" [floatLabel]=\"floatLabelType\"\r\n [subscriptSizing]=\"subscriptSizing\">\r\n <mat-label>{{ label | translate }}</mat-label>\r\n <input type=\"text\" matInput [formControl]=\"form\" [matAutocomplete]=\"auto\">\r\n <mat-autocomplete #auto=\"matAutocomplete\" [displayWith]=\"displayFn\" (optionSelected)=\"optionSelected($event)\"\r\n [requireSelection]=\"requireSelection\">\r\n @for (palette of PALETTES; track palette.palette) {\r\n <mat-option [value]=\"palette\">\r\n <div class=\"guajiritos-theme-item w-100\">\r\n <svg width=\"80\" height=\"80\" viewBox=\"0 0 80 80\" [class]=\"palette.palette\">\r\n <path\r\n d=\"M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z\"\r\n fill=\"#fffbff\"></path>\r\n <path\r\n d=\"M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z\"\r\n fill=\"\" class=\"svg-color\"></path>\r\n <path d=\"M0 0h80v17.24H0V0z\" class=\"svg-color\" fill=\"\"></path>\r\n </svg>\r\n <span>{{ palette.name }}</span>\r\n </div>\r\n </mat-option>\r\n }\r\n </mat-autocomplete>\r\n </mat-form-field>\r\n\r\n @if (form.value?.palette) {\r\n <svg width=\"80\" height=\"80\" viewBox=\"0 0 80 80\" [class]=\"form.value.palette\"\r\n [ngStyle]=\"{'width': width, 'height': height}\" id=\"activePalette\">\r\n <path\r\n d=\"M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z\"\r\n fill=\"#fffbff\"></path>\r\n <path\r\n d=\"M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z\"\r\n fill=\"\" class=\"svg-color\"></path>\r\n <path d=\"M0 0h80v17.24H0V0z\" class=\"svg-color\" fill=\"\"></path>\r\n </svg>\r\n }\r\n </div>\r\n `,\r\n styles: [\r\n `\r\n .w-100 {\r\n width: 100%;\r\n }\r\n\r\n .guajiritos-theme-picker {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-end;\r\n gap: 1rem;\r\n }\r\n\r\n .guajiritos-theme-item {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: 1rem;\r\n\r\n svg {\r\n width: 24px;\r\n height: 24px;\r\n }\r\n }\r\n\r\n #activePalette {\r\n border-radius: 4px;\r\n margin-bottom: 2px;\r\n }\r\n `\r\n ],\r\n providers: [\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => GuajiritosThemePicker),\r\n multi: true\r\n }\r\n ]\r\n})\r\nexport class GuajiritosThemePicker implements ControlValueAccessor {\r\n protected readonly PALETTES: GuajiritosPalette[] = PALETTES;\r\n\r\n public form: UntypedFormControl = new UntypedFormControl({value: null, disabled: false});\r\n\r\n @Input() appearance: MatFormFieldAppearance = \"outline\";\r\n @Input() color: ThemePalette = \"accent\";\r\n @Input() subscriptSizing: SubscriptSizing = \"dynamic\";\r\n @Input() floatLabelType: FloatLabelType = \"always\";\r\n @Input() requireSelection: boolean = true;\r\n\r\n @Input() label: string = 'Seleccione su tema';\r\n @Input() height: string = '44px';\r\n @Input() width: string = '44px';\r\n @Input() emitOnlyPalette: boolean = false;\r\n\r\n displayFn(palette: GuajiritosPalette): string {\r\n return palette?.name ?? '';\r\n }\r\n\r\n propagateChange = (_: any): void => {\r\n };\r\n\r\n registerOnChange(fn: (_: any) => void): void {\r\n this.propagateChange = fn;\r\n }\r\n\r\n registerOnTouched(): void {\r\n }\r\n\r\n writeValue(palette: GuajiritosPalette): void {\r\n if (palette) {\r\n this.form.setValue(palette, {emitEvent: false});\r\n }\r\n }\r\n\r\n setDisabledState(isDisabled: boolean): void {\r\n if (isDisabled) {\r\n this.form.disable();\r\n } else {\r\n this.form.enable();\r\n }\r\n }\r\n\r\n public optionSelected($event: any): void {\r\n if ($event?.option?.value) {\r\n this.propagateChange(this.emitOnlyPalette ? $event.option.value?.palette : $event.option.value);\r\n }\r\n }\r\n}\r\n","/*\r\n * Public API Surface of material-themes-picker\r\n */\r\n\r\nexport * from './lib/material-theme-picker.component';\r\nexport * from './lib/models/models';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"guajiritos-theme-picker.mjs","sources":["../../../projects/material-theme-picker/src/lib/models/models.ts","../../../projects/material-theme-picker/src/lib/material-theme-picker.component.ts","../../../projects/material-theme-picker/src/public-api.ts","../../../projects/material-theme-picker/src/guajiritos-theme-picker.ts"],"sourcesContent":["export enum GUAJIRITOS_PALETTE {\n OCEAN_GREEN = 'ocean-green',\n BRIGHT_YELLOW = 'bright-yellow',\n APPLE = 'apple',\n GREEN = 'green',\n DOUBAN_BLUE = 'douban-blue',\n BLIZZARD_BLUE = 'blizzard-blue',\n SASQUATCH_SOCKS = 'sasquatch-socks',\n SAPPHIRE = 'sapphire',\n ATENEO_BLUE = 'ateneo-blue',\n BRILLIANT_AZURE = 'brilliant-azure',\n DEEP_CARMINE_PINK = 'deep-carmine-pink',\n MUSTARD_YELLOW = 'mustard-yellow',\n BLUE_BOLT = 'blue-bolt',\n DARK_TURQUOISE = 'dark-turquoise',\n JELLY_BEAN_BLUE = 'jelly-bean-blue',\n GUAJIPAY = 'guajipay',\n DARK = 'dark',\n LIGHT_MAGENTA = 'light-magenta',\n DARK_GRAY = 'dark-gray',\n}\n\nexport interface GuajiritosPalette {\n name: string;\n palette: GUAJIRITOS_PALETTE;\n show?: boolean;\n}\n\nexport const PALETTES: GuajiritosPalette[] = [\n {\n name: 'Ocean Green',\n palette: GUAJIRITOS_PALETTE.OCEAN_GREEN,\n show: true\n },\n {\n name: 'Bright Yellow',\n palette: GUAJIRITOS_PALETTE.BRIGHT_YELLOW,\n show: true\n },\n {\n name: 'Apple',\n palette: GUAJIRITOS_PALETTE.APPLE,\n show: true\n },\n {\n name: 'Green',\n palette: GUAJIRITOS_PALETTE.GREEN,\n show: true\n },\n {\n name: 'Douban Blue',\n palette: GUAJIRITOS_PALETTE.DOUBAN_BLUE,\n show: true\n },\n {\n name: 'Blizzard Blue',\n palette: GUAJIRITOS_PALETTE.BLIZZARD_BLUE,\n show: true\n },\n {\n name: 'Sasquatch Socks',\n palette: GUAJIRITOS_PALETTE.SASQUATCH_SOCKS,\n show: true\n },\n {\n name: 'Sapphire',\n palette: GUAJIRITOS_PALETTE.SAPPHIRE,\n show: true\n },\n {\n name: 'Ateneo Blue',\n palette: GUAJIRITOS_PALETTE.ATENEO_BLUE,\n show: true\n },\n {\n name: 'Brilliant Azure',\n palette: GUAJIRITOS_PALETTE.BRILLIANT_AZURE,\n show: true\n },\n {\n name: 'Deep Carmine Pink',\n palette: GUAJIRITOS_PALETTE.DEEP_CARMINE_PINK,\n show: true\n },\n {\n name: 'Mustard Yellow',\n palette: GUAJIRITOS_PALETTE.MUSTARD_YELLOW,\n show: true\n },\n {\n name: 'Blue Bolt',\n palette: GUAJIRITOS_PALETTE.BLUE_BOLT,\n show: true\n },\n {\n name: 'Dark Turquoise',\n palette: GUAJIRITOS_PALETTE.DARK_TURQUOISE,\n show: true\n },\n {\n name: 'Jelly Bean Blue',\n palette: GUAJIRITOS_PALETTE.JELLY_BEAN_BLUE,\n show: true\n },\n {\n name: 'Guajipay',\n palette: GUAJIRITOS_PALETTE.GUAJIPAY,\n show: true\n },\n {\n name: 'Light Magenta',\n palette: GUAJIRITOS_PALETTE.LIGHT_MAGENTA,\n show: true\n },\n {\n name: 'Dark Gray',\n palette: GUAJIRITOS_PALETTE.DARK_GRAY,\n show: true\n }\n];\n","import {Component, EventEmitter, forwardRef, Input, Output, signal, WritableSignal} from '@angular/core';\nimport {MatIconModule} from \"@angular/material/icon\";\nimport {CommonModule} from \"@angular/common\";\nimport {MatMenuModule} from \"@angular/material/menu\";\nimport {MatButtonModule} from \"@angular/material/button\";\nimport {ThemePalette} from \"@angular/material/core\";\nimport {\n FloatLabelType,\n MatFormFieldAppearance,\n MatFormFieldModule,\n SubscriptSizing\n} from \"@angular/material/form-field\";\nimport {MatAutocompleteModule} from \"@angular/material/autocomplete\";\nimport {ControlValueAccessor, NG_VALUE_ACCESSOR, ReactiveFormsModule, UntypedFormControl} from \"@angular/forms\";\nimport {MatInputModule} from \"@angular/material/input\";\nimport {TranslateModule} from \"@ngx-translate/core\";\n\nimport {GUAJIRITOS_PALETTE, GuajiritosPalette, PALETTES} from './models/models';\n\n@Component({\n selector: 'guajiritos-theme-picker-menu',\n standalone: true,\n imports: [\n CommonModule,\n MatIconModule,\n MatMenuModule,\n MatButtonModule\n ],\n template: `\n <button mat-icon-button [matMenuTriggerFor]=\"menu\" aria-label=\"theme picker\" [color]=\"color\">\n <mat-icon>format_color_fill</mat-icon>\n </button>\n <mat-menu #menu=\"matMenu\">\n @for (palette of menuPalettes(); track palette.palette) {\n @if (palette.show) {\n <button mat-menu-item (click)=\"selectPalette(palette)\">\n <div class=\"guajiritos-theme-item\">\n <span>{{ palette.name }}</span>\n <svg width=\"80\" height=\"80\" viewBox=\"0 0 80 80\" [class]=\"palette.palette\">\n <path\n d=\"M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z\"\n fill=\"#fffbff\"></path>\n <path\n d=\"M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z\"\n fill=\"\" class=\"svg-color\"></path>\n <path d=\"M0 0h80v17.24H0V0z\" class=\"svg-color\" fill=\"\"></path>\n </svg>\n </div>\n </button>\n }\n }\n </mat-menu>\n `,\n styles: `\n .guajiritos-theme-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 1rem;\n\n svg {\n width: 24px;\n height: 24px;\n }\n }\n `\n})\nexport class GuajiritosThemePickerMenu {\n public menuPalettes: WritableSignal<GuajiritosPalette[]> = signal((PALETTES));\n\n @Input() color: ThemePalette;\n\n @Input() set activePalettes(palettes: GUAJIRITOS_PALETTE[]) {\n if (palettes?.length) {\n this.menuPalettes.update((patts: GuajiritosPalette[]) => {\n patts.forEach((palette: GuajiritosPalette): void => {\n palette.show = palettes.includes(palette.palette);\n })\n return patts;\n })\n }\n }\n\n @Output() paletteChanged = new EventEmitter<GuajiritosPalette>();\n\n public selectPalette(palette: GuajiritosPalette): void {\n this.paletteChanged.emit(palette);\n }\n}\n\n@Component({\n selector: 'guajiritos-theme-picker',\n standalone: true,\n imports: [\n CommonModule,\n MatFormFieldModule,\n MatAutocompleteModule,\n ReactiveFormsModule,\n MatInputModule,\n TranslateModule\n ],\n template: `\n <div class=\"guajiritos-theme-picker\">\n <mat-form-field class=\"w-100\" [appearance]=\"appearance\" [color]=\"color\" [floatLabel]=\"floatLabelType\"\n [subscriptSizing]=\"subscriptSizing\">\n <mat-label>{{ label | translate }}</mat-label>\n <input type=\"text\" matInput [formControl]=\"form\" [matAutocomplete]=\"auto\">\n <mat-autocomplete #auto=\"matAutocomplete\" [displayWith]=\"displayFn\" (optionSelected)=\"optionSelected($event)\"\n [requireSelection]=\"requireSelection\">\n @for (palette of PALETTES; track palette.palette) {\n <mat-option [value]=\"palette\">\n <div class=\"guajiritos-theme-item w-100\">\n <svg width=\"80\" height=\"80\" viewBox=\"0 0 80 80\" [class]=\"palette.palette\">\n <path\n d=\"M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z\"\n fill=\"#fffbff\"></path>\n <path\n d=\"M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z\"\n fill=\"\" class=\"svg-color\"></path>\n <path d=\"M0 0h80v17.24H0V0z\" class=\"svg-color\" fill=\"\"></path>\n </svg>\n <span>{{ palette.name }}</span>\n </div>\n </mat-option>\n }\n </mat-autocomplete>\n </mat-form-field>\n\n @if (form.value?.palette) {\n <svg width=\"80\" height=\"80\" viewBox=\"0 0 80 80\" [class]=\"form.value.palette\"\n [ngStyle]=\"{'width': width, 'height': height}\" id=\"activePalette\">\n <path\n d=\"M77.87 0C79.05 0 80 .95 80 2.13v75.74c0 1.17-.95 2.13-2.13 2.13H2.13C.96 80 0 79.04 0 77.87V2.13C0 .95.96 0 2.13 0h75.74z\"\n fill=\"#fffbff\"></path>\n <path\n d=\"M54 40c3.32 0 6 2.69 6 6 0 1.2 0-1.2 0 0 0 3.31-2.68 6-6 6H26c-3.31 0-6-2.69-6-6 0-1.2 0 1.2 0 0 0-3.31 2.69-6 6-6h28z\"\n fill=\"\" class=\"svg-color\"></path>\n <path d=\"M0 0h80v17.24H0V0z\" class=\"svg-color\" fill=\"\"></path>\n </svg>\n }\n </div>\n `,\n styles: [\n `\n .w-100 {\n width: 100%;\n }\n\n .guajiritos-theme-picker {\n display: flex;\n justify-content: space-between;\n align-items: flex-end;\n gap: 1rem;\n }\n\n .guajiritos-theme-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 1rem;\n\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n #activePalette {\n border-radius: 4px;\n margin-bottom: 2px;\n }\n `\n ],\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => GuajiritosThemePicker),\n multi: true\n }\n ]\n})\nexport class GuajiritosThemePicker implements ControlValueAccessor {\n protected readonly PALETTES: GuajiritosPalette[] = PALETTES;\n\n public form: UntypedFormControl = new UntypedFormControl({value: null, disabled: false});\n\n @Input() appearance: MatFormFieldAppearance = \"outline\";\n @Input() color: ThemePalette = \"accent\";\n @Input() subscriptSizing: SubscriptSizing = \"dynamic\";\n @Input() floatLabelType: FloatLabelType = \"always\";\n @Input() requireSelection: boolean = true;\n\n @Input() label: string = 'Seleccione su tema';\n @Input() height: string = '44px';\n @Input() width: string = '44px';\n @Input() emitOnlyPalette: boolean = false;\n\n displayFn(palette: GuajiritosPalette): string {\n return palette?.name ?? '';\n }\n\n propagateChange = (_: any): void => {\n };\n\n registerOnChange(fn: (_: any) => void): void {\n this.propagateChange = fn;\n }\n\n registerOnTouched(): void {\n }\n\n writeValue(palette: GuajiritosPalette): void {\n if (palette) {\n this.form.setValue(palette, {emitEvent: false});\n }\n }\n\n setDisabledState(isDisabled: boolean): void {\n if (isDisabled) {\n this.form.disable();\n } else {\n this.form.enable();\n }\n }\n\n public optionSelected($event: any): void {\n if ($event?.option?.value) {\n this.propagateChange(this.emitOnlyPalette ? $event.option.value?.palette : $event.option.value);\n }\n }\n}\n","/*\n * Public API Surface of material-themes-picker\n */\n\nexport * from './lib/material-theme-picker.component';\nexport * from './lib/models/models';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
package/lib/models/models.d.ts CHANGED
@@ -15,7 +15,9 @@ export declare enum GUAJIRITOS_PALETTE {
15
15
  DARK_TURQUOISE = "dark-turquoise",
16
16
  JELLY_BEAN_BLUE = "jelly-bean-blue",
17
17
  GUAJIPAY = "guajipay",
18
- DARK = "dark"
18
+ DARK = "dark",
19
+ LIGHT_MAGENTA = "light-magenta",
20
+ DARK_GRAY = "dark-gray"
19
21
  }
20
22
  export interface GuajiritosPalette {
21
23
  name: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@guajiritos/theme-picker",
3
- "version": "18.0.2",
3
+ "version": "18.0.4",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "^18.0.0",
6
6
  "@angular/core": "^18.0.0",