@praxisui/expansion 10.0.0-rc.4 → 10.0.0-rc.40
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.
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"schemaVersion": "1.0.0",
|
|
3
|
-
"generatedAt": "2026-10-
|
|
3
|
+
"generatedAt": "2026-10-26T18:09:20.136Z",
|
|
4
4
|
"packageName": "@praxisui/expansion",
|
|
5
|
-
"packageVersion": "10.0.0-rc.
|
|
5
|
+
"packageVersion": "10.0.0-rc.40",
|
|
6
6
|
"sourceRegistry": "praxis-component-registry-ingestion",
|
|
7
7
|
"sourceRegistryVersion": "1.0.0",
|
|
8
8
|
"componentCount": 1,
|
|
@@ -14,12 +14,14 @@ import * as i4 from '@angular/material/button';
|
|
|
14
14
|
import { MatButtonModule } from '@angular/material/button';
|
|
15
15
|
import * as i6 from '@angular/material/input';
|
|
16
16
|
import { MatInputModule } from '@angular/material/input';
|
|
17
|
-
import * as i7 from '@angular/material/
|
|
17
|
+
import * as i7 from '@angular/material/select';
|
|
18
|
+
import { MatSelectModule } from '@angular/material/select';
|
|
19
|
+
import * as i8 from '@angular/material/slide-toggle';
|
|
18
20
|
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
|
|
19
|
-
import * as
|
|
21
|
+
import * as i9 from '@angular/material/tooltip';
|
|
20
22
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
21
23
|
import { DynamicFieldLoaderDirective } from '@praxisui/dynamic-fields';
|
|
22
|
-
import { deepMerge, ASYNC_CONFIG_STORAGE, DynamicFormService, ComponentKeyService, DynamicWidgetLoaderDirective, PraxisIconDirective, PraxisIconButtonComponent, ComponentMetadataRegistry } from '@praxisui/core';
|
|
24
|
+
import { deepMerge, ASYNC_CONFIG_STORAGE, DynamicFormService, ComponentKeyService, DynamicWidgetLoaderDirective, PraxisIconDirective, EmptyStateCardComponent, PraxisIconButtonComponent, ComponentMetadataRegistry } from '@praxisui/core';
|
|
23
25
|
import { SettingsPanelService, SETTINGS_PANEL_DATA } from '@praxisui/settings-panel';
|
|
24
26
|
import { firstValueFrom, BehaviorSubject, Subscription } from 'rxjs';
|
|
25
27
|
import { take } from 'rxjs/operators';
|
|
@@ -1431,14 +1433,22 @@ class PraxisExpansion {
|
|
|
1431
1433
|
</ng-template>
|
|
1432
1434
|
</mat-expansion-panel>
|
|
1433
1435
|
} @else {
|
|
1434
|
-
<
|
|
1435
|
-
|
|
1436
|
-
|
|
1437
|
-
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1436
|
+
<praxis-empty-state-card
|
|
1437
|
+
class="praxis-expansion-empty"
|
|
1438
|
+
[inline]="true"
|
|
1439
|
+
icon="unfold_more"
|
|
1440
|
+
title="Nenhum painel configurado"
|
|
1441
|
+
description="Adicione painéis retráteis para organizar formulários ou widgets por seção."
|
|
1442
|
+
[primaryAction]="
|
|
1443
|
+
enableCustomization
|
|
1444
|
+
? {
|
|
1445
|
+
label: 'Configurar painéis',
|
|
1446
|
+
icon: 'tune',
|
|
1447
|
+
action: openEditor.bind(this),
|
|
1448
|
+
}
|
|
1449
|
+
: undefined
|
|
1450
|
+
"
|
|
1451
|
+
></praxis-empty-state-card>
|
|
1442
1452
|
}
|
|
1443
1453
|
}
|
|
1444
1454
|
</div>
|
|
@@ -1453,7 +1463,7 @@ class PraxisExpansion {
|
|
|
1453
1463
|
<mat-icon fontIcon="edit"></mat-icon>
|
|
1454
1464
|
</button>
|
|
1455
1465
|
}
|
|
1456
|
-
`, isInline: true, styles: [":host{display:block;position:relative;color:var(--md-sys-color-on-surface)}.praxis-expansion-root{display:block;--p-exp-surface: var(--md-sys-color-surface);--p-exp-surface-container: var(--md-sys-color-surface-container);--p-exp-border: var(--md-sys-color-outline-variant);--p-exp-text: var(--md-sys-color-on-surface);--p-exp-text-muted: var(--md-sys-color-on-surface-variant);--p-exp-focus: var(--md-sys-color-primary);--p-exp-radius: 12px}.mat-expansion-panel{background:var(--p-exp-surface);border:1px solid var(--p-exp-border);border-radius:var(--p-exp-radius);overflow:clip}.mat-expansion-panel:not(:last-child){margin-bottom:var(--p-exp-panel-gap, 12px)}.mat-expansion-panel-header{background:var(--p-exp-surface-container);color:var(--p-exp-text)}.mat-expansion-panel-header:focus-visible{outline:2px solid var(--p-exp-focus);outline-offset:-2px}.mat-expansion-panel-header-title{font-weight:600}.mat-expansion-panel-header-description{color:var(--p-exp-text-muted)}.mat-expansion-panel-body{padding:12px 16px 16px}.mat-action-row{border-top:1px solid var(--p-exp-border)}.density-compact .mat-expansion-panel-body{padding:8px 12px 12px}.density-compact .mat-expansion-panel-header{min-height:40px;padding:0 12px}.density-comfortable .mat-expansion-panel-body{padding:12px 16px 16px}.density-comfortable .mat-expansion-panel-header{min-height:48px;padding:0 16px}.density-spacious .mat-expansion-panel-body{padding:16px 20px 20px}.density-spacious .mat-expansion-panel-header{min-height:56px;padding:0 20px}.praxis-expansion-empty{display:
|
|
1466
|
+
`, isInline: true, styles: [":host{display:block;position:relative;color:var(--md-sys-color-on-surface)}.praxis-expansion-root{display:block;--p-exp-surface: var(--md-sys-color-surface);--p-exp-surface-container: var(--md-sys-color-surface-container);--p-exp-border: var(--md-sys-color-outline-variant);--p-exp-text: var(--md-sys-color-on-surface);--p-exp-text-muted: var(--md-sys-color-on-surface-variant);--p-exp-focus: var(--md-sys-color-primary);--p-exp-radius: 12px}.mat-expansion-panel{background:var(--p-exp-surface);border:1px solid var(--p-exp-border);border-radius:var(--p-exp-radius);overflow:clip}.mat-expansion-panel:not(:last-child){margin-bottom:var(--p-exp-panel-gap, 12px)}.mat-expansion-panel-header{background:var(--p-exp-surface-container);color:var(--p-exp-text)}.mat-expansion-panel-header:focus-visible{outline:2px solid var(--p-exp-focus);outline-offset:-2px}.mat-expansion-panel-header-title{font-weight:600}.mat-expansion-panel-header-description{color:var(--p-exp-text-muted)}.mat-expansion-panel-body{padding:12px 16px 16px}.mat-action-row{border-top:1px solid var(--p-exp-border)}.density-compact .mat-expansion-panel-body{padding:8px 12px 12px}.density-compact .mat-expansion-panel-header{min-height:40px;padding:0 12px}.density-comfortable .mat-expansion-panel-body{padding:12px 16px 16px}.density-comfortable .mat-expansion-panel-header{min-height:48px;padding:0 16px}.density-spacious .mat-expansion-panel-body{padding:16px 20px 20px}.density-spacious .mat-expansion-panel-header{min-height:56px;padding:0 20px}.praxis-expansion-empty{display:block}.edit-fab{position:absolute;right:12px;bottom:12px;z-index:2}.expansion-ai-assistant{position:absolute;right:12px;bottom:72px;z-index:3}.expansion-ai-assistant-trigger{box-shadow:var(--md-sys-elevation-level2, 0 4px 12px rgba(0, 0, 0, .18))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i2.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i2.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "directive", type: i2.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.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: "component", type: i4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: DynamicFieldLoaderDirective, selector: "[dynamicFieldLoader]", inputs: ["fields", "formGroup", "enableExternalControlBinding", "itemTemplate", "debugTrace", "debugTraceLabel", "readonlyMode", "disabledMode", "presentationMode", "visible", "canvasMode"], outputs: ["componentsCreated", "fieldCreated", "fieldDestroyed", "renderError", "canvasMouseEnter", "canvasMouseLeave", "canvasClick", "canvasFocus"] }, { kind: "directive", type: DynamicWidgetLoaderDirective, selector: "[dynamicWidgetLoader]", inputs: ["dynamicWidgetLoader", "ownerWidgetKey", "context", "strictValidation", "autoWireOutputs"], outputs: ["widgetEvent", "widgetDiagnostic"], exportAs: ["dynamicWidgetLoader"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "component", type: EmptyStateCardComponent, selector: "praxis-empty-state-card", inputs: ["icon", "title", "description", "primaryAction", "secondaryActions", "inline", "tone", "variant", "alignment", "density", "iconContainer"] }, { kind: "component", type: PraxisAiAssistantShellComponent, selector: "praxis-ai-assistant-shell", inputs: ["labels", "mode", "state", "contextItems", "attachments", "messages", "quickReplies", "recommendedIntents", "prompt", "statusText", "errorText", "testIdPrefix", "panelTestId", "submitTestId", "applyTestId", "primaryAction", "secondaryActions", "governanceActions", "busy", "canSubmit", "canApply", "submitOnEnter", "showAttachAction", "enablePastedAttachments", "enableFileAttachments", "attachmentAccept", "attachmentMultiple", "voiceInputMode", "voiceLanguage", "draggable", "resizable", "minWidth", "minHeight", "margin", "layout"], outputs: ["promptChange", "submitPrompt", "apply", "retryTurn", "cancelTurn", "shellAction", "close", "attach", "attachmentsPasted", "attachmentsSelected", "removeAttachment", "messageAction", "editMessage", "resendMessage", "quickReply", "recommendedIntent", "layoutChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1457
1467
|
}
|
|
1458
1468
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisExpansion, decorators: [{
|
|
1459
1469
|
type: Component,
|
|
@@ -1465,6 +1475,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
1465
1475
|
DynamicFieldLoaderDirective,
|
|
1466
1476
|
DynamicWidgetLoaderDirective,
|
|
1467
1477
|
PraxisIconDirective,
|
|
1478
|
+
EmptyStateCardComponent,
|
|
1468
1479
|
PraxisAiAssistantShellComponent,
|
|
1469
1480
|
], template: `
|
|
1470
1481
|
<div
|
|
@@ -1663,14 +1674,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
1663
1674
|
</ng-template>
|
|
1664
1675
|
</mat-expansion-panel>
|
|
1665
1676
|
} @else {
|
|
1666
|
-
<
|
|
1667
|
-
|
|
1668
|
-
|
|
1669
|
-
|
|
1670
|
-
|
|
1671
|
-
|
|
1672
|
-
|
|
1673
|
-
|
|
1677
|
+
<praxis-empty-state-card
|
|
1678
|
+
class="praxis-expansion-empty"
|
|
1679
|
+
[inline]="true"
|
|
1680
|
+
icon="unfold_more"
|
|
1681
|
+
title="Nenhum painel configurado"
|
|
1682
|
+
description="Adicione painéis retráteis para organizar formulários ou widgets por seção."
|
|
1683
|
+
[primaryAction]="
|
|
1684
|
+
enableCustomization
|
|
1685
|
+
? {
|
|
1686
|
+
label: 'Configurar painéis',
|
|
1687
|
+
icon: 'tune',
|
|
1688
|
+
action: openEditor.bind(this),
|
|
1689
|
+
}
|
|
1690
|
+
: undefined
|
|
1691
|
+
"
|
|
1692
|
+
></praxis-empty-state-card>
|
|
1674
1693
|
}
|
|
1675
1694
|
}
|
|
1676
1695
|
</div>
|
|
@@ -1685,7 +1704,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
1685
1704
|
<mat-icon fontIcon="edit"></mat-icon>
|
|
1686
1705
|
</button>
|
|
1687
1706
|
}
|
|
1688
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;position:relative;color:var(--md-sys-color-on-surface)}.praxis-expansion-root{display:block;--p-exp-surface: var(--md-sys-color-surface);--p-exp-surface-container: var(--md-sys-color-surface-container);--p-exp-border: var(--md-sys-color-outline-variant);--p-exp-text: var(--md-sys-color-on-surface);--p-exp-text-muted: var(--md-sys-color-on-surface-variant);--p-exp-focus: var(--md-sys-color-primary);--p-exp-radius: 12px}.mat-expansion-panel{background:var(--p-exp-surface);border:1px solid var(--p-exp-border);border-radius:var(--p-exp-radius);overflow:clip}.mat-expansion-panel:not(:last-child){margin-bottom:var(--p-exp-panel-gap, 12px)}.mat-expansion-panel-header{background:var(--p-exp-surface-container);color:var(--p-exp-text)}.mat-expansion-panel-header:focus-visible{outline:2px solid var(--p-exp-focus);outline-offset:-2px}.mat-expansion-panel-header-title{font-weight:600}.mat-expansion-panel-header-description{color:var(--p-exp-text-muted)}.mat-expansion-panel-body{padding:12px 16px 16px}.mat-action-row{border-top:1px solid var(--p-exp-border)}.density-compact .mat-expansion-panel-body{padding:8px 12px 12px}.density-compact .mat-expansion-panel-header{min-height:40px;padding:0 12px}.density-comfortable .mat-expansion-panel-body{padding:12px 16px 16px}.density-comfortable .mat-expansion-panel-header{min-height:48px;padding:0 16px}.density-spacious .mat-expansion-panel-body{padding:16px 20px 20px}.density-spacious .mat-expansion-panel-header{min-height:56px;padding:0 20px}.praxis-expansion-empty{display:
|
|
1707
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;position:relative;color:var(--md-sys-color-on-surface)}.praxis-expansion-root{display:block;--p-exp-surface: var(--md-sys-color-surface);--p-exp-surface-container: var(--md-sys-color-surface-container);--p-exp-border: var(--md-sys-color-outline-variant);--p-exp-text: var(--md-sys-color-on-surface);--p-exp-text-muted: var(--md-sys-color-on-surface-variant);--p-exp-focus: var(--md-sys-color-primary);--p-exp-radius: 12px}.mat-expansion-panel{background:var(--p-exp-surface);border:1px solid var(--p-exp-border);border-radius:var(--p-exp-radius);overflow:clip}.mat-expansion-panel:not(:last-child){margin-bottom:var(--p-exp-panel-gap, 12px)}.mat-expansion-panel-header{background:var(--p-exp-surface-container);color:var(--p-exp-text)}.mat-expansion-panel-header:focus-visible{outline:2px solid var(--p-exp-focus);outline-offset:-2px}.mat-expansion-panel-header-title{font-weight:600}.mat-expansion-panel-header-description{color:var(--p-exp-text-muted)}.mat-expansion-panel-body{padding:12px 16px 16px}.mat-action-row{border-top:1px solid var(--p-exp-border)}.density-compact .mat-expansion-panel-body{padding:8px 12px 12px}.density-compact .mat-expansion-panel-header{min-height:40px;padding:0 12px}.density-comfortable .mat-expansion-panel-body{padding:12px 16px 16px}.density-comfortable .mat-expansion-panel-header{min-height:48px;padding:0 16px}.density-spacious .mat-expansion-panel-body{padding:16px 20px 20px}.density-spacious .mat-expansion-panel-header{min-height:56px;padding:0 20px}.praxis-expansion-empty{display:block}.edit-fab{position:absolute;right:12px;bottom:12px;z-index:2}.expansion-ai-assistant{position:absolute;right:12px;bottom:72px;z-index:3}.expansion-ai-assistant-trigger{box-shadow:var(--md-sys-elevation-level2, 0 4px 12px rgba(0, 0, 0, .18))}\n"] }]
|
|
1689
1708
|
}], propDecorators: { config: [{
|
|
1690
1709
|
type: Input
|
|
1691
1710
|
}], expansionId: [{
|
|
@@ -1904,12 +1923,12 @@ class PraxisExpansionConfigEditor {
|
|
|
1904
1923
|
</mat-form-field>
|
|
1905
1924
|
<mat-form-field appearance="outline">
|
|
1906
1925
|
<mat-label>Densidade</mat-label>
|
|
1907
|
-
<select
|
|
1908
|
-
<option value="">Padrão</option>
|
|
1909
|
-
<option value="compact">Compacta</option>
|
|
1910
|
-
<option value="comfortable">Confortável</option>
|
|
1911
|
-
<option value="spacious">Espaçosa</option>
|
|
1912
|
-
</select>
|
|
1926
|
+
<mat-select [value]="config?.appearance?.density || ''" (selectionChange)="setAppearance('density', $event.value || undefined)" placeholder="Padrão">
|
|
1927
|
+
<mat-option value="">Padrão</mat-option>
|
|
1928
|
+
<mat-option value="compact">Compacta</mat-option>
|
|
1929
|
+
<mat-option value="comfortable">Confortável</mat-option>
|
|
1930
|
+
<mat-option value="spacious">Espaçosa</mat-option>
|
|
1931
|
+
</mat-select>
|
|
1913
1932
|
</mat-form-field>
|
|
1914
1933
|
</div>
|
|
1915
1934
|
|
|
@@ -1933,13 +1952,13 @@ class PraxisExpansionConfigEditor {
|
|
|
1933
1952
|
</mat-form-field>
|
|
1934
1953
|
<mat-form-field appearance="outline">
|
|
1935
1954
|
<mat-label>Estilo da borda</mat-label>
|
|
1936
|
-
<select
|
|
1937
|
-
<option value="">Padrão</option>
|
|
1938
|
-
<option value="solid">Solid</option>
|
|
1939
|
-
<option value="dashed">Dashed</option>
|
|
1940
|
-
<option value="dotted">Dotted</option>
|
|
1941
|
-
<option value="none">None</option>
|
|
1942
|
-
</select>
|
|
1955
|
+
<mat-select [value]="config?.appearance?.container?.borderStyle || ''" (selectionChange)="setContainer('borderStyle', $event.value || undefined)" placeholder="Padrão">
|
|
1956
|
+
<mat-option value="">Padrão</mat-option>
|
|
1957
|
+
<mat-option value="solid">Solid</mat-option>
|
|
1958
|
+
<mat-option value="dashed">Dashed</mat-option>
|
|
1959
|
+
<mat-option value="dotted">Dotted</mat-option>
|
|
1960
|
+
<mat-option value="none">None</mat-option>
|
|
1961
|
+
</mat-select>
|
|
1943
1962
|
</mat-form-field>
|
|
1944
1963
|
<mat-form-field appearance="outline">
|
|
1945
1964
|
<mat-label>Raio da borda</mat-label>
|
|
@@ -2077,17 +2096,17 @@ class PraxisExpansionConfigEditor {
|
|
|
2077
2096
|
</mat-form-field>
|
|
2078
2097
|
<mat-form-field appearance="outline">
|
|
2079
2098
|
<mat-label>Modo de exibição</mat-label>
|
|
2080
|
-
<select
|
|
2081
|
-
<option value="default">Padrão</option>
|
|
2082
|
-
<option value="flat">Flat</option>
|
|
2083
|
-
</select>
|
|
2099
|
+
<mat-select [value]="config?.accordion?.displayMode || 'default'" (selectionChange)="setAccordion('displayMode', $event.value)">
|
|
2100
|
+
<mat-option value="default">Padrão</mat-option>
|
|
2101
|
+
<mat-option value="flat">Flat</mat-option>
|
|
2102
|
+
</mat-select>
|
|
2084
2103
|
</mat-form-field>
|
|
2085
2104
|
<mat-form-field appearance="outline">
|
|
2086
2105
|
<mat-label>Posição do toggle</mat-label>
|
|
2087
|
-
<select
|
|
2088
|
-
<option value="after">Depois</option>
|
|
2089
|
-
<option value="before">Antes</option>
|
|
2090
|
-
</select>
|
|
2106
|
+
<mat-select [value]="config?.accordion?.togglePosition || 'after'" (selectionChange)="setAccordion('togglePosition', $event.value)">
|
|
2107
|
+
<mat-option value="after">Depois</mat-option>
|
|
2108
|
+
<mat-option value="before">Antes</mat-option>
|
|
2109
|
+
</mat-select>
|
|
2091
2110
|
</mat-form-field>
|
|
2092
2111
|
<div class="row wrap">
|
|
2093
2112
|
<mat-slide-toggle [checked]="config?.accordion?.multi || false" (change)="setAccordion('multi', $event.checked)">Múltiplos abertos</mat-slide-toggle>
|
|
@@ -2136,7 +2155,7 @@ class PraxisExpansionConfigEditor {
|
|
|
2136
2155
|
</section>
|
|
2137
2156
|
}
|
|
2138
2157
|
</div>
|
|
2139
|
-
`, isInline: true, styles: [":host{display:block;color:var(--md-sys-color-on-surface)}.pdx-expansion-editor{display:grid;gap:16px}.sec{border:1px solid var(--md-sys-color-outline-variant);padding:
|
|
2158
|
+
`, isInline: true, styles: [":host{display:block;container-type:inline-size;color:var(--pfx-settings-panel-text-primary, var(--md-sys-color-on-surface))}.pdx-expansion-editor{display:grid;gap:16px}.sec{border:1px solid var(--pfx-settings-panel-border, var(--md-sys-color-outline-variant));padding:14px;border-radius:12px;background:var(--pfx-settings-panel-surface, var(--md-sys-color-surface-container-lowest));display:grid;gap:12px}.sec h4,.sec h5{margin:0;font-weight:600;color:var(--pfx-settings-panel-text-primary, var(--md-sys-color-on-surface))}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.wrap{flex-wrap:wrap}.panel-row{display:flex;gap:8px;align-items:center;width:100%;flex-wrap:wrap}.grow{flex:1 1 auto}.grid{display:grid;gap:10px;align-items:center}.grid.two{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.full{width:100%}.error{color:var(--md-sys-color-error);font-size:12px}.pdx-expansion-editor .mat-mdc-form-field{width:100%;--mdc-outlined-text-field-container-height: 48px;--mdc-outlined-text-field-outline-color: var(--md-sys-color-outline-variant);--mdc-outlined-text-field-hover-outline-color: var(--md-sys-color-outline);--mdc-outlined-text-field-focus-outline-color: var(--md-sys-color-primary);--mdc-outlined-text-field-error-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-focus-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-hover-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-label-text-color: var(--md-sys-color-on-surface-variant);--mdc-outlined-text-field-input-text-color: var(--md-sys-color-on-surface);--mdc-outlined-text-field-supporting-text-color: var(--md-sys-color-on-surface-variant)}@container (max-width: 600px){.grid.two{grid-template-columns:1fr}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.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: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { 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: "directive", type: i5.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.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: i7.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: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i8.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: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: PraxisIconButtonComponent, selector: "button[praxisIconButton]", inputs: ["praxisIconButton", "size", "appearance", "presentation", "pressed", "busy"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2140
2159
|
}
|
|
2141
2160
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisExpansionConfigEditor, decorators: [{
|
|
2142
2161
|
type: Component,
|
|
@@ -2146,6 +2165,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
2146
2165
|
MatIconModule,
|
|
2147
2166
|
MatFormFieldModule,
|
|
2148
2167
|
MatInputModule,
|
|
2168
|
+
MatSelectModule,
|
|
2149
2169
|
MatSlideToggleModule,
|
|
2150
2170
|
MatTooltipModule,
|
|
2151
2171
|
PraxisIconButtonComponent,
|
|
@@ -2161,12 +2181,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
2161
2181
|
</mat-form-field>
|
|
2162
2182
|
<mat-form-field appearance="outline">
|
|
2163
2183
|
<mat-label>Densidade</mat-label>
|
|
2164
|
-
<select
|
|
2165
|
-
<option value="">Padrão</option>
|
|
2166
|
-
<option value="compact">Compacta</option>
|
|
2167
|
-
<option value="comfortable">Confortável</option>
|
|
2168
|
-
<option value="spacious">Espaçosa</option>
|
|
2169
|
-
</select>
|
|
2184
|
+
<mat-select [value]="config?.appearance?.density || ''" (selectionChange)="setAppearance('density', $event.value || undefined)" placeholder="Padrão">
|
|
2185
|
+
<mat-option value="">Padrão</mat-option>
|
|
2186
|
+
<mat-option value="compact">Compacta</mat-option>
|
|
2187
|
+
<mat-option value="comfortable">Confortável</mat-option>
|
|
2188
|
+
<mat-option value="spacious">Espaçosa</mat-option>
|
|
2189
|
+
</mat-select>
|
|
2170
2190
|
</mat-form-field>
|
|
2171
2191
|
</div>
|
|
2172
2192
|
|
|
@@ -2190,13 +2210,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
2190
2210
|
</mat-form-field>
|
|
2191
2211
|
<mat-form-field appearance="outline">
|
|
2192
2212
|
<mat-label>Estilo da borda</mat-label>
|
|
2193
|
-
<select
|
|
2194
|
-
<option value="">Padrão</option>
|
|
2195
|
-
<option value="solid">Solid</option>
|
|
2196
|
-
<option value="dashed">Dashed</option>
|
|
2197
|
-
<option value="dotted">Dotted</option>
|
|
2198
|
-
<option value="none">None</option>
|
|
2199
|
-
</select>
|
|
2213
|
+
<mat-select [value]="config?.appearance?.container?.borderStyle || ''" (selectionChange)="setContainer('borderStyle', $event.value || undefined)" placeholder="Padrão">
|
|
2214
|
+
<mat-option value="">Padrão</mat-option>
|
|
2215
|
+
<mat-option value="solid">Solid</mat-option>
|
|
2216
|
+
<mat-option value="dashed">Dashed</mat-option>
|
|
2217
|
+
<mat-option value="dotted">Dotted</mat-option>
|
|
2218
|
+
<mat-option value="none">None</mat-option>
|
|
2219
|
+
</mat-select>
|
|
2200
2220
|
</mat-form-field>
|
|
2201
2221
|
<mat-form-field appearance="outline">
|
|
2202
2222
|
<mat-label>Raio da borda</mat-label>
|
|
@@ -2334,17 +2354,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
2334
2354
|
</mat-form-field>
|
|
2335
2355
|
<mat-form-field appearance="outline">
|
|
2336
2356
|
<mat-label>Modo de exibição</mat-label>
|
|
2337
|
-
<select
|
|
2338
|
-
<option value="default">Padrão</option>
|
|
2339
|
-
<option value="flat">Flat</option>
|
|
2340
|
-
</select>
|
|
2357
|
+
<mat-select [value]="config?.accordion?.displayMode || 'default'" (selectionChange)="setAccordion('displayMode', $event.value)">
|
|
2358
|
+
<mat-option value="default">Padrão</mat-option>
|
|
2359
|
+
<mat-option value="flat">Flat</mat-option>
|
|
2360
|
+
</mat-select>
|
|
2341
2361
|
</mat-form-field>
|
|
2342
2362
|
<mat-form-field appearance="outline">
|
|
2343
2363
|
<mat-label>Posição do toggle</mat-label>
|
|
2344
|
-
<select
|
|
2345
|
-
<option value="after">Depois</option>
|
|
2346
|
-
<option value="before">Antes</option>
|
|
2347
|
-
</select>
|
|
2364
|
+
<mat-select [value]="config?.accordion?.togglePosition || 'after'" (selectionChange)="setAccordion('togglePosition', $event.value)">
|
|
2365
|
+
<mat-option value="after">Depois</mat-option>
|
|
2366
|
+
<mat-option value="before">Antes</mat-option>
|
|
2367
|
+
</mat-select>
|
|
2348
2368
|
</mat-form-field>
|
|
2349
2369
|
<div class="row wrap">
|
|
2350
2370
|
<mat-slide-toggle [checked]="config?.accordion?.multi || false" (change)="setAccordion('multi', $event.checked)">Múltiplos abertos</mat-slide-toggle>
|
|
@@ -2393,7 +2413,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
2393
2413
|
</section>
|
|
2394
2414
|
}
|
|
2395
2415
|
</div>
|
|
2396
|
-
`, styles: [":host{display:block;color:var(--md-sys-color-on-surface)}.pdx-expansion-editor{display:grid;gap:16px}.sec{border:1px solid var(--md-sys-color-outline-variant);padding:
|
|
2416
|
+
`, styles: [":host{display:block;container-type:inline-size;color:var(--pfx-settings-panel-text-primary, var(--md-sys-color-on-surface))}.pdx-expansion-editor{display:grid;gap:16px}.sec{border:1px solid var(--pfx-settings-panel-border, var(--md-sys-color-outline-variant));padding:14px;border-radius:12px;background:var(--pfx-settings-panel-surface, var(--md-sys-color-surface-container-lowest));display:grid;gap:12px}.sec h4,.sec h5{margin:0;font-weight:600;color:var(--pfx-settings-panel-text-primary, var(--md-sys-color-on-surface))}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.wrap{flex-wrap:wrap}.panel-row{display:flex;gap:8px;align-items:center;width:100%;flex-wrap:wrap}.grow{flex:1 1 auto}.grid{display:grid;gap:10px;align-items:center}.grid.two{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.full{width:100%}.error{color:var(--md-sys-color-error);font-size:12px}.pdx-expansion-editor .mat-mdc-form-field{width:100%;--mdc-outlined-text-field-container-height: 48px;--mdc-outlined-text-field-outline-color: var(--md-sys-color-outline-variant);--mdc-outlined-text-field-hover-outline-color: var(--md-sys-color-outline);--mdc-outlined-text-field-focus-outline-color: var(--md-sys-color-primary);--mdc-outlined-text-field-error-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-focus-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-hover-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-label-text-color: var(--md-sys-color-on-surface-variant);--mdc-outlined-text-field-input-text-color: var(--md-sys-color-on-surface);--mdc-outlined-text-field-supporting-text-color: var(--md-sys-color-on-surface-variant)}@container (max-width: 600px){.grid.two{grid-template-columns:1fr}}\n"] }]
|
|
2397
2417
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
2398
2418
|
type: Inject,
|
|
2399
2419
|
args: [SETTINGS_PANEL_DATA]
|
package/package.json
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@praxisui/expansion",
|
|
3
|
-
"version": "10.0.0-rc.
|
|
3
|
+
"version": "10.0.0-rc.40",
|
|
4
4
|
"description": "Expansion panel (accordion) components for Praxis UI with metadata configuration and editor integration.",
|
|
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-fields": "^10.0.0-rc.
|
|
12
|
-
"@praxisui/settings-panel": "^10.0.0-rc.
|
|
10
|
+
"@praxisui/core": "^10.0.0-rc.40",
|
|
11
|
+
"@praxisui/dynamic-fields": "^10.0.0-rc.40",
|
|
12
|
+
"@praxisui/settings-panel": "^10.0.0-rc.40",
|
|
13
13
|
"@angular/forms": "^21.0.0",
|
|
14
14
|
"@angular/router": "^21.0.0",
|
|
15
|
-
"@praxisui/ai": "^10.0.0-rc.
|
|
15
|
+
"@praxisui/ai": "^10.0.0-rc.40",
|
|
16
16
|
"rxjs": "~7.8.0"
|
|
17
17
|
},
|
|
18
18
|
"dependencies": {
|