@patter/ngx-components 19.0.4 → 20.0.5
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/fesm2022/patter-ngx-components.mjs +59 -60
- package/fesm2022/patter-ngx-components.mjs.map +1 -1
- package/index.d.ts +450 -3
- package/package.json +3 -3
- package/patter-ngx-components-20.0.5.tgz +0 -0
- package/lib/components/tabs/ptr-tab/ptr-tab.component.d.ts +0 -8
- package/lib/components/tabs/ptr-tabs/ptr-tabs.component.d.ts +0 -23
- package/lib/dialog/ptr-dialog/ptr-dialog.component.d.ts +0 -24
- package/lib/dialog/ptr-dialog.service.d.ts +0 -22
- package/lib/dialog/ptr-tooltip/ptr-tooltip.component.d.ts +0 -11
- package/lib/forms/form/form.component.d.ts +0 -26
- package/lib/forms/input/ptr-chip-input/ptr-chip-input.component.d.ts +0 -30
- package/lib/forms/input/ptr-input/ptr-input.component.d.ts +0 -39
- package/lib/forms/input/ptr-select/select.component.d.ts +0 -33
- package/lib/forms/interfaces.d.ts +0 -48
- package/lib/forms/shared/ptr-dialog-list/ptr-dialog-list.component.d.ts +0 -43
- package/lib/loading-spinner/loading-spinner.component.d.ts +0 -5
- package/lib/loading-spinner/loading-spinner.directive.d.ts +0 -20
- package/lib/menu/menu.component.d.ts +0 -11
- package/lib/ptr-breadcrumbs/interfaces.d.ts +0 -8
- package/lib/ptr-breadcrumbs/ptr-breadcrumbs.component.d.ts +0 -13
- package/lib/ptr-button/ptr-button.component.d.ts +0 -29
- package/lib/ptr-title/ptr-title.component.d.ts +0 -17
- package/lib/ptr-toaster/interfaces.d.ts +0 -5
- package/lib/ptr-toaster/ptr-toaster/ptr-toaster.component.d.ts +0 -7
- package/lib/ptr-toaster/ptr-toaster.service.d.ts +0 -18
- package/lib/services/loading.service.d.ts +0 -39
- package/patter-ngx-components-19.0.4.tgz +0 -0
- package/public-api.d.ts +0 -21
|
@@ -12,10 +12,10 @@ import { take } from 'rxjs/operators';
|
|
|
12
12
|
|
|
13
13
|
class PtrMenuComponent {
|
|
14
14
|
menuItems = [];
|
|
15
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
16
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
15
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
16
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrMenuComponent, isStandalone: true, selector: "ptr-menu", inputs: { menuItems: "menuItems" }, ngImport: i0, template: "<nav class=\"ptr-menu\">\n <ul class=\"menu\">\n @for (item of menuItems; track item.label) {\n <li class=\"menu-item\" routerLinkActive=\"current_page_item\" [routerLinkActiveOptions]=\"{exact: true}\">\n <a [routerLink]=\"item.link || '#'\">{{item.label}}</a>\n </li>\n }\n </ul>\n</nav>\n", styles: [".menu{display:flex;flex-direction:row;gap:var(--wp--custom--content--gap, 40px);align-items:center}.menu>ul{display:flex;flex-direction:row;gap:var(--wp--custom--content--gap, 40px);align-items:center}.menu--vertical{flex-direction:column;align-items:flex-start;gap:calc(var(--wp--custom--content--gap, 40px) / 2)}.menu--vertical>ul{flex-direction:column;align-items:flex-start;gap:calc(var(--wp--custom--content--gap, 40px) / 2)}.menu li.current-menu-item>a,.menu li.current_page_item>a,.menu li.current-menu-parent>a{opacity:1;font-weight:700}.menu a{transition:color .33s}.menu a:hover,.menu a:focus{text-decoration:none}.menu a{position:relative;text-decoration:none;padding:8px 0;font-family:var(--wp--preset--font-family--heading-font);letter-spacing:-.72px;color:var(--ptr-menu-color, var(--wp--preset--color--black))}.menu a:before,.menu a:after{content:\"\";position:absolute;bottom:2px;left:0;right:0;height:2px;background-color:var(--wp--preset--color--primary)}.menu a:before{opacity:0;transform:translateY(-8px);transition:transform 0s cubic-bezier(.175,.885,.32,1.275),opacity 0s}.menu a:after{opacity:0;transform:translateY(4px);transition:transform .2s cubic-bezier(.175,.885,.32,1.275),opacity .2s}.menu a:hover:before,.menu a:hover:after,.menu a:focus:before,.menu a:focus:after{opacity:1;transform:translateY(0)}.menu a:hover:before,.menu a:focus:before{transition:transform .2s cubic-bezier(.175,.885,.32,1.275),opacity .2s}.menu a:hover:after,.menu a:focus:after{transition:transform 0s .2s cubic-bezier(.175,.885,.32,1.275),opacity 0s .2s}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
17
17
|
}
|
|
18
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
18
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrMenuComponent, decorators: [{
|
|
19
19
|
type: Component,
|
|
20
20
|
args: [{ selector: 'ptr-menu', imports: [RouterModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav class=\"ptr-menu\">\n <ul class=\"menu\">\n @for (item of menuItems; track item.label) {\n <li class=\"menu-item\" routerLinkActive=\"current_page_item\" [routerLinkActiveOptions]=\"{exact: true}\">\n <a [routerLink]=\"item.link || '#'\">{{item.label}}</a>\n </li>\n }\n </ul>\n</nav>\n", styles: [".menu{display:flex;flex-direction:row;gap:var(--wp--custom--content--gap, 40px);align-items:center}.menu>ul{display:flex;flex-direction:row;gap:var(--wp--custom--content--gap, 40px);align-items:center}.menu--vertical{flex-direction:column;align-items:flex-start;gap:calc(var(--wp--custom--content--gap, 40px) / 2)}.menu--vertical>ul{flex-direction:column;align-items:flex-start;gap:calc(var(--wp--custom--content--gap, 40px) / 2)}.menu li.current-menu-item>a,.menu li.current_page_item>a,.menu li.current-menu-parent>a{opacity:1;font-weight:700}.menu a{transition:color .33s}.menu a:hover,.menu a:focus{text-decoration:none}.menu a{position:relative;text-decoration:none;padding:8px 0;font-family:var(--wp--preset--font-family--heading-font);letter-spacing:-.72px;color:var(--ptr-menu-color, var(--wp--preset--color--black))}.menu a:before,.menu a:after{content:\"\";position:absolute;bottom:2px;left:0;right:0;height:2px;background-color:var(--wp--preset--color--primary)}.menu a:before{opacity:0;transform:translateY(-8px);transition:transform 0s cubic-bezier(.175,.885,.32,1.275),opacity 0s}.menu a:after{opacity:0;transform:translateY(4px);transition:transform .2s cubic-bezier(.175,.885,.32,1.275),opacity .2s}.menu a:hover:before,.menu a:hover:after,.menu a:focus:before,.menu a:focus:after{opacity:1;transform:translateY(0)}.menu a:hover:before,.menu a:focus:before{transition:transform .2s cubic-bezier(.175,.885,.32,1.275),opacity .2s}.menu a:hover:after,.menu a:focus:after{transition:transform 0s .2s cubic-bezier(.175,.885,.32,1.275),opacity 0s .2s}\n"] }]
|
|
21
21
|
}], propDecorators: { menuItems: [{
|
|
@@ -97,10 +97,10 @@ class PtrButtonComponent {
|
|
|
97
97
|
}
|
|
98
98
|
this.clicked.emit(event);
|
|
99
99
|
}
|
|
100
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
101
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
100
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
101
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrButtonComponent, isStandalone: true, selector: "ptr-button", inputs: { buttonStyle: "buttonStyle", buttonType: "buttonType", isDisabled: "isDisabled", hrefLink: "hrefLink", routerLinkValue: "routerLinkValue", extraClasses: "extraClasses", isSmallSize: "isSmallSize", isIconButton: "isIconButton", ariaLabel: "ariaLabel" }, outputs: { clicked: "clicked" }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0, template: "<ng-template #contentTpl>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if (isLink()) {\r\n<a [attr.href]=\"href()\" [routerLink]=\"routerLink()\" [class]=\"buttonClasses()\" [attr.disabled]=\"disabled() ? '' : null\"\r\n (click)=\"onClick($event)\" [attr.aria-label]=\"ariaLabel ?? null\">\r\n <ng-container [ngTemplateOutlet]=\"contentTpl\"></ng-container>\r\n</a>\r\n} @else {\r\n<button [type]=\"type()\" [class]=\"buttonClasses()\" [disabled]=\"disabled()\" (click)=\"onClick($event)\"\r\n [attr.aria-label]=\"ariaLabel ?? null\">\r\n <ng-container [ngTemplateOutlet]=\"contentTpl\"></ng-container>\r\n</button>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
102
102
|
}
|
|
103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrButtonComponent, decorators: [{
|
|
104
104
|
type: Component,
|
|
105
105
|
args: [{ selector: 'ptr-button', imports: [CommonModule, RouterLink], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #contentTpl>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if (isLink()) {\r\n<a [attr.href]=\"href()\" [routerLink]=\"routerLink()\" [class]=\"buttonClasses()\" [attr.disabled]=\"disabled() ? '' : null\"\r\n (click)=\"onClick($event)\" [attr.aria-label]=\"ariaLabel ?? null\">\r\n <ng-container [ngTemplateOutlet]=\"contentTpl\"></ng-container>\r\n</a>\r\n} @else {\r\n<button [type]=\"type()\" [class]=\"buttonClasses()\" [disabled]=\"disabled()\" (click)=\"onClick($event)\"\r\n [attr.aria-label]=\"ariaLabel ?? null\">\r\n <ng-container [ngTemplateOutlet]=\"contentTpl\"></ng-container>\r\n</button>\r\n}\r\n" }]
|
|
106
106
|
}], propDecorators: { hostClasses: [{
|
|
@@ -292,10 +292,10 @@ class PtrDialogListComponent {
|
|
|
292
292
|
this.dialog.nativeElement.style.top = '';
|
|
293
293
|
this.dialog.nativeElement.style.bottom = '';
|
|
294
294
|
}
|
|
295
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
296
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
295
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrDialogListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
296
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrDialogListComponent, isStandalone: true, selector: "ptr-dialog-list", inputs: { options: "options", showSearch: "showSearch", searchPlaceholder: "searchPlaceholder", dialogTitle: "dialogTitle" }, outputs: { selectionChange: "selectionChange", dialogClosed: "dialogClosed", searchTermChanged: "searchTermChanged" }, viewQueries: [{ propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true }], ngImport: i0, template: "<dialog #dialog class=\"ptr-dialog-list\" (keydown)=\"onDialogKeyDown($event)\" [attr.aria-label]=\"'Options'\">\r\n\r\n @if(dialogTitle) {\r\n <p class=\"dialog-title\">{{dialogTitle}}</p>\r\n }\r\n\r\n @if (showSearch) {\r\n <div>\r\n <input #searchInput [ngModel]=\"searchTerm()\" (ngModelChange)=\"updateSearchTerm($event)\"\r\n [attr.aria-expanded]=\"isOpen()\" [attr.aria-owns]=\"listId\" (keydown)=\"onInputKeyDown($event)\"\r\n [attr.aria-autocomplete]=\"'list'\" role=\"combobox\" [attr.aria-controls]=\"listId\" [placeholder]=\"searchPlaceholder\"\r\n class=\"search-input\">\r\n </div>\r\n }\r\n\r\n <ul [attr.id]=\"listId\" role=\"listbox\" class=\"option-list\">\r\n @for (item of filteredOptions(); track item.label) {\r\n @if (item.type === 'option') {\r\n <li role=\"option\" [attr.id]=\"item.value\" [attr.aria-selected]=\"item.value === value()\"\r\n [class.selected]=\"item.value === value()\" [class.highlighted]=\"item === filteredOptions()[highlightedIndex()]\"\r\n (click)=\"selectOption(item.value!)\" (keydown)=\"onOptionKeyDown($event, item.value!)\"\r\n [attr.tabindex]=\"item === filteredOptions()[highlightedIndex()] ? 0 : -1\">\r\n {{ item.label }}\r\n </li>\r\n } @else {\r\n <li role=\"group\" [attr.aria-label]=\"item.label\">\r\n {{ item.label }}\r\n </li>\r\n @for (option of item.options!; track option.value) {\r\n <li role=\"option\" [attr.id]=\"option.value\" [attr.aria-selected]=\"option.value === value()\"\r\n [class.selected]=\"option.value === value()\" [class.highlighted]=\"option === filteredOptions()[highlightedIndex()]\"\r\n (click)=\"selectOption(option.value!)\" (keydown)=\"onOptionKeyDown($event, option.value!)\"\r\n [attr.tabindex]=\"option === filteredOptions()[highlightedIndex()] ? 0 : -1\">\r\n {{ option.label }}\r\n </li>\r\n }\r\n }\r\n }\r\n </ul>\r\n\r\n</dialog>\r\n", styles: [".ptr-dialog-list{margin:0;padding:0;border:1px solid var(--wp--custom--color--border);width:100%;max-height:350px;overflow-y:auto;z-index:5;border-radius:calc(var(--wp--custom--default-border-radius) / 2);border-top-left-radius:0;border-top-right-radius:0;scrollbar-width:thin}.ptr-dialog-list:focus{outline:none}input.search-input{padding:calc(var(--wp--custom--content--button-input-padding-y, 12px) / 1.5) var(--wp--custom--content--button-input-padding-x, 16px)!important;border:none!important;border-bottom:1px solid var(--wp--custom--color--border)!important;outline:0;font-size:var(--wp--preset--font-size--small, inherit);border-radius:0!important}.dialog-title{padding:5px 10px;border:none!important;border-bottom:1px solid var(--wp--custom--color--border)!important;font-size:var(--wp--preset--font-size--small, inherit);font-weight:500;margin:0}.option-list{list-style-type:none;padding:0;margin:0}li[role=option],li[role=group]{padding:5px 10px}li[role=group]{font-weight:700;margin-top:6px}li[role=option]{cursor:pointer;font-size:var(--wp--preset--font-size--small, inherit)}li[role=option]:hover,li[role=option].selected,li[role=option].highlighted{background-color:#f0f0f0}li[role=option]:focus-within{outline:2px solid var(--wp--custom--color--border)}\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.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
297
297
|
}
|
|
298
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
298
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrDialogListComponent, decorators: [{
|
|
299
299
|
type: Component,
|
|
300
300
|
args: [{ selector: 'ptr-dialog-list', imports: [
|
|
301
301
|
FormsModule
|
|
@@ -340,7 +340,7 @@ class PtrSelectComponent {
|
|
|
340
340
|
return selectedOption ? selectedOption.label : null;
|
|
341
341
|
});
|
|
342
342
|
effectivePlaceholder = computed(() => {
|
|
343
|
-
return this.placeholder
|
|
343
|
+
return this.placeholder?.trim() || 'Select an option';
|
|
344
344
|
});
|
|
345
345
|
componentId = Math.random().toString(36).substring(2);
|
|
346
346
|
labelId = `${this.componentId}-label`;
|
|
@@ -397,8 +397,8 @@ class PtrSelectComponent {
|
|
|
397
397
|
}
|
|
398
398
|
});
|
|
399
399
|
}
|
|
400
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
401
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
400
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
401
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrSelectComponent, isStandalone: true, selector: "ptr-select", inputs: { options: "options", showSearch: "showSearch", placeholder: "placeholder", label: "label", description: "description", labelPosition: "labelPosition" }, outputs: { selectionChange: "selectionChange" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, providers: [
|
|
402
402
|
{
|
|
403
403
|
provide: NG_VALUE_ACCESSOR,
|
|
404
404
|
useExisting: forwardRef(() => PtrSelectComponent),
|
|
@@ -406,7 +406,7 @@ class PtrSelectComponent {
|
|
|
406
406
|
}
|
|
407
407
|
], viewQueries: [{ propertyName: "selectButton", first: true, predicate: ["selectButton"], descendants: true }, { propertyName: "dialogList", first: true, predicate: ["dialogList"], descendants: true }], ngImport: i0, template: "<label class=\"gfield_label gform-field-label\" [attr.for]=\"inputId\"\r\n [class.gfield--input-wrapper--label-inline]=\"labelPosition === 'inline'\">{{ label }}</label>\r\n@if(description){\r\n<div class=\"gfield_description\">{{description}}</div>\r\n}\r\n<div class=\"gfield--input-wrapper ginput_container\"\r\n [class.gfield--input-wrapper--label-inline]=\"labelPosition === 'inline'\">\r\n\r\n <button #selectButton type=\"button\" class=\"select-button\" [attr.id]=\"inputId\" [attr.aria-haspopup]=\"'listbox'\"\r\n [attr.aria-expanded]=\"dialogList.isOpen()\" [attr.aria-labelledby]=\"labelId\" (click)=\"toggleDialog()\">\r\n <span [attr.id]=\"labelId\">@if (displayValue(); as dValue) { {{dValue}} } @else { {{effectivePlaceholder()}} }</span>\r\n </button>\r\n\r\n @if (labelPosition === 'inline') {\r\n <fieldset aria-hidden=\"true\" class=\"input-fieldset\">\r\n <legend class=\"input-legend gfield_label gform-field-label gform-field-label--hidden\">\r\n <span>{{label}}</span>\r\n </legend>\r\n </fieldset>\r\n }\r\n\r\n <ptr-dialog-list #dialogList [options]=\"options\" (selectionChange)=\"onOptionSelected($event)\"\r\n [showSearch]=\"showSearch\" />\r\n\r\n</div>\r\n", styles: [".select-button{appearance:none;background-color:#fff;text-align:left;cursor:pointer;border:1px solid var(--wp--custom--color--border);width:100%;padding:var(--wp--custom--content--button-input-padding-y, 12px) var(--wp--custom--content--button-input-padding-x, 16px);margin:0;font-size:var(--wp--preset--font-size--small, inherit);font-family:Arial,Helvetica,sans-serif;z-index:5;color:#000;border-radius:calc(var(--wp--custom--default-border-radius) / 2);transition:border-color .3s,color .3s,background-color .3s;transition-timing-function:cubic-bezier(.2,1,.3,1);background-position:calc(100% - 4px) 50%;background-repeat:no-repeat;background-image:url(data:image/png;base64,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)}.select-button[aria-expanded=true]{border-bottom-left-radius:0;border-bottom-right-radius:0}.gfield--input-wrapper--label-inline .select-button{border-color:transparent;outline:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: PtrDialogListComponent, selector: "ptr-dialog-list", inputs: ["options", "showSearch", "searchPlaceholder", "dialogTitle"], outputs: ["selectionChange", "dialogClosed", "searchTermChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
408
408
|
}
|
|
409
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
409
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrSelectComponent, decorators: [{
|
|
410
410
|
type: Component,
|
|
411
411
|
args: [{ selector: 'ptr-select', imports: [
|
|
412
412
|
FormsModule,
|
|
@@ -526,8 +526,8 @@ class PtrInputComponent {
|
|
|
526
526
|
this.input.nativeElement.disabled = isDisabled;
|
|
527
527
|
}
|
|
528
528
|
}
|
|
529
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
530
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
529
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
530
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrInputComponent, isStandalone: true, selector: "ptr-input", inputs: { type: "type", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", description: "description", dialogHelpText: "dialogHelpText", searchFn: "searchFn", labelPosition: "labelPosition" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, providers: [
|
|
531
531
|
{
|
|
532
532
|
provide: NG_VALUE_ACCESSOR,
|
|
533
533
|
useExisting: forwardRef(() => PtrInputComponent),
|
|
@@ -535,7 +535,7 @@ class PtrInputComponent {
|
|
|
535
535
|
}
|
|
536
536
|
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "dialogList", first: true, predicate: ["dialogList"], descendants: true }], ngImport: i0, template: "<label class=\"gfield_label gform-field-label\" [attr.for]=\"inputId\"\r\n [class.gfield--input-wrapper--label-inline]=\"labelPosition === 'inline'\">{{ label }}</label>\r\n@if(description){\r\n <div class=\"gfield_description\">{{description}}</div>\r\n}\r\n<div class=\"gfield--input-wrapper ginput_container\"\r\n [class.gfield--input-wrapper--label-inline]=\"labelPosition === 'inline'\">\r\n\r\n @switch (type) {\r\n @case ('textarea') {\r\n <textarea #input [id]=\"inputId\" [attr.autocomplete]=\"autocomplete || null\" [attr.placeholder]=\"placeholder || null\"\r\n [ngModel]=\"inputValue()\" (ngModelChange)=\"onInputChange($event)\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" [rows]=\"3\"></textarea>\r\n }\r\n @default {\r\n <input #input [id]=\"inputId\" [type]=\"type\" [attr.autocomplete]=\"autocomplete || null\"\r\n [attr.placeholder]=\"placeholder || null\" [ngModel]=\"inputValue()\" (ngModelChange)=\"onInputChange($event)\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\" />\r\n }\r\n }\r\n\r\n @if (labelPosition === 'inline') {\r\n <fieldset aria-hidden=\"true\" class=\"input-fieldset\">\r\n <legend class=\"input-legend gfield_label gform-field-label gform-field-label--hidden\">\r\n <span>{{label}}</span>\r\n </legend>\r\n </fieldset>\r\n }\r\n\r\n @if (searchFn) {\r\n <ptr-dialog-list #dialogList [options]=\"searchResultOptions()\" (selectionChange)=\"onOptionSelected($event)\"\r\n [dialogTitle]=\"dialogHelpText\" />\r\n }\r\n\r\n</div>\r\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.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: ReactiveFormsModule }, { kind: "component", type: PtrDialogListComponent, selector: "ptr-dialog-list", inputs: ["options", "showSearch", "searchPlaceholder", "dialogTitle"], outputs: ["selectionChange", "dialogClosed", "searchTermChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
537
537
|
}
|
|
538
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
538
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrInputComponent, decorators: [{
|
|
539
539
|
type: Component,
|
|
540
540
|
args: [{ selector: 'ptr-input', imports: [
|
|
541
541
|
FormsModule,
|
|
@@ -650,19 +650,18 @@ class PtrChipInputComponent {
|
|
|
650
650
|
this.tempInputControl.enable();
|
|
651
651
|
}
|
|
652
652
|
}
|
|
653
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
654
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
653
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrChipInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
654
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrChipInputComponent, isStandalone: true, selector: "ptr-chip-input", inputs: { label: "label", placeholder: "placeholder", description: "description", labelPosition: "labelPosition", maxItems: "maxItems" }, providers: [
|
|
655
655
|
{
|
|
656
656
|
provide: NG_VALUE_ACCESSOR,
|
|
657
657
|
useExisting: forwardRef(() => PtrChipInputComponent),
|
|
658
658
|
multi: true
|
|
659
659
|
}
|
|
660
|
-
], viewQueries: [{ propertyName: "chipInput", first: true, predicate: ["chipInput"], descendants: true }], ngImport: i0, template: "<label class=\"gfield_label gform-field-label\" [attr.for]=\"inputId\"\r\n [class.gfield--input-wrapper--label-inline]=\"labelPosition === 'inline'\">{{ label }}</label>\r\n@if(description){\r\n<div class=\"gfield_description\">{{description}}</div>\r\n}\r\n<div class=\"gfield--input-wrapper ginput_container\"\r\n [class.gfield--input-wrapper--label-inline]=\"labelPosition === 'inline'\">\r\n\r\n <div class=\"ptr-chip-container\">\r\n <div class=\"ptr-chip-list\">\r\n @for (chip of chipItems(); track chip; let i = $index) {\r\n <div class=\"ptr-chip\">\r\n <span class=\"ptr-chip-text\">{{ chip }}</span>\r\n <button type=\"button\" class=\"ptr-chip-remove\" (click)=\"removeChip(i)\" [disabled]=\"isDisabled()\"\r\n aria-label=\"Remove item\">\u00D7</button>\r\n </div>\r\n }\r\n </div>\r\n\r\n <div class=\"ptr-chip-input-wrapper\">\r\n <input #chipInput [id]=\"inputId\" type=\"text\" [placeholder]=\"placeholder || ''\" [formControl]=\"tempInputControl\"\r\n (keydown)=\"onKeyDown($event)\" (blur)=\"onBlur()\"\r\n [disabled]=\"isDisabled() || (maxItems !== undefined && chipItems().length >= maxItems)\" />\r\n <ptr-button (clicked)=\"addChip()\"\r\n [isDisabled]=\"!inputValue().trim() || isDisabled() || (maxItems !== undefined && chipItems().length >= maxItems)\">Add</ptr-button>\r\n </div>\r\n </div>\r\n\r\n @if (labelPosition === 'inline') {\r\n <fieldset aria-hidden=\"true\" class=\"input-fieldset\">\r\n <legend class=\"input-legend gfield_label gform-field-label gform-field-label--hidden\">\r\n <span>{{label}}</span>\r\n </legend>\r\n </fieldset>\r\n }\r\n</div>\r\n", styles: [".ptr-chip-container{display:flex;flex-direction:column;gap:8px;width:100%}.ptr-chip-list{display:flex;flex-wrap:wrap;gap:8px}.ptr-chip{display:inline-flex;align-items:center;background-color:var(--wp--preset--color--primary);color:var(--wp--custom--color--primary-text, currentColor);border-radius:16px;padding:4px 12px;font-size:var(--wp--preset--font-size--small, 14px);line-height:20px;margin-right:4px;cursor:default;transition:background-color .2s ease}.ptr-chip:hover{background-color:var(--wp--custom--color--primary-hover)}.ptr-chip-text{margin-right:6px}.ptr-chip-remove{border:none;background:none;color:var(--wp--custom--color--primary-text, currentColor);font-size:var(--wp--preset--font-size--medium, 16px);cursor:pointer;padding:0;margin:0;line-height:1;display:flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;transition:background-color .2s ease}.ptr-chip-remove:hover{background-color:#0000001a}.ptr-chip-remove:disabled{opacity:.5;cursor:not-allowed}.ptr-chip-input-wrapper{display:flex;gap:8px;width:100%}\n"], dependencies: [{ kind: "ngmodule", type:
|
|
660
|
+
], viewQueries: [{ propertyName: "chipInput", first: true, predicate: ["chipInput"], descendants: true }], ngImport: i0, template: "<label class=\"gfield_label gform-field-label\" [attr.for]=\"inputId\"\r\n [class.gfield--input-wrapper--label-inline]=\"labelPosition === 'inline'\">{{ label }}</label>\r\n@if(description){\r\n<div class=\"gfield_description\">{{description}}</div>\r\n}\r\n<div class=\"gfield--input-wrapper ginput_container\"\r\n [class.gfield--input-wrapper--label-inline]=\"labelPosition === 'inline'\">\r\n\r\n <div class=\"ptr-chip-container\">\r\n <div class=\"ptr-chip-list\">\r\n @for (chip of chipItems(); track chip; let i = $index) {\r\n <div class=\"ptr-chip\">\r\n <span class=\"ptr-chip-text\">{{ chip }}</span>\r\n <button type=\"button\" class=\"ptr-chip-remove\" (click)=\"removeChip(i)\" [disabled]=\"isDisabled()\"\r\n aria-label=\"Remove item\">\u00D7</button>\r\n </div>\r\n }\r\n </div>\r\n\r\n <div class=\"ptr-chip-input-wrapper\">\r\n <input #chipInput [id]=\"inputId\" type=\"text\" [placeholder]=\"placeholder || ''\" [formControl]=\"tempInputControl\"\r\n (keydown)=\"onKeyDown($event)\" (blur)=\"onBlur()\"\r\n [disabled]=\"isDisabled() || (maxItems !== undefined && chipItems().length >= maxItems)\" />\r\n <ptr-button (clicked)=\"addChip()\"\r\n [isDisabled]=\"!inputValue().trim() || isDisabled() || (maxItems !== undefined && chipItems().length >= maxItems)\">Add</ptr-button>\r\n </div>\r\n </div>\r\n\r\n @if (labelPosition === 'inline') {\r\n <fieldset aria-hidden=\"true\" class=\"input-fieldset\">\r\n <legend class=\"input-legend gfield_label gform-field-label gform-field-label--hidden\">\r\n <span>{{label}}</span>\r\n </legend>\r\n </fieldset>\r\n }\r\n</div>\r\n", styles: [".ptr-chip-container{display:flex;flex-direction:column;gap:8px;width:100%}.ptr-chip-list{display:flex;flex-wrap:wrap;gap:8px}.ptr-chip{display:inline-flex;align-items:center;background-color:var(--wp--preset--color--primary);color:var(--wp--custom--color--primary-text, currentColor);border-radius:16px;padding:4px 12px;font-size:var(--wp--preset--font-size--small, 14px);line-height:20px;margin-right:4px;cursor:default;transition:background-color .2s ease}.ptr-chip:hover{background-color:var(--wp--custom--color--primary-hover)}.ptr-chip-text{margin-right:6px}.ptr-chip-remove{border:none;background:none;color:var(--wp--custom--color--primary-text, currentColor);font-size:var(--wp--preset--font-size--medium, 16px);cursor:pointer;padding:0;margin:0;line-height:1;display:flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;transition:background-color .2s ease}.ptr-chip-remove:hover{background-color:#0000001a}.ptr-chip-remove:disabled{opacity:.5;cursor:not-allowed}.ptr-chip-input-wrapper{display:flex;gap:8px;width:100%}\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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: PtrButtonComponent, selector: "ptr-button", inputs: ["buttonStyle", "buttonType", "isDisabled", "hrefLink", "routerLinkValue", "extraClasses", "isSmallSize", "isIconButton", "ariaLabel"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
661
661
|
}
|
|
662
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
662
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrChipInputComponent, decorators: [{
|
|
663
663
|
type: Component,
|
|
664
664
|
args: [{ selector: 'ptr-chip-input', imports: [
|
|
665
|
-
CommonModule,
|
|
666
665
|
FormsModule,
|
|
667
666
|
ReactiveFormsModule,
|
|
668
667
|
PtrButtonComponent
|
|
@@ -770,10 +769,10 @@ class PtrFormComponent {
|
|
|
770
769
|
}
|
|
771
770
|
return false;
|
|
772
771
|
}
|
|
773
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
774
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
772
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
773
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrFormComponent, isStandalone: true, selector: "ptr-form", inputs: { config: "config", loading: "loading", error: "error" }, outputs: { formSubmit: "formSubmit", formGroupCreated: "formGroupCreated" }, ngImport: i0, template: "<div [class]=\"'gform_wrapper ' + config.formClass\">\r\n\r\n @if (error) {\r\n <div class=\"gform_validation_errors\">\r\n <h2 class=\"gform_submission_error hide_summary\">{{error}}</h2>\r\n </div>\r\n }\r\n\r\n @if (config.title) {\r\n <div class=\"gform_heading\">\r\n <h2 class=\"gform_title\">{{ config.title }}</h2>\r\n </div>\r\n }\r\n\r\n <form [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\r\n\r\n <div class=\"gform_fields\">\r\n\r\n @for (field of config.fields; track field.name) {\r\n @if(isFieldVisible(field)) {\r\n\r\n <div class=\"gfield gfield--width-{{field.size}}\" [class.gform_hidden]=\"field.type === 'hidden'\"\r\n [class.gfield_error]=\"formGroup.get(field.name)?.invalid && formGroup.get(field.name)?.touched\" [class.gfield--label-inline]=\"config.labelPosition === 'inline'\">\r\n\r\n @switch (field.type) {\r\n @case ('select') {\r\n <ptr-select [label]=\"getFieldLabel(field)\" [formControlName]=\"field.name\" [options]=\"field.options\"\r\n [placeholder]=\"getFieldPlaceholder(field)\" [labelPosition]=\"config.labelPosition\" />\r\n }\r\n @case ('chips') {\r\n <ptr-chip-input [label]=\"getFieldLabel(field)\" [formControlName]=\"field.name\"\r\n [placeholder]=\"getFieldPlaceholder(field)\" [description]=\"field.description\"\r\n [maxItems]=\"field.maxItems\" [labelPosition]=\"config.labelPosition\" />\r\n }\r\n @default {\r\n <ptr-input [label]=\"getFieldLabel(field)\" [formControlName]=\"field.name\" [type]=\"field.type\"\r\n [placeholder]=\"getFieldPlaceholder(field)\" [autocomplete]=\"field.autocomplete\" [searchFn]=\"field.searchFn\"\r\n [dialogHelpText]=\"field.dialogHelpText\" [labelPosition]=\"config.labelPosition\" />\r\n }\r\n }\r\n\r\n @if (formGroup.get(field.name)?.invalid && formGroup.get(field.name)?.touched) {\r\n <div class=\"gfield_description validation_message gfield_validation_message\">\r\n @if (formGroup.get(field.name)?.errors?.['required']) {\r\n This field is required.\r\n }\r\n @if (formGroup.get(field.name)?.errors?.['email']) {\r\n Please enter a valid email address.\r\n }\r\n @if (formGroup.get(field.name)?.errors?.['minlength']) {\r\n Minimum length is {{ formGroup.get(field.name)?.errors?.['minlength'].requiredLength }} characters.\r\n }\r\n @if (formGroup.get(field.name)?.errors?.['maxlength']) {\r\n Maximum length is {{ formGroup.get(field.name)?.errors?.['maxlength'].requiredLength }} characters.\r\n }\r\n @if (formGroup.get(field.name)?.errors?.['pattern']) {\r\n Please match the required format.\r\n }\r\n </div>\r\n }\r\n @if (field.validationMessages && formGroup.invalid && !formGroup.get(field.name)?.invalid &&\r\n formGroup.get(field.name)?.touched) {\r\n @for (error of formGroup.errors | keyvalue; track error) {\r\n @if (field.validationMessages[error.key]) {\r\n <div class=\"gfield_description validation_message gfield_validation_message\">\r\n {{ field.validationMessages[error.key] }}\r\n </div>\r\n }\r\n }\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n\r\n @if(config.submitText){\r\n <div class=\"gform_footer\">\r\n <ptr-button buttonType=\"submit\" [isDisabled]=\"loading || !formGroup.valid\"\r\n [extraClasses]=\"config.submitFullWidth ? 'gform-button--width-full' : ''\">{{config.submitText}}</ptr-button>\r\n </div>\r\n }\r\n\r\n </form>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.KeyValuePipe, name: "keyvalue" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: PtrButtonComponent, selector: "ptr-button", inputs: ["buttonStyle", "buttonType", "isDisabled", "hrefLink", "routerLinkValue", "extraClasses", "isSmallSize", "isIconButton", "ariaLabel"], outputs: ["clicked"] }, { kind: "component", type: PtrSelectComponent, selector: "ptr-select", inputs: ["options", "showSearch", "placeholder", "label", "description", "labelPosition"], outputs: ["selectionChange"] }, { kind: "component", type: PtrInputComponent, selector: "ptr-input", inputs: ["type", "label", "placeholder", "autocomplete", "description", "dialogHelpText", "searchFn", "labelPosition"] }, { kind: "component", type: PtrChipInputComponent, selector: "ptr-chip-input", inputs: ["label", "placeholder", "description", "labelPosition", "maxItems"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
775
774
|
}
|
|
776
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
775
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrFormComponent, decorators: [{
|
|
777
776
|
type: Component,
|
|
778
777
|
args: [{ selector: 'ptr-form', imports: [
|
|
779
778
|
CommonModule,
|
|
@@ -829,10 +828,10 @@ class PtrTitleComponent {
|
|
|
829
828
|
}
|
|
830
829
|
return route;
|
|
831
830
|
}
|
|
832
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
833
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
831
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
832
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrTitleComponent, isStandalone: true, selector: "ptr-title", inputs: { styleClass: "styleClass", wrapperStyleClass: "wrapperStyleClass", screenReaderOnly: "screenReaderOnly" }, ngImport: i0, template: "@if ((hideTitle$|async) === false) {\r\n @if(wrapperStyleClass) {\r\n <header [class]=\"wrapperStyleClass\" [class.screen-reader-text]=\"screenReaderOnly\">\r\n <h1 [class]=\"styleClass\">{{displayTitle$|async}}</h1>\r\n </header>\r\n } @else {\r\n <h1 [class]=\"styleClass\" [class.screen-reader-text]=\"screenReaderOnly\">{{displayTitle$|async}}</h1>\r\n }\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
834
833
|
}
|
|
835
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
834
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrTitleComponent, decorators: [{
|
|
836
835
|
type: Component,
|
|
837
836
|
args: [{ selector: 'ptr-title', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if ((hideTitle$|async) === false) {\r\n @if(wrapperStyleClass) {\r\n <header [class]=\"wrapperStyleClass\" [class.screen-reader-text]=\"screenReaderOnly\">\r\n <h1 [class]=\"styleClass\">{{displayTitle$|async}}</h1>\r\n </header>\r\n } @else {\r\n <h1 [class]=\"styleClass\" [class.screen-reader-text]=\"screenReaderOnly\">{{displayTitle$|async}}</h1>\r\n }\r\n}\r\n" }]
|
|
838
837
|
}], propDecorators: { styleClass: [{
|
|
@@ -844,10 +843,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImpor
|
|
|
844
843
|
}] } });
|
|
845
844
|
|
|
846
845
|
class PtrLoadingSpinnerComponent {
|
|
847
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
848
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
846
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrLoadingSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
847
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.4", type: PtrLoadingSpinnerComponent, isStandalone: true, selector: "ptr-loading-spinner", ngImport: i0, template: `<div class="ptr-progress-spinner"></div>`, isInline: true, styles: [":host{display:inline-block;line-height:0}.ptr-progress-spinner{display:inline-block;width:25px;height:25px;transform:scaleZ(1)}.ptr-progress-spinner:before{position:absolute;content:\"\";background-image:url(\"data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 40 40' style='enable-background:new 0 0 40 40;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23272e3e;%7D%0A%3C/style%3E%3Ccircle class='st0' cx='34' cy='6' r='6'/%3E%3Ccircle class='st0' cx='6' cy='6' r='6'/%3E%3Ccircle class='st0' cx='6' cy='34' r='6'/%3E%3Ccircle class='st0' cx='34' cy='34' r='6'/%3E%3C/svg%3E\");height:40px;width:40px;left:-8px;top:-8px;border:none;display:block;animation:loader-anim 1.5s 0s ease-in-out infinite}.ptr-progress-spinner:after{content:\"\";position:absolute;height:12px;width:12px;border:none;border-radius:12px;display:block;left:6px;top:6px;background-color:#272e3e;animation:loader-anim-dot 1.5s 0s ease-in-out infinite}@keyframes loader-anim{0%{transform:rotate(0) scale(0);opacity:.5}50%{transform:rotate(180deg) scale(1);opacity:1}to{transform:rotate(360deg) scale(0);opacity:.2}}@keyframes loader-anim-dot{0%{opacity:1}50%{opacity:0}to{opacity:1}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
849
848
|
}
|
|
850
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
849
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrLoadingSpinnerComponent, decorators: [{
|
|
851
850
|
type: Component,
|
|
852
851
|
args: [{ selector: 'ptr-loading-spinner', imports: [], template: `<div class="ptr-progress-spinner"></div>`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block;line-height:0}.ptr-progress-spinner{display:inline-block;width:25px;height:25px;transform:scaleZ(1)}.ptr-progress-spinner:before{position:absolute;content:\"\";background-image:url(\"data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 40 40' style='enable-background:new 0 0 40 40;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23272e3e;%7D%0A%3C/style%3E%3Ccircle class='st0' cx='34' cy='6' r='6'/%3E%3Ccircle class='st0' cx='6' cy='6' r='6'/%3E%3Ccircle class='st0' cx='6' cy='34' r='6'/%3E%3Ccircle class='st0' cx='34' cy='34' r='6'/%3E%3C/svg%3E\");height:40px;width:40px;left:-8px;top:-8px;border:none;display:block;animation:loader-anim 1.5s 0s ease-in-out infinite}.ptr-progress-spinner:after{content:\"\";position:absolute;height:12px;width:12px;border:none;border-radius:12px;display:block;left:6px;top:6px;background-color:#272e3e;animation:loader-anim-dot 1.5s 0s ease-in-out infinite}@keyframes loader-anim{0%{transform:rotate(0) scale(0);opacity:.5}50%{transform:rotate(180deg) scale(1);opacity:1}to{transform:rotate(360deg) scale(0);opacity:.2}}@keyframes loader-anim-dot{0%{opacity:1}50%{opacity:0}to{opacity:1}}\n"] }]
|
|
853
852
|
}] });
|
|
@@ -916,10 +915,10 @@ class PtrLoadingSpinnerDirective {
|
|
|
916
915
|
removeBlurEffect() {
|
|
917
916
|
this.renderer.removeClass(this.targetEl.nativeElement, 'ptr-loading-blur');
|
|
918
917
|
}
|
|
919
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
920
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
918
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrLoadingSpinnerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
919
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: PtrLoadingSpinnerDirective, isStandalone: true, selector: "[ptrLoadingSpinner]", inputs: { ptrLoadingSpinner: "ptrLoadingSpinner" }, host: { properties: { "style.position": "this.hostPosition" } }, ngImport: i0 });
|
|
921
920
|
}
|
|
922
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
921
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrLoadingSpinnerDirective, decorators: [{
|
|
923
922
|
type: Directive,
|
|
924
923
|
args: [{
|
|
925
924
|
selector: '[ptrLoadingSpinner]'
|
|
@@ -1016,10 +1015,10 @@ class PtrLoadingService {
|
|
|
1016
1015
|
updateTaskCount(taskCount, increment) {
|
|
1017
1016
|
taskCount.update(count => increment ? count + 1 : Math.max(0, count - 1));
|
|
1018
1017
|
}
|
|
1019
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1020
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1018
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrLoadingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1019
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrLoadingService, providedIn: 'root' });
|
|
1021
1020
|
}
|
|
1022
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1021
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrLoadingService, decorators: [{
|
|
1023
1022
|
type: Injectable,
|
|
1024
1023
|
args: [{
|
|
1025
1024
|
providedIn: 'root'
|
|
@@ -1052,10 +1051,10 @@ class PtrDialogComponent {
|
|
|
1052
1051
|
setData(data) {
|
|
1053
1052
|
this.data = data;
|
|
1054
1053
|
}
|
|
1055
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1056
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1054
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1055
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrDialogComponent, isStandalone: true, selector: "ptr-dialog", inputs: { title: "title", message: "message", buttonText: "buttonText", buttonStyle: "buttonStyle", contentTemplate: "contentTemplate", hasDefaultContent: "hasDefaultContent", data: "data" }, outputs: { closed: "closed" }, viewQueries: [{ propertyName: "dialogElement", first: true, predicate: ["dialogElement"], descendants: true }], ngImport: i0, template: "<dialog #dialogElement class=\"ptr-modal\" (close)=\"onClose()\">\n <div class=\"ptr-modal__content\">\n\n <div class=\"ptr-modal__header\">\n <h2 class=\"ptr-modal__title\">{{title}}</h2>\n <button class=\"ptr-modal__close\" (click)=\"close()\" aria-label=\"Close dialog\">×</button>\n </div>\n\n @if (hasDefaultContent && !contentTemplate) {\n <p>{{ message }}</p>\n }\n\n @if (contentTemplate) {\n <ng-container *ngTemplateOutlet=\"contentTemplate; context: {$implicit: data, dialogInstance: this}\"></ng-container>\n }\n\n <div class=\"ptr-modal__actions\">\n <ptr-button buttonStyle=\"secondary\" (clicked)=\"close()\" [isSmallSize]=\"true\">Cancel</ptr-button>\n <ptr-button class=\"ml-auto\" [buttonStyle]=\"buttonStyle\" (clicked)=\"confirm()\"\n [isSmallSize]=\"true\">{{buttonText}}</ptr-button>\n </div>\n\n </div>\n</dialog>\n", styles: [".ptr-modal{border-radius:min(var(--wp--custom--default-border-radius),6px);border:none;padding:.75rem}.ptr-modal__content{padding:.75rem;position:relative}.ptr-modal__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.ptr-modal__header h2{margin:0;font-size:calc(var(--wp--preset--font-size--medium) * 1.125)}.ptr-modal__close{background:none;border:none;font-size:1.5rem;cursor:pointer;padding:0;line-height:1.5rem;transform:translateY(-25%)}.ptr-modal__close:hover,.ptr-modal__close:focus{background-color:var(----wp--preset--color--light, rgba(51, 54, 70, .0392156863))}.ptr-modal__actions{margin-top:20px;text-align:right;display:flex;justify-content:space-between}dialog.ptr-modal{opacity:0;transition:all .2s}dialog.ptr-modal[open]{opacity:1}@starting-style{dialog.ptr-modal[open]{opacity:0}}dialog.ptr-modal::backdrop{opacity:0;background-color:#0000;transition:all .2s}dialog.ptr-modal[open]::backdrop{background-color:#25273499;opacity:1}@starting-style{dialog.ptr-modal[open]::backdrop{opacity:0;background-color:#0000}}\n"], dependencies: [{ kind: "component", type: PtrButtonComponent, selector: "ptr-button", inputs: ["buttonStyle", "buttonType", "isDisabled", "hrefLink", "routerLinkValue", "extraClasses", "isSmallSize", "isIconButton", "ariaLabel"], outputs: ["clicked"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1057
1056
|
}
|
|
1058
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1057
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrDialogComponent, decorators: [{
|
|
1059
1058
|
type: Component,
|
|
1060
1059
|
args: [{ selector: 'ptr-dialog', imports: [
|
|
1061
1060
|
PtrButtonComponent,
|
|
@@ -1128,10 +1127,10 @@ class PtrDialogService {
|
|
|
1128
1127
|
this.dialogComponentRef = null;
|
|
1129
1128
|
}
|
|
1130
1129
|
}
|
|
1131
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1132
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1130
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrDialogService, deps: [{ token: i0.ApplicationRef }, { token: i0.EnvironmentInjector }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1131
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrDialogService, providedIn: 'root' });
|
|
1133
1132
|
}
|
|
1134
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1133
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrDialogService, decorators: [{
|
|
1135
1134
|
type: Injectable,
|
|
1136
1135
|
args: [{
|
|
1137
1136
|
providedIn: 'root'
|
|
@@ -1155,10 +1154,10 @@ class PtrTooltipComponent {
|
|
|
1155
1154
|
this.tooltipDialog.nativeElement.close();
|
|
1156
1155
|
}, 200); // Small delay to allow moving mouse to tooltip
|
|
1157
1156
|
}
|
|
1158
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1159
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1157
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1158
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.4", type: PtrTooltipComponent, isStandalone: true, selector: "ptr-tooltip", inputs: { content: "content" }, viewQueries: [{ propertyName: "tooltipDialog", first: true, predicate: ["tooltipDialog"], descendants: true }], ngImport: i0, template: "<span (mouseenter)=\"showTooltip()\" (mouseleave)=\"hideTooltip()\" class=\"tooltip-trigger\">\r\n <ng-content></ng-content>\r\n</span>\r\n<dialog #tooltipDialog class=\"ptr-tooltip\">\r\n <div class=\"ptr-tooltip__content\">{{ content }}</div>\r\n</dialog>", styles: [":host{display:inline-block;position:relative}.tooltip-trigger{cursor:help}.ptr-tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%);border:none;border-radius:3px;padding:.5rem .75rem;background-color:#212121;border:0;color:#fff;font-size:.875rem;max-width:15.5rem;min-width:12.5rem;z-index:1000;margin:0 0 8px;box-shadow:0 3px 6px #00000029,0 3px 6px #0000003b}.ptr-tooltip:before{content:\"\";position:absolute;top:100%;left:50%;transform:translate(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #212121}.ptr-tooltip__content{white-space:pre-wrap;text-align:center;line-height:1.5}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1160
1159
|
}
|
|
1161
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1160
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrTooltipComponent, decorators: [{
|
|
1162
1161
|
type: Component,
|
|
1163
1162
|
args: [{ selector: 'ptr-tooltip', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<span (mouseenter)=\"showTooltip()\" (mouseleave)=\"hideTooltip()\" class=\"tooltip-trigger\">\r\n <ng-content></ng-content>\r\n</span>\r\n<dialog #tooltipDialog class=\"ptr-tooltip\">\r\n <div class=\"ptr-tooltip__content\">{{ content }}</div>\r\n</dialog>", styles: [":host{display:inline-block;position:relative}.tooltip-trigger{cursor:help}.ptr-tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%);border:none;border-radius:3px;padding:.5rem .75rem;background-color:#212121;border:0;color:#fff;font-size:.875rem;max-width:15.5rem;min-width:12.5rem;z-index:1000;margin:0 0 8px;box-shadow:0 3px 6px #00000029,0 3px 6px #0000003b}.ptr-tooltip:before{content:\"\";position:absolute;top:100%;left:50%;transform:translate(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #212121}.ptr-tooltip__content{white-space:pre-wrap;text-align:center;line-height:1.5}\n"] }]
|
|
1164
1163
|
}], propDecorators: { content: [{
|
|
@@ -1212,10 +1211,10 @@ class PtrBreadcrumbsComponent {
|
|
|
1212
1211
|
}
|
|
1213
1212
|
return breadcrumbReturnInfo;
|
|
1214
1213
|
}
|
|
1215
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1216
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1214
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrBreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1215
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrBreadcrumbsComponent, isStandalone: true, selector: "ptr-breadcrumbs", inputs: { showFirstSeparator: "showFirstSeparator" }, ngImport: i0, template: "@if (breadcrumbs().length > 0) {\n <nav aria-label=\"breadcrumb\" class=\"breadcrumb-wrapper\">\n <ol class=\"breadcrumb\" [class.breadcrumb--show-first-separator]=\"showFirstSeparator\">\n @for (breadcrumb of breadcrumbs(); track breadcrumb.label; let last = $last) {\n <li class=\"breadcrumb-item\" [class.breadcrumb-item--active]=\"last\">\n @if (!last) {\n <a class=\"breadcrumb-item-label\" [routerLink]=\"breadcrumb.url\">{{ breadcrumb.label }}</a>\n }\n @if (last) {\n <span class=\"breadcrumb-item-label\">{{ breadcrumb.label }}</span>\n }\n </li>\n }\n </ol>\n </nav>\n}\n", styles: [".breadcrumb{--breadcrumb-item-color: #ababab;--breadcrumb-item-font-size: var(--wp--preset--font-size--large, 1.25rem);list-style:none;border-radius:.25rem;margin:0 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:2px}.breadcrumb-item{display:inline-block;margin:0}.breadcrumb-item--active .breadcrumb-item-label{color:inherit;font-weight:700}.breadcrumb-item-label{text-decoration:none;padding:4px;display:inline-block;color:var(--breadcrumb-item-color);font-size:var(--breadcrumb-item-font-size);font-weight:500;border-bottom:2px solid transparent}.breadcrumb-item a{transition:border-bottom .25s,color .25s}.breadcrumb-item a:hover,.breadcrumb-item a:focus{border-bottom-color:var(--wp--preset--color--primary)}.breadcrumb-item:first-child .breadcrumb-item-label{padding-left:0}.breadcrumb-item+.breadcrumb-item .breadcrumb-item-label:before{content:\"/\";padding-right:8px}.breadcrumb.breadcrumb--show-first-separator .breadcrumb-item-label:before{content:\"/\";padding-right:8px}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1217
1216
|
}
|
|
1218
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1217
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrBreadcrumbsComponent, decorators: [{
|
|
1219
1218
|
type: Component,
|
|
1220
1219
|
args: [{ selector: 'ptr-breadcrumbs', imports: [RouterModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (breadcrumbs().length > 0) {\n <nav aria-label=\"breadcrumb\" class=\"breadcrumb-wrapper\">\n <ol class=\"breadcrumb\" [class.breadcrumb--show-first-separator]=\"showFirstSeparator\">\n @for (breadcrumb of breadcrumbs(); track breadcrumb.label; let last = $last) {\n <li class=\"breadcrumb-item\" [class.breadcrumb-item--active]=\"last\">\n @if (!last) {\n <a class=\"breadcrumb-item-label\" [routerLink]=\"breadcrumb.url\">{{ breadcrumb.label }}</a>\n }\n @if (last) {\n <span class=\"breadcrumb-item-label\">{{ breadcrumb.label }}</span>\n }\n </li>\n }\n </ol>\n </nav>\n}\n", styles: [".breadcrumb{--breadcrumb-item-color: #ababab;--breadcrumb-item-font-size: var(--wp--preset--font-size--large, 1.25rem);list-style:none;border-radius:.25rem;margin:0 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:2px}.breadcrumb-item{display:inline-block;margin:0}.breadcrumb-item--active .breadcrumb-item-label{color:inherit;font-weight:700}.breadcrumb-item-label{text-decoration:none;padding:4px;display:inline-block;color:var(--breadcrumb-item-color);font-size:var(--breadcrumb-item-font-size);font-weight:500;border-bottom:2px solid transparent}.breadcrumb-item a{transition:border-bottom .25s,color .25s}.breadcrumb-item a:hover,.breadcrumb-item a:focus{border-bottom-color:var(--wp--preset--color--primary)}.breadcrumb-item:first-child .breadcrumb-item-label{padding-left:0}.breadcrumb-item+.breadcrumb-item .breadcrumb-item-label:before{content:\"/\";padding-right:8px}.breadcrumb.breadcrumb--show-first-separator .breadcrumb-item-label:before{content:\"/\";padding-right:8px}\n"] }]
|
|
1221
1220
|
}], propDecorators: { showFirstSeparator: [{
|
|
@@ -1226,10 +1225,10 @@ class PtrTabComponent {
|
|
|
1226
1225
|
label;
|
|
1227
1226
|
link;
|
|
1228
1227
|
active = signal(false);
|
|
1229
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1230
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1228
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1229
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrTabComponent, isStandalone: true, selector: "ptr-tab", inputs: { label: "label", link: "link" }, ngImport: i0, template: '@if(active()){<ng-content></ng-content>}', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1231
1230
|
}
|
|
1232
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1231
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrTabComponent, decorators: [{
|
|
1233
1232
|
type: Component,
|
|
1234
1233
|
args: [{
|
|
1235
1234
|
selector: 'ptr-tab',
|
|
@@ -1292,10 +1291,10 @@ class PtrTabsComponent {
|
|
|
1292
1291
|
});
|
|
1293
1292
|
}
|
|
1294
1293
|
}
|
|
1295
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1296
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1294
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1295
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrTabsComponent, isStandalone: true, selector: "ptr-tabs", queries: [{ propertyName: "tabComponents", predicate: PtrTabComponent }], viewQueries: [{ propertyName: "buttons", predicate: ["tabButton"], descendants: true }], ngImport: i0, template: "<div class=\"tabs-container\" role=\"tablist\">\r\n @for (tab of tabs(); track $index; let i = $index) {\r\n <button #tabButton [attr.role]=\"tab.link ? 'link' : 'tab'\" [attr.aria-selected]=\"tab.active()\"\r\n [class.active]=\"tab.active()\" (click)=\"selectTab(i)\" [routerLink]=\"tab.link\">{{tab.label}}</button>\r\n }\r\n\r\n <div class=\"slider\" [style.transform]=\"sliderPosition().transform\" [style.width]=\"sliderPosition().width\"></div>\r\n</div>\r\n\r\n@if (!useLinks()) {\r\n<div class=\"tab-content\">\r\n <ng-content></ng-content>\r\n</div>\r\n}\r\n", styles: [".tabs-container{display:flex;position:relative}button{display:inline-flex;max-width:360px;appearance:none;padding:.5rem 1rem;border:none;background:none;cursor:pointer;font-weight:700;font-size:var(--wp--preset--font-size--small, inherit)}button:hover,button:focus{background-color:var(----wp--preset--color--light, rgba(51, 54, 70, .0392156863))}.slider{position:absolute;bottom:-2px;height:2px;background-color:var(--wp--preset--color--secondary, #0073aa);transition:transform .3s ease}.tab-content{padding:20px 0}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1297
1296
|
}
|
|
1298
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1297
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrTabsComponent, decorators: [{
|
|
1299
1298
|
type: Component,
|
|
1300
1299
|
args: [{ selector: 'ptr-tabs', imports: [RouterModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"tabs-container\" role=\"tablist\">\r\n @for (tab of tabs(); track $index; let i = $index) {\r\n <button #tabButton [attr.role]=\"tab.link ? 'link' : 'tab'\" [attr.aria-selected]=\"tab.active()\"\r\n [class.active]=\"tab.active()\" (click)=\"selectTab(i)\" [routerLink]=\"tab.link\">{{tab.label}}</button>\r\n }\r\n\r\n <div class=\"slider\" [style.transform]=\"sliderPosition().transform\" [style.width]=\"sliderPosition().width\"></div>\r\n</div>\r\n\r\n@if (!useLinks()) {\r\n<div class=\"tab-content\">\r\n <ng-content></ng-content>\r\n</div>\r\n}\r\n", styles: [".tabs-container{display:flex;position:relative}button{display:inline-flex;max-width:360px;appearance:none;padding:.5rem 1rem;border:none;background:none;cursor:pointer;font-weight:700;font-size:var(--wp--preset--font-size--small, inherit)}button:hover,button:focus{background-color:var(----wp--preset--color--light, rgba(51, 54, 70, .0392156863))}.slider{position:absolute;bottom:-2px;height:2px;background-color:var(--wp--preset--color--secondary, #0073aa);transition:transform .3s ease}.tab-content{padding:20px 0}\n"] }]
|
|
1301
1300
|
}], ctorParameters: () => [], propDecorators: { tabComponents: [{
|
|
@@ -1344,10 +1343,10 @@ class PtrToasterService {
|
|
|
1344
1343
|
remove(id) {
|
|
1345
1344
|
this.toasts.update(toasts => toasts.filter(t => t.id !== id));
|
|
1346
1345
|
}
|
|
1347
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1348
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1346
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrToasterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1347
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrToasterService, providedIn: 'root' });
|
|
1349
1348
|
}
|
|
1350
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1349
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrToasterService, decorators: [{
|
|
1351
1350
|
type: Injectable,
|
|
1352
1351
|
args: [{
|
|
1353
1352
|
providedIn: 'root'
|
|
@@ -1356,10 +1355,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImpor
|
|
|
1356
1355
|
|
|
1357
1356
|
class PtrToasterComponent {
|
|
1358
1357
|
toasterService = inject(PtrToasterService);
|
|
1359
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1360
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1358
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrToasterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1359
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: PtrToasterComponent, isStandalone: true, selector: "ptr-toaster", ngImport: i0, template: "<div class=\"toaster-container\" aria-live=\"polite\" aria-atomic=\"true\">\r\n @for (toast of toasterService.getToasts()(); track toast.id) {\r\n <div class=\"toast\" [ngClass]=\"toast.type\" role=\"alert\">\r\n <span>{{toast.message}}</span>\r\n <button (click)=\"toasterService.remove(toast.id)\" aria-label=\"Close\"><span>×</span></button>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".toaster-container{position:fixed;top:20px;right:20px;z-index:1000}.toast{padding:10px 20px;margin-bottom:10px;border-radius:calc(var(--wp--custom--default-border-radius) / 2);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:1rem;box-shadow:0 2px 4px 2px #00000026}.success{background-color:var(--wp--preset--color--primary, #28a745)}.error{background-color:var(--wp--custom--color--error, #dc3545)}.info{background-color:var(--wp--preset--color--secondary, #17a2b8)}.warning{background-color:var(--wp--preset--color--secondary, #ffc107)}button{background:none;border:none;color:inherit;font-size:2em;cursor:pointer;font-family:monospace}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1361
1360
|
}
|
|
1362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1361
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: PtrToasterComponent, decorators: [{
|
|
1363
1362
|
type: Component,
|
|
1364
1363
|
args: [{ selector: 'ptr-toaster', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"toaster-container\" aria-live=\"polite\" aria-atomic=\"true\">\r\n @for (toast of toasterService.getToasts()(); track toast.id) {\r\n <div class=\"toast\" [ngClass]=\"toast.type\" role=\"alert\">\r\n <span>{{toast.message}}</span>\r\n <button (click)=\"toasterService.remove(toast.id)\" aria-label=\"Close\"><span>×</span></button>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".toaster-container{position:fixed;top:20px;right:20px;z-index:1000}.toast{padding:10px 20px;margin-bottom:10px;border-radius:calc(var(--wp--custom--default-border-radius) / 2);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:1rem;box-shadow:0 2px 4px 2px #00000026}.success{background-color:var(--wp--preset--color--primary, #28a745)}.error{background-color:var(--wp--custom--color--error, #dc3545)}.info{background-color:var(--wp--preset--color--secondary, #17a2b8)}.warning{background-color:var(--wp--preset--color--secondary, #ffc107)}button{background:none;border:none;color:inherit;font-size:2em;cursor:pointer;font-family:monospace}\n"] }]
|
|
1365
1364
|
}] });
|