@praxisui/stepper 10.0.0-rc.34 → 10.0.0-rc.36
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.
- package/ai/component-registry.json +2 -2
- package/fesm2022/praxisui-stepper.mjs +112 -108
- package/package.json +9 -9
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"schemaVersion": "1.0.0",
|
|
3
|
-
"generatedAt": "2026-10-
|
|
3
|
+
"generatedAt": "2026-10-21T13:45:30.091Z",
|
|
4
4
|
"packageName": "@praxisui/stepper",
|
|
5
|
-
"packageVersion": "10.0.0-rc.
|
|
5
|
+
"packageVersion": "10.0.0-rc.36",
|
|
6
6
|
"sourceRegistry": "praxis-component-registry-ingestion",
|
|
7
7
|
"sourceRegistryVersion": "1.0.0",
|
|
8
8
|
"componentCount": 1,
|
|
@@ -22,15 +22,17 @@ import * as i3$1 from '@angular/material/form-field';
|
|
|
22
22
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
23
23
|
import * as i4$1 from '@angular/material/input';
|
|
24
24
|
import { MatInputModule } from '@angular/material/input';
|
|
25
|
-
import * as
|
|
25
|
+
import * as i4$2 from '@angular/material/select';
|
|
26
|
+
import { MatSelectModule } from '@angular/material/select';
|
|
27
|
+
import * as i7 from '@angular/material/slide-toggle';
|
|
26
28
|
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
|
|
27
|
-
import * as
|
|
29
|
+
import * as i8 from '@angular/cdk/drag-drop';
|
|
28
30
|
import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
|
|
29
|
-
import * as
|
|
31
|
+
import * as i9 from '@angular/material/tooltip';
|
|
30
32
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
31
33
|
import * as i1$1 from '@angular/material/dialog';
|
|
32
34
|
import { MAT_DIALOG_DATA, MatDialogModule, MatDialog } from '@angular/material/dialog';
|
|
33
|
-
import * as
|
|
35
|
+
import * as i10 from '@angular/material/tabs';
|
|
34
36
|
import { MatTabsModule } from '@angular/material/tabs';
|
|
35
37
|
import { PRAXIS_LIST_COMPONENT_METADATA } from '@praxisui/list';
|
|
36
38
|
import { PraxisFilesUploadConfigEditor } from '@praxisui/files-upload';
|
|
@@ -3542,14 +3544,15 @@ class PraxisStepperConfigEditor {
|
|
|
3542
3544
|
this.onAppearanceChange();
|
|
3543
3545
|
}
|
|
3544
3546
|
get headerLabelTextWeight() {
|
|
3545
|
-
|
|
3547
|
+
const raw = this.appearance.tokens['header-label-text-weight'];
|
|
3548
|
+
return raw != null && String(raw).trim() !== '' ? String(raw).trim() : undefined;
|
|
3546
3549
|
}
|
|
3547
3550
|
setHeaderLabelTextWeight(v) {
|
|
3548
3551
|
if (!v) {
|
|
3549
3552
|
delete this.appearance.tokens['header-label-text-weight'];
|
|
3550
3553
|
}
|
|
3551
3554
|
else {
|
|
3552
|
-
this.appearance.tokens['header-label-text-weight'] = v;
|
|
3555
|
+
this.appearance.tokens['header-label-text-weight'] = String(v);
|
|
3553
3556
|
}
|
|
3554
3557
|
this.onAppearanceChange();
|
|
3555
3558
|
}
|
|
@@ -4057,32 +4060,32 @@ class PraxisStepperConfigEditor {
|
|
|
4057
4060
|
<div class="pdx-grid">
|
|
4058
4061
|
<mat-form-field appearance="outline">
|
|
4059
4062
|
<mat-label>{{ tx('editor.general.orientation', 'Orientation') }}</mat-label>
|
|
4060
|
-
<select
|
|
4061
|
-
<option value="horizontal">{{ tx('editor.general.orientation.horizontal', 'Horizontal') }}</option>
|
|
4062
|
-
<option value="vertical">{{ tx('editor.general.orientation.vertical', 'Vertical') }}</option>
|
|
4063
|
-
</select>
|
|
4063
|
+
<mat-select [(ngModel)]="config.orientation" (ngModelChange)="markDirty()">
|
|
4064
|
+
<mat-option value="horizontal">{{ tx('editor.general.orientation.horizontal', 'Horizontal') }}</mat-option>
|
|
4065
|
+
<mat-option value="vertical">{{ tx('editor.general.orientation.vertical', 'Vertical') }}</mat-option>
|
|
4066
|
+
</mat-select>
|
|
4064
4067
|
</mat-form-field>
|
|
4065
4068
|
<mat-form-field appearance="outline">
|
|
4066
4069
|
<mat-label>{{ tx('editor.general.headerPosition', 'Title position') }}</mat-label>
|
|
4067
|
-
<select
|
|
4068
|
-
<option value="top">{{ tx('editor.general.headerPosition.top', 'Above') }}</option>
|
|
4069
|
-
<option value="bottom">{{ tx('editor.general.headerPosition.bottom', 'Below') }}</option>
|
|
4070
|
-
</select>
|
|
4070
|
+
<mat-select [(ngModel)]="config.headerPosition" (ngModelChange)="markDirty()">
|
|
4071
|
+
<mat-option value="top">{{ tx('editor.general.headerPosition.top', 'Above') }}</mat-option>
|
|
4072
|
+
<mat-option value="bottom">{{ tx('editor.general.headerPosition.bottom', 'Below') }}</mat-option>
|
|
4073
|
+
</mat-select>
|
|
4071
4074
|
</mat-form-field>
|
|
4072
4075
|
<mat-form-field appearance="outline">
|
|
4073
4076
|
<mat-label>{{ tx('editor.general.labelPosition', 'Label position') }}</mat-label>
|
|
4074
|
-
<select
|
|
4075
|
-
<option value="end">{{ tx('editor.general.labelPosition.end', 'Beside') }}</option>
|
|
4076
|
-
<option value="bottom">{{ tx('editor.general.labelPosition.bottom', 'Below') }}</option>
|
|
4077
|
-
</select>
|
|
4077
|
+
<mat-select [(ngModel)]="config.labelPosition" (ngModelChange)="markDirty()" [disabled]="config.orientation !== 'horizontal'">
|
|
4078
|
+
<mat-option value="end">{{ tx('editor.general.labelPosition.end', 'Beside') }}</mat-option>
|
|
4079
|
+
<mat-option value="bottom">{{ tx('editor.general.labelPosition.bottom', 'Below') }}</mat-option>
|
|
4080
|
+
</mat-select>
|
|
4078
4081
|
</mat-form-field>
|
|
4079
4082
|
<mat-form-field appearance="outline">
|
|
4080
4083
|
<mat-label>{{ tx('editor.general.density', 'Density') }}</mat-label>
|
|
4081
|
-
<select
|
|
4082
|
-
<option [
|
|
4083
|
-
<option value="comfortable">{{ tx('editor.general.density.comfortable', 'Comfortable') }}</option>
|
|
4084
|
-
<option value="compact">{{ tx('editor.general.density.compact', 'Compact') }}</option>
|
|
4085
|
-
</select>
|
|
4084
|
+
<mat-select [(ngModel)]="config.density" (ngModelChange)="markDirty()" [placeholder]="tx('editor.general.density.default', 'Default')">
|
|
4085
|
+
<mat-option [value]="undefined">{{ tx('editor.general.density.default', 'Default') }}</mat-option>
|
|
4086
|
+
<mat-option value="comfortable">{{ tx('editor.general.density.comfortable', 'Comfortable') }}</mat-option>
|
|
4087
|
+
<mat-option value="compact">{{ tx('editor.general.density.compact', 'Compact') }}</mat-option>
|
|
4088
|
+
</mat-select>
|
|
4086
4089
|
</mat-form-field>
|
|
4087
4090
|
<mat-form-field appearance="outline">
|
|
4088
4091
|
<mat-label>{{ tx('editor.general.animationDuration', 'Animation duration') }}</mat-label>
|
|
@@ -4476,32 +4479,32 @@ class PraxisStepperConfigEditor {
|
|
|
4476
4479
|
<div class="pdx-grid">
|
|
4477
4480
|
<mat-form-field appearance="outline">
|
|
4478
4481
|
<mat-label>{{ tx('editor.navigation.variant', 'Button style') }}</mat-label>
|
|
4479
|
-
<select
|
|
4480
|
-
<option [
|
|
4481
|
-
<option value="basic">{{ tx('editor.navigation.variant.basic', 'Text') }}</option>
|
|
4482
|
-
<option value="flat">{{ tx('editor.navigation.variant.flat', 'Flat') }}</option>
|
|
4483
|
-
<option value="stroked">{{ tx('editor.navigation.variant.stroked', 'Stroked') }}</option>
|
|
4484
|
-
<option value="raised">{{ tx('editor.navigation.variant.raised', 'Raised') }}</option>
|
|
4485
|
-
</select>
|
|
4482
|
+
<mat-select [(ngModel)]="navigationCfg.variant" (ngModelChange)="markDirty()" [disabled]="!navigationCfg.visible" [placeholder]="tx('editor.navigation.variant.default', 'Default (raised)')">
|
|
4483
|
+
<mat-option [value]="undefined">{{ tx('editor.navigation.variant.default', 'Default (raised)') }}</mat-option>
|
|
4484
|
+
<mat-option value="basic">{{ tx('editor.navigation.variant.basic', 'Text') }}</mat-option>
|
|
4485
|
+
<mat-option value="flat">{{ tx('editor.navigation.variant.flat', 'Flat') }}</mat-option>
|
|
4486
|
+
<mat-option value="stroked">{{ tx('editor.navigation.variant.stroked', 'Stroked') }}</mat-option>
|
|
4487
|
+
<mat-option value="raised">{{ tx('editor.navigation.variant.raised', 'Raised') }}</mat-option>
|
|
4488
|
+
</mat-select>
|
|
4486
4489
|
</mat-form-field>
|
|
4487
4490
|
<mat-form-field appearance="outline">
|
|
4488
4491
|
<mat-label>{{ tx('editor.navigation.color', 'Color') }}</mat-label>
|
|
4489
|
-
<select
|
|
4490
|
-
<option [
|
|
4491
|
-
<option value="primary">{{ tx('editor.navigation.color.primary', 'Primary') }}</option>
|
|
4492
|
-
<option value="accent">{{ tx('editor.navigation.color.accent', 'Accent') }}</option>
|
|
4493
|
-
<option value="warn">{{ tx('editor.navigation.color.warn', 'Warn') }}</option>
|
|
4494
|
-
</select>
|
|
4492
|
+
<mat-select [(ngModel)]="navigationCfg.color" (ngModelChange)="markDirty()" [disabled]="!navigationCfg.visible" [placeholder]="tx('editor.navigation.color.default', 'Default')">
|
|
4493
|
+
<mat-option [value]="undefined">{{ tx('editor.navigation.color.default', 'Default') }}</mat-option>
|
|
4494
|
+
<mat-option value="primary">{{ tx('editor.navigation.color.primary', 'Primary') }}</mat-option>
|
|
4495
|
+
<mat-option value="accent">{{ tx('editor.navigation.color.accent', 'Accent') }}</mat-option>
|
|
4496
|
+
<mat-option value="warn">{{ tx('editor.navigation.color.warn', 'Warn') }}</mat-option>
|
|
4497
|
+
</mat-select>
|
|
4495
4498
|
</mat-form-field>
|
|
4496
4499
|
<mat-form-field appearance="outline">
|
|
4497
4500
|
<mat-label>{{ tx('editor.navigation.align', 'Alignment') }}</mat-label>
|
|
4498
|
-
<select
|
|
4499
|
-
<option [
|
|
4500
|
-
<option value="start">{{ tx('editor.navigation.align.start', 'Left') }}</option>
|
|
4501
|
-
<option value="center">{{ tx('editor.navigation.align.center', 'Center') }}</option>
|
|
4502
|
-
<option value="space-between">{{ tx('editor.navigation.align.spaceBetween', 'Spaced') }}</option>
|
|
4503
|
-
<option value="end">{{ tx('editor.navigation.align.end', 'Right') }}</option>
|
|
4504
|
-
</select>
|
|
4501
|
+
<mat-select [(ngModel)]="navigationCfg.align" (ngModelChange)="markDirty()" [disabled]="!navigationCfg.visible" [placeholder]="tx('editor.navigation.align.default', 'Right')">
|
|
4502
|
+
<mat-option [value]="undefined">{{ tx('editor.navigation.align.default', 'Right') }}</mat-option>
|
|
4503
|
+
<mat-option value="start">{{ tx('editor.navigation.align.start', 'Left') }}</mat-option>
|
|
4504
|
+
<mat-option value="center">{{ tx('editor.navigation.align.center', 'Center') }}</mat-option>
|
|
4505
|
+
<mat-option value="space-between">{{ tx('editor.navigation.align.spaceBetween', 'Spaced') }}</mat-option>
|
|
4506
|
+
<mat-option value="end">{{ tx('editor.navigation.align.end', 'Right') }}</mat-option>
|
|
4507
|
+
</mat-select>
|
|
4505
4508
|
</mat-form-field>
|
|
4506
4509
|
</div>
|
|
4507
4510
|
</div>
|
|
@@ -4573,13 +4576,13 @@ class PraxisStepperConfigEditor {
|
|
|
4573
4576
|
</mat-form-field>
|
|
4574
4577
|
<mat-form-field appearance="outline">
|
|
4575
4578
|
<mat-label>{{ tx('editor.appearance.textWeight', 'Text weight') }}</mat-label>
|
|
4576
|
-
<select
|
|
4577
|
-
<option [
|
|
4578
|
-
<option value="400">{{ tx('editor.appearance.textWeight.400', 'Normal') }}</option>
|
|
4579
|
-
<option value="500">{{ tx('editor.appearance.textWeight.500', 'Medium') }}</option>
|
|
4580
|
-
<option value="600">{{ tx('editor.appearance.textWeight.600', 'Semibold') }}</option>
|
|
4581
|
-
<option value="700">{{ tx('editor.appearance.textWeight.700', 'Bold') }}</option>
|
|
4582
|
-
</select>
|
|
4579
|
+
<mat-select [ngModel]="headerLabelTextWeight" (ngModelChange)="setHeaderLabelTextWeight($event)" [placeholder]="tx('editor.appearance.textWeight.default', 'Default')">
|
|
4580
|
+
<mat-option [value]="undefined">{{ tx('editor.appearance.textWeight.default', 'Default') }}</mat-option>
|
|
4581
|
+
<mat-option value="400">{{ tx('editor.appearance.textWeight.400', 'Normal') }}</mat-option>
|
|
4582
|
+
<mat-option value="500">{{ tx('editor.appearance.textWeight.500', 'Medium') }}</mat-option>
|
|
4583
|
+
<mat-option value="600">{{ tx('editor.appearance.textWeight.600', 'Semibold') }}</mat-option>
|
|
4584
|
+
<mat-option value="700">{{ tx('editor.appearance.textWeight.700', 'Bold') }}</mat-option>
|
|
4585
|
+
</mat-select>
|
|
4583
4586
|
</mat-form-field>
|
|
4584
4587
|
<mat-form-field appearance="outline" class="field-span-2">
|
|
4585
4588
|
<mat-label>{{ tx('editor.appearance.themeClass', 'Theme class') }}</mat-label>
|
|
@@ -4587,12 +4590,12 @@ class PraxisStepperConfigEditor {
|
|
|
4587
4590
|
</mat-form-field>
|
|
4588
4591
|
<mat-form-field appearance="outline">
|
|
4589
4592
|
<mat-label>{{ tx('editor.appearance.iconSet', 'Icon set') }}</mat-label>
|
|
4590
|
-
<select
|
|
4591
|
-
<option [
|
|
4592
|
-
<option value="material-symbols-outlined">Material Symbols (Outlined)</option>
|
|
4593
|
-
<option value="material-symbols-rounded">Material Symbols (Rounded)</option>
|
|
4594
|
-
<option value="material-symbols-sharp">Material Symbols (Sharp)</option>
|
|
4595
|
-
</select>
|
|
4593
|
+
<mat-select [(ngModel)]="appearance.iconsSet" (ngModelChange)="onAppearanceChange()" [placeholder]="tx('editor.appearance.iconSet.default', 'Material Icons (default)')">
|
|
4594
|
+
<mat-option [value]="undefined">{{ tx('editor.appearance.iconSet.default', 'Material Icons (default)') }}</mat-option>
|
|
4595
|
+
<mat-option value="material-symbols-outlined">Material Symbols (Outlined)</mat-option>
|
|
4596
|
+
<mat-option value="material-symbols-rounded">Material Symbols (Rounded)</mat-option>
|
|
4597
|
+
<mat-option value="material-symbols-sharp">Material Symbols (Sharp)</mat-option>
|
|
4598
|
+
</mat-select>
|
|
4596
4599
|
</mat-form-field>
|
|
4597
4600
|
</div>
|
|
4598
4601
|
<div class="inline-actions-grid icon-picker-grid">
|
|
@@ -4678,7 +4681,7 @@ class PraxisStepperConfigEditor {
|
|
|
4678
4681
|
</mat-tab>
|
|
4679
4682
|
</mat-tab-group>
|
|
4680
4683
|
</div>
|
|
4681
|
-
`, isInline: true, styles: [".pdx-editor{display:grid;gap:16px}.pdx-editor .mat-mdc-form-field{width:100%}.pdx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.pdx-toggles{display:flex;gap:12px;flex-wrap:wrap}.tab-pad{padding:16px;display:grid;gap:16px;background:var(--md-sys-color-surface);border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 78%,transparent);border-radius:16px}.help{color:var(--md-sys-color-on-surface-variant);font-size:13px}.editor-intro{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:4px 2px 2px}.editor-intro-copy{display:grid;gap:6px;max-width:760px}.eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant);font-weight:600}.editor-title{font-size:22px;line-height:1.15;font-weight:650;color:var(--md-sys-color-on-surface)}.editor-subtitle{max-width:72ch;color:var(--md-sys-color-on-surface-variant);line-height:1.45;font-size:14px}.editor-intro-meta{display:flex;gap:8px;align-items:flex-start}.meta-pill{display:grid;gap:2px;min-width:88px;padding:10px 12px;border-radius:14px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 70%,transparent);background:var(--md-sys-color-surface-container-low)}.meta-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--md-sys-color-on-surface-variant)}.quick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:6px}.icons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:8px 0}.icon-item{display:grid;gap:6px;align-content:start}.icons-hint{margin-top:4px}.settings-group{display:grid;gap:14px;padding:2px 0 4px}.settings-group+.settings-group,.settings-group+.disclosure,.disclosure+.settings-group{padding-top:18px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 60%,transparent)}.group-head{display:grid;gap:4px;max-width:72ch}.inline-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:start}.inline-action-item{display:grid;gap:8px;align-content:start;min-width:0}.pdx-steps{display:grid;gap:12px;padding:4px 0 2px}.steps-workspace{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:24px;align-items:start}.pdx-steps-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.pdx-step-list{display:grid;gap:10px}.pdx-step-item{display:grid;grid-template-columns:20px 1fr auto;gap:10px;align-items:start;padding:12px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 68%,transparent);border-radius:14px;background:var(--md-sys-color-surface);cursor:pointer;outline:none}.pdx-step-item.active{border-color:color-mix(in srgb,var(--md-sys-color-primary) 55%,var(--md-sys-color-outline-variant));background:color-mix(in srgb,var(--md-sys-color-primary-container) 26%,var(--md-sys-color-surface));box-shadow:none}.pdx-step-item:focus-visible{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}.drag-handle{display:flex;align-items:center;color:var(--md-sys-color-on-surface-variant)}.step-summary{display:grid;gap:8px;min-width:0}.step-summary-head{display:grid;gap:2px}.step-summary-index{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--md-sys-color-on-surface-variant);font-weight:600}.step-summary-title{font-size:15px;line-height:1.3;font-weight:600;color:var(--md-sys-color-on-surface)}.step-summary-sub{font-size:12px;color:var(--md-sys-color-on-surface-variant);font-family:var(--md-ref-typeface-plain, monospace);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.step-summary-flags{display:flex;gap:6px;flex-wrap:wrap}.summary-chip{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:999px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant);font-size:11px;font-weight:600}.summary-chip-warn{background:color-mix(in srgb,var(--md-sys-color-error-container) 60%,transparent);color:var(--md-sys-color-on-error-container)}.pdx-active-step{display:grid;gap:18px;min-width:0}.pdx-active-step .hdr{display:flex;gap:12px;align-items:flex-start;justify-content:space-between}.active-step-head{display:grid;gap:4px}.pdx-content-editor{display:grid;gap:16px}.section{display:grid;gap:12px;padding:0;border:none;border-radius:0;background:transparent}.section-body{display:grid;gap:12px}.section-title{font-weight:600;font-size:15px;color:var(--md-sys-color-on-surface)}.section-subtitle{font-size:13px;color:var(--md-sys-color-on-surface-variant);line-height:1.45}.section-head{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.editorial-section{padding-bottom:6px;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 68%,transparent)}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field-span-2{grid-column:span 2}.toggle-group{display:flex;gap:10px;flex-wrap:wrap;padding-top:4px}.disclosure{padding:0 0 12px;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 62%,transparent)}.disclosure summary{list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:16px;cursor:pointer;padding:0;position:relative}.disclosure summary::-webkit-details-marker{display:none}.disclosure summary:after{content:\"expand_more\";font-family:Material Icons;font-size:18px;color:var(--md-sys-color-on-surface-variant);transition:transform .16s ease}.disclosure[open] summary:after{transform:rotate(180deg)}.disclosure summary:focus-visible{outline:2px solid color-mix(in srgb,var(--md-sys-color-primary) 58%,transparent);outline-offset:4px;border-radius:8px}.disclosure-body{padding-top:12px}.widget-list{display:grid;gap:8px}.widget-item{display:grid;grid-template-columns:20px 1fr auto;align-items:start;gap:12px;padding:10px 0;border:none;border-radius:0;background:transparent;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.widget-item .info{display:grid;gap:2px;min-width:0}.widget-item .info .name{font-weight:600}.widget-item .info .sub{font-size:12px;color:var(--md-sys-color-on-surface-variant);line-height:1.45}.widget-item .info .meta{margin-top:2px;font-size:11px;color:var(--md-sys-color-on-surface-variant);font-family:var(--md-ref-typeface-plain, monospace);opacity:.85}.widget-item .actions{display:flex;gap:2px;flex-wrap:nowrap;justify-content:flex-end;align-items:flex-start;opacity:.92}.editorial-item{align-items:start}.editorial-item .actions{justify-content:flex-end}.cta-row{display:flex;gap:8px;align-items:center}.spacer{flex:1 1 auto}.muted{color:var(--md-sys-color-on-surface-variant)}.cta-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-bottom:4px}.cta-row-item{display:grid;gap:10px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.tokens-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:8px 0}.token-item{display:contents}.pdx-appearance{margin-top:8px;display:grid;gap:8px}.pdx-appearance-actions{display:flex;gap:8px;flex-wrap:wrap}.zone-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.zone-column{display:grid;gap:10px;min-width:0}.zone-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.zone-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.zone-title{font-weight:600}.zone-column+.zone-column{padding-left:16px;border-left:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.zone-count{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}.advanced-list{margin-top:4px}.form-row-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.form-row-main{display:flex;align-items:center;gap:12px;min-width:0}.form-row-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}.code-card{margin-top:8px}.code-head{font-weight:600;margin-bottom:4px}.code{white-space:pre;overflow:auto;background:var(--md-sys-color-surface-container-highest)}.w-full{grid-column:1 / -1}.min-180{min-width:180px}.editor-icon-action{color:var(--md-sys-color-on-surface-variant)}.editor-icon-action--danger{color:var(--md-sys-color-error)}.mat-mdc-form-field-icon-suffix{align-self:center}.cta-row-item .cta-head{display:grid;grid-template-columns:20px 1fr;align-items:start;gap:10px}.cta-row-item .cta-title{font-weight:600;color:var(--md-sys-color-on-surface)}.cta-row-item .cta-desc{font-size:12px;color:var(--md-sys-color-on-surface-variant);line-height:1.45;margin-top:2px}.cta-row-item .cta-actions{display:flex;gap:8px;align-items:center}.widget-item:last-child,.cta-row-item:last-child,.form-row-card:last-child{border-bottom:none}@media(max-width:900px){.editor-intro{flex-direction:column}.steps-workspace{grid-template-columns:1fr;gap:20px}.pdx-step-item{grid-template-columns:20px 1fr}.pdx-actions{grid-column:1 / -1;justify-self:end}.widget-item{grid-template-columns:20px 1fr}.widget-item .actions{grid-column:1 / -1;justify-content:flex-end}.form-row-card{flex-direction:column;align-items:flex-start}.form-row-actions{justify-content:flex-start}.zone-column+.zone-column{padding-left:0;border-left:none;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}}@media(max-width:640px){.tab-pad{padding:14px}.editor-title{font-size:20px}.pdx-active-step .hdr{align-items:flex-start;flex-direction:column}.detail-grid{grid-template-columns:1fr}.field-span-2{grid-column:auto}.toggle-group{flex-direction:column;align-items:flex-start}.zone-head{align-items:flex-start;flex-direction:column}.zone-actions,.widget-item .actions{justify-content:flex-start}.disclosure summary{flex-direction:column;align-items:flex-start}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.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: i1$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PraxisIconButtonComponent, selector: "button[praxisIconButton]", inputs: ["praxisIconButton", "size", "appearance", "presentation", "pressed", "busy"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i7.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i7.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i7.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i9.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i9.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }] });
|
|
4684
|
+
`, isInline: true, styles: [":host{display:block;container-type:inline-size;color:var(--pfx-settings-panel-text-primary, var(--md-sys-color-on-surface))}.pdx-editor{display:grid;gap:16px}.pdx-editor .mat-mdc-form-field{width:100%}.pdx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.pdx-toggles{display:flex;gap:12px;flex-wrap:wrap}.tab-pad{padding:16px;display:grid;gap:16px;background:var(--pfx-settings-panel-surface, var(--md-sys-color-surface));border:1px solid color-mix(in srgb,var(--pfx-settings-panel-border, var(--md-sys-color-outline-variant)) 78%,transparent);border-radius:16px}.help{color:var(--md-sys-color-on-surface-variant);font-size:13px}.editor-intro{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:4px 2px 2px}.editor-intro-copy{display:grid;gap:6px;max-width:760px}.eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant);font-weight:600}.editor-title{font-size:22px;line-height:1.15;font-weight:650;color:var(--md-sys-color-on-surface)}.editor-subtitle{max-width:72ch;color:var(--md-sys-color-on-surface-variant);line-height:1.45;font-size:14px}.editor-intro-meta{display:flex;gap:8px;align-items:flex-start}.meta-pill{display:grid;gap:2px;min-width:88px;padding:10px 12px;border-radius:14px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 70%,transparent);background:var(--md-sys-color-surface-container-low)}.meta-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--md-sys-color-on-surface-variant)}.quick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:6px}.icons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:8px 0}.icon-item{display:grid;gap:6px;align-content:start}.icons-hint{margin-top:4px}.settings-group{display:grid;gap:14px;padding:2px 0 4px}.settings-group+.settings-group,.settings-group+.disclosure,.disclosure+.settings-group{padding-top:18px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 60%,transparent)}.group-head{display:grid;gap:4px;max-width:72ch}.inline-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:start}.inline-action-item{display:grid;gap:8px;align-content:start;min-width:0}.pdx-steps{display:grid;gap:12px;padding:4px 0 2px}.steps-workspace{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:24px;align-items:start}.pdx-steps-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.pdx-step-list{display:grid;gap:10px}.pdx-step-item{display:grid;grid-template-columns:20px 1fr auto;gap:10px;align-items:start;padding:12px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 68%,transparent);border-radius:14px;background:var(--md-sys-color-surface);cursor:pointer;outline:none}.pdx-step-item.active{border-color:color-mix(in srgb,var(--md-sys-color-primary) 55%,var(--md-sys-color-outline-variant));background:color-mix(in srgb,var(--md-sys-color-primary-container) 26%,var(--md-sys-color-surface));box-shadow:none}.pdx-step-item:focus-visible{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}.drag-handle{display:flex;align-items:center;color:var(--md-sys-color-on-surface-variant)}.step-summary{display:grid;gap:8px;min-width:0}.step-summary-head{display:grid;gap:2px}.step-summary-index{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--md-sys-color-on-surface-variant);font-weight:600}.step-summary-title{font-size:15px;line-height:1.3;font-weight:600;color:var(--md-sys-color-on-surface)}.step-summary-sub{font-size:12px;color:var(--md-sys-color-on-surface-variant);font-family:var(--md-ref-typeface-plain, monospace);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.step-summary-flags{display:flex;gap:6px;flex-wrap:wrap}.summary-chip{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:999px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant);font-size:11px;font-weight:600}.summary-chip-warn{background:color-mix(in srgb,var(--md-sys-color-error-container) 60%,transparent);color:var(--md-sys-color-on-error-container)}.pdx-active-step{display:grid;gap:18px;min-width:0}.pdx-active-step .hdr{display:flex;gap:12px;align-items:flex-start;justify-content:space-between}.active-step-head{display:grid;gap:4px}.pdx-content-editor{display:grid;gap:16px}.section{display:grid;gap:12px;padding:0;border:none;border-radius:0;background:transparent}.section-body{display:grid;gap:12px}.section-title{font-weight:600;font-size:15px;color:var(--md-sys-color-on-surface)}.section-subtitle{font-size:13px;color:var(--md-sys-color-on-surface-variant);line-height:1.45}.section-head{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.editorial-section{padding-bottom:6px;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 68%,transparent)}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field-span-2{grid-column:span 2}.toggle-group{display:flex;gap:10px;flex-wrap:wrap;padding-top:4px}.disclosure{padding:0 0 12px;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 62%,transparent)}.disclosure summary{list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:16px;cursor:pointer;padding:0;position:relative}.disclosure summary::-webkit-details-marker{display:none}.disclosure summary:after{content:\"expand_more\";font-family:Material Icons;font-size:18px;color:var(--md-sys-color-on-surface-variant);transition:transform .16s ease}.disclosure[open] summary:after{transform:rotate(180deg)}.disclosure summary:focus-visible{outline:2px solid color-mix(in srgb,var(--md-sys-color-primary) 58%,transparent);outline-offset:4px;border-radius:8px}.disclosure-body{padding-top:12px}.widget-list{display:grid;gap:8px}.widget-item{display:grid;grid-template-columns:20px 1fr auto;align-items:start;gap:12px;padding:10px 0;border:none;border-radius:0;background:transparent;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.widget-item .info{display:grid;gap:2px;min-width:0}.widget-item .info .name{font-weight:600}.widget-item .info .sub{font-size:12px;color:var(--md-sys-color-on-surface-variant);line-height:1.45}.widget-item .info .meta{margin-top:2px;font-size:11px;color:var(--md-sys-color-on-surface-variant);font-family:var(--md-ref-typeface-plain, monospace);opacity:.85}.widget-item .actions{display:flex;gap:2px;flex-wrap:nowrap;justify-content:flex-end;align-items:flex-start;opacity:.92}.editorial-item{align-items:start}.editorial-item .actions{justify-content:flex-end}.cta-row{display:flex;gap:8px;align-items:center}.spacer{flex:1 1 auto}.muted{color:var(--md-sys-color-on-surface-variant)}.cta-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-bottom:4px}.cta-row-item{display:grid;gap:10px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.tokens-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:8px 0}.token-item{display:contents}.pdx-appearance{margin-top:8px;display:grid;gap:8px}.pdx-appearance-actions{display:flex;gap:8px;flex-wrap:wrap}.zone-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.zone-column{display:grid;gap:10px;min-width:0}.zone-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.zone-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.zone-title{font-weight:600}.zone-column+.zone-column{padding-left:16px;border-left:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.zone-count{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}.advanced-list{margin-top:4px}.form-row-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.form-row-main{display:flex;align-items:center;gap:12px;min-width:0}.form-row-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}.code-card{margin-top:8px}.code-head{font-weight:600;margin-bottom:4px}.code{white-space:pre;overflow:auto;background:var(--md-sys-color-surface-container-highest)}.w-full{grid-column:1 / -1}.min-180{min-width:180px}.editor-icon-action{color:var(--md-sys-color-on-surface-variant)}.editor-icon-action--danger{color:var(--md-sys-color-error)}.mat-mdc-form-field-icon-suffix{align-self:center}.cta-row-item .cta-head{display:grid;grid-template-columns:20px 1fr;align-items:start;gap:10px}.cta-row-item .cta-title{font-weight:600;color:var(--md-sys-color-on-surface)}.cta-row-item .cta-desc{font-size:12px;color:var(--md-sys-color-on-surface-variant);line-height:1.45;margin-top:2px}.cta-row-item .cta-actions{display:flex;gap:8px;align-items:center}.widget-item:last-child,.cta-row-item:last-child,.form-row-card:last-child{border-bottom:none}@container (max-width: 900px){.editor-intro{flex-direction:column}.steps-workspace{grid-template-columns:1fr;gap:20px}.pdx-step-item{grid-template-columns:20px 1fr}.pdx-actions{grid-column:1 / -1;justify-self:end}.widget-item{grid-template-columns:20px 1fr}.widget-item .actions{grid-column:1 / -1;justify-content:flex-end}.form-row-card{flex-direction:column;align-items:flex-start}.form-row-actions{justify-content:flex-start}.zone-column+.zone-column{padding-left:0;border-left:none;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}}@container (max-width: 640px){.tab-pad{padding:14px}.editor-title{font-size:20px}.pdx-active-step .hdr{align-items:flex-start;flex-direction:column}.detail-grid{grid-template-columns:1fr}.field-span-2{grid-column:auto}.toggle-group{flex-direction:column;align-items:flex-start}.zone-head{align-items:flex-start;flex-direction:column}.zone-actions,.widget-item .actions{justify-content:flex-start}.disclosure summary{flex-direction:column;align-items:flex-start}}@media(max-width:900px){.editor-intro{flex-direction:column}.steps-workspace{grid-template-columns:1fr;gap:20px}.pdx-step-item{grid-template-columns:20px 1fr}.pdx-actions{grid-column:1 / -1;justify-self:end}.widget-item{grid-template-columns:20px 1fr}.widget-item .actions{grid-column:1 / -1;justify-content:flex-end}.form-row-card{flex-direction:column;align-items:flex-start}.form-row-actions{justify-content:flex-start}.zone-column+.zone-column{padding-left:0;border-left:none;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}}@media(max-width:640px){.tab-pad{padding:14px}.editor-title{font-size:20px}.pdx-active-step .hdr{align-items:flex-start;flex-direction:column}.detail-grid{grid-template-columns:1fr}.field-span-2{grid-column:auto}.toggle-group{flex-direction:column;align-items:flex-start}.zone-head{align-items:flex-start;flex-direction:column}.zone-actions,.widget-item .actions{justify-content:flex-start}.disclosure summary{flex-direction:column;align-items:flex-start}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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: i1$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PraxisIconButtonComponent, selector: "button[praxisIconButton]", inputs: ["praxisIconButton", "size", "appearance", "presentation", "pressed", "busy"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i7.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i8.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i8.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i8.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i10.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i10.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }] });
|
|
4682
4685
|
}
|
|
4683
4686
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisStepperConfigEditor, decorators: [{
|
|
4684
4687
|
type: Component,
|
|
@@ -4686,6 +4689,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
4686
4689
|
FormsModule,
|
|
4687
4690
|
MatFormFieldModule,
|
|
4688
4691
|
MatInputModule,
|
|
4692
|
+
MatSelectModule,
|
|
4689
4693
|
MatIconModule,
|
|
4690
4694
|
PraxisIconButtonComponent,
|
|
4691
4695
|
PraxisIconDirective,
|
|
@@ -4715,32 +4719,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
4715
4719
|
<div class="pdx-grid">
|
|
4716
4720
|
<mat-form-field appearance="outline">
|
|
4717
4721
|
<mat-label>{{ tx('editor.general.orientation', 'Orientation') }}</mat-label>
|
|
4718
|
-
<select
|
|
4719
|
-
<option value="horizontal">{{ tx('editor.general.orientation.horizontal', 'Horizontal') }}</option>
|
|
4720
|
-
<option value="vertical">{{ tx('editor.general.orientation.vertical', 'Vertical') }}</option>
|
|
4721
|
-
</select>
|
|
4722
|
+
<mat-select [(ngModel)]="config.orientation" (ngModelChange)="markDirty()">
|
|
4723
|
+
<mat-option value="horizontal">{{ tx('editor.general.orientation.horizontal', 'Horizontal') }}</mat-option>
|
|
4724
|
+
<mat-option value="vertical">{{ tx('editor.general.orientation.vertical', 'Vertical') }}</mat-option>
|
|
4725
|
+
</mat-select>
|
|
4722
4726
|
</mat-form-field>
|
|
4723
4727
|
<mat-form-field appearance="outline">
|
|
4724
4728
|
<mat-label>{{ tx('editor.general.headerPosition', 'Title position') }}</mat-label>
|
|
4725
|
-
<select
|
|
4726
|
-
<option value="top">{{ tx('editor.general.headerPosition.top', 'Above') }}</option>
|
|
4727
|
-
<option value="bottom">{{ tx('editor.general.headerPosition.bottom', 'Below') }}</option>
|
|
4728
|
-
</select>
|
|
4729
|
+
<mat-select [(ngModel)]="config.headerPosition" (ngModelChange)="markDirty()">
|
|
4730
|
+
<mat-option value="top">{{ tx('editor.general.headerPosition.top', 'Above') }}</mat-option>
|
|
4731
|
+
<mat-option value="bottom">{{ tx('editor.general.headerPosition.bottom', 'Below') }}</mat-option>
|
|
4732
|
+
</mat-select>
|
|
4729
4733
|
</mat-form-field>
|
|
4730
4734
|
<mat-form-field appearance="outline">
|
|
4731
4735
|
<mat-label>{{ tx('editor.general.labelPosition', 'Label position') }}</mat-label>
|
|
4732
|
-
<select
|
|
4733
|
-
<option value="end">{{ tx('editor.general.labelPosition.end', 'Beside') }}</option>
|
|
4734
|
-
<option value="bottom">{{ tx('editor.general.labelPosition.bottom', 'Below') }}</option>
|
|
4735
|
-
</select>
|
|
4736
|
+
<mat-select [(ngModel)]="config.labelPosition" (ngModelChange)="markDirty()" [disabled]="config.orientation !== 'horizontal'">
|
|
4737
|
+
<mat-option value="end">{{ tx('editor.general.labelPosition.end', 'Beside') }}</mat-option>
|
|
4738
|
+
<mat-option value="bottom">{{ tx('editor.general.labelPosition.bottom', 'Below') }}</mat-option>
|
|
4739
|
+
</mat-select>
|
|
4736
4740
|
</mat-form-field>
|
|
4737
4741
|
<mat-form-field appearance="outline">
|
|
4738
4742
|
<mat-label>{{ tx('editor.general.density', 'Density') }}</mat-label>
|
|
4739
|
-
<select
|
|
4740
|
-
<option [
|
|
4741
|
-
<option value="comfortable">{{ tx('editor.general.density.comfortable', 'Comfortable') }}</option>
|
|
4742
|
-
<option value="compact">{{ tx('editor.general.density.compact', 'Compact') }}</option>
|
|
4743
|
-
</select>
|
|
4743
|
+
<mat-select [(ngModel)]="config.density" (ngModelChange)="markDirty()" [placeholder]="tx('editor.general.density.default', 'Default')">
|
|
4744
|
+
<mat-option [value]="undefined">{{ tx('editor.general.density.default', 'Default') }}</mat-option>
|
|
4745
|
+
<mat-option value="comfortable">{{ tx('editor.general.density.comfortable', 'Comfortable') }}</mat-option>
|
|
4746
|
+
<mat-option value="compact">{{ tx('editor.general.density.compact', 'Compact') }}</mat-option>
|
|
4747
|
+
</mat-select>
|
|
4744
4748
|
</mat-form-field>
|
|
4745
4749
|
<mat-form-field appearance="outline">
|
|
4746
4750
|
<mat-label>{{ tx('editor.general.animationDuration', 'Animation duration') }}</mat-label>
|
|
@@ -5134,32 +5138,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
5134
5138
|
<div class="pdx-grid">
|
|
5135
5139
|
<mat-form-field appearance="outline">
|
|
5136
5140
|
<mat-label>{{ tx('editor.navigation.variant', 'Button style') }}</mat-label>
|
|
5137
|
-
<select
|
|
5138
|
-
<option [
|
|
5139
|
-
<option value="basic">{{ tx('editor.navigation.variant.basic', 'Text') }}</option>
|
|
5140
|
-
<option value="flat">{{ tx('editor.navigation.variant.flat', 'Flat') }}</option>
|
|
5141
|
-
<option value="stroked">{{ tx('editor.navigation.variant.stroked', 'Stroked') }}</option>
|
|
5142
|
-
<option value="raised">{{ tx('editor.navigation.variant.raised', 'Raised') }}</option>
|
|
5143
|
-
</select>
|
|
5141
|
+
<mat-select [(ngModel)]="navigationCfg.variant" (ngModelChange)="markDirty()" [disabled]="!navigationCfg.visible" [placeholder]="tx('editor.navigation.variant.default', 'Default (raised)')">
|
|
5142
|
+
<mat-option [value]="undefined">{{ tx('editor.navigation.variant.default', 'Default (raised)') }}</mat-option>
|
|
5143
|
+
<mat-option value="basic">{{ tx('editor.navigation.variant.basic', 'Text') }}</mat-option>
|
|
5144
|
+
<mat-option value="flat">{{ tx('editor.navigation.variant.flat', 'Flat') }}</mat-option>
|
|
5145
|
+
<mat-option value="stroked">{{ tx('editor.navigation.variant.stroked', 'Stroked') }}</mat-option>
|
|
5146
|
+
<mat-option value="raised">{{ tx('editor.navigation.variant.raised', 'Raised') }}</mat-option>
|
|
5147
|
+
</mat-select>
|
|
5144
5148
|
</mat-form-field>
|
|
5145
5149
|
<mat-form-field appearance="outline">
|
|
5146
5150
|
<mat-label>{{ tx('editor.navigation.color', 'Color') }}</mat-label>
|
|
5147
|
-
<select
|
|
5148
|
-
<option [
|
|
5149
|
-
<option value="primary">{{ tx('editor.navigation.color.primary', 'Primary') }}</option>
|
|
5150
|
-
<option value="accent">{{ tx('editor.navigation.color.accent', 'Accent') }}</option>
|
|
5151
|
-
<option value="warn">{{ tx('editor.navigation.color.warn', 'Warn') }}</option>
|
|
5152
|
-
</select>
|
|
5151
|
+
<mat-select [(ngModel)]="navigationCfg.color" (ngModelChange)="markDirty()" [disabled]="!navigationCfg.visible" [placeholder]="tx('editor.navigation.color.default', 'Default')">
|
|
5152
|
+
<mat-option [value]="undefined">{{ tx('editor.navigation.color.default', 'Default') }}</mat-option>
|
|
5153
|
+
<mat-option value="primary">{{ tx('editor.navigation.color.primary', 'Primary') }}</mat-option>
|
|
5154
|
+
<mat-option value="accent">{{ tx('editor.navigation.color.accent', 'Accent') }}</mat-option>
|
|
5155
|
+
<mat-option value="warn">{{ tx('editor.navigation.color.warn', 'Warn') }}</mat-option>
|
|
5156
|
+
</mat-select>
|
|
5153
5157
|
</mat-form-field>
|
|
5154
5158
|
<mat-form-field appearance="outline">
|
|
5155
5159
|
<mat-label>{{ tx('editor.navigation.align', 'Alignment') }}</mat-label>
|
|
5156
|
-
<select
|
|
5157
|
-
<option [
|
|
5158
|
-
<option value="start">{{ tx('editor.navigation.align.start', 'Left') }}</option>
|
|
5159
|
-
<option value="center">{{ tx('editor.navigation.align.center', 'Center') }}</option>
|
|
5160
|
-
<option value="space-between">{{ tx('editor.navigation.align.spaceBetween', 'Spaced') }}</option>
|
|
5161
|
-
<option value="end">{{ tx('editor.navigation.align.end', 'Right') }}</option>
|
|
5162
|
-
</select>
|
|
5160
|
+
<mat-select [(ngModel)]="navigationCfg.align" (ngModelChange)="markDirty()" [disabled]="!navigationCfg.visible" [placeholder]="tx('editor.navigation.align.default', 'Right')">
|
|
5161
|
+
<mat-option [value]="undefined">{{ tx('editor.navigation.align.default', 'Right') }}</mat-option>
|
|
5162
|
+
<mat-option value="start">{{ tx('editor.navigation.align.start', 'Left') }}</mat-option>
|
|
5163
|
+
<mat-option value="center">{{ tx('editor.navigation.align.center', 'Center') }}</mat-option>
|
|
5164
|
+
<mat-option value="space-between">{{ tx('editor.navigation.align.spaceBetween', 'Spaced') }}</mat-option>
|
|
5165
|
+
<mat-option value="end">{{ tx('editor.navigation.align.end', 'Right') }}</mat-option>
|
|
5166
|
+
</mat-select>
|
|
5163
5167
|
</mat-form-field>
|
|
5164
5168
|
</div>
|
|
5165
5169
|
</div>
|
|
@@ -5231,13 +5235,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
5231
5235
|
</mat-form-field>
|
|
5232
5236
|
<mat-form-field appearance="outline">
|
|
5233
5237
|
<mat-label>{{ tx('editor.appearance.textWeight', 'Text weight') }}</mat-label>
|
|
5234
|
-
<select
|
|
5235
|
-
<option [
|
|
5236
|
-
<option value="400">{{ tx('editor.appearance.textWeight.400', 'Normal') }}</option>
|
|
5237
|
-
<option value="500">{{ tx('editor.appearance.textWeight.500', 'Medium') }}</option>
|
|
5238
|
-
<option value="600">{{ tx('editor.appearance.textWeight.600', 'Semibold') }}</option>
|
|
5239
|
-
<option value="700">{{ tx('editor.appearance.textWeight.700', 'Bold') }}</option>
|
|
5240
|
-
</select>
|
|
5238
|
+
<mat-select [ngModel]="headerLabelTextWeight" (ngModelChange)="setHeaderLabelTextWeight($event)" [placeholder]="tx('editor.appearance.textWeight.default', 'Default')">
|
|
5239
|
+
<mat-option [value]="undefined">{{ tx('editor.appearance.textWeight.default', 'Default') }}</mat-option>
|
|
5240
|
+
<mat-option value="400">{{ tx('editor.appearance.textWeight.400', 'Normal') }}</mat-option>
|
|
5241
|
+
<mat-option value="500">{{ tx('editor.appearance.textWeight.500', 'Medium') }}</mat-option>
|
|
5242
|
+
<mat-option value="600">{{ tx('editor.appearance.textWeight.600', 'Semibold') }}</mat-option>
|
|
5243
|
+
<mat-option value="700">{{ tx('editor.appearance.textWeight.700', 'Bold') }}</mat-option>
|
|
5244
|
+
</mat-select>
|
|
5241
5245
|
</mat-form-field>
|
|
5242
5246
|
<mat-form-field appearance="outline" class="field-span-2">
|
|
5243
5247
|
<mat-label>{{ tx('editor.appearance.themeClass', 'Theme class') }}</mat-label>
|
|
@@ -5245,12 +5249,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
5245
5249
|
</mat-form-field>
|
|
5246
5250
|
<mat-form-field appearance="outline">
|
|
5247
5251
|
<mat-label>{{ tx('editor.appearance.iconSet', 'Icon set') }}</mat-label>
|
|
5248
|
-
<select
|
|
5249
|
-
<option [
|
|
5250
|
-
<option value="material-symbols-outlined">Material Symbols (Outlined)</option>
|
|
5251
|
-
<option value="material-symbols-rounded">Material Symbols (Rounded)</option>
|
|
5252
|
-
<option value="material-symbols-sharp">Material Symbols (Sharp)</option>
|
|
5253
|
-
</select>
|
|
5252
|
+
<mat-select [(ngModel)]="appearance.iconsSet" (ngModelChange)="onAppearanceChange()" [placeholder]="tx('editor.appearance.iconSet.default', 'Material Icons (default)')">
|
|
5253
|
+
<mat-option [value]="undefined">{{ tx('editor.appearance.iconSet.default', 'Material Icons (default)') }}</mat-option>
|
|
5254
|
+
<mat-option value="material-symbols-outlined">Material Symbols (Outlined)</mat-option>
|
|
5255
|
+
<mat-option value="material-symbols-rounded">Material Symbols (Rounded)</mat-option>
|
|
5256
|
+
<mat-option value="material-symbols-sharp">Material Symbols (Sharp)</mat-option>
|
|
5257
|
+
</mat-select>
|
|
5254
5258
|
</mat-form-field>
|
|
5255
5259
|
</div>
|
|
5256
5260
|
<div class="inline-actions-grid icon-picker-grid">
|
|
@@ -5336,7 +5340,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
5336
5340
|
</mat-tab>
|
|
5337
5341
|
</mat-tab-group>
|
|
5338
5342
|
</div>
|
|
5339
|
-
`, styles: [".pdx-editor{display:grid;gap:16px}.pdx-editor .mat-mdc-form-field{width:100%}.pdx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.pdx-toggles{display:flex;gap:12px;flex-wrap:wrap}.tab-pad{padding:16px;display:grid;gap:16px;background:var(--md-sys-color-surface);border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 78%,transparent);border-radius:16px}.help{color:var(--md-sys-color-on-surface-variant);font-size:13px}.editor-intro{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:4px 2px 2px}.editor-intro-copy{display:grid;gap:6px;max-width:760px}.eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant);font-weight:600}.editor-title{font-size:22px;line-height:1.15;font-weight:650;color:var(--md-sys-color-on-surface)}.editor-subtitle{max-width:72ch;color:var(--md-sys-color-on-surface-variant);line-height:1.45;font-size:14px}.editor-intro-meta{display:flex;gap:8px;align-items:flex-start}.meta-pill{display:grid;gap:2px;min-width:88px;padding:10px 12px;border-radius:14px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 70%,transparent);background:var(--md-sys-color-surface-container-low)}.meta-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--md-sys-color-on-surface-variant)}.quick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:6px}.icons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:8px 0}.icon-item{display:grid;gap:6px;align-content:start}.icons-hint{margin-top:4px}.settings-group{display:grid;gap:14px;padding:2px 0 4px}.settings-group+.settings-group,.settings-group+.disclosure,.disclosure+.settings-group{padding-top:18px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 60%,transparent)}.group-head{display:grid;gap:4px;max-width:72ch}.inline-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:start}.inline-action-item{display:grid;gap:8px;align-content:start;min-width:0}.pdx-steps{display:grid;gap:12px;padding:4px 0 2px}.steps-workspace{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:24px;align-items:start}.pdx-steps-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.pdx-step-list{display:grid;gap:10px}.pdx-step-item{display:grid;grid-template-columns:20px 1fr auto;gap:10px;align-items:start;padding:12px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 68%,transparent);border-radius:14px;background:var(--md-sys-color-surface);cursor:pointer;outline:none}.pdx-step-item.active{border-color:color-mix(in srgb,var(--md-sys-color-primary) 55%,var(--md-sys-color-outline-variant));background:color-mix(in srgb,var(--md-sys-color-primary-container) 26%,var(--md-sys-color-surface));box-shadow:none}.pdx-step-item:focus-visible{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}.drag-handle{display:flex;align-items:center;color:var(--md-sys-color-on-surface-variant)}.step-summary{display:grid;gap:8px;min-width:0}.step-summary-head{display:grid;gap:2px}.step-summary-index{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--md-sys-color-on-surface-variant);font-weight:600}.step-summary-title{font-size:15px;line-height:1.3;font-weight:600;color:var(--md-sys-color-on-surface)}.step-summary-sub{font-size:12px;color:var(--md-sys-color-on-surface-variant);font-family:var(--md-ref-typeface-plain, monospace);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.step-summary-flags{display:flex;gap:6px;flex-wrap:wrap}.summary-chip{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:999px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant);font-size:11px;font-weight:600}.summary-chip-warn{background:color-mix(in srgb,var(--md-sys-color-error-container) 60%,transparent);color:var(--md-sys-color-on-error-container)}.pdx-active-step{display:grid;gap:18px;min-width:0}.pdx-active-step .hdr{display:flex;gap:12px;align-items:flex-start;justify-content:space-between}.active-step-head{display:grid;gap:4px}.pdx-content-editor{display:grid;gap:16px}.section{display:grid;gap:12px;padding:0;border:none;border-radius:0;background:transparent}.section-body{display:grid;gap:12px}.section-title{font-weight:600;font-size:15px;color:var(--md-sys-color-on-surface)}.section-subtitle{font-size:13px;color:var(--md-sys-color-on-surface-variant);line-height:1.45}.section-head{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.editorial-section{padding-bottom:6px;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 68%,transparent)}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field-span-2{grid-column:span 2}.toggle-group{display:flex;gap:10px;flex-wrap:wrap;padding-top:4px}.disclosure{padding:0 0 12px;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 62%,transparent)}.disclosure summary{list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:16px;cursor:pointer;padding:0;position:relative}.disclosure summary::-webkit-details-marker{display:none}.disclosure summary:after{content:\"expand_more\";font-family:Material Icons;font-size:18px;color:var(--md-sys-color-on-surface-variant);transition:transform .16s ease}.disclosure[open] summary:after{transform:rotate(180deg)}.disclosure summary:focus-visible{outline:2px solid color-mix(in srgb,var(--md-sys-color-primary) 58%,transparent);outline-offset:4px;border-radius:8px}.disclosure-body{padding-top:12px}.widget-list{display:grid;gap:8px}.widget-item{display:grid;grid-template-columns:20px 1fr auto;align-items:start;gap:12px;padding:10px 0;border:none;border-radius:0;background:transparent;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.widget-item .info{display:grid;gap:2px;min-width:0}.widget-item .info .name{font-weight:600}.widget-item .info .sub{font-size:12px;color:var(--md-sys-color-on-surface-variant);line-height:1.45}.widget-item .info .meta{margin-top:2px;font-size:11px;color:var(--md-sys-color-on-surface-variant);font-family:var(--md-ref-typeface-plain, monospace);opacity:.85}.widget-item .actions{display:flex;gap:2px;flex-wrap:nowrap;justify-content:flex-end;align-items:flex-start;opacity:.92}.editorial-item{align-items:start}.editorial-item .actions{justify-content:flex-end}.cta-row{display:flex;gap:8px;align-items:center}.spacer{flex:1 1 auto}.muted{color:var(--md-sys-color-on-surface-variant)}.cta-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-bottom:4px}.cta-row-item{display:grid;gap:10px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.tokens-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:8px 0}.token-item{display:contents}.pdx-appearance{margin-top:8px;display:grid;gap:8px}.pdx-appearance-actions{display:flex;gap:8px;flex-wrap:wrap}.zone-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.zone-column{display:grid;gap:10px;min-width:0}.zone-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.zone-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.zone-title{font-weight:600}.zone-column+.zone-column{padding-left:16px;border-left:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.zone-count{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}.advanced-list{margin-top:4px}.form-row-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.form-row-main{display:flex;align-items:center;gap:12px;min-width:0}.form-row-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}.code-card{margin-top:8px}.code-head{font-weight:600;margin-bottom:4px}.code{white-space:pre;overflow:auto;background:var(--md-sys-color-surface-container-highest)}.w-full{grid-column:1 / -1}.min-180{min-width:180px}.editor-icon-action{color:var(--md-sys-color-on-surface-variant)}.editor-icon-action--danger{color:var(--md-sys-color-error)}.mat-mdc-form-field-icon-suffix{align-self:center}.cta-row-item .cta-head{display:grid;grid-template-columns:20px 1fr;align-items:start;gap:10px}.cta-row-item .cta-title{font-weight:600;color:var(--md-sys-color-on-surface)}.cta-row-item .cta-desc{font-size:12px;color:var(--md-sys-color-on-surface-variant);line-height:1.45;margin-top:2px}.cta-row-item .cta-actions{display:flex;gap:8px;align-items:center}.widget-item:last-child,.cta-row-item:last-child,.form-row-card:last-child{border-bottom:none}@media(max-width:900px){.editor-intro{flex-direction:column}.steps-workspace{grid-template-columns:1fr;gap:20px}.pdx-step-item{grid-template-columns:20px 1fr}.pdx-actions{grid-column:1 / -1;justify-self:end}.widget-item{grid-template-columns:20px 1fr}.widget-item .actions{grid-column:1 / -1;justify-content:flex-end}.form-row-card{flex-direction:column;align-items:flex-start}.form-row-actions{justify-content:flex-start}.zone-column+.zone-column{padding-left:0;border-left:none;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}}@media(max-width:640px){.tab-pad{padding:14px}.editor-title{font-size:20px}.pdx-active-step .hdr{align-items:flex-start;flex-direction:column}.detail-grid{grid-template-columns:1fr}.field-span-2{grid-column:auto}.toggle-group{flex-direction:column;align-items:flex-start}.zone-head{align-items:flex-start;flex-direction:column}.zone-actions,.widget-item .actions{justify-content:flex-start}.disclosure summary{flex-direction:column;align-items:flex-start}}\n"] }]
|
|
5343
|
+
`, styles: [":host{display:block;container-type:inline-size;color:var(--pfx-settings-panel-text-primary, var(--md-sys-color-on-surface))}.pdx-editor{display:grid;gap:16px}.pdx-editor .mat-mdc-form-field{width:100%}.pdx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.pdx-toggles{display:flex;gap:12px;flex-wrap:wrap}.tab-pad{padding:16px;display:grid;gap:16px;background:var(--pfx-settings-panel-surface, var(--md-sys-color-surface));border:1px solid color-mix(in srgb,var(--pfx-settings-panel-border, var(--md-sys-color-outline-variant)) 78%,transparent);border-radius:16px}.help{color:var(--md-sys-color-on-surface-variant);font-size:13px}.editor-intro{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:4px 2px 2px}.editor-intro-copy{display:grid;gap:6px;max-width:760px}.eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant);font-weight:600}.editor-title{font-size:22px;line-height:1.15;font-weight:650;color:var(--md-sys-color-on-surface)}.editor-subtitle{max-width:72ch;color:var(--md-sys-color-on-surface-variant);line-height:1.45;font-size:14px}.editor-intro-meta{display:flex;gap:8px;align-items:flex-start}.meta-pill{display:grid;gap:2px;min-width:88px;padding:10px 12px;border-radius:14px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 70%,transparent);background:var(--md-sys-color-surface-container-low)}.meta-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--md-sys-color-on-surface-variant)}.quick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:6px}.icons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:8px 0}.icon-item{display:grid;gap:6px;align-content:start}.icons-hint{margin-top:4px}.settings-group{display:grid;gap:14px;padding:2px 0 4px}.settings-group+.settings-group,.settings-group+.disclosure,.disclosure+.settings-group{padding-top:18px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 60%,transparent)}.group-head{display:grid;gap:4px;max-width:72ch}.inline-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:start}.inline-action-item{display:grid;gap:8px;align-content:start;min-width:0}.pdx-steps{display:grid;gap:12px;padding:4px 0 2px}.steps-workspace{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:24px;align-items:start}.pdx-steps-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.pdx-step-list{display:grid;gap:10px}.pdx-step-item{display:grid;grid-template-columns:20px 1fr auto;gap:10px;align-items:start;padding:12px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 68%,transparent);border-radius:14px;background:var(--md-sys-color-surface);cursor:pointer;outline:none}.pdx-step-item.active{border-color:color-mix(in srgb,var(--md-sys-color-primary) 55%,var(--md-sys-color-outline-variant));background:color-mix(in srgb,var(--md-sys-color-primary-container) 26%,var(--md-sys-color-surface));box-shadow:none}.pdx-step-item:focus-visible{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}.drag-handle{display:flex;align-items:center;color:var(--md-sys-color-on-surface-variant)}.step-summary{display:grid;gap:8px;min-width:0}.step-summary-head{display:grid;gap:2px}.step-summary-index{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--md-sys-color-on-surface-variant);font-weight:600}.step-summary-title{font-size:15px;line-height:1.3;font-weight:600;color:var(--md-sys-color-on-surface)}.step-summary-sub{font-size:12px;color:var(--md-sys-color-on-surface-variant);font-family:var(--md-ref-typeface-plain, monospace);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.step-summary-flags{display:flex;gap:6px;flex-wrap:wrap}.summary-chip{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:999px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant);font-size:11px;font-weight:600}.summary-chip-warn{background:color-mix(in srgb,var(--md-sys-color-error-container) 60%,transparent);color:var(--md-sys-color-on-error-container)}.pdx-active-step{display:grid;gap:18px;min-width:0}.pdx-active-step .hdr{display:flex;gap:12px;align-items:flex-start;justify-content:space-between}.active-step-head{display:grid;gap:4px}.pdx-content-editor{display:grid;gap:16px}.section{display:grid;gap:12px;padding:0;border:none;border-radius:0;background:transparent}.section-body{display:grid;gap:12px}.section-title{font-weight:600;font-size:15px;color:var(--md-sys-color-on-surface)}.section-subtitle{font-size:13px;color:var(--md-sys-color-on-surface-variant);line-height:1.45}.section-head{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.editorial-section{padding-bottom:6px;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 68%,transparent)}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field-span-2{grid-column:span 2}.toggle-group{display:flex;gap:10px;flex-wrap:wrap;padding-top:4px}.disclosure{padding:0 0 12px;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 62%,transparent)}.disclosure summary{list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:16px;cursor:pointer;padding:0;position:relative}.disclosure summary::-webkit-details-marker{display:none}.disclosure summary:after{content:\"expand_more\";font-family:Material Icons;font-size:18px;color:var(--md-sys-color-on-surface-variant);transition:transform .16s ease}.disclosure[open] summary:after{transform:rotate(180deg)}.disclosure summary:focus-visible{outline:2px solid color-mix(in srgb,var(--md-sys-color-primary) 58%,transparent);outline-offset:4px;border-radius:8px}.disclosure-body{padding-top:12px}.widget-list{display:grid;gap:8px}.widget-item{display:grid;grid-template-columns:20px 1fr auto;align-items:start;gap:12px;padding:10px 0;border:none;border-radius:0;background:transparent;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.widget-item .info{display:grid;gap:2px;min-width:0}.widget-item .info .name{font-weight:600}.widget-item .info .sub{font-size:12px;color:var(--md-sys-color-on-surface-variant);line-height:1.45}.widget-item .info .meta{margin-top:2px;font-size:11px;color:var(--md-sys-color-on-surface-variant);font-family:var(--md-ref-typeface-plain, monospace);opacity:.85}.widget-item .actions{display:flex;gap:2px;flex-wrap:nowrap;justify-content:flex-end;align-items:flex-start;opacity:.92}.editorial-item{align-items:start}.editorial-item .actions{justify-content:flex-end}.cta-row{display:flex;gap:8px;align-items:center}.spacer{flex:1 1 auto}.muted{color:var(--md-sys-color-on-surface-variant)}.cta-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-bottom:4px}.cta-row-item{display:grid;gap:10px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.tokens-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:8px 0}.token-item{display:contents}.pdx-appearance{margin-top:8px;display:grid;gap:8px}.pdx-appearance-actions{display:flex;gap:8px;flex-wrap:wrap}.zone-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.zone-column{display:grid;gap:10px;min-width:0}.zone-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.zone-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.zone-title{font-weight:600}.zone-column+.zone-column{padding-left:16px;border-left:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.zone-count{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}.advanced-list{margin-top:4px}.form-row-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}.form-row-main{display:flex;align-items:center;gap:12px;min-width:0}.form-row-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}.code-card{margin-top:8px}.code-head{font-weight:600;margin-bottom:4px}.code{white-space:pre;overflow:auto;background:var(--md-sys-color-surface-container-highest)}.w-full{grid-column:1 / -1}.min-180{min-width:180px}.editor-icon-action{color:var(--md-sys-color-on-surface-variant)}.editor-icon-action--danger{color:var(--md-sys-color-error)}.mat-mdc-form-field-icon-suffix{align-self:center}.cta-row-item .cta-head{display:grid;grid-template-columns:20px 1fr;align-items:start;gap:10px}.cta-row-item .cta-title{font-weight:600;color:var(--md-sys-color-on-surface)}.cta-row-item .cta-desc{font-size:12px;color:var(--md-sys-color-on-surface-variant);line-height:1.45;margin-top:2px}.cta-row-item .cta-actions{display:flex;gap:8px;align-items:center}.widget-item:last-child,.cta-row-item:last-child,.form-row-card:last-child{border-bottom:none}@container (max-width: 900px){.editor-intro{flex-direction:column}.steps-workspace{grid-template-columns:1fr;gap:20px}.pdx-step-item{grid-template-columns:20px 1fr}.pdx-actions{grid-column:1 / -1;justify-self:end}.widget-item{grid-template-columns:20px 1fr}.widget-item .actions{grid-column:1 / -1;justify-content:flex-end}.form-row-card{flex-direction:column;align-items:flex-start}.form-row-actions{justify-content:flex-start}.zone-column+.zone-column{padding-left:0;border-left:none;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}}@container (max-width: 640px){.tab-pad{padding:14px}.editor-title{font-size:20px}.pdx-active-step .hdr{align-items:flex-start;flex-direction:column}.detail-grid{grid-template-columns:1fr}.field-span-2{grid-column:auto}.toggle-group{flex-direction:column;align-items:flex-start}.zone-head{align-items:flex-start;flex-direction:column}.zone-actions,.widget-item .actions{justify-content:flex-start}.disclosure summary{flex-direction:column;align-items:flex-start}}@media(max-width:900px){.editor-intro{flex-direction:column}.steps-workspace{grid-template-columns:1fr;gap:20px}.pdx-step-item{grid-template-columns:20px 1fr}.pdx-actions{grid-column:1 / -1;justify-self:end}.widget-item{grid-template-columns:20px 1fr}.widget-item .actions{grid-column:1 / -1;justify-content:flex-end}.form-row-card{flex-direction:column;align-items:flex-start}.form-row-actions{justify-content:flex-start}.zone-column+.zone-column{padding-left:0;border-left:none;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 56%,transparent)}}@media(max-width:640px){.tab-pad{padding:14px}.editor-title{font-size:20px}.pdx-active-step .hdr{align-items:flex-start;flex-direction:column}.detail-grid{grid-template-columns:1fr}.field-span-2{grid-column:auto}.toggle-group{flex-direction:column;align-items:flex-start}.zone-head{align-items:flex-start;flex-direction:column}.zone-actions,.widget-item .actions{justify-content:flex-start}.disclosure summary{flex-direction:column;align-items:flex-start}}\n"] }]
|
|
5340
5344
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
5341
5345
|
type: Inject,
|
|
5342
5346
|
args: [SETTINGS_PANEL_DATA]
|
package/package.json
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@praxisui/stepper",
|
|
3
|
-
"version": "10.0.0-rc.
|
|
3
|
+
"version": "10.0.0-rc.36",
|
|
4
4
|
"description": "Stepper workflows for Praxis UI with integrated forms, lists, uploads and page builder support.",
|
|
5
5
|
"peerDependencies": {
|
|
6
6
|
"@angular/common": "^21.0.0",
|
|
7
7
|
"@angular/core": "^21.0.0",
|
|
8
8
|
"@angular/material": "^21.0.0",
|
|
9
9
|
"@angular/cdk": "^21.0.0",
|
|
10
|
-
"@praxisui/core": "^10.0.0-rc.
|
|
11
|
-
"@praxisui/dynamic-form": "^10.0.0-rc.
|
|
12
|
-
"@praxisui/rich-content": "^10.0.0-rc.
|
|
13
|
-
"@praxisui/settings-panel": "^10.0.0-rc.
|
|
14
|
-
"@praxisui/list": "^10.0.0-rc.
|
|
15
|
-
"@praxisui/files-upload": "^10.0.0-rc.
|
|
16
|
-
"@praxisui/page-builder": "^10.0.0-rc.
|
|
10
|
+
"@praxisui/core": "^10.0.0-rc.36",
|
|
11
|
+
"@praxisui/dynamic-form": "^10.0.0-rc.36",
|
|
12
|
+
"@praxisui/rich-content": "^10.0.0-rc.36",
|
|
13
|
+
"@praxisui/settings-panel": "^10.0.0-rc.36",
|
|
14
|
+
"@praxisui/list": "^10.0.0-rc.36",
|
|
15
|
+
"@praxisui/files-upload": "^10.0.0-rc.36",
|
|
16
|
+
"@praxisui/page-builder": "^10.0.0-rc.36",
|
|
17
17
|
"@angular/forms": "^21.0.0",
|
|
18
18
|
"@angular/router": "^21.0.0",
|
|
19
|
-
"@praxisui/ai": "^10.0.0-rc.
|
|
19
|
+
"@praxisui/ai": "^10.0.0-rc.36",
|
|
20
20
|
"rxjs": "~7.8.0"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|