@praxisui/dynamic-fields 3.0.0-beta.1 → 3.0.0-beta.3

package/fesm2022/praxisui-dynamic-fields.mjs

@@ -3,7 +3,7 @@ import { NgControl, FormControl, Validators, ReactiveFormsModule, NG_VALUE_ACCES
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, DestroyRef, ElementRef, ChangeDetectorRef, Injector, signal, output, computed, Input, Directive, viewChild, effect, Injectable, EventEmitter, ViewContainerRef, ViewChild, HostListener, HostBinding, Output, ViewEncapsulation, ChangeDetectionStrategy, Component, Inject, forwardRef, LOCALE_ID, ViewChildren, TemplateRef, ContentChild, ENVIRONMENT_INITIALIZER, APP_INITIALIZER, Optional } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import { providePraxisI18n, PraxisI18nService, isCssTextTransform, getTextTransformer, GenericCrudService, GlobalConfigService, INLINE_FILTER_CONTROL_TYPES, FieldSelectorRegistry, FIELD_SELECTOR_REGISTRY_BASE, FIELD_SELECTOR_REGISTRY_DISABLE_DEFAULTS, LoggerService, FieldControlType, resolveInlineFilterControlType, DEFAULT_FIELD_SELECTOR_CONTROL_TYPE_MAP, PraxisIconDirective, resolveBuiltinPresets, createCpfCnpjValidator, NumericFormat, interpolatePraxisTranslation, ComponentMetadataRegistry, FIELD_METADATA_CAPABILITIES } from '@praxisui/core';
+import { providePraxisI18n, PraxisI18nService, isCssTextTransform, getTextTransformer, GenericCrudService, GlobalConfigService, INLINE_FILTER_CONTROL_TYPES, FieldControlType, FieldSelectorRegistry, FIELD_SELECTOR_REGISTRY_BASE, FIELD_SELECTOR_REGISTRY_DISABLE_DEFAULTS, LoggerService, resolveInlineFilterControlType, DEFAULT_FIELD_SELECTOR_CONTROL_TYPE_MAP, PraxisIconDirective, resolveBuiltinPresets, createCpfCnpjValidator, NumericFormat, interpolatePraxisTranslation, ComponentMetadataRegistry, FIELD_METADATA_CAPABILITIES } from '@praxisui/core';
 import { BehaviorSubject, combineLatest, Subscription, firstValueFrom, fromEvent, take as take$1, of, EMPTY } from 'rxjs';
 import { Router } from '@angular/router';
 import * as i1$2 from '@angular/material/dialog';
@@ -869,6 +869,11 @@ class SimpleBaseInputComponent {
         const componentState = this.componentState();
         const ngControl = this.getNgControl();
         const parentInvalid = !!ngControl?.invalid;
+        const parentTouched = !!ngControl?.touched;
+        const parentDirty = !!ngControl?.dirty;
+        const controlState = this.control();
+        const controlTouched = !!controlState.touched;
+        const controlDirty = !!controlState.dirty;
         const errors = ngControl?.errors ?? this.control().errors;
         const meta = this.metadata();
         const trig = meta?.validators?.validationTrigger;
@@ -883,13 +888,19 @@ class SimpleBaseInputComponent {
             case 'immediate':
                 return true;
             case 'blur':
-                return componentState.touched;
+                return componentState.touched || parentTouched || controlTouched;
             case 'submit':
                 // Praxis onSubmit marca todos como touched; usamos esse sinal
-                return componentState.touched;
+                return componentState.touched || parentTouched || controlTouched;
             case 'change':
             default:
-                return (componentState.dirty || componentState.touched) && this.errorDisplayReady();
+                return (componentState.dirty
+                    || componentState.touched
+                    || parentDirty
+                    || parentTouched
+                    || controlDirty
+                    || controlTouched)
+                    && this.errorDisplayReady();
         }
     }, ...(ngDevMode ? [{ debugName: "hasValidationError" }] : []));
     /** CSS classes básicas do componente */
@@ -1492,10 +1503,12 @@ class SimpleBaseInputComponent {
     // =============================================================================
     setupFormControlIntegration() {
         const control = this.control();
+        this.syncComponentStateFromControl(control);
         control.valueChanges
             .pipe(takeUntilDestroyed(this.destroyRef))
             .subscribe((value) => {
             this.fieldState.update((state) => ({ ...state, value }));
+            this.syncComponentStateFromControl(control);
         });
         control.statusChanges
             .pipe(takeUntilDestroyed(this.destroyRef))
@@ -1505,6 +1518,7 @@ class SimpleBaseInputComponent {
                 valid: status === 'VALID',
                 errors: control.errors,
             }));
+            this.syncComponentStateFromControl(control);
             this.refreshErrorTooltip();
         });
         // Sincronizar erros/estado do controle pai apenas quando usando controle interno
@@ -1520,35 +1534,51 @@ class SimpleBaseInputComponent {
                     errors: errs,
                     valid: !errs,
                 }));
+                this.syncComponentStateFromControl(control);
                 this.refreshErrorTooltip();
                 this.cdr.markForCheck();
             });
         }
     }
+    syncComponentStateFromControl(control) {
+        this.componentState.update((state) => ({
+            ...state,
+            touched: !!control.touched,
+            dirty: !!control.dirty,
+            disabled: !!control.disabled,
+        }));
+    }
     // Atualiza tooltip/atributos de erro quando erros mudam e quando inline errors estiverem desabilitados
     refreshErrorTooltip() {
         if (!this.nativeElement)
             return;
-        // Só aplica tooltip nativo quando errorPosition === 'tooltip' e não houver MatTooltip no template
-        // Força avaliação de tooltipPosition para evitar aviso de membro não utilizado
-        void this.tooltipPosition();
-        if (!this.tooltipEnabled()) {
-            this.nativeElement.removeAttribute('title');
-            this.nativeElement.removeAttribute('aria-invalid');
-            return;
-        }
         const hasErrors = !!(this.getNgControl()?.errors ?? this.control().errors);
         if (hasErrors) {
-            const msg = this.errorMessage();
-            if (msg)
-                this.nativeElement.setAttribute('title', msg);
             this.nativeElement.setAttribute('aria-invalid', 'true');
+            if (this.tooltipEnabled()) {
+                // Força avaliação de tooltipPosition para evitar aviso de membro não utilizado
+                void this.tooltipPosition();
+                const msg = this.errorMessage();
+                if (msg) {
+                    this.nativeElement.setAttribute('title', msg);
+                }
+                else {
+                    this.nativeElement.removeAttribute('title');
+                }
+            }
+            else {
+                this.nativeElement.removeAttribute('title');
+            }
         }
         else {
             this.nativeElement.removeAttribute('title');
             this.nativeElement.removeAttribute('aria-invalid');
         }
     }
+    ariaInvalidAttribute() {
+        const hasErrors = !!(this.getNgControl()?.errors ?? this.control().errors);
+        return hasErrors ? 'true' : null;
+    }
     tDynamicFields(keySuffix, fallback, params) {
         return this.i18n.t(`praxis.dynamicFields.${keySuffix}`, params, fallback, 'dynamicFields');
     }
@@ -2404,6 +2434,8 @@ class SimpleBaseSelectComponent extends SimpleBaseInputComponent {
     maxSelections = signal(null, ...(ngDevMode ? [{ debugName: "maxSelections" }] : []));
     /** Backend resource path for dynamic option loading */
     resourcePath = signal(null, ...(ngDevMode ? [{ debugName: "resourcePath" }] : []));
+    /** Canonical source for derived options */
+    optionSource = signal(null, ...(ngDevMode ? [{ debugName: "optionSource" }] : []));
     /** Criteria applied to backend filtering */
     filterCriteria = signal({}, ...(ngDevMode ? [{ debugName: "filterCriteria" }] : []));
     /** Field used for option labels when loading from backend */
@@ -2472,18 +2504,26 @@ class SimpleBaseSelectComponent extends SimpleBaseInputComponent {
             ? null
             : this.resolveDynamicFieldsMessage(this.dynamicFieldsI18n?.select?.emptyOptionText, 'select.emptyOptionText', '').trim() || null;
         this.emptyOptionText.set(isMultiple ? null : (metadata.emptyOptionText ?? fallbackEmptyOption));
-        const path = metadata.resourcePath;
+        const optionSource = metadata.optionSource ?? null;
+        this.optionSource.set(optionSource);
+        const path = optionSource?.resourcePath ?? metadata.resourcePath ?? metadata.endpoint;
         if (path) {
             this.resourcePath.set(path);
             this.filterCriteria.set(metadata.filterCriteria ?? {});
-            const needLabel = !metadata.optionLabelKey;
-            const needValue = !metadata.optionValueKey;
+            const needLabel = !metadata.optionLabelKey && !optionSource;
+            const needValue = !metadata.optionValueKey && !optionSource;
             if (metadata.optionLabelKey) {
                 this.optionLabelKey.set(metadata.optionLabelKey);
             }
+            else if (optionSource) {
+                this.optionLabelKey.set('label');
+            }
             if (metadata.optionValueKey) {
                 this.optionValueKey.set(metadata.optionValueKey);
             }
+            else if (optionSource) {
+                this.optionValueKey.set('id');
+            }
             this.configureCrudService(path);
             if (needLabel || needValue) {
                 this.loadSchema(needLabel, needValue);
@@ -2919,12 +2959,22 @@ class SimpleBaseSelectComponent extends SimpleBaseInputComponent {
             return;
         }
         const filter = { ...criteria };
-        if (searchTerm) {
+        if (searchTerm && !this.optionSource()) {
             filter[this.optionLabelKey()] = searchTerm;
         }
         this.loading.set(true);
-        this.crudService
-            .filter(filter, { pageNumber: page, pageSize: this.pageSize() })
+        const request$ = this.optionSource()
+            ? this.crudService.filterOptionSourceOptions(this.optionSource().key, filter, { pageNumber: page, pageSize: this.pageSize() }, {
+                search: searchTerm || undefined,
+                includeIds: this.optionSource().includeIds
+                    ? this.currentIncludeIds()
+                    : undefined,
+            })
+            : this.crudService.filter(filter, {
+                pageNumber: page,
+                pageSize: this.pageSize(),
+            });
+        request$
             .pipe(takeUntilDestroyed(this.destroyRef), take(1))
             .subscribe({
             next: (resp) => {
@@ -2950,6 +3000,16 @@ class SimpleBaseSelectComponent extends SimpleBaseInputComponent {
             },
         });
     }
+    currentIncludeIds() {
+        const currentValue = this.control().value;
+        if (Array.isArray(currentValue)) {
+            return currentValue.filter((value) => value !== null && value !== undefined && value !== '');
+        }
+        if (currentValue === null || currentValue === undefined || currentValue === '') {
+            return [];
+        }
+        return [currentValue];
+    }
     /** Dev-only warning when legacy alias keys are used instead of canonical ones */
     devWarnSelectAliases(meta, component) {
         const isDev = () => typeof globalThis.ngDevMode !== 'undefined'
@@ -3300,6 +3360,9 @@ const RETRY_DELAY = 1000; // 1 segundo
  * Focado no essencial: registro, carregamento e cache básico
  */
 const { SELECT: INLINE_SELECT_CONTROL_TYPE, MULTI_SELECT: INLINE_MULTI_SELECT_CONTROL_TYPE, INPUT: INLINE_INPUT_CONTROL_TYPE, TOGGLE: INLINE_TOGGLE_CONTROL_TYPE, RANGE: INLINE_RANGE_CONTROL_TYPE, SEARCHABLE_SELECT: INLINE_SEARCHABLE_SELECT_CONTROL_TYPE, ASYNC_SELECT: INLINE_ASYNC_SELECT_CONTROL_TYPE, ENTITY_LOOKUP: INLINE_ENTITY_LOOKUP_CONTROL_TYPE, AUTOCOMPLETE: INLINE_AUTOCOMPLETE_CONTROL_TYPE, NUMBER: INLINE_NUMBER_CONTROL_TYPE, CURRENCY: INLINE_CURRENCY_CONTROL_TYPE, CURRENCY_RANGE: INLINE_CURRENCY_RANGE_CONTROL_TYPE, DATE: INLINE_DATE_CONTROL_TYPE, DATE_RANGE: INLINE_DATE_RANGE_CONTROL_TYPE, TIME: INLINE_TIME_CONTROL_TYPE, TIME_RANGE: INLINE_TIME_RANGE_CONTROL_TYPE, TREE_SELECT: INLINE_TREE_SELECT_CONTROL_TYPE, RATING: INLINE_RATING_CONTROL_TYPE, DISTANCE_RADIUS: INLINE_DISTANCE_RADIUS_CONTROL_TYPE, PIPELINE_STATUS: INLINE_PIPELINE_STATUS_CONTROL_TYPE, SCORE_PRIORITY: INLINE_SCORE_PRIORITY_CONTROL_TYPE, RELATIVE_PERIOD: INLINE_RELATIVE_PERIOD_CONTROL_TYPE, SENTIMENT: INLINE_SENTIMENT_CONTROL_TYPE, COLOR_LABEL: INLINE_COLOR_LABEL_CONTROL_TYPE, } = INLINE_FILTER_CONTROL_TYPES;
+const INLINE_PERIOD_RANGE_CONTROL_TYPE = FieldControlType.INLINE_PERIOD_RANGE;
+const INLINE_YEAR_RANGE_CONTROL_TYPE = FieldControlType.INLINE_YEAR_RANGE;
+const INLINE_MONTH_RANGE_CONTROL_TYPE = FieldControlType.INLINE_MONTH_RANGE;
 function lazyComponent(loader, exportName) {
     return async () => loader().then((module) => module[exportName]);
 }
@@ -3558,6 +3621,9 @@ class ComponentRegistryService {
         this.register(INLINE_INPUT_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-iIeaA6ko.mjs'), 'InlineInputComponent'));
         this.register(INLINE_TOGGLE_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-BMHfcV1t.mjs'), 'InlineToggleComponent'));
         this.register(INLINE_RANGE_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-DYV54GUZ.mjs'), 'InlineRangeSliderComponent'));
+        this.register(INLINE_PERIOD_RANGE_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-CsBUpYPm.mjs'), 'InlinePeriodRangeComponent'));
+        this.register(INLINE_YEAR_RANGE_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-CY-plw8X.mjs'), 'InlineYearRangeComponent'));
+        this.register(INLINE_MONTH_RANGE_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-DlL36zZl.mjs'), 'InlineMonthRangeComponent'));
         this.register(INLINE_DATE_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-CfZxkljy.mjs'), 'InlineDateComponent'));
         this.register(INLINE_DATE_RANGE_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-7NLgtZV4.mjs'), 'InlineDateRangeComponent'));
         this.register(INLINE_TIME_CONTROL_TYPE, lazyComponent(() => import('./praxisui-dynamic-fields-index-DD5h8DRG.mjs'), 'InlineTimeComponent'));
@@ -7689,6 +7755,7 @@ class TextInputComponent extends SimpleBaseInputComponent {
         [minlength]="metadata()?.minLength || null"
         [attr.aria-label]="!label && placeholder ? placeholder : null"
         [attr.aria-required]="metadata()?.required ? 'true' : 'false'"
+        [attr.aria-invalid]="ariaInvalidAttribute()"
         [matTooltip]="tooltipEnabled() ? errorMessage() : null"
         [matTooltipDisabled]="!(tooltipEnabled() && !!errorMessage())"
         [matTooltipPosition]="tooltipPosition()"
@@ -7780,6 +7847,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
         [minlength]="metadata()?.minLength || null"
         [attr.aria-label]="!label && placeholder ? placeholder : null"
         [attr.aria-required]="metadata()?.required ? 'true' : 'false'"
+        [attr.aria-invalid]="ariaInvalidAttribute()"
         [matTooltip]="tooltipEnabled() ? errorMessage() : null"
         [matTooltipDisabled]="!(tooltipEnabled() && !!errorMessage())"
         [matTooltipPosition]="tooltipPosition()"
@@ -15432,6 +15500,9 @@ class MaterialAsyncSelectComponent extends SimpleBaseSelectComponent {
     dataVersion;
     useCursor = false;
     // Uses protected `global` from base class
+    isCategoricalBucketOptionSource(optionSource) {
+        return String(optionSource?.type || '').trim().toUpperCase() === 'CATEGORICAL_BUCKET';
+    }
     setSelectMetadata(metadata) {
         // Normalize and store metadata without triggering the base's remote load
         this.devWarnSelectAliases(metadata, 'MaterialAsyncSelectComponent');
@@ -15450,28 +15521,40 @@ class MaterialAsyncSelectComponent extends SimpleBaseSelectComponent {
         }
         // Apply base input metadata (placeholder, validators, a11y, etc.)
         super.setMetadata({ ...metadata });
+        const optionSource = metadata.optionSource ?? null;
+        const isCategoricalBucket = this.isCategoricalBucketOptionSource(optionSource);
         // Local select configuration
         if (mappedOptions)
             this.options.set(mappedOptions);
         this.multiple.set(!!metadata.multiple);
-        this.searchable.set(true);
+        this.searchable.set(metadata.searchable ?? !isCategoricalBucket);
         this.selectAll.set(!!metadata.selectAll);
         this.maxSelections.set(metadata.maxSelections ?? null);
         this.emptyOptionText.set(this.multiple() ? null : (metadata.emptyOptionText ?? null));
         // Load strategy: default 'open' to avoid unnecessary requests
         const loadOn = metadata.loadOn ??
+            (isCategoricalBucket ? 'init' : undefined) ??
             this.global.getDynamicFields()?.asyncSelect?.loadOn ??
             'open';
         this.initialLoadStrategy = loadOn;
         // Remote config without auto-loading here (avoid duplicate /filter on init)
-        const path = metadata.resourcePath;
+        this.optionSource.set(optionSource);
+        const path = optionSource?.resourcePath ?? metadata.resourcePath;
         if (path) {
             this.resourcePath.set(path);
             this.filterCriteria.set(metadata.filterCriteria ?? {});
-            if (metadata.optionLabelKey)
+            if (metadata.optionLabelKey) {
                 this.optionLabelKey.set(metadata.optionLabelKey);
-            if (metadata.optionValueKey)
+            }
+            else if (optionSource) {
+                this.optionLabelKey.set('label');
+            }
+            if (metadata.optionValueKey) {
                 this.optionValueKey.set(metadata.optionValueKey);
+            }
+            else if (optionSource) {
+                this.optionValueKey.set('id');
+            }
             if (this.lastConfiguredPath !== path) {
                 this.configureCrudService(path);
                 this.lastConfiguredPath = path;
@@ -15548,8 +15631,11 @@ class MaterialAsyncSelectComponent extends SimpleBaseSelectComponent {
         const ids = this.getSelectedIds();
         if (!ids.length)
             return;
-        this.crudService
-            .getOptionsByIds(ids)
+        const optionSource = this.optionSource();
+        const request$ = optionSource
+            ? this.crudService.getOptionSourceOptionsByIds(optionSource.key, ids)
+            : this.crudService.getOptionsByIds(ids);
+        request$
             .pipe(takeUntilDestroyed(this.destroyRef))
             .subscribe((opts) => {
             const returned = new Set(opts.map((o) => o.id));
@@ -15571,7 +15657,7 @@ class MaterialAsyncSelectComponent extends SimpleBaseSelectComponent {
         }
         const term = this.termControl.value || '';
         const filter = { ...this.filterCriteria() };
-        if (term) {
+        if (term && !this.optionSource()) {
             filter[this.optionLabelKey()] = term;
         }
         const selected = this.getSelectedIds();
@@ -15597,11 +15683,18 @@ class MaterialAsyncSelectComponent extends SimpleBaseSelectComponent {
             }));
         }
         const page = this.pageIndex();
-        return this.crudService
-            .filterOptions(filter, { pageNumber: page, pageSize: this.pageSize() }, {
-            ...(include || {}),
-            observeVersionHeader: observeVersion,
-        })
+        const optionSource = this.optionSource();
+        const request$ = optionSource
+            ? this.crudService.filterOptionSourceOptions(optionSource.key, filter, { pageNumber: page, pageSize: this.pageSize() }, {
+                ...(include || {}),
+                observeVersionHeader: observeVersion,
+                search: term || undefined,
+            })
+            : this.crudService.filterOptions(filter, { pageNumber: page, pageSize: this.pageSize() }, {
+                ...(include || {}),
+                observeVersionHeader: observeVersion,
+            });
+        return request$
             .pipe(tap((resp) => {
             if (resp.dataVersion)
                 this.dataVersion = resp.dataVersion;
@@ -15719,7 +15812,7 @@ class MaterialAsyncSelectComponent extends SimpleBaseSelectComponent {
         [matTooltipDisabled]="!(tooltipEnabled() && !!errorMessage())"
         [matTooltipPosition]="tooltipPosition()"
       >
-        <mat-option disabled>
+        <mat-option *ngIf="searchable()" disabled>
           <input
             #searchInput
             matInput
@@ -15833,7 +15926,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
         [matTooltipDisabled]="!(tooltipEnabled() && !!errorMessage())"
         [matTooltipPosition]="tooltipPosition()"
       >
-        <mat-option disabled>
+        <mat-option *ngIf="searchable()" disabled>
           <input
             #searchInput
             matInput
@@ -19310,9 +19403,35 @@ class InlineNumberComponent extends SimpleBaseInputComponent {
             return custom;
         return this.showPercentSuffix() ? 'percent' : 'tag';
     }
+    showPercentGraphicMode() {
+        return this.showPercentSuffix() && this.currentMetadata().inlineVisualStyle === 'graphic';
+    }
     showPercentSuffix() {
         return this.isPercentFormat();
     }
+    percentDisplayText() {
+        const value = this.currentNumericValue();
+        if (value === null) {
+            return '--%';
+        }
+        return `${this.formatCompactNumber(value)}%`;
+    }
+    percentRangeText() {
+        const min = this.effectiveMinValue();
+        const max = this.effectiveMaxValue();
+        if (min === null && max === null) {
+            return '';
+        }
+        const start = min === null ? '—' : this.formatCompactNumber(min);
+        const end = max === null ? '—' : this.formatCompactNumber(max);
+        return `${start}-${end}%`;
+    }
+    percentAngle() {
+        return this.percentRatio() * 360;
+    }
+    percentFillWidth() {
+        return this.percentRatio() * 100;
+    }
     effectiveMinValue() {
         return this.resolveEffectiveMin(this.currentMetadata());
     }
@@ -19362,8 +19481,14 @@ class InlineNumberComponent extends SimpleBaseInputComponent {
     widthProbeText() {
         const value = this.control().value;
         if (value !== null && value !== undefined && String(value).trim().length) {
+            if (this.showPercentGraphicMode()) {
+                return this.longestMeasureCandidate(String(value), this.placeholderText(), this.percentRangeText());
+            }
             return String(value);
         }
+        if (this.showPercentGraphicMode()) {
+            return this.longestMeasureCandidate(this.placeholderText(), this.percentRangeText(), this.defaultFieldLabel());
+        }
         return this.placeholderText() || this.defaultFieldLabel();
     }
     placeholderText() {
@@ -19466,6 +19591,12 @@ class InlineNumberComponent extends SimpleBaseInputComponent {
             baseMinMobile = 84;
             baseMaxMobile = 188;
         }
+        if (this.showPercentGraphicMode()) {
+            baseMinDesktop = Math.max(baseMinDesktop, 192);
+            baseMaxDesktop = Math.max(baseMaxDesktop, 288);
+            baseMinMobile = Math.max(baseMinMobile, 184);
+            baseMaxMobile = Math.max(baseMaxMobile, 260);
+        }
         const min = Math.max(84, Math.round(isMobile
             ? (cfg.minWidthMobile ?? baseMinMobile)
             : (cfg.minWidth ?? baseMinDesktop)));
@@ -19543,6 +19674,39 @@ class InlineNumberComponent extends SimpleBaseInputComponent {
             ? InlineNumberComponent.PERCENT_PLACEHOLDER_DEFAULT
             : 'Número';
     }
+    currentNumericValue() {
+        return this.resolveFiniteNumber(this.control().value);
+    }
+    percentRatio() {
+        const value = this.currentNumericValue();
+        if (value === null) {
+            return 0;
+        }
+        const min = this.effectiveMinValue() ?? InlineNumberComponent.PERCENT_MIN_DEFAULT;
+        const max = this.effectiveMaxValue() ?? InlineNumberComponent.PERCENT_MAX_DEFAULT;
+        if (max <= min) {
+            return 0;
+        }
+        return Math.max(0, Math.min(1, (value - min) / (max - min)));
+    }
+    formatCompactNumber(value) {
+        if (!Number.isFinite(value)) {
+            return '';
+        }
+        if (Number.isInteger(value)) {
+            return `${value}`;
+        }
+        return value.toFixed(2).replace(/\.?0+$/, '');
+    }
+    longestMeasureCandidate(...values) {
+        const candidates = values
+            .map((value) => String(value ?? '').trim())
+            .filter((value) => value.length);
+        if (!candidates.length) {
+            return '';
+        }
+        return candidates.reduce((longest, current) => current.length > longest.length ? current : longest);
+    }
     isPercentFormat(meta) {
         const metadataRecord = this.asRecord(meta) ?? this.metadataRecord();
         const numberFormat = this.asRecord(metadataRecord.numberFormat);
@@ -19603,80 +19767,107 @@ class InlineNumberComponent extends SimpleBaseInputComponent {
                 multi: true,
             },
         ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, read: ElementRef }, { propertyName: "measureEl", first: true, predicate: ["measureEl"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: `
-    <mat-form-field
-      [appearance]="'outline'"
-      [color]="materialColor()"
-      [class]="componentCssClasses()"
-      [floatLabel]="'auto'"
-      [subscriptSizing]="'dynamic'"
-      [hideRequiredMarker]="true"
-      [style.width.px]="inlineWidthPx || null"
-      [style.--pdx-inline-number-max-w.px]="inlineMaxWidthPx || null"
-    >
-      <mat-icon
-        matPrefix
-        [color]="iconPalette(prefixIconColor())"
-        [style.color]="iconResolvedColor(prefixIconColor())"
-      >
-        {{ leadingIconName() }}
-      </mat-icon>
-      <input
-        #inputEl
-        matInput
-        type="number"
-        [formControl]="control()"
-        [errorStateMatcher]="errorStateMatcher()"
-        [placeholder]="placeholderText()"
-        [required]="metadata()?.required || false"
-        [readonly]="isReadonlyEffective()"
-        [autocomplete]="metadata()?.autocomplete || 'off'"
-        [spellcheck]="metadata()?.spellcheck ?? false"
-        [min]="effectiveMinValue()"
-        [max]="effectiveMaxValue()"
-        [step]="effectiveStepValue()"
-        [attr.inputmode]="metadata()?.inputMode || 'decimal'"
-        [attr.aria-label]="ariaLabel()"
-        [matTooltip]="inlineTooltipText()"
-        [matTooltipDisabled]="inlineTooltipDisabled()"
-        [matTooltipPosition]="tooltipPosition()"
-        (input)="onInlineInput()"
-      />
-      @if (showInlinePlaceholder()) {
-        <span class="pdx-inline-placeholder" aria-hidden="true">{{ placeholderText() }}</span>
+    <div class="pdx-inline-number-shell" [class.pdx-inline-number-shell-percent]="showPercentGraphicMode()">
+      @if (showPercentGraphicMode()) {
+        <div class="pdx-inline-percent-insight" aria-hidden="true">
+          <div
+            class="pdx-inline-percent-gauge"
+            [style.--pdx-inline-percent-angle]="percentAngle() + 'deg'"
+          >
+            <div class="pdx-inline-percent-gauge__core">
+              <span class="pdx-inline-percent-gauge__value">{{ percentDisplayText() }}</span>
+            </div>
+          </div>
+          <div class="pdx-inline-percent-copy">
+            <span class="pdx-inline-percent-copy__label">{{ placeholderText() }}</span>
+            <span class="pdx-inline-percent-copy__range">{{ percentRangeText() }}</span>
+          </div>
+        </div>
       }
-      <span #measureEl aria-hidden="true" class="pdx-inline-measure">{{ widthProbeText() }}</span>
-      @if (suffixIconName()) {
+
+      <mat-form-field
+        [appearance]="'outline'"
+        [color]="materialColor()"
+        [class]="componentCssClasses()"
+        [floatLabel]="'auto'"
+        [subscriptSizing]="'dynamic'"
+        [hideRequiredMarker]="true"
+        [style.width.px]="inlineWidthPx || null"
+        [style.--pdx-inline-number-max-w.px]="inlineMaxWidthPx || null"
+      >
         <mat-icon
-          matSuffix
-          class="pdx-inline-static-suffix"
-          [color]="iconPalette(suffixIconColor())"
-          [style.color]="iconResolvedColor(suffixIconColor())"
-          [matTooltip]="metadata()?.suffixIconTooltip || null"
-          [attr.aria-label]="metadata()?.suffixIconAriaLabel || null"
+          matPrefix
+          [color]="iconPalette(prefixIconColor())"
+          [style.color]="iconResolvedColor(prefixIconColor())"
         >
-          {{ suffixIconName() }}
+          {{ leadingIconName() }}
         </mat-icon>
-      }
-      @if (showPercentSuffix()) {
-        <span matSuffix class="pdx-inline-number-suffix">%</span>
-      }
-      @if (showQuickClear()) {
-        <button
-          matSuffix
-          type="button"
-          class="pdx-inline-clear"
-          (mousedown)="onTriggerIconMouseDown($event)"
-          (click)="onQuickClear($event)"
-          [attr.aria-label]="clearActionAriaLabel()"
-        >
+        <input
+          #inputEl
+          matInput
+          type="number"
+          [formControl]="control()"
+          [errorStateMatcher]="errorStateMatcher()"
+          [placeholder]="placeholderText()"
+          [required]="metadata()?.required || false"
+          [readonly]="isReadonlyEffective()"
+          [autocomplete]="metadata()?.autocomplete || 'off'"
+          [spellcheck]="metadata()?.spellcheck ?? false"
+          [min]="effectiveMinValue()"
+          [max]="effectiveMaxValue()"
+          [step]="effectiveStepValue()"
+          [attr.inputmode]="metadata()?.inputMode || 'decimal'"
+          [attr.aria-label]="ariaLabel()"
+          [matTooltip]="inlineTooltipText()"
+          [matTooltipDisabled]="inlineTooltipDisabled()"
+          [matTooltipPosition]="tooltipPosition()"
+          (input)="onInlineInput()"
+        />
+        @if (showInlinePlaceholder()) {
+          <span class="pdx-inline-placeholder" aria-hidden="true">{{ placeholderText() }}</span>
+        }
+        <span #measureEl aria-hidden="true" class="pdx-inline-measure">{{ widthProbeText() }}</span>
+        @if (suffixIconName()) {
           <mat-icon
-            [color]="iconPalette(clearIconColor())"
-            [style.color]="iconResolvedColor(clearIconColor())"
-          >{{ clearIconName() }}</mat-icon>
-        </button>
+            matSuffix
+            class="pdx-inline-static-suffix"
+            [color]="iconPalette(suffixIconColor())"
+            [style.color]="iconResolvedColor(suffixIconColor())"
+            [matTooltip]="metadata()?.suffixIconTooltip || null"
+            [attr.aria-label]="metadata()?.suffixIconAriaLabel || null"
+          >
+            {{ suffixIconName() }}
+          </mat-icon>
+        }
+        @if (showPercentSuffix()) {
+          <span matSuffix class="pdx-inline-number-suffix">%</span>
+        }
+        @if (showQuickClear()) {
+          <button
+            matSuffix
+            type="button"
+            class="pdx-inline-clear"
+            (mousedown)="onTriggerIconMouseDown($event)"
+            (click)="onQuickClear($event)"
+            [attr.aria-label]="clearActionAriaLabel()"
+          >
+            <mat-icon
+              [color]="iconPalette(clearIconColor())"
+              [style.color]="iconResolvedColor(clearIconColor())"
+            >{{ clearIconName() }}</mat-icon>
+          </button>
+        }
+      </mat-form-field>
+
+      @if (showPercentGraphicMode()) {
+        <div class="pdx-inline-percent-rail" aria-hidden="true">
+          <div class="pdx-inline-percent-rail__track"></div>
+          <div class="pdx-inline-percent-rail__fill" [style.width.%]="percentFillWidth()"></div>
+          <div class="pdx-inline-percent-rail__marker" [style.left.%]="percentFillWidth()"></div>
+        </div>
       }
-    </mat-form-field>
-  `, isInline: true, styles: [":host{display:inline-flex;width:auto;min-width:0;max-width:100%}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field{width:auto;min-width:0;margin-bottom:0;transition:width .12s ease}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-subscript-wrapper{display:none}:host ::ng-deep .pdx-inline-number .mdc-notched-outline{display:none}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-flex,:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper{padding:0;background:transparent}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-focus-overlay{display:none}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-infix{min-height:0;width:auto;flex:0 1 auto;min-width:0;padding:0;position:relative}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{display:flex;align-items:center;min-height:44px;min-width:0;max-width:min(var(--pdx-inline-number-max-w, 280px),calc(100vw - 48px));padding-inline:14px;border-radius:999px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high);box-sizing:border-box;transition:border-color .12s ease,box-shadow .12s ease}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined:after{display:none!important;content:none!important}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--focused{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}:host ::ng-deep .pdx-inline-number input.mat-mdc-input-element{color:var(--md-sys-color-on-surface);font-size:1.05rem;line-height:1.2;width:auto!important;min-width:2ch}:host ::ng-deep .pdx-inline-number .mdc-text-field__input::placeholder,:host ::ng-deep .pdx-inline-number input.mat-mdc-input-element::placeholder{color:var(--md-sys-color-on-surface-variant)!important;opacity:0!important}:host ::ng-deep .pdx-inline-number .pdx-inline-placeholder{position:absolute;left:0;top:50%;transform:translateY(-50%);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--md-sys-color-on-surface-variant);font-size:1.05rem;line-height:1.2}:host ::ng-deep .pdx-inline-number .pdx-inline-measure{position:absolute;visibility:hidden;pointer-events:none;white-space:pre;font-size:1.05rem;line-height:1.2;font-weight:400;left:-9999px;top:-9999px}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-prefix{padding:0;margin-right:10px}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-prefix mat-icon{width:22px;height:22px;font-size:22px;color:var(--md-sys-color-primary)}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-suffix{display:inline-flex;align-items:center;justify-content:center;align-self:center;margin-left:10px;gap:8px;padding:0}:host ::ng-deep .pdx-inline-number .pdx-inline-static-suffix{width:18px;height:18px;font-size:18px}:host ::ng-deep .pdx-inline-number .pdx-inline-number-suffix{color:var(--md-sys-color-on-surface-variant);font-size:.95rem;line-height:1;font-weight:600}:host ::ng-deep .pdx-inline-number .pdx-inline-clear{--clear-ring-color: var(--md-sys-color-primary);width:24px;height:24px;min-width:24px;border:0;border-radius:50%;appearance:none;-webkit-appearance:none;outline:none;padding:0;display:grid;place-items:center;background:color-mix(in srgb,var(--md-sys-color-on-surface) 12%,transparent);color:var(--md-sys-color-on-surface-variant);cursor:pointer;line-height:0;font-size:0;transition:background-color .12s ease,box-shadow .12s ease,color .12s ease}:host ::ng-deep .pdx-inline-number .pdx-inline-clear:hover{background:color-mix(in srgb,var(--md-sys-color-on-surface) 18%,transparent)}:host ::ng-deep .pdx-inline-number .pdx-inline-clear:focus-visible{background:color-mix(in srgb,var(--md-sys-color-on-surface) 20%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--clear-ring-color) 34%,transparent)}:host ::ng-deep .pdx-inline-number .pdx-inline-clear mat-icon{display:block;width:16px;height:16px;font-size:16px;line-height:1;margin:0}@media(max-width:768px){:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{min-height:40px;padding-inline:12px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
+    </div>
+  `, isInline: true, styles: [":host{display:inline-flex;width:auto;min-width:0;max-width:100%}.pdx-inline-number-shell{display:inline-flex;flex-direction:column;gap:8px;width:auto;min-width:0;max-width:100%}.pdx-inline-number-shell-percent{--pdx-inline-percent-accent-start: color-mix(in srgb, var(--md-sys-color-tertiary) 72%, var(--md-sys-color-primary));--pdx-inline-percent-accent-mid: color-mix(in srgb, var(--md-sys-color-secondary) 82%, var(--md-sys-color-primary));--pdx-inline-percent-accent-end: color-mix(in srgb, var(--md-sys-color-primary) 88%, var(--md-sys-color-tertiary));padding:10px 12px 12px;border-radius:20px;border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 16%,var(--md-sys-color-outline-variant));background:linear-gradient(180deg,color-mix(in srgb,var(--md-sys-color-primary) 8%,var(--md-sys-color-surface-container-highest)) 0%,var(--md-sys-color-surface-container) 100%);box-shadow:inset 0 1px color-mix(in srgb,var(--md-sys-color-on-surface) 5%,transparent),0 8px 24px color-mix(in srgb,var(--md-sys-color-primary) 10%,transparent)}.pdx-inline-percent-insight{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center}.pdx-inline-percent-gauge{--pdx-inline-percent-angle: 0deg;position:relative;width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at center,var(--md-sys-color-surface-container) 56%,transparent 57%),conic-gradient(from -90deg,var(--pdx-inline-percent-accent-start) 0deg,var(--pdx-inline-percent-accent-mid) 150deg,var(--pdx-inline-percent-accent-end) var(--pdx-inline-percent-angle),color-mix(in srgb,var(--md-sys-color-outline-variant) 54%,transparent) var(--pdx-inline-percent-angle),color-mix(in srgb,var(--md-sys-color-outline-variant) 54%,transparent) 360deg);box-shadow:0 0 0 1px color-mix(in srgb,var(--md-sys-color-primary) 12%,transparent),0 10px 22px color-mix(in srgb,var(--md-sys-color-primary) 16%,transparent)}.pdx-inline-percent-gauge__core{position:absolute;inset:7px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 30% 30%,color-mix(in srgb,white 54%,transparent),transparent 42%),var(--md-sys-color-surface);border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 14%,var(--md-sys-color-outline-variant))}.pdx-inline-percent-gauge__value{font-size:.85rem;font-weight:700;line-height:1;letter-spacing:-.02em;color:var(--md-sys-color-primary)}.pdx-inline-percent-copy{min-width:0;display:flex;flex-direction:column;gap:4px}.pdx-inline-percent-copy__label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:color-mix(in srgb,var(--md-sys-color-primary) 84%,var(--md-sys-color-on-surface))}.pdx-inline-percent-copy__range{font-size:.82rem;font-weight:500;color:var(--md-sys-color-on-surface-variant);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field{width:auto;min-width:0;margin-bottom:0;transition:width .12s ease}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-subscript-wrapper{display:none}:host ::ng-deep .pdx-inline-number .mdc-notched-outline{display:none}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-flex,:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper{padding:0;background:transparent}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-focus-overlay{display:none}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-infix{min-height:0;width:auto;flex:0 1 auto;min-width:0;padding:0;position:relative}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{display:flex;align-items:center;min-height:44px;min-width:0;max-width:min(var(--pdx-inline-number-max-w, 280px),calc(100vw - 48px));padding-inline:14px;border-radius:999px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high);box-sizing:border-box;transition:border-color .12s ease,box-shadow .12s ease}:host ::ng-deep .pdx-inline-number-shell-percent .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{background:linear-gradient(180deg,color-mix(in srgb,white 68%,transparent),color-mix(in srgb,var(--md-sys-color-surface-container-high) 88%,white));border-color:color-mix(in srgb,var(--md-sys-color-primary) 20%,var(--md-sys-color-outline-variant))}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined:after{display:none!important;content:none!important}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--focused{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}:host ::ng-deep .pdx-inline-number input.mat-mdc-input-element{color:var(--md-sys-color-on-surface);font-size:1.05rem;line-height:1.2;width:auto!important;min-width:2ch}:host ::ng-deep .pdx-inline-number .mdc-text-field__input::placeholder,:host ::ng-deep .pdx-inline-number input.mat-mdc-input-element::placeholder{color:var(--md-sys-color-on-surface-variant)!important;opacity:0!important}:host ::ng-deep .pdx-inline-number .pdx-inline-placeholder{position:absolute;left:0;top:50%;transform:translateY(-50%);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--md-sys-color-on-surface-variant);font-size:1.05rem;line-height:1.2}:host ::ng-deep .pdx-inline-number .pdx-inline-measure{position:absolute;visibility:hidden;pointer-events:none;white-space:pre;font-size:1.05rem;line-height:1.2;font-weight:400;left:-9999px;top:-9999px}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-prefix{padding:0;margin-right:10px}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-prefix mat-icon{width:22px;height:22px;font-size:22px;color:var(--md-sys-color-primary)}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-suffix{display:inline-flex;align-items:center;justify-content:center;align-self:center;margin-left:10px;gap:8px;padding:0}:host ::ng-deep .pdx-inline-number .pdx-inline-static-suffix{width:18px;height:18px;font-size:18px}:host ::ng-deep .pdx-inline-number .pdx-inline-number-suffix{color:var(--md-sys-color-on-surface-variant);font-size:.95rem;line-height:1;font-weight:600}:host ::ng-deep .pdx-inline-number .pdx-inline-clear{--clear-ring-color: var(--md-sys-color-primary);width:24px;height:24px;min-width:24px;border:0;border-radius:50%;appearance:none;-webkit-appearance:none;outline:none;padding:0;display:grid;place-items:center;background:color-mix(in srgb,var(--md-sys-color-on-surface) 12%,transparent);color:var(--md-sys-color-on-surface-variant);cursor:pointer;line-height:0;font-size:0;transition:background-color .12s ease,box-shadow .12s ease,color .12s ease}:host ::ng-deep .pdx-inline-number .pdx-inline-clear:hover{background:color-mix(in srgb,var(--md-sys-color-on-surface) 18%,transparent)}:host ::ng-deep .pdx-inline-number .pdx-inline-clear:focus-visible{background:color-mix(in srgb,var(--md-sys-color-on-surface) 20%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--clear-ring-color) 34%,transparent)}:host ::ng-deep .pdx-inline-number .pdx-inline-clear mat-icon{display:block;width:16px;height:16px;font-size:16px;line-height:1;margin:0}.pdx-inline-percent-rail{position:relative;height:10px;margin-top:2px}.pdx-inline-percent-rail__track,.pdx-inline-percent-rail__fill{position:absolute;inset-block:1px;left:0;border-radius:999px}.pdx-inline-percent-rail__track{right:0;background:linear-gradient(90deg,color-mix(in srgb,var(--pdx-inline-percent-accent-start) 70%,var(--md-sys-color-surface-container-high)),color-mix(in srgb,var(--pdx-inline-percent-accent-mid) 78%,var(--md-sys-color-surface-container-high)) 52%,color-mix(in srgb,var(--pdx-inline-percent-accent-end) 82%,var(--md-sys-color-surface-container-high)));opacity:.2}.pdx-inline-percent-rail__fill{width:0;background:linear-gradient(90deg,var(--pdx-inline-percent-accent-start) 0%,var(--pdx-inline-percent-accent-mid) 52%,var(--pdx-inline-percent-accent-end) 100%);box-shadow:0 0 18px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}.pdx-inline-percent-rail__marker{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;transform:translate(-50%,-50%);background:var(--md-sys-color-surface);border:2px solid var(--md-sys-color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--md-sys-color-primary) 12%,transparent),0 4px 14px color-mix(in srgb,var(--md-sys-color-primary) 18%,transparent)}@media(max-width:768px){.pdx-inline-number-shell-percent{padding:9px 10px 10px;gap:6px}.pdx-inline-percent-insight{gap:10px}.pdx-inline-percent-gauge{width:46px;height:46px}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{min-height:40px;padding-inline:12px}}@media(forced-colors:active){.pdx-inline-number-shell-percent{border-color:CanvasText;background:Canvas;box-shadow:none}.pdx-inline-percent-gauge,.pdx-inline-percent-rail__track,.pdx-inline-percent-rail__fill,.pdx-inline-percent-rail__marker{forced-color-adjust:none}.pdx-inline-percent-gauge{background:radial-gradient(circle at center,Canvas 56%,transparent 57%),conic-gradient(from -90deg,Highlight 0deg,Highlight var(--pdx-inline-percent-angle),GrayText var(--pdx-inline-percent-angle),GrayText 360deg);box-shadow:none}.pdx-inline-percent-gauge__core,.pdx-inline-percent-rail__marker{background:Canvas;border-color:CanvasText}.pdx-inline-percent-rail__track{background:GrayText;opacity:1}.pdx-inline-percent-rail__fill{background:Highlight;box-shadow:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: InlineNumberComponent, decorators: [{
             type: Component,
@@ -19688,79 +19879,106 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                         MatIconModule,
                         MatTooltipModule,
                     ], template: `
-    <mat-form-field
-      [appearance]="'outline'"
-      [color]="materialColor()"
-      [class]="componentCssClasses()"
-      [floatLabel]="'auto'"
-      [subscriptSizing]="'dynamic'"
-      [hideRequiredMarker]="true"
-      [style.width.px]="inlineWidthPx || null"
-      [style.--pdx-inline-number-max-w.px]="inlineMaxWidthPx || null"
-    >
-      <mat-icon
-        matPrefix
-        [color]="iconPalette(prefixIconColor())"
-        [style.color]="iconResolvedColor(prefixIconColor())"
-      >
-        {{ leadingIconName() }}
-      </mat-icon>
-      <input
-        #inputEl
-        matInput
-        type="number"
-        [formControl]="control()"
-        [errorStateMatcher]="errorStateMatcher()"
-        [placeholder]="placeholderText()"
-        [required]="metadata()?.required || false"
-        [readonly]="isReadonlyEffective()"
-        [autocomplete]="metadata()?.autocomplete || 'off'"
-        [spellcheck]="metadata()?.spellcheck ?? false"
-        [min]="effectiveMinValue()"
-        [max]="effectiveMaxValue()"
-        [step]="effectiveStepValue()"
-        [attr.inputmode]="metadata()?.inputMode || 'decimal'"
-        [attr.aria-label]="ariaLabel()"
-        [matTooltip]="inlineTooltipText()"
-        [matTooltipDisabled]="inlineTooltipDisabled()"
-        [matTooltipPosition]="tooltipPosition()"
-        (input)="onInlineInput()"
-      />
-      @if (showInlinePlaceholder()) {
-        <span class="pdx-inline-placeholder" aria-hidden="true">{{ placeholderText() }}</span>
+    <div class="pdx-inline-number-shell" [class.pdx-inline-number-shell-percent]="showPercentGraphicMode()">
+      @if (showPercentGraphicMode()) {
+        <div class="pdx-inline-percent-insight" aria-hidden="true">
+          <div
+            class="pdx-inline-percent-gauge"
+            [style.--pdx-inline-percent-angle]="percentAngle() + 'deg'"
+          >
+            <div class="pdx-inline-percent-gauge__core">
+              <span class="pdx-inline-percent-gauge__value">{{ percentDisplayText() }}</span>
+            </div>
+          </div>
+          <div class="pdx-inline-percent-copy">
+            <span class="pdx-inline-percent-copy__label">{{ placeholderText() }}</span>
+            <span class="pdx-inline-percent-copy__range">{{ percentRangeText() }}</span>
+          </div>
+        </div>
       }
-      <span #measureEl aria-hidden="true" class="pdx-inline-measure">{{ widthProbeText() }}</span>
-      @if (suffixIconName()) {
+
+      <mat-form-field
+        [appearance]="'outline'"
+        [color]="materialColor()"
+        [class]="componentCssClasses()"
+        [floatLabel]="'auto'"
+        [subscriptSizing]="'dynamic'"
+        [hideRequiredMarker]="true"
+        [style.width.px]="inlineWidthPx || null"
+        [style.--pdx-inline-number-max-w.px]="inlineMaxWidthPx || null"
+      >
         <mat-icon
-          matSuffix
-          class="pdx-inline-static-suffix"
-          [color]="iconPalette(suffixIconColor())"
-          [style.color]="iconResolvedColor(suffixIconColor())"
-          [matTooltip]="metadata()?.suffixIconTooltip || null"
-          [attr.aria-label]="metadata()?.suffixIconAriaLabel || null"
+          matPrefix
+          [color]="iconPalette(prefixIconColor())"
+          [style.color]="iconResolvedColor(prefixIconColor())"
         >
-          {{ suffixIconName() }}
+          {{ leadingIconName() }}
         </mat-icon>
-      }
-      @if (showPercentSuffix()) {
-        <span matSuffix class="pdx-inline-number-suffix">%</span>
-      }
-      @if (showQuickClear()) {
-        <button
-          matSuffix
-          type="button"
-          class="pdx-inline-clear"
-          (mousedown)="onTriggerIconMouseDown($event)"
-          (click)="onQuickClear($event)"
-          [attr.aria-label]="clearActionAriaLabel()"
-        >
+        <input
+          #inputEl
+          matInput
+          type="number"
+          [formControl]="control()"
+          [errorStateMatcher]="errorStateMatcher()"
+          [placeholder]="placeholderText()"
+          [required]="metadata()?.required || false"
+          [readonly]="isReadonlyEffective()"
+          [autocomplete]="metadata()?.autocomplete || 'off'"
+          [spellcheck]="metadata()?.spellcheck ?? false"
+          [min]="effectiveMinValue()"
+          [max]="effectiveMaxValue()"
+          [step]="effectiveStepValue()"
+          [attr.inputmode]="metadata()?.inputMode || 'decimal'"
+          [attr.aria-label]="ariaLabel()"
+          [matTooltip]="inlineTooltipText()"
+          [matTooltipDisabled]="inlineTooltipDisabled()"
+          [matTooltipPosition]="tooltipPosition()"
+          (input)="onInlineInput()"
+        />
+        @if (showInlinePlaceholder()) {
+          <span class="pdx-inline-placeholder" aria-hidden="true">{{ placeholderText() }}</span>
+        }
+        <span #measureEl aria-hidden="true" class="pdx-inline-measure">{{ widthProbeText() }}</span>
+        @if (suffixIconName()) {
           <mat-icon
-            [color]="iconPalette(clearIconColor())"
-            [style.color]="iconResolvedColor(clearIconColor())"
-          >{{ clearIconName() }}</mat-icon>
-        </button>
+            matSuffix
+            class="pdx-inline-static-suffix"
+            [color]="iconPalette(suffixIconColor())"
+            [style.color]="iconResolvedColor(suffixIconColor())"
+            [matTooltip]="metadata()?.suffixIconTooltip || null"
+            [attr.aria-label]="metadata()?.suffixIconAriaLabel || null"
+          >
+            {{ suffixIconName() }}
+          </mat-icon>
+        }
+        @if (showPercentSuffix()) {
+          <span matSuffix class="pdx-inline-number-suffix">%</span>
+        }
+        @if (showQuickClear()) {
+          <button
+            matSuffix
+            type="button"
+            class="pdx-inline-clear"
+            (mousedown)="onTriggerIconMouseDown($event)"
+            (click)="onQuickClear($event)"
+            [attr.aria-label]="clearActionAriaLabel()"
+          >
+            <mat-icon
+              [color]="iconPalette(clearIconColor())"
+              [style.color]="iconResolvedColor(clearIconColor())"
+            >{{ clearIconName() }}</mat-icon>
+          </button>
+        }
+      </mat-form-field>
+
+      @if (showPercentGraphicMode()) {
+        <div class="pdx-inline-percent-rail" aria-hidden="true">
+          <div class="pdx-inline-percent-rail__track"></div>
+          <div class="pdx-inline-percent-rail__fill" [style.width.%]="percentFillWidth()"></div>
+          <div class="pdx-inline-percent-rail__marker" [style.left.%]="percentFillWidth()"></div>
+        </div>
       }
-    </mat-form-field>
+    </div>
   `, providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
@@ -19777,7 +19995,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                         '[attr.data-field-type]': '"inlineNumber"',
                         '[attr.data-field-name]': 'metadata()?.name',
                         '[attr.data-component-id]': 'componentId()',
-                    }, styles: [":host{display:inline-flex;width:auto;min-width:0;max-width:100%}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field{width:auto;min-width:0;margin-bottom:0;transition:width .12s ease}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-subscript-wrapper{display:none}:host ::ng-deep .pdx-inline-number .mdc-notched-outline{display:none}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-flex,:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper{padding:0;background:transparent}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-focus-overlay{display:none}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-infix{min-height:0;width:auto;flex:0 1 auto;min-width:0;padding:0;position:relative}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{display:flex;align-items:center;min-height:44px;min-width:0;max-width:min(var(--pdx-inline-number-max-w, 280px),calc(100vw - 48px));padding-inline:14px;border-radius:999px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high);box-sizing:border-box;transition:border-color .12s ease,box-shadow .12s ease}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined:after{display:none!important;content:none!important}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--focused{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}:host ::ng-deep .pdx-inline-number input.mat-mdc-input-element{color:var(--md-sys-color-on-surface);font-size:1.05rem;line-height:1.2;width:auto!important;min-width:2ch}:host ::ng-deep .pdx-inline-number .mdc-text-field__input::placeholder,:host ::ng-deep .pdx-inline-number input.mat-mdc-input-element::placeholder{color:var(--md-sys-color-on-surface-variant)!important;opacity:0!important}:host ::ng-deep .pdx-inline-number .pdx-inline-placeholder{position:absolute;left:0;top:50%;transform:translateY(-50%);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--md-sys-color-on-surface-variant);font-size:1.05rem;line-height:1.2}:host ::ng-deep .pdx-inline-number .pdx-inline-measure{position:absolute;visibility:hidden;pointer-events:none;white-space:pre;font-size:1.05rem;line-height:1.2;font-weight:400;left:-9999px;top:-9999px}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-prefix{padding:0;margin-right:10px}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-prefix mat-icon{width:22px;height:22px;font-size:22px;color:var(--md-sys-color-primary)}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-suffix{display:inline-flex;align-items:center;justify-content:center;align-self:center;margin-left:10px;gap:8px;padding:0}:host ::ng-deep .pdx-inline-number .pdx-inline-static-suffix{width:18px;height:18px;font-size:18px}:host ::ng-deep .pdx-inline-number .pdx-inline-number-suffix{color:var(--md-sys-color-on-surface-variant);font-size:.95rem;line-height:1;font-weight:600}:host ::ng-deep .pdx-inline-number .pdx-inline-clear{--clear-ring-color: var(--md-sys-color-primary);width:24px;height:24px;min-width:24px;border:0;border-radius:50%;appearance:none;-webkit-appearance:none;outline:none;padding:0;display:grid;place-items:center;background:color-mix(in srgb,var(--md-sys-color-on-surface) 12%,transparent);color:var(--md-sys-color-on-surface-variant);cursor:pointer;line-height:0;font-size:0;transition:background-color .12s ease,box-shadow .12s ease,color .12s ease}:host ::ng-deep .pdx-inline-number .pdx-inline-clear:hover{background:color-mix(in srgb,var(--md-sys-color-on-surface) 18%,transparent)}:host ::ng-deep .pdx-inline-number .pdx-inline-clear:focus-visible{background:color-mix(in srgb,var(--md-sys-color-on-surface) 20%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--clear-ring-color) 34%,transparent)}:host ::ng-deep .pdx-inline-number .pdx-inline-clear mat-icon{display:block;width:16px;height:16px;font-size:16px;line-height:1;margin:0}@media(max-width:768px){:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{min-height:40px;padding-inline:12px}}\n"] }]
+                    }, styles: [":host{display:inline-flex;width:auto;min-width:0;max-width:100%}.pdx-inline-number-shell{display:inline-flex;flex-direction:column;gap:8px;width:auto;min-width:0;max-width:100%}.pdx-inline-number-shell-percent{--pdx-inline-percent-accent-start: color-mix(in srgb, var(--md-sys-color-tertiary) 72%, var(--md-sys-color-primary));--pdx-inline-percent-accent-mid: color-mix(in srgb, var(--md-sys-color-secondary) 82%, var(--md-sys-color-primary));--pdx-inline-percent-accent-end: color-mix(in srgb, var(--md-sys-color-primary) 88%, var(--md-sys-color-tertiary));padding:10px 12px 12px;border-radius:20px;border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 16%,var(--md-sys-color-outline-variant));background:linear-gradient(180deg,color-mix(in srgb,var(--md-sys-color-primary) 8%,var(--md-sys-color-surface-container-highest)) 0%,var(--md-sys-color-surface-container) 100%);box-shadow:inset 0 1px color-mix(in srgb,var(--md-sys-color-on-surface) 5%,transparent),0 8px 24px color-mix(in srgb,var(--md-sys-color-primary) 10%,transparent)}.pdx-inline-percent-insight{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center}.pdx-inline-percent-gauge{--pdx-inline-percent-angle: 0deg;position:relative;width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at center,var(--md-sys-color-surface-container) 56%,transparent 57%),conic-gradient(from -90deg,var(--pdx-inline-percent-accent-start) 0deg,var(--pdx-inline-percent-accent-mid) 150deg,var(--pdx-inline-percent-accent-end) var(--pdx-inline-percent-angle),color-mix(in srgb,var(--md-sys-color-outline-variant) 54%,transparent) var(--pdx-inline-percent-angle),color-mix(in srgb,var(--md-sys-color-outline-variant) 54%,transparent) 360deg);box-shadow:0 0 0 1px color-mix(in srgb,var(--md-sys-color-primary) 12%,transparent),0 10px 22px color-mix(in srgb,var(--md-sys-color-primary) 16%,transparent)}.pdx-inline-percent-gauge__core{position:absolute;inset:7px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 30% 30%,color-mix(in srgb,white 54%,transparent),transparent 42%),var(--md-sys-color-surface);border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 14%,var(--md-sys-color-outline-variant))}.pdx-inline-percent-gauge__value{font-size:.85rem;font-weight:700;line-height:1;letter-spacing:-.02em;color:var(--md-sys-color-primary)}.pdx-inline-percent-copy{min-width:0;display:flex;flex-direction:column;gap:4px}.pdx-inline-percent-copy__label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:color-mix(in srgb,var(--md-sys-color-primary) 84%,var(--md-sys-color-on-surface))}.pdx-inline-percent-copy__range{font-size:.82rem;font-weight:500;color:var(--md-sys-color-on-surface-variant);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field{width:auto;min-width:0;margin-bottom:0;transition:width .12s ease}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-subscript-wrapper{display:none}:host ::ng-deep .pdx-inline-number .mdc-notched-outline{display:none}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-flex,:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper{padding:0;background:transparent}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-focus-overlay{display:none}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-infix{min-height:0;width:auto;flex:0 1 auto;min-width:0;padding:0;position:relative}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{display:flex;align-items:center;min-height:44px;min-width:0;max-width:min(var(--pdx-inline-number-max-w, 280px),calc(100vw - 48px));padding-inline:14px;border-radius:999px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high);box-sizing:border-box;transition:border-color .12s ease,box-shadow .12s ease}:host ::ng-deep .pdx-inline-number-shell-percent .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{background:linear-gradient(180deg,color-mix(in srgb,white 68%,transparent),color-mix(in srgb,var(--md-sys-color-surface-container-high) 88%,white));border-color:color-mix(in srgb,var(--md-sys-color-primary) 20%,var(--md-sys-color-outline-variant))}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined:after{display:none!important;content:none!important}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--focused{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}:host ::ng-deep .pdx-inline-number input.mat-mdc-input-element{color:var(--md-sys-color-on-surface);font-size:1.05rem;line-height:1.2;width:auto!important;min-width:2ch}:host ::ng-deep .pdx-inline-number .mdc-text-field__input::placeholder,:host ::ng-deep .pdx-inline-number input.mat-mdc-input-element::placeholder{color:var(--md-sys-color-on-surface-variant)!important;opacity:0!important}:host ::ng-deep .pdx-inline-number .pdx-inline-placeholder{position:absolute;left:0;top:50%;transform:translateY(-50%);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--md-sys-color-on-surface-variant);font-size:1.05rem;line-height:1.2}:host ::ng-deep .pdx-inline-number .pdx-inline-measure{position:absolute;visibility:hidden;pointer-events:none;white-space:pre;font-size:1.05rem;line-height:1.2;font-weight:400;left:-9999px;top:-9999px}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-prefix{padding:0;margin-right:10px}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-prefix mat-icon{width:22px;height:22px;font-size:22px;color:var(--md-sys-color-primary)}:host ::ng-deep .pdx-inline-number .mat-mdc-form-field-icon-suffix{display:inline-flex;align-items:center;justify-content:center;align-self:center;margin-left:10px;gap:8px;padding:0}:host ::ng-deep .pdx-inline-number .pdx-inline-static-suffix{width:18px;height:18px;font-size:18px}:host ::ng-deep .pdx-inline-number .pdx-inline-number-suffix{color:var(--md-sys-color-on-surface-variant);font-size:.95rem;line-height:1;font-weight:600}:host ::ng-deep .pdx-inline-number .pdx-inline-clear{--clear-ring-color: var(--md-sys-color-primary);width:24px;height:24px;min-width:24px;border:0;border-radius:50%;appearance:none;-webkit-appearance:none;outline:none;padding:0;display:grid;place-items:center;background:color-mix(in srgb,var(--md-sys-color-on-surface) 12%,transparent);color:var(--md-sys-color-on-surface-variant);cursor:pointer;line-height:0;font-size:0;transition:background-color .12s ease,box-shadow .12s ease,color .12s ease}:host ::ng-deep .pdx-inline-number .pdx-inline-clear:hover{background:color-mix(in srgb,var(--md-sys-color-on-surface) 18%,transparent)}:host ::ng-deep .pdx-inline-number .pdx-inline-clear:focus-visible{background:color-mix(in srgb,var(--md-sys-color-on-surface) 20%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--clear-ring-color) 34%,transparent)}:host ::ng-deep .pdx-inline-number .pdx-inline-clear mat-icon{display:block;width:16px;height:16px;font-size:16px;line-height:1;margin:0}.pdx-inline-percent-rail{position:relative;height:10px;margin-top:2px}.pdx-inline-percent-rail__track,.pdx-inline-percent-rail__fill{position:absolute;inset-block:1px;left:0;border-radius:999px}.pdx-inline-percent-rail__track{right:0;background:linear-gradient(90deg,color-mix(in srgb,var(--pdx-inline-percent-accent-start) 70%,var(--md-sys-color-surface-container-high)),color-mix(in srgb,var(--pdx-inline-percent-accent-mid) 78%,var(--md-sys-color-surface-container-high)) 52%,color-mix(in srgb,var(--pdx-inline-percent-accent-end) 82%,var(--md-sys-color-surface-container-high)));opacity:.2}.pdx-inline-percent-rail__fill{width:0;background:linear-gradient(90deg,var(--pdx-inline-percent-accent-start) 0%,var(--pdx-inline-percent-accent-mid) 52%,var(--pdx-inline-percent-accent-end) 100%);box-shadow:0 0 18px color-mix(in srgb,var(--md-sys-color-primary) 22%,transparent)}.pdx-inline-percent-rail__marker{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;transform:translate(-50%,-50%);background:var(--md-sys-color-surface);border:2px solid var(--md-sys-color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--md-sys-color-primary) 12%,transparent),0 4px 14px color-mix(in srgb,var(--md-sys-color-primary) 18%,transparent)}@media(max-width:768px){.pdx-inline-number-shell-percent{padding:9px 10px 10px;gap:6px}.pdx-inline-percent-insight{gap:10px}.pdx-inline-percent-gauge{width:46px;height:46px}:host ::ng-deep .pdx-inline-number .mat-mdc-text-field-wrapper.mdc-text-field--outlined{min-height:40px;padding-inline:12px}}@media(forced-colors:active){.pdx-inline-number-shell-percent{border-color:CanvasText;background:Canvas;box-shadow:none}.pdx-inline-percent-gauge,.pdx-inline-percent-rail__track,.pdx-inline-percent-rail__fill,.pdx-inline-percent-rail__marker{forced-color-adjust:none}.pdx-inline-percent-gauge{background:radial-gradient(circle at center,Canvas 56%,transparent 57%),conic-gradient(from -90deg,Highlight 0deg,Highlight var(--pdx-inline-percent-angle),GrayText var(--pdx-inline-percent-angle),GrayText 360deg);box-shadow:none}.pdx-inline-percent-gauge__core,.pdx-inline-percent-rail__marker{background:Canvas;border-color:CanvasText}.pdx-inline-percent-rail__track{background:GrayText;opacity:1}.pdx-inline-percent-rail__fill{background:Highlight;box-shadow:none}}\n"] }]
         }], propDecorators: { inputEl: [{
                 type: ViewChild,
                 args: ['inputEl', { read: ElementRef }]
@@ -23673,6 +23891,673 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                 args: ['document:keydown.escape']
             }] } });
 
+class InlinePeriodRangeComponent extends SimpleBaseInputComponent {
+    innerComponent;
+    readonlyMode = false;
+    disabledMode = false;
+    visible = true;
+    presentationMode = false;
+    sliderControl = new FormControl(null);
+    syncingFromOuter = false;
+    syncingFromInner = false;
+    periodState = computed(() => {
+        const metadata = this.metadata();
+        if (!metadata)
+            return null;
+        const values = this.buildPeriods(metadata);
+        if (!values.length)
+            return null;
+        return {
+            values,
+            indexByValue: new Map(values.map((value, index) => [value, index])),
+        };
+    }, ...(ngDevMode ? [{ debugName: "periodState" }] : []));
+    resolvedMetadata = computed(() => {
+        const metadata = this.metadata();
+        const periodState = this.periodState();
+        if (!metadata || !periodState)
+            return null;
+        const maxIndex = Math.max(periodState.values.length - 1, 0);
+        const defaultInlineTexts = metadata.granularity === 'year'
+            ? {
+                minLabel: 'Período inicial',
+                maxLabel: 'Período final',
+                quickPresetsLabel: 'Períodos rápidos',
+            }
+            : {
+                quickPresetsLabel: 'Períodos rápidos',
+            };
+        return {
+            ...metadata,
+            controlType: FieldControlType.RANGE_SLIDER,
+            mode: 'range',
+            min: 0,
+            max: maxIndex,
+            step: 1,
+            discrete: metadata.discrete ?? true,
+            showTicks: metadata.showTicks ?? true,
+            showInputs: metadata.showInputs ??
+                (metadata.granularity === 'year' &&
+                    periodState.values.every((value) => /^\d{4}$/.test(value))),
+            prefixIcon: metadata.prefixIcon || this.defaultIcon(metadata.granularity),
+            inlineTexts: metadata.inlineTexts ?? defaultInlineTexts,
+            displayWith: metadata.displayWith ??
+                ((value) => this.formatPeriodLabel(periodState.values[this.boundIndex(value, maxIndex)] || '', metadata)),
+            quickPresets: this.adaptQuickPresets(metadata.quickPresets, periodState),
+            quickPresetsAuto: false,
+        };
+    }, ...(ngDevMode ? [{ debugName: "resolvedMetadata" }] : []));
+    ngOnInit() {
+        super.ngOnInit();
+        this.control().valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((value) => {
+            if (this.syncingFromInner)
+                return;
+            this.syncFromOuterValue(value);
+        });
+        this.sliderControl.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((value) => {
+            if (this.syncingFromOuter)
+                return;
+            this.syncFromInnerValue(value);
+        });
+    }
+    ngAfterViewInit() {
+        super.ngAfterViewInit();
+        this.syncInnerMetadata();
+        this.syncFromOuterValue(this.control().value);
+    }
+    writeValue(value) {
+        super.writeValue(value);
+        this.syncFromOuterValue(value);
+    }
+    setInputMetadata(metadata) {
+        this.setMetadata(metadata);
+        this.syncInnerMetadata();
+        this.syncFromOuterValue(this.control().value);
+    }
+    setMetadata(metadata) {
+        super.setMetadata(metadata);
+        this.syncInnerMetadata();
+        this.syncFromOuterValue(this.control().value);
+    }
+    getSpecificCssClasses() {
+        return ['pdx-inline-period-range'];
+    }
+    syncFromOuterValue(value) {
+        const periodState = this.periodState();
+        if (!periodState)
+            return;
+        const nextValue = this.toSliderValue(value, periodState);
+        this.syncingFromOuter = true;
+        try {
+            this.sliderControl.setValue(nextValue, { emitEvent: false });
+        }
+        finally {
+            this.syncingFromOuter = false;
+        }
+    }
+    syncFromInnerValue(value) {
+        const periodState = this.periodState();
+        if (!periodState)
+            return;
+        const nextOuter = this.toOuterValue(value, periodState);
+        this.syncingFromInner = true;
+        try {
+            this.setValue(nextOuter, { emitEvent: true });
+        }
+        finally {
+            this.syncingFromInner = false;
+        }
+    }
+    toSliderValue(value, periodState) {
+        if (!Array.isArray(value) || value.length < 2)
+            return null;
+        const start = periodState.indexByValue.get(String(value[0]));
+        const end = periodState.indexByValue.get(String(value[1]));
+        if (start === undefined || end === undefined)
+            return null;
+        return {
+            start: Math.min(start, end),
+            end: Math.max(start, end),
+        };
+    }
+    toOuterValue(value, periodState) {
+        if (!value)
+            return null;
+        const start = this.boundIndex(value.start ?? 0, periodState.values.length - 1);
+        const end = this.boundIndex(value.end ?? 0, periodState.values.length - 1);
+        return [periodState.values[Math.min(start, end)], periodState.values[Math.max(start, end)]];
+    }
+    adaptQuickPresets(presets, periodState) {
+        if (!Array.isArray(presets) || !presets.length)
+            return [];
+        return presets
+            .map((preset) => {
+            const start = periodState.indexByValue.get(String(preset.start));
+            const end = periodState.indexByValue.get(String(preset.end));
+            if (start === undefined || end === undefined)
+                return null;
+            return {
+                id: preset.id,
+                label: preset.label,
+                start: Math.min(start, end),
+                end: Math.max(start, end),
+            };
+        })
+            .filter((preset) => Boolean(preset));
+    }
+    formatPeriodLabel(value, metadata) {
+        if (!value)
+            return '';
+        switch (metadata.granularity) {
+            case 'month':
+                return this.formatMonthValue(value, metadata);
+            case 'quarter':
+            case 'fiscal-quarter':
+                return value.replace('-', '/');
+            case 'fiscal-year':
+                return value;
+            case 'year':
+                return value;
+            default:
+                return value;
+        }
+    }
+    formatMonthValue(value, metadata) {
+        const match = /^(\d{4})-(\d{2})$/.exec(value);
+        if (!match)
+            return value;
+        const [, year, month] = match;
+        const monthIndex = Number(month) - 1;
+        const customLabels = Array.isArray(metadata.monthLabels) ? metadata.monthLabels : [];
+        const labelFromConfig = customLabels[monthIndex];
+        if (labelFromConfig)
+            return `${labelFromConfig}/${year}`;
+        const formatter = new Intl.DateTimeFormat(metadata.locale || 'pt-BR', {
+            month: 'short',
+        });
+        const raw = formatter.format(new Date(Number(year), monthIndex, 1)).replace('.', '');
+        return `${raw.charAt(0).toUpperCase()}${raw.slice(1)}/${year}`;
+    }
+    defaultIcon(granularity) {
+        switch (granularity) {
+            case 'month':
+                return 'calendar_view_month';
+            case 'quarter':
+            case 'fiscal-quarter':
+                return 'date_range';
+            case 'year':
+            case 'fiscal-year':
+                return 'calendar_today';
+            default:
+                return 'date_range';
+        }
+    }
+    buildPeriods(metadata) {
+        switch (metadata.granularity) {
+            case 'month':
+                return this.buildMonthPeriods(metadata.min, metadata.max);
+            case 'quarter':
+            case 'fiscal-quarter':
+                return this.buildQuarterPeriods(metadata.min, metadata.max);
+            case 'year':
+            case 'fiscal-year':
+                return this.buildYearPeriods(metadata.min, metadata.max);
+            default:
+                return [];
+        }
+    }
+    buildMonthPeriods(min, max) {
+        const start = this.parseYearMonth(min);
+        const end = this.parseYearMonth(max);
+        if (!start || !end)
+            return [];
+        const periods = [];
+        let current = start.year * 12 + (start.month - 1);
+        const last = end.year * 12 + (end.month - 1);
+        while (current <= last) {
+            const year = Math.floor(current / 12);
+            const month = (current % 12) + 1;
+            periods.push(`${year}-${String(month).padStart(2, '0')}`);
+            current += 1;
+        }
+        return periods;
+    }
+    buildQuarterPeriods(min, max) {
+        const start = this.parseQuarter(min);
+        const end = this.parseQuarter(max);
+        if (!start || !end)
+            return [];
+        const periods = [];
+        let currentYear = start.year;
+        let currentQuarter = start.quarter;
+        while (currentYear < end.year ||
+            (currentYear === end.year && currentQuarter <= end.quarter)) {
+            periods.push(`${currentYear}-Q${currentQuarter}`);
+            currentQuarter += 1;
+            if (currentQuarter > 4) {
+                currentQuarter = 1;
+                currentYear += 1;
+            }
+        }
+        return periods;
+    }
+    buildYearPeriods(min, max) {
+        const start = this.parseYear(min);
+        const end = this.parseYear(max);
+        if (start === null || end === null)
+            return [];
+        const periods = [];
+        for (let year = Math.min(start, end); year <= Math.max(start, end); year += 1) {
+            periods.push(String(year));
+        }
+        return periods;
+    }
+    parseYearMonth(value) {
+        if (!value)
+            return null;
+        const match = /^(\d{4})-(\d{2})$/.exec(String(value).trim());
+        if (!match)
+            return null;
+        const year = Number(match[1]);
+        const month = Number(match[2]);
+        if (!Number.isFinite(year) || !Number.isFinite(month) || month < 1 || month > 12) {
+            return null;
+        }
+        return { year, month };
+    }
+    parseQuarter(value) {
+        if (!value)
+            return null;
+        const match = /^(\d{4})-Q([1-4])$/i.exec(String(value).trim());
+        if (!match)
+            return null;
+        return { year: Number(match[1]), quarter: Number(match[2]) };
+    }
+    parseYear(value) {
+        if (!value)
+            return null;
+        const normalized = String(value).trim().replace(/^FY/i, '');
+        const year = Number(normalized);
+        return Number.isFinite(year) ? year : null;
+    }
+    boundIndex(value, max) {
+        const numeric = Number.isFinite(Number(value)) ? Number(value) : 0;
+        return Math.min(max, Math.max(0, Math.round(numeric)));
+    }
+    syncInnerMetadata() {
+        const metadata = this.resolvedMetadata();
+        if (!metadata || !this.innerComponent)
+            return;
+        this.innerComponent.setMetadata(metadata);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: InlinePeriodRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: InlinePeriodRangeComponent, isStandalone: true, selector: "pdx-inline-period-range", inputs: { readonlyMode: "readonlyMode", disabledMode: "disabledMode", visible: "visible", presentationMode: "presentationMode" }, host: { properties: { "style.display": "visible ? null : \"none\"", "attr.aria-hidden": "visible ? null : \"true\"", "attr.data-field-type": "\"inlinePeriodRange\"", "attr.data-field-name": "metadata()?.name", "attr.data-component-id": "componentId()" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => InlinePeriodRangeComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "innerComponent", first: true, predicate: InlineRangeSliderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: `
+    <pdx-inline-range-slider
+      [formControl]="sliderControl"
+      [readonlyMode]="readonlyMode"
+      [disabledMode]="disabledMode"
+      [visible]="visible"
+      [presentationMode]="presentationMode"
+    />
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: InlineRangeSliderComponent, selector: "pdx-inline-range-slider", inputs: ["readonlyMode", "disabledMode", "visible", "presentationMode"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: InlinePeriodRangeComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'pdx-inline-period-range',
+                    standalone: true,
+                    imports: [CommonModule, ReactiveFormsModule, InlineRangeSliderComponent],
+                    template: `
+    <pdx-inline-range-slider
+      [formControl]="sliderControl"
+      [readonlyMode]="readonlyMode"
+      [disabledMode]="disabledMode"
+      [visible]="visible"
+      [presentationMode]="presentationMode"
+    />
+  `,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => InlinePeriodRangeComponent),
+                            multi: true,
+                        },
+                    ],
+                    host: {
+                        '[style.display]': 'visible ? null : "none"',
+                        '[attr.aria-hidden]': 'visible ? null : "true"',
+                        '[attr.data-field-type]': '"inlinePeriodRange"',
+                        '[attr.data-field-name]': 'metadata()?.name',
+                        '[attr.data-component-id]': 'componentId()',
+                    },
+                }]
+        }], propDecorators: { innerComponent: [{
+                type: ViewChild,
+                args: [InlineRangeSliderComponent]
+            }], readonlyMode: [{
+                type: Input
+            }], disabledMode: [{
+                type: Input
+            }], visible: [{
+                type: Input
+            }], presentationMode: [{
+                type: Input
+            }] } });
+
+class InlineYearRangeComponent extends SimpleBaseInputComponent {
+    innerComponent;
+    readonlyMode = false;
+    disabledMode = false;
+    visible = true;
+    presentationMode = false;
+    resolvedMetadata = computed(() => {
+        const metadata = this.metadata();
+        if (!metadata)
+            return null;
+        const maxYear = Number.isFinite(Number(metadata.max))
+            ? Number(metadata.max)
+            : new Date().getFullYear();
+        const minYear = Number.isFinite(Number(metadata.min))
+            ? Number(metadata.min)
+            : Math.max(2000, maxYear - 10);
+        const boundedMin = Math.min(minYear, maxYear);
+        const boundedMax = Math.max(maxYear, minYear);
+        const fullLabel = metadata.quickPresetsLabels?.full ||
+            (boundedMin === boundedMax ? String(boundedMax) : 'Todo o período');
+        const currentLabel = metadata.quickPresetsLabels?.current || String(boundedMax);
+        const previousYear = Math.max(boundedMin, boundedMax - 1);
+        const previousLabel = metadata.quickPresetsLabels?.previous || String(previousYear);
+        const recentStart = Math.max(boundedMin, boundedMax - 2);
+        const recentLabel = metadata.quickPresetsLabels?.recent ||
+            (recentStart === boundedMax ? String(boundedMax) : `${recentStart}-${boundedMax}`);
+        const quickPresets = metadata.quickPresets ??
+            [
+                {
+                    id: 'full',
+                    label: fullLabel,
+                    start: boundedMin,
+                    end: boundedMax,
+                },
+                {
+                    id: 'current',
+                    label: currentLabel,
+                    start: boundedMax,
+                    end: boundedMax,
+                },
+                ...(previousYear < boundedMax
+                    ? [
+                        {
+                            id: 'previous',
+                            label: previousLabel,
+                            start: previousYear,
+                            end: previousYear,
+                        },
+                    ]
+                    : []),
+                ...(recentStart < boundedMax
+                    ? [
+                        {
+                            id: 'recent',
+                            label: recentLabel,
+                            start: recentStart,
+                            end: boundedMax,
+                        },
+                    ]
+                    : []),
+            ];
+        return {
+            ...metadata,
+            controlType: FieldControlType.RANGE_SLIDER,
+            mode: 'range',
+            min: boundedMin,
+            max: boundedMax,
+            step: Number.isFinite(Number(metadata.step)) ? Number(metadata.step) : 1,
+            discrete: metadata.discrete ?? true,
+            showTicks: metadata.showTicks ?? true,
+            showInputs: metadata.showInputs ?? true,
+            prefixIcon: metadata.prefixIcon || 'calendar_today',
+            inlineTexts: metadata.inlineTexts ?? {
+                minLabel: 'Ano inicial',
+                maxLabel: 'Ano final',
+                quickPresetsLabel: 'Anos rápidos',
+            },
+            displayWith: metadata.displayWith ??
+                ((value) => {
+                    const year = Math.round(value);
+                    return Number.isFinite(year) ? String(year) : '';
+                }),
+            quickPresets,
+            quickPresetsAuto: false,
+        };
+    }, ...(ngDevMode ? [{ debugName: "resolvedMetadata" }] : []));
+    getSpecificCssClasses() {
+        return ['pdx-inline-year-range'];
+    }
+    ngAfterViewInit() {
+        super.ngAfterViewInit();
+        this.syncInnerMetadata();
+    }
+    setInputMetadata(metadata) {
+        this.setMetadata(metadata);
+        this.syncInnerMetadata();
+    }
+    setMetadata(metadata) {
+        super.setMetadata(metadata);
+        this.syncInnerMetadata();
+    }
+    syncInnerMetadata() {
+        const metadata = this.resolvedMetadata();
+        if (!metadata || !this.innerComponent)
+            return;
+        this.innerComponent.setMetadata(metadata);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: InlineYearRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: InlineYearRangeComponent, isStandalone: true, selector: "pdx-inline-year-range", inputs: { readonlyMode: "readonlyMode", disabledMode: "disabledMode", visible: "visible", presentationMode: "presentationMode" }, host: { properties: { "style.display": "visible ? null : \"none\"", "attr.aria-hidden": "visible ? null : \"true\"", "attr.data-field-type": "\"inlineYearRange\"", "attr.data-field-name": "metadata()?.name", "attr.data-component-id": "componentId()" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => InlineYearRangeComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "innerComponent", first: true, predicate: InlineRangeSliderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: `
+    <pdx-inline-range-slider
+      [formControl]="control()"
+      [readonlyMode]="readonlyMode"
+      [disabledMode]="disabledMode"
+      [visible]="visible"
+      [presentationMode]="presentationMode"
+    />
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: InlineRangeSliderComponent, selector: "pdx-inline-range-slider", inputs: ["readonlyMode", "disabledMode", "visible", "presentationMode"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: InlineYearRangeComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'pdx-inline-year-range',
+                    standalone: true,
+                    imports: [CommonModule, ReactiveFormsModule, InlineRangeSliderComponent],
+                    template: `
+    <pdx-inline-range-slider
+      [formControl]="control()"
+      [readonlyMode]="readonlyMode"
+      [disabledMode]="disabledMode"
+      [visible]="visible"
+      [presentationMode]="presentationMode"
+    />
+  `,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => InlineYearRangeComponent),
+                            multi: true,
+                        },
+                    ],
+                    host: {
+                        '[style.display]': 'visible ? null : "none"',
+                        '[attr.aria-hidden]': 'visible ? null : "true"',
+                        '[attr.data-field-type]': '"inlineYearRange"',
+                        '[attr.data-field-name]': 'metadata()?.name',
+                        '[attr.data-component-id]': 'componentId()',
+                    },
+                }]
+        }], propDecorators: { innerComponent: [{
+                type: ViewChild,
+                args: [InlineRangeSliderComponent]
+            }], readonlyMode: [{
+                type: Input
+            }], disabledMode: [{
+                type: Input
+            }], visible: [{
+                type: Input
+            }], presentationMode: [{
+                type: Input
+            }] } });
+
+class InlineMonthRangeComponent extends SimpleBaseInputComponent {
+    innerComponent;
+    readonlyMode = false;
+    disabledMode = false;
+    visible = true;
+    presentationMode = false;
+    resolvedMetadata = computed(() => {
+        const metadata = this.metadata();
+        if (!metadata)
+            return null;
+        const labels = this.resolveMonthLabels(metadata);
+        const fullLabel = metadata.quickPresetsLabels?.full || 'Ano todo';
+        const firstHalfLabel = metadata.quickPresetsLabels?.firstHalf || 'Jan-Jun';
+        const secondHalfLabel = metadata.quickPresetsLabels?.secondHalf || 'Jul-Dez';
+        return {
+            ...metadata,
+            controlType: FieldControlType.RANGE_SLIDER,
+            mode: 'range',
+            min: 1,
+            max: 12,
+            step: 1,
+            discrete: metadata.discrete ?? true,
+            showTicks: metadata.showTicks ?? true,
+            showInputs: metadata.showInputs ?? false,
+            prefixIcon: metadata.prefixIcon || 'calendar_view_month',
+            inlineTexts: metadata.inlineTexts ?? {
+                quickPresetsLabel: 'Períodos rápidos',
+            },
+            displayWith: metadata.displayWith ??
+                ((value) => {
+                    const monthNumber = Math.min(12, Math.max(1, Math.round(value)));
+                    return labels[monthNumber - 1] || String(monthNumber);
+                }),
+            quickPresets: metadata.quickPresets ??
+                [
+                    { id: 'full', label: fullLabel, start: 1, end: 12 },
+                    { id: 'q1', label: metadata.quickPresetsLabels?.q1 || 'Q1', start: 1, end: 3 },
+                    { id: 'q2', label: metadata.quickPresetsLabels?.q2 || 'Q2', start: 4, end: 6 },
+                    { id: 'q3', label: metadata.quickPresetsLabels?.q3 || 'Q3', start: 7, end: 9 },
+                    { id: 'q4', label: metadata.quickPresetsLabels?.q4 || 'Q4', start: 10, end: 12 },
+                    { id: 'first-half', label: firstHalfLabel, start: 1, end: 6 },
+                    { id: 'second-half', label: secondHalfLabel, start: 7, end: 12 },
+                ],
+            quickPresetsAuto: false,
+        };
+    }, ...(ngDevMode ? [{ debugName: "resolvedMetadata" }] : []));
+    getSpecificCssClasses() {
+        return ['pdx-inline-month-range'];
+    }
+    ngAfterViewInit() {
+        super.ngAfterViewInit();
+        this.syncInnerMetadata();
+    }
+    setInputMetadata(metadata) {
+        this.setMetadata(metadata);
+        this.syncInnerMetadata();
+    }
+    setMetadata(metadata) {
+        super.setMetadata(metadata);
+        this.syncInnerMetadata();
+    }
+    resolveMonthLabels(metadata) {
+        if (Array.isArray(metadata.monthLabels) && metadata.monthLabels.length >= 12) {
+            return metadata.monthLabels.slice(0, 12);
+        }
+        const formatter = new Intl.DateTimeFormat('pt-BR', { month: 'short' });
+        return Array.from({ length: 12 }, (_, index) => {
+            const raw = formatter.format(new Date(2020, index, 1)).replace('.', '');
+            return raw.charAt(0).toUpperCase() + raw.slice(1);
+        });
+    }
+    syncInnerMetadata() {
+        const metadata = this.resolvedMetadata();
+        if (!metadata || !this.innerComponent)
+            return;
+        this.innerComponent.setMetadata(metadata);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: InlineMonthRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: InlineMonthRangeComponent, isStandalone: true, selector: "pdx-inline-month-range", inputs: { readonlyMode: "readonlyMode", disabledMode: "disabledMode", visible: "visible", presentationMode: "presentationMode" }, host: { properties: { "style.display": "visible ? null : \"none\"", "attr.aria-hidden": "visible ? null : \"true\"", "attr.data-field-type": "\"inlineMonthRange\"", "attr.data-field-name": "metadata()?.name", "attr.data-component-id": "componentId()" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => InlineMonthRangeComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "innerComponent", first: true, predicate: InlineRangeSliderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: `
+    <pdx-inline-range-slider
+      [formControl]="control()"
+      [readonlyMode]="readonlyMode"
+      [disabledMode]="disabledMode"
+      [visible]="visible"
+      [presentationMode]="presentationMode"
+    />
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: InlineRangeSliderComponent, selector: "pdx-inline-range-slider", inputs: ["readonlyMode", "disabledMode", "visible", "presentationMode"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: InlineMonthRangeComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'pdx-inline-month-range',
+                    standalone: true,
+                    imports: [CommonModule, ReactiveFormsModule, InlineRangeSliderComponent],
+                    template: `
+    <pdx-inline-range-slider
+      [formControl]="control()"
+      [readonlyMode]="readonlyMode"
+      [disabledMode]="disabledMode"
+      [visible]="visible"
+      [presentationMode]="presentationMode"
+    />
+  `,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => InlineMonthRangeComponent),
+                            multi: true,
+                        },
+                    ],
+                    host: {
+                        '[style.display]': 'visible ? null : "none"',
+                        '[attr.aria-hidden]': 'visible ? null : "true"',
+                        '[attr.data-field-type]': '"inlineMonthRange"',
+                        '[attr.data-field-name]': 'metadata()?.name',
+                        '[attr.data-component-id]': 'componentId()',
+                    },
+                }]
+        }], propDecorators: { innerComponent: [{
+                type: ViewChild,
+                args: [InlineRangeSliderComponent]
+            }], readonlyMode: [{
+                type: Input
+            }], disabledMode: [{
+                type: Input
+            }], visible: [{
+                type: Input
+            }], presentationMode: [{
+                type: Input
+            }] } });
+
 class InlineDateComponent extends MaterialDatepickerComponent {
     inputEl;
     measureEl;
@@ -45619,6 +46504,60 @@ const PDX_INLINE_RANGE_SLIDER_COMPONENT_METADATA = {
     lib: '@praxisui/dynamic-fields',
 };
 
+const PDX_INLINE_PERIOD_RANGE_COMPONENT_METADATA = {
+    id: 'pdx-inline-period-range',
+    selector: 'pdx-inline-period-range',
+    component: InlinePeriodRangeComponent,
+    friendlyName: 'Inline Period Range',
+    description: 'Faixa temporal corporativa por granularidade, cobrindo meses, trimestres, anos e períodos fiscais em um contrato inline canônico.',
+    icon: 'date_range',
+    inputs: [
+        { name: 'metadata', type: 'InlinePeriodRangeMetadata', description: 'Configuração do campo' },
+        { name: 'readonlyMode', type: 'boolean', default: false, description: 'Define modo somente leitura' },
+        { name: 'disabledMode', type: 'boolean', default: false, description: 'Desabilita o campo' },
+        { name: 'visible', type: 'boolean', default: true, description: 'Controla a visibilidade' },
+        { name: 'presentationMode', type: 'boolean', default: false, description: 'Modo de apresentação' },
+    ],
+    tags: ['widget', 'field', 'period', 'range', 'filter', 'inline', 'temporal'],
+    lib: '@praxisui/dynamic-fields',
+};
+
+const PDX_INLINE_YEAR_RANGE_COMPONENT_METADATA = {
+    id: 'pdx-inline-year-range',
+    selector: 'pdx-inline-year-range',
+    component: InlineYearRangeComponent,
+    friendlyName: 'Inline Year Range',
+    description: 'Faixa anual compacta para filtros inline corporativos, com slider dedicado, presets por período recente e leitura semântica orientada a analytics.',
+    icon: 'calendar_today',
+    inputs: [
+        { name: 'metadata', type: 'InlineYearRangeMetadata', description: 'Configuração do campo' },
+        { name: 'readonlyMode', type: 'boolean', default: false, description: 'Define modo somente leitura' },
+        { name: 'disabledMode', type: 'boolean', default: false, description: 'Desabilita o campo' },
+        { name: 'visible', type: 'boolean', default: true, description: 'Controla a visibilidade' },
+        { name: 'presentationMode', type: 'boolean', default: false, description: 'Modo de apresentação' },
+    ],
+    tags: ['widget', 'field', 'year', 'range', 'filter', 'inline'],
+    lib: '@praxisui/dynamic-fields',
+};
+
+const PDX_INLINE_MONTH_RANGE_COMPONENT_METADATA = {
+    id: 'pdx-inline-month-range',
+    selector: 'pdx-inline-month-range',
+    component: InlineMonthRangeComponent,
+    friendlyName: 'Inline Month Range',
+    description: 'Faixa mensal compacta para filtros inline, com leitura por nomes de mês e atalhos de trimestre/semestre para dashboards analíticos.',
+    icon: 'calendar_view_month',
+    inputs: [
+        { name: 'metadata', type: 'InlineMonthRangeMetadata', description: 'Configuração do campo' },
+        { name: 'readonlyMode', type: 'boolean', default: false, description: 'Define modo somente leitura' },
+        { name: 'disabledMode', type: 'boolean', default: false, description: 'Desabilita o campo' },
+        { name: 'visible', type: 'boolean', default: true, description: 'Controla a visibilidade' },
+        { name: 'presentationMode', type: 'boolean', default: false, description: 'Modo de apresentação' },
+    ],
+    tags: ['widget', 'field', 'month', 'range', 'filter', 'inline'],
+    lib: '@praxisui/dynamic-fields',
+};
+
 const PDX_INLINE_DATE_COMPONENT_METADATA = {
     id: 'pdx-inline-date',
     selector: 'pdx-inline-date',
@@ -47047,6 +47986,1139 @@ function providePraxisDynamicFieldsCoreNoDefaults() {
     ];
 }
 
+const DYNAMIC_FIELD_DEFAULT_STATE_RECIPE = {
+    state: 'default',
+    label: 'Default',
+    supported: true,
+};
+const DYNAMIC_FIELD_FILLED_STATE_RECIPE = {
+    state: 'filled',
+    label: 'Filled',
+    supported: true,
+    note: 'Consumer or playground should provide a representative value for the field.',
+};
+const DYNAMIC_FIELD_DISABLED_STATE_RECIPE = {
+    state: 'disabled',
+    label: 'Disabled',
+    supported: true,
+    metadataPatch: { disabled: true },
+};
+const DYNAMIC_FIELD_READONLY_STATE_RECIPE = {
+    state: 'readonly',
+    label: 'Readonly',
+    supported: true,
+    metadataPatch: { readonly: true },
+};
+const DYNAMIC_FIELD_ERROR_STATE_RECIPE = {
+    state: 'error',
+    label: 'Error',
+    supported: true,
+    metadataPatch: {
+        required: true,
+        validators: {
+            requiredMessage: 'Governed sample error state for playground preview.',
+            validationTrigger: 'immediate',
+        },
+    },
+    errorMessage: 'Governed sample error state for playground preview.',
+};
+const DYNAMIC_FIELD_BASE_STATE_RECIPES = [
+    DYNAMIC_FIELD_DEFAULT_STATE_RECIPE,
+    DYNAMIC_FIELD_FILLED_STATE_RECIPE,
+    DYNAMIC_FIELD_DISABLED_STATE_RECIPE,
+    DYNAMIC_FIELD_READONLY_STATE_RECIPE,
+    DYNAMIC_FIELD_ERROR_STATE_RECIPE,
+];
+function createDynamicFieldPreviewRecipe(input) {
+    return {
+        recipeId: input.recipeId,
+        fieldName: input.fieldName,
+        label: input.label,
+        description: input.description,
+        baseMetadata: {
+            name: input.fieldName,
+            label: input.label,
+            controlType: input.controlType,
+            ...(input.metadata ?? {}),
+        },
+        states: input.states ? [...input.states] : [...DYNAMIC_FIELD_BASE_STATE_RECIPES],
+    };
+}
+
+const PRIMARY_CATALOG_SLUG = 'dynamic-fields-field-catalog';
+const INLINE_CATALOG_SLUG = 'dynamic-fields-inline-filter-catalog';
+const OVERVIEW_SLUG = 'dynamic-fields-overview';
+const SELECTION_GUIDE_SLUG = 'dynamic-fields-field-selection-guide';
+const INLINE_SELECTION_GUIDE_SLUG = 'dynamic-fields-inline-filter-selection-guide';
+const DEFAULT_A11Y_NOTES = [
+    'Use labels claros e nao dependa apenas de placeholder.',
+    'Garanta foco visivel, contraste AA e mensagens de erro textuais.',
+];
+const DEFAULT_THEMING_NOTES = [
+    'O preview deve respeitar tokens do host e nao introduzir skin isolada da landing.',
+];
+function detailFragment(controlType) {
+    return controlType.toLowerCase().replace(/[^a-z0-9-]+/g, '-');
+}
+function jsonApiPath(relativePath) {
+    return `projects/praxis-dynamic-fields/src/lib/components/${relativePath}`;
+}
+function createEntry(input) {
+    const states = input.states ?? ['default', 'filled', 'disabled', 'readonly', 'error'];
+    return {
+        id: input.id,
+        controlType: input.controlType,
+        track: input.track,
+        family: input.family,
+        status: input.status ?? 'stable',
+        friendlyName: input.friendlyName,
+        description: input.description,
+        tags: input.tags,
+        keywords: input.keywords ?? input.tags,
+        valueShape: input.valueShape,
+        recommendedWhen: input.recommendedWhen,
+        avoidWhen: input.avoidWhen,
+        dataSourceKind: input.dataSourceKind,
+        supportsStates: states,
+        docs: {
+            catalogSlug: input.catalogSlug ?? (input.track === 'inline-filter' ? INLINE_CATALOG_SLUG : PRIMARY_CATALOG_SLUG),
+            detailFragment: input.detailFragment ?? detailFragment(input.controlType),
+            selectionGuideSlug: input.selectionGuideSlug ?? (input.track === 'inline-filter' ? INLINE_SELECTION_GUIDE_SLUG : SELECTION_GUIDE_SLUG),
+            overviewSlug: input.overviewSlug ?? OVERVIEW_SLUG,
+            jsonApiPath: input.apiPath,
+        },
+        previewRecipe: createDynamicFieldPreviewRecipe({
+            recipeId: input.id,
+            fieldName: `${input.id}Field`,
+            label: input.friendlyName,
+            controlType: input.controlType,
+            description: input.description,
+            metadata: input.metadata,
+            states: input.stateRecipes,
+        }),
+        snippetRecipe: {
+            language: input.snippetLanguage ?? 'json',
+            snippet: input.snippet ??
+                `{ "name": "${input.id}", "label": "${input.friendlyName}", "controlType": "${input.controlType}" }`,
+            note: input.snippetNote,
+        },
+        a11yNotes: input.a11yNotes ?? DEFAULT_A11Y_NOTES,
+        themingNotes: input.themingNotes ?? DEFAULT_THEMING_NOTES,
+    };
+}
+const DYNAMIC_FIELDS_PLAYGROUND_CATALOG = [
+    createEntry({
+        id: 'text-input',
+        controlType: FieldControlType.INPUT,
+        track: 'primary-form',
+        family: 'text',
+        friendlyName: 'Text input',
+        description: 'Entrada textual curta e canonica para formularios metadata-driven.',
+        tags: ['text', 'input', 'form'],
+        valueShape: 'string',
+        recommendedWhen: ['texto livre curto', 'nome', 'descricao curta'],
+        avoidWhen: ['lista governada de opcoes', 'texto longo multi-linha'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('text-input/pdx-text-input.json-api.md'),
+        metadata: { placeholder: 'Type here' },
+    }),
+    createEntry({
+        id: 'email-input',
+        controlType: FieldControlType.EMAIL_INPUT,
+        track: 'primary-form',
+        family: 'text',
+        friendlyName: 'Email input',
+        description: 'Campo textual especializado para emails.',
+        tags: ['text', 'email', 'validation'],
+        valueShape: 'string',
+        recommendedWhen: ['email validado', 'contato institucional'],
+        avoidWhen: ['texto livre generico'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('email-input/pdx-email-input.json-api.md'),
+        metadata: { placeholder: 'name@company.com' },
+    }),
+    createEntry({
+        id: 'password-input',
+        controlType: FieldControlType.PASSWORD,
+        track: 'primary-form',
+        family: 'text',
+        friendlyName: 'Password input',
+        description: 'Campo de segredo com mascaramento e interacao apropriada.',
+        tags: ['text', 'password', 'security'],
+        valueShape: 'string',
+        recommendedWhen: ['segredos', 'credenciais'],
+        avoidWhen: ['valor que precisa ficar legivel em tela'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('password-input/pdx-password-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'textarea',
+        controlType: FieldControlType.TEXTAREA,
+        track: 'primary-form',
+        family: 'text',
+        friendlyName: 'Textarea',
+        description: 'Campo multi-linha para observacoes e conteudo textual maior.',
+        tags: ['text', 'textarea', 'multiline'],
+        valueShape: 'string',
+        recommendedWhen: ['descricao longa', 'observacoes', 'justificativa'],
+        avoidWhen: ['texto curto de uma linha'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('material-textarea/pdx-material-textarea.json-api.md'),
+        metadata: { rows: 4, placeholder: 'Describe the situation' },
+    }),
+    createEntry({
+        id: 'search-input',
+        controlType: FieldControlType.SEARCH_INPUT,
+        track: 'primary-form',
+        family: 'text',
+        friendlyName: 'Search input',
+        description: 'Entrada textual dedicada a busca.',
+        tags: ['text', 'search', 'query'],
+        valueShape: 'string',
+        recommendedWhen: ['busca textual', 'query curta'],
+        avoidWhen: ['campo de negocio comum sem semantica de busca'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('search-input/pdx-search-input.json-api.md'),
+        metadata: { placeholder: 'Search records' },
+    }),
+    createEntry({
+        id: 'phone-input',
+        controlType: FieldControlType.PHONE,
+        track: 'primary-form',
+        family: 'text',
+        friendlyName: 'Phone input',
+        description: 'Campo especializado para telefone.',
+        tags: ['text', 'phone', 'formatted'],
+        valueShape: 'string',
+        recommendedWhen: ['telefone', 'contato'],
+        avoidWhen: ['dominio sem telefone'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('phone-input/pdx-phone-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'url-input',
+        controlType: FieldControlType.URL_INPUT,
+        track: 'primary-form',
+        family: 'text',
+        friendlyName: 'URL input',
+        description: 'Campo para links e URLs.',
+        tags: ['text', 'url', 'link'],
+        valueShape: 'string',
+        recommendedWhen: ['website', 'link institucional'],
+        avoidWhen: ['texto generico'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('url-input/pdx-url-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'cpf-cnpj-input',
+        controlType: FieldControlType.CPF_CNPJ_INPUT,
+        track: 'primary-form',
+        family: 'text',
+        friendlyName: 'CPF/CNPJ input',
+        description: 'Campo regionalizado para documento brasileiro.',
+        tags: ['text', 'brazil', 'document'],
+        valueShape: 'string',
+        recommendedWhen: ['CPF', 'CNPJ', 'documento BR'],
+        avoidWhen: ['dominio internacional ou sem documento nacional'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-cpf-cnpj-input/pdx-material-cpf-cnpj-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'number-input',
+        controlType: FieldControlType.NUMERIC_TEXT_BOX,
+        track: 'primary-form',
+        family: 'numbers-range',
+        friendlyName: 'Number input',
+        description: 'Campo numerico canonico para valores pontuais.',
+        tags: ['number', 'numeric', 'form'],
+        valueShape: 'number',
+        recommendedWhen: ['idade', 'quantidade', 'score unico'],
+        avoidWhen: ['range', 'moeda'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('number-input/pdx-number-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'currency-input',
+        controlType: FieldControlType.CURRENCY_INPUT,
+        track: 'primary-form',
+        family: 'numbers-range',
+        friendlyName: 'Currency input',
+        description: 'Campo monetario para valor unico.',
+        tags: ['number', 'currency', 'money'],
+        valueShape: 'number',
+        recommendedWhen: ['orcamento', 'ticket medio', 'valor monetario unico'],
+        avoidWhen: ['faixa monetaria'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('material-currency/pdx-material-currency.json-api.md'),
+        metadata: { currency: 'BRL', locale: 'pt-BR' },
+    }),
+    createEntry({
+        id: 'slider',
+        controlType: FieldControlType.SLIDER,
+        track: 'primary-form',
+        family: 'numbers-range',
+        friendlyName: 'Slider',
+        description: 'Campo de faixa continua para valor unico.',
+        tags: ['number', 'slider', 'range'],
+        valueShape: 'number',
+        recommendedWhen: ['nota', 'nivel', 'escala continua'],
+        avoidWhen: ['valor financeiro complexo', 'range duplo'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('material-slider/pdx-material-slider.json-api.md'),
+        metadata: { min: 0, max: 10 },
+    }),
+    createEntry({
+        id: 'range-slider',
+        controlType: FieldControlType.RANGE_SLIDER,
+        track: 'primary-form',
+        family: 'numbers-range',
+        friendlyName: 'Range slider',
+        description: 'Campo para faixa numerica com um ou dois bounds.',
+        tags: ['number', 'range', 'slider'],
+        valueShape: 'number | { start, end }',
+        recommendedWhen: ['faixa numerica', 'limite minimo e maximo'],
+        avoidWhen: ['datas ou horarios'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-range-slider/pdx-material-range-slider.json-api.md'),
+    }),
+    createEntry({
+        id: 'price-range',
+        controlType: FieldControlType.PRICE_RANGE,
+        track: 'primary-form',
+        family: 'numbers-range',
+        friendlyName: 'Price range',
+        description: 'Faixa monetaria com semantica propria.',
+        tags: ['number', 'currency', 'range'],
+        valueShape: '{ min, max }',
+        recommendedWhen: ['faixa de preco', 'banda salarial', 'orcamento minimo/maximo'],
+        avoidWhen: ['valor monetario unico'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-price-range/pdx-material-price-range.json-api.md'),
+        metadata: { currency: 'BRL', locale: 'pt-BR' },
+    }),
+    createEntry({
+        id: 'rating',
+        controlType: FieldControlType.RATING,
+        track: 'primary-form',
+        family: 'numbers-range',
+        friendlyName: 'Rating',
+        description: 'Controle visual de nota.',
+        tags: ['number', 'rating', 'visual'],
+        valueShape: 'number',
+        recommendedWhen: ['avaliacao visual', 'satisfacao', 'score legivel'],
+        avoidWhen: ['quando numero bruto ja basta'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('material-rating/pdx-material-rating.json-api.md'),
+        metadata: { max: 5 },
+    }),
+    createEntry({
+        id: 'date-input',
+        controlType: FieldControlType.DATE_INPUT,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Date input',
+        description: 'Input nativo de data.',
+        tags: ['date', 'native', 'time'],
+        valueShape: 'string | Date',
+        recommendedWhen: ['integracao simples com input nativo'],
+        avoidWhen: ['quando a UX Material padronizada e obrigatoria'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('date-input/pdx-date-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'date-picker',
+        controlType: FieldControlType.DATE_PICKER,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Date picker',
+        description: 'Datepicker Material canonico.',
+        tags: ['date', 'picker', 'material'],
+        valueShape: 'Date | string',
+        recommendedWhen: ['data unica', 'consistencia de design system'],
+        avoidWhen: ['range temporal'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('material-datepicker/pdx-material-datepicker.json-api.md'),
+    }),
+    createEntry({
+        id: 'date-range',
+        controlType: FieldControlType.DATE_RANGE,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Date range',
+        description: 'Intervalo de datas.',
+        tags: ['date', 'range', 'time'],
+        valueShape: '{ startDate, endDate }',
+        recommendedWhen: ['periodo', 'janela temporal'],
+        avoidWhen: ['data unica'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('material-date-range/pdx-material-date-range.json-api.md'),
+    }),
+    createEntry({
+        id: 'datetime-local',
+        controlType: FieldControlType.DATETIME_LOCAL_INPUT,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Datetime local',
+        description: 'Campo unificado para data e hora local.',
+        tags: ['date', 'time', 'datetime'],
+        valueShape: 'string',
+        recommendedWhen: ['agendamento local', 'data + hora no mesmo campo'],
+        avoidWhen: ['quando data e hora precisam de UX separada'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('datetime-local-input/pdx-datetime-local-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'month-input',
+        controlType: FieldControlType.MONTH_INPUT,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Month input',
+        description: 'Campo especializado para mes e ano.',
+        tags: ['date', 'month', 'competence'],
+        valueShape: 'string',
+        recommendedWhen: ['competencia', 'mes/ano'],
+        avoidWhen: ['data completa'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('month-input/pdx-month-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'time-input',
+        controlType: FieldControlType.TIME_INPUT,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Time input',
+        description: 'Campo simples para horario.',
+        tags: ['time', 'input', 'hour'],
+        valueShape: 'string',
+        recommendedWhen: ['hora simples', 'slot horario'],
+        avoidWhen: ['range horario'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('time-input/pdx-time-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'time-picker',
+        controlType: FieldControlType.TIME_PICKER,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Time picker',
+        description: 'Seletor Material de horario.',
+        tags: ['time', 'picker', 'hour'],
+        valueShape: 'string',
+        recommendedWhen: ['escolha guiada de horario'],
+        avoidWhen: ['texto/mascara simples e suficiente'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('material-timepicker/pdx-material-timepicker.json-api.md'),
+    }),
+    createEntry({
+        id: 'time-range',
+        controlType: FieldControlType.TIME_RANGE,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Time range',
+        description: 'Intervalo de horario.',
+        tags: ['time', 'range', 'hour'],
+        valueShape: '{ start, end }',
+        recommendedWhen: ['janela de atendimento', 'turno'],
+        avoidWhen: ['horario unico'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('pdx-material-time-range/pdx-material-time-range.json-api.md'),
+    }),
+    createEntry({
+        id: 'week-input',
+        controlType: FieldControlType.WEEK_INPUT,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Week input',
+        description: 'Campo de semana ISO.',
+        tags: ['date', 'week', 'iso'],
+        valueShape: 'string',
+        recommendedWhen: ['semana de referencia'],
+        avoidWhen: ['negocio centrado em datas convencionais'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('week-input/pdx-week-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'year-input',
+        controlType: FieldControlType.YEAR_INPUT,
+        track: 'primary-form',
+        family: 'date-time',
+        friendlyName: 'Year input',
+        description: 'Campo para ano isolado.',
+        tags: ['date', 'year', 'fiscal'],
+        valueShape: 'number | string',
+        recommendedWhen: ['ano fiscal', 'ano civil isolado'],
+        avoidWhen: ['mes/ano ou data completa'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('pdx-year-input/pdx-year-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'select',
+        controlType: FieldControlType.SELECT,
+        track: 'primary-form',
+        family: 'selection',
+        friendlyName: 'Select',
+        description: 'Lista fechada simples para escolha unica.',
+        tags: ['selection', 'select', 'options'],
+        valueShape: 'string | number | object',
+        recommendedWhen: ['lista pequena estavel', 'escolha unica'],
+        avoidWhen: ['lista grande ou remota'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('material-select/pdx-material-select.json-api.md'),
+        metadata: {
+            options: [
+                { label: 'Active', value: 'ACTIVE' },
+                { label: 'Paused', value: 'PAUSED' },
+            ],
+        },
+    }),
+    createEntry({
+        id: 'searchable-select',
+        controlType: FieldControlType.SEARCHABLE_SELECT,
+        track: 'primary-form',
+        family: 'selection',
+        friendlyName: 'Searchable select',
+        description: 'Select com busca local para listas medias ou grandes.',
+        tags: ['selection', 'select', 'search'],
+        valueShape: 'string | number | object',
+        recommendedWhen: ['lista maior com busca', 'descoberta de opcao'],
+        avoidWhen: ['lista remota sob demanda'],
+        dataSourceKind: 'mixed',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-searchable-select/pdx-material-searchable-select.json-api.md'),
+    }),
+    createEntry({
+        id: 'async-select',
+        controlType: FieldControlType.ASYNC_SELECT,
+        track: 'primary-form',
+        family: 'selection',
+        friendlyName: 'Async select',
+        description: 'Select remoto para opcoes sob demanda.',
+        tags: ['selection', 'remote', 'async'],
+        valueShape: 'string | number | object',
+        recommendedWhen: ['lookup remoto', 'lista paginada', 'catalogo grande'],
+        avoidWhen: ['opcoes locais pequenas'],
+        dataSourceKind: 'remote',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-async-select/pdx-material-async-select.json-api.md'),
+        metadata: { resourcePath: 'cities', optionLabelKey: 'name', optionValueKey: 'id' },
+    }),
+    createEntry({
+        id: 'autocomplete',
+        controlType: FieldControlType.AUTO_COMPLETE,
+        track: 'primary-form',
+        family: 'selection',
+        friendlyName: 'Autocomplete',
+        description: 'Busca incremental com sugestoes.',
+        tags: ['selection', 'autocomplete', 'search'],
+        valueShape: 'string | number | object',
+        recommendedWhen: ['sugestoes incrementais', 'descoberta textual'],
+        avoidWhen: ['lista pequena e fechada'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('material-autocomplete/pdx-material-autocomplete.json-api.md'),
+    }),
+    createEntry({
+        id: 'multi-select',
+        controlType: FieldControlType.MULTI_SELECT,
+        track: 'primary-form',
+        family: 'selection',
+        friendlyName: 'Multi select',
+        description: 'Selecao multipla de opcoes.',
+        tags: ['selection', 'multiple', 'options'],
+        valueShape: 'unknown[]',
+        recommendedWhen: ['multiplas escolhas discretas'],
+        avoidWhen: ['escolha unica'],
+        dataSourceKind: 'mixed',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-multi-select/pdx-material-multi-select.json-api.md'),
+    }),
+    createEntry({
+        id: 'multi-select-tree',
+        controlType: FieldControlType.MULTI_SELECT_TREE,
+        track: 'primary-form',
+        family: 'trees-lists',
+        friendlyName: 'Multi select tree',
+        description: 'Arvore hierarquica com selecao multipla.',
+        tags: ['tree', 'selection', 'hierarchy'],
+        valueShape: 'unknown[]',
+        recommendedWhen: ['taxonomia hierarquica com multiplas escolhas'],
+        avoidWhen: ['lista plana pequena'],
+        dataSourceKind: 'mixed',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-multi-select-tree/pdx-material-multi-select-tree.json-api.md'),
+    }),
+    createEntry({
+        id: 'tree-select',
+        controlType: FieldControlType.TREE_SELECT,
+        track: 'primary-form',
+        family: 'trees-lists',
+        friendlyName: 'Tree select',
+        description: 'Arvore hierarquica com selecao simples.',
+        tags: ['tree', 'selection', 'hierarchy'],
+        valueShape: 'string | number | object',
+        recommendedWhen: ['estrutura hierarquica com escolha unica'],
+        avoidWhen: ['multiplas escolhas'],
+        dataSourceKind: 'mixed',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-tree-select/pdx-material-tree-select.json-api.md'),
+    }),
+    createEntry({
+        id: 'selection-list',
+        controlType: FieldControlType.SELECTION_LIST,
+        track: 'primary-form',
+        family: 'trees-lists',
+        friendlyName: 'Selection list',
+        description: 'Lista explicita de opcoes selecionaveis.',
+        tags: ['list', 'selection', 'explicit'],
+        valueShape: 'unknown[]',
+        recommendedWhen: ['lista visivel de opcoes', 'affordance forte de lista'],
+        avoidWhen: ['dropdown compacto resolve melhor'],
+        dataSourceKind: 'mixed',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-selection-list/pdx-material-selection-list.json-api.md'),
+    }),
+    createEntry({
+        id: 'transfer-list',
+        controlType: FieldControlType.TRANSFER_LIST,
+        track: 'primary-form',
+        family: 'trees-lists',
+        friendlyName: 'Transfer list',
+        description: 'Move itens entre listas disponivel e selecionado.',
+        tags: ['list', 'transfer', 'selection'],
+        valueShape: 'unknown[]',
+        recommendedWhen: ['alocacao entre disponiveis e selecionados'],
+        avoidWhen: ['selecao simples ou pequena'],
+        dataSourceKind: 'mixed',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-transfer-list/pdx-material-transfer-list.json-api.md'),
+    }),
+    createEntry({
+        id: 'chip-input',
+        controlType: FieldControlType.CHIP_INPUT,
+        track: 'primary-form',
+        family: 'trees-lists',
+        friendlyName: 'Chip input',
+        description: 'Entrada de itens textuais em formato de chips.',
+        tags: ['chips', 'list', 'text'],
+        valueShape: 'string[]',
+        recommendedWhen: ['emails', 'labels editaveis', 'lista textual'],
+        avoidWhen: ['valor unico'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-chips/pdx-material-chips.json-api.md'),
+    }),
+    createEntry({
+        id: 'chip-list',
+        controlType: FieldControlType.CHIP_LIST,
+        track: 'primary-form',
+        family: 'trees-lists',
+        friendlyName: 'Chip list',
+        description: 'Lista textual em chips.',
+        tags: ['chips', 'list', 'display'],
+        valueShape: 'string[]',
+        recommendedWhen: ['lista curta em chips', 'edicao leve'],
+        avoidWhen: ['valor unico'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-chips/pdx-material-chips.json-api.md'),
+    }),
+    createEntry({
+        id: 'checkbox-group',
+        controlType: FieldControlType.CHECKBOX,
+        track: 'primary-form',
+        family: 'toggle-choice',
+        friendlyName: 'Checkbox group',
+        description: 'Escolhas discretas booleanas ou multiplas.',
+        tags: ['choice', 'checkbox', 'boolean'],
+        valueShape: 'boolean | unknown[]',
+        recommendedWhen: ['multiplas escolhas discretas', 'booleano com selectionMode apropriado'],
+        avoidWhen: ['escolha unica'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('material-checkbox-group/pdx-material-checkbox-group.json-api.md'),
+    }),
+    createEntry({
+        id: 'radio-group',
+        controlType: FieldControlType.RADIO,
+        track: 'primary-form',
+        family: 'toggle-choice',
+        friendlyName: 'Radio group',
+        description: 'Escolha unica explicita.',
+        tags: ['choice', 'radio', 'single'],
+        valueShape: 'string | number | boolean',
+        recommendedWhen: ['escolha unica com poucas opcoes e alta legibilidade'],
+        avoidWhen: ['muitas opcoes'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('material-radio-group/pdx-material-radio-group.json-api.md'),
+    }),
+    createEntry({
+        id: 'toggle',
+        controlType: FieldControlType.TOGGLE,
+        track: 'primary-form',
+        family: 'toggle-choice',
+        friendlyName: 'Toggle',
+        description: 'Booleano binario on/off.',
+        tags: ['choice', 'toggle', 'boolean'],
+        valueShape: 'boolean',
+        recommendedWhen: ['booleano simples'],
+        avoidWhen: ['mais de dois estados'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('material-slide-toggle/pdx-material-slide-toggle.json-api.md'),
+    }),
+    createEntry({
+        id: 'button-toggle',
+        controlType: FieldControlType.BUTTON_TOGGLE,
+        track: 'primary-form',
+        family: 'toggle-choice',
+        friendlyName: 'Button toggle',
+        description: 'Grupo segmentado para poucas opcoes.',
+        tags: ['choice', 'toggle', 'segmented'],
+        valueShape: 'string | number',
+        recommendedWhen: ['poucas opcoes curtas', 'segmentacao visivel'],
+        avoidWhen: ['lista longa'],
+        dataSourceKind: 'local',
+        status: 'partial-docs',
+        apiPath: jsonApiPath('material-button-toggle/pdx-material-button-toggle.json-api.md'),
+    }),
+    createEntry({
+        id: 'file-upload',
+        controlType: FieldControlType.FILE_UPLOAD,
+        track: 'primary-form',
+        family: 'upload-color-visual',
+        friendlyName: 'File upload',
+        description: 'Campo para anexos e documentos.',
+        tags: ['upload', 'files', 'attachments'],
+        valueShape: 'File | File[] | metadata',
+        recommendedWhen: ['documentos', 'anexos', 'comprovantes'],
+        avoidWhen: ['fluxo sem arquivos'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('material-file-upload/pdx-material-file-upload.json-api.md'),
+    }),
+    createEntry({
+        id: 'color-input',
+        controlType: FieldControlType.COLOR_INPUT,
+        track: 'primary-form',
+        family: 'upload-color-visual',
+        friendlyName: 'Color input',
+        description: 'Entrada simples de cor.',
+        tags: ['color', 'input', 'visual'],
+        valueShape: 'string',
+        recommendedWhen: ['cor por valor simples'],
+        avoidWhen: ['paleta rica ou presets'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('color-input/pdx-color-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'color-picker',
+        controlType: FieldControlType.COLOR_PICKER,
+        track: 'primary-form',
+        family: 'upload-color-visual',
+        friendlyName: 'Color picker',
+        description: 'Picker avancado de cor com paleta.',
+        tags: ['color', 'picker', 'visual'],
+        valueShape: 'string',
+        recommendedWhen: ['paleta rica', 'preset visual', 'tema'],
+        avoidWhen: ['valor simples textual basta'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('color-picker/pdx-color-picker.json-api.md'),
+    }),
+    createEntry({
+        id: 'avatar',
+        controlType: FieldControlType.AVATAR,
+        track: 'primary-form',
+        family: 'upload-color-visual',
+        friendlyName: 'Avatar',
+        description: 'Representacao visual de entidade/usuario.',
+        tags: ['visual', 'avatar', 'display'],
+        valueShape: 'string | object',
+        recommendedWhen: ['representacao visual de usuario ou entidade'],
+        avoidWhen: ['captura de dado textual'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('material-avatar/pdx-material-avatar.json-api.md'),
+    }),
+    createEntry({
+        id: 'button',
+        controlType: FieldControlType.BUTTON,
+        track: 'primary-form',
+        family: 'upload-color-visual',
+        friendlyName: 'Button',
+        description: 'Acao auxiliar embutida no layout do formulario.',
+        tags: ['action', 'button', 'visual'],
+        valueShape: 'n/a',
+        recommendedWhen: ['acao auxiliar no layout'],
+        avoidWhen: ['submit/cancel padrao do form'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('material-button/pdx-material-button.json-api.md'),
+        states: ['default', 'disabled', 'readonly'],
+    }),
+    createEntry({
+        id: 'cron-builder',
+        controlType: FieldControlType.CRON_BUILDER,
+        track: 'primary-form',
+        family: 'upload-color-visual',
+        friendlyName: 'Cron builder',
+        description: 'Controle especializado para expressoes CRON.',
+        tags: ['cron', 'schedule', 'specialized'],
+        valueShape: 'string',
+        recommendedWhen: ['agenda cron', 'frequencia recorrente'],
+        avoidWhen: ['datas ou ranges simples'],
+        dataSourceKind: 'specialized',
+        status: 'partial-docs',
+        snippetNote: 'A documentacao detalhada continua vivendo na lib especializada @praxisui/cron-builder.',
+    }),
+    createEntry({
+        id: 'inline-input',
+        controlType: FieldControlType.INLINE_INPUT,
+        track: 'inline-filter',
+        family: 'text',
+        friendlyName: 'Inline input',
+        description: 'Filtro textual compacto para toolbar.',
+        tags: ['inline', 'filter', 'text'],
+        valueShape: 'string',
+        recommendedWhen: ['busca curta em toolbar', 'identificador', 'nome'],
+        avoidWhen: ['texto longo', 'validacao complexa'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('inline-input/pdx-inline-input.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-select',
+        controlType: FieldControlType.INLINE_SELECT,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline select',
+        description: 'Selecao compacta em pill para filtros.',
+        tags: ['inline', 'filter', 'selection'],
+        valueShape: 'simple value',
+        recommendedWhen: ['lista pequena ou media em toolbar'],
+        avoidWhen: ['lookup remoto grande'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('inline-select/pdx-inline-select.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-searchable-select',
+        controlType: FieldControlType.INLINE_SEARCHABLE_SELECT,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline searchable select',
+        description: 'Selecao compacta com busca.',
+        tags: ['inline', 'filter', 'selection', 'search'],
+        valueShape: 'simple value | option object',
+        recommendedWhen: ['lista media/grande com busca em toolbar'],
+        avoidWhen: ['select simples ja resolve'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('inline-searchable-select/pdx-inline-searchable-select.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-async-select',
+        controlType: FieldControlType.INLINE_ASYNC_SELECT,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline async select',
+        description: 'Selecao remota compacta para toolbar.',
+        tags: ['inline', 'filter', 'selection', 'remote'],
+        valueShape: 'simple value | option object',
+        recommendedWhen: ['lookup remoto em toolbar', 'lista sob demanda'],
+        avoidWhen: ['lista local pequena'],
+        dataSourceKind: 'remote',
+        apiPath: jsonApiPath('inline-async-select/pdx-inline-async-select.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-entity-lookup',
+        controlType: FieldControlType.INLINE_ENTITY_LOOKUP,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline entity lookup',
+        description: 'Lookup compacto de entidade com semantica corporativa.',
+        tags: ['inline', 'filter', 'lookup', 'remote'],
+        valueShape: 'object | id',
+        recommendedWhen: ['id + descricao', 'identidade de entidade'],
+        avoidWhen: ['select local simples'],
+        dataSourceKind: 'remote',
+        apiPath: jsonApiPath('inline-entity-lookup/pdx-inline-entity-lookup.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-autocomplete',
+        controlType: FieldControlType.INLINE_AUTOCOMPLETE,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline autocomplete',
+        description: 'Autocomplete compacto para filtros.',
+        tags: ['inline', 'filter', 'autocomplete'],
+        valueShape: 'simple value | option object',
+        recommendedWhen: ['sugestao incremental em toolbar'],
+        avoidWhen: ['select simples basta'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('inline-autocomplete/pdx-inline-autocomplete.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-multi-select',
+        controlType: FieldControlType.INLINE_MULTISELECT,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline multi select',
+        description: 'Selecao multipla compacta com resumo em pill.',
+        tags: ['inline', 'filter', 'multiple'],
+        valueShape: 'unknown[]',
+        recommendedWhen: ['poucas selecoes simultaneas com resumo curto'],
+        avoidWhen: ['necessidade de leitura integral de todos os itens'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('inline-multi-select/pdx-inline-multi-select.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-number',
+        controlType: FieldControlType.INLINE_NUMBER,
+        track: 'inline-filter',
+        family: 'numbers-range',
+        friendlyName: 'Inline number',
+        description: 'Filtro numerico compacto.',
+        tags: ['inline', 'filter', 'number'],
+        valueShape: 'number',
+        recommendedWhen: ['valor numerico pontual em toolbar'],
+        avoidWhen: ['range'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('inline-number/pdx-inline-number.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-currency',
+        controlType: FieldControlType.INLINE_CURRENCY,
+        track: 'inline-filter',
+        family: 'numbers-range',
+        friendlyName: 'Inline currency',
+        description: 'Filtro monetario compacto.',
+        tags: ['inline', 'filter', 'currency'],
+        valueShape: 'number',
+        recommendedWhen: ['valor monetario unico em toolbar'],
+        avoidWhen: ['faixa monetaria'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('inline-currency/pdx-inline-currency.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-currency-range',
+        controlType: FieldControlType.INLINE_CURRENCY_RANGE,
+        track: 'inline-filter',
+        family: 'numbers-range',
+        friendlyName: 'Inline currency range',
+        description: 'Faixa monetaria compacta para toolbar.',
+        tags: ['inline', 'filter', 'currency', 'range'],
+        valueShape: '{ minPrice?, maxPrice?, currency? }',
+        recommendedWhen: ['faixa monetaria em toolbar'],
+        avoidWhen: ['valor unico'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-currency-range/pdx-inline-currency-range.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-range',
+        controlType: FieldControlType.INLINE_RANGE,
+        track: 'inline-filter',
+        family: 'numbers-range',
+        friendlyName: 'Inline range',
+        description: 'Range numerico compacto para toolbar.',
+        tags: ['inline', 'filter', 'range', 'slider'],
+        valueShape: 'number | { start?, end? }',
+        recommendedWhen: ['faixa numerica compacta'],
+        avoidWhen: ['datas ou horarios'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-currency-range/pdx-inline-currency-range.json-api.md'),
+        detailFragment: 'inline-range',
+    }),
+    createEntry({
+        id: 'inline-rating',
+        controlType: FieldControlType.INLINE_RATING,
+        track: 'inline-filter',
+        family: 'numbers-range',
+        friendlyName: 'Inline rating',
+        description: 'Filtro visual de rating para toolbar.',
+        tags: ['inline', 'filter', 'rating'],
+        valueShape: 'number | { start?, end? }',
+        recommendedWhen: ['score visual', 'avaliacao em estrelas'],
+        avoidWhen: ['quando numero bruto ja basta'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-rating/pdx-inline-rating.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-distance-radius',
+        controlType: FieldControlType.INLINE_DISTANCE_RADIUS,
+        track: 'inline-filter',
+        family: 'numbers-range',
+        friendlyName: 'Inline distance radius',
+        description: 'Filtro semantico de distancia e raio.',
+        tags: ['inline', 'filter', 'distance', 'radius'],
+        valueShape: 'number | { start?, end? }',
+        recommendedWhen: ['raio de busca', 'proximidade'],
+        avoidWhen: ['range numerico generico'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-distance-radius/pdx-inline-distance-radius.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-score-priority',
+        controlType: FieldControlType.INLINE_SCORE_PRIORITY,
+        track: 'inline-filter',
+        family: 'numbers-range',
+        friendlyName: 'Inline score priority',
+        description: 'Filtro semantico de score/prioridade.',
+        tags: ['inline', 'filter', 'score', 'priority'],
+        valueShape: 'number | { start?, end? }',
+        recommendedWhen: ['prioridade', 'criticidade', 'banda de score'],
+        avoidWhen: ['numero simples sem ganho semantico'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-score-priority/pdx-inline-score-priority.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-date',
+        controlType: FieldControlType.INLINE_DATE,
+        track: 'inline-filter',
+        family: 'date-time',
+        friendlyName: 'Inline date',
+        description: 'Filtro de data compacta.',
+        tags: ['inline', 'filter', 'date'],
+        valueShape: 'Date',
+        recommendedWhen: ['data unica em toolbar'],
+        avoidWhen: ['periodo completo'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-date/pdx-inline-date.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-date-range',
+        controlType: FieldControlType.INLINE_DATE_RANGE,
+        track: 'inline-filter',
+        family: 'date-time',
+        friendlyName: 'Inline date range',
+        description: 'Range de data compacta com semantica de toolbar.',
+        tags: ['inline', 'filter', 'date', 'range'],
+        valueShape: '{ startDate?, endDate? }',
+        recommendedWhen: ['janela temporal em toolbar'],
+        avoidWhen: ['toolbar saturada ou data unica'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-date-range/pdx-inline-date-range.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-time',
+        controlType: FieldControlType.INLINE_TIME,
+        track: 'inline-filter',
+        family: 'date-time',
+        friendlyName: 'Inline time',
+        description: 'Filtro compacto de horario.',
+        tags: ['inline', 'filter', 'time'],
+        valueShape: 'string HH:mm',
+        recommendedWhen: ['horario unico em toolbar'],
+        avoidWhen: ['periodo relativo ou range'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-time/pdx-inline-time.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-time-range',
+        controlType: FieldControlType.INLINE_TIME_RANGE,
+        track: 'inline-filter',
+        family: 'date-time',
+        friendlyName: 'Inline time range',
+        description: 'Faixa horaria compacta para toolbar.',
+        tags: ['inline', 'filter', 'time', 'range'],
+        valueShape: '{ start?, end? }',
+        recommendedWhen: ['turno', 'janela operacional'],
+        avoidWhen: ['horario unico'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-time-range/pdx-inline-time-range.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-tree-select',
+        controlType: FieldControlType.INLINE_TREE_SELECT,
+        track: 'inline-filter',
+        family: 'trees-lists',
+        friendlyName: 'Inline tree select',
+        description: 'Arvore compacta para filtro em toolbar.',
+        tags: ['inline', 'filter', 'tree', 'hierarchy'],
+        valueShape: 'simple node value',
+        recommendedWhen: ['taxonomia ou unidade organizacional em toolbar'],
+        avoidWhen: ['arvore profunda demais'],
+        dataSourceKind: 'mixed',
+        apiPath: jsonApiPath('inline-tree-select/pdx-inline-tree-select.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-pipeline-status',
+        controlType: FieldControlType.INLINE_PIPELINE_STATUS,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline pipeline status',
+        description: 'Filtro semantico de status de pipeline.',
+        tags: ['inline', 'filter', 'pipeline', 'status'],
+        valueShape: 'simple value | unknown[]',
+        recommendedWhen: ['esteira operacional', 'pipeline comercial'],
+        avoidWhen: ['status simples sem ganho visual'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-pipeline-status/pdx-inline-pipeline-status.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-relative-period',
+        controlType: FieldControlType.INLINE_RELATIVE_PERIOD,
+        track: 'inline-filter',
+        family: 'date-time',
+        friendlyName: 'Inline relative period',
+        description: 'Preset semantico de periodo relativo.',
+        tags: ['inline', 'filter', 'date', 'relative'],
+        valueShape: 'string',
+        recommendedWhen: ['hoje', 'ontem', 'ultimos 7 dias', 'este mes'],
+        avoidWhen: ['API fora da trilha canonica que nao normaliza presets'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-relative-period/pdx-inline-relative-period.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-sentiment',
+        controlType: FieldControlType.INLINE_SENTIMENT,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline sentiment',
+        description: 'Filtro semantico de sentimento/polaridade.',
+        tags: ['inline', 'filter', 'sentiment'],
+        valueShape: 'string',
+        recommendedWhen: ['sentimento', 'polaridade', 'humor'],
+        avoidWhen: ['enum simples sem ganho visual'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-sentiment/pdx-inline-sentiment.json-api.md'),
+    }),
+    createEntry({
+        id: 'inline-color-label',
+        controlType: FieldControlType.INLINE_COLOR_LABEL,
+        track: 'inline-filter',
+        family: 'selection',
+        friendlyName: 'Inline color label',
+        description: 'Filtro de labels coloridas semanticas.',
+        tags: ['inline', 'filter', 'color', 'labels'],
+        valueShape: 'simple value | unknown[]',
+        recommendedWhen: ['tags coloridas', 'categorias visuais'],
+        avoidWhen: ['quando cor e o unico canal de significado'],
+        dataSourceKind: 'specialized',
+        apiPath: jsonApiPath('inline-color-label/pdx-inline-color-label.json-api.md'),
+        a11yNotes: [
+            'Nunca dependa apenas de cor para comunicar estado ou significado.',
+            'Garanta contraste AA e rotulagem textual no resumo da pill e no painel.',
+        ],
+    }),
+    createEntry({
+        id: 'inline-toggle',
+        controlType: FieldControlType.INLINE_TOGGLE,
+        track: 'inline-filter',
+        family: 'toggle-choice',
+        friendlyName: 'Inline toggle',
+        description: 'Booleano compacto com estado neutro para toolbar.',
+        tags: ['inline', 'filter', 'toggle', 'boolean'],
+        valueShape: 'boolean | null',
+        recommendedWhen: ['booleano simples em toolbar'],
+        avoidWhen: ['false e null nao estao bem documentados no fluxo'],
+        dataSourceKind: 'local',
+        apiPath: jsonApiPath('inline-toggle/pdx-inline-toggle.json-api.md'),
+    }),
+];
+
 const BRAZIL_INPUTS_AI_CAPABILITIES = {
     version: 'v2.0',
     enums: {
@@ -48856,6 +50928,14 @@ const CLEAR_BUTTON_CONTROL_TYPES = new Set([
     'inlinetime',
     'inlinetimerange',
     'inlinetreeselect',
+    'inlineperiodrange',
+    'inlinerating',
+    'inlinedistanceradius',
+    'inlinepipelinestatus',
+    'inlinescorepriority',
+    'inlinerelativeperiod',
+    'inlinesentiment',
+    'inlinecolorlabel',
 ]);
 function supportsClearButtonControlType(controlType) {
     if (!controlType)
@@ -48872,5 +50952,5 @@ function supportsClearButtonControlType(controlType) {
  * Generated bundle index. Do not edit.
  */
 
-export { ActionResolverService, BRAZIL_INPUTS_AI_CAPABILITIES, CACHE_TTL, CHIPS_CONTROLS_AI_CAPABILITIES, CLEAR_BUTTON_CONTROL_TYPES, COLOR_CONTROLS_AI_CAPABILITIES, CONTROL_TYPE_AI_CATALOGS, ColorInputComponent, ComponentPreloaderService, ComponentRegistryService, ConfirmDialogComponent, DATE_CONTROLS_AI_CAPABILITIES, DISPLAY_ACTION_AI_CAPABILITIES, DateInputComponent, DateUtilsService, DatetimeLocalInputComponent, DynamicFieldLoaderDirective, EmailInputComponent, FILE_UPLOAD_AI_CAPABILITIES, InlineAsyncSelectComponent, InlineAutocompleteComponent, InlineColorLabelComponent, InlineCurrencyComponent, InlineCurrencyRangeComponent, InlineDateComponent, InlineDateRangeComponent, InlineDistanceRadiusComponent, InlineEntityLookupComponent, InlineInputComponent, InlineMultiSelectComponent, InlineNumberComponent, InlinePipelineStatusComponent, InlineRangeSliderComponent, InlineRatingComponent, InlineRelativePeriodComponent, InlineScorePriorityComponent, InlineSearchableSelectComponent, InlineSelectComponent, InlineSentimentComponent, InlineTimeComponent, InlineTimeRangeComponent, InlineToggleComponent, InlineTreeSelectComponent, KeyboardShortcutService, LIST_CONTROLS_AI_CAPABILITIES, LoggerPresets, MAX_LOAD_ATTEMPTS, MaterialAsyncSelectComponent, MaterialAutocompleteComponent, MaterialAvatarComponent, MaterialButtonComponent, MaterialButtonToggleComponent, MaterialCheckboxGroupComponent, MaterialChipsComponent, MaterialColorPickerComponent, MaterialCpfCnpjInputComponent, MaterialCurrencyComponent, MaterialDateRangeComponent, MaterialDatepickerComponent, MaterialFileUploadComponent, MaterialMultiSelectComponent, MaterialMultiSelectTreeComponent, MaterialPriceRangeComponent, MaterialRadioGroupComponent, MaterialRatingComponent, MaterialSearchableSelectComponent, MaterialSelectComponent, MaterialSelectionListComponent, MaterialSlideToggleComponent, MaterialSliderComponent, MaterialTextareaComponent, MaterialTimepickerComponent, MaterialTransferListComponent, MaterialTreeSelectComponent, MonthInputComponent, NUMERIC_INPUTS_AI_CAPABILITIES, NumberInputComponent, OptionStore, PDX_COLOR_INPUT_COMPONENT_METADATA, PDX_COLOR_PICKER_COMPONENT_METADATA, PDX_DATETIME_LOCAL_INPUT_COMPONENT_METADATA, PDX_DATE_INPUT_COMPONENT_METADATA, PDX_EMAIL_INPUT_COMPONENT_METADATA, PDX_FIELD_SHELL_COMPONENT_METADATA, PDX_INLINE_ASYNC_SELECT_COMPONENT_METADATA, PDX_INLINE_AUTOCOMPLETE_COMPONENT_METADATA, PDX_INLINE_COLOR_LABEL_COMPONENT_METADATA, PDX_INLINE_CURRENCY_COMPONENT_METADATA, PDX_INLINE_CURRENCY_RANGE_COMPONENT_METADATA, PDX_INLINE_DATE_COMPONENT_METADATA, PDX_INLINE_DATE_RANGE_COMPONENT_METADATA, PDX_INLINE_DISTANCE_RADIUS_COMPONENT_METADATA, PDX_INLINE_ENTITY_LOOKUP_COMPONENT_METADATA, PDX_INLINE_INPUT_COMPONENT_METADATA, PDX_INLINE_MULTI_SELECT_COMPONENT_METADATA, PDX_INLINE_NUMBER_COMPONENT_METADATA, PDX_INLINE_PIPELINE_STATUS_COMPONENT_METADATA, PDX_INLINE_RANGE_SLIDER_COMPONENT_METADATA, PDX_INLINE_RATING_COMPONENT_METADATA, PDX_INLINE_RELATIVE_PERIOD_COMPONENT_METADATA, PDX_INLINE_SCORE_PRIORITY_COMPONENT_METADATA, PDX_INLINE_SEARCHABLE_SELECT_COMPONENT_METADATA, PDX_INLINE_SELECT_COMPONENT_METADATA, PDX_INLINE_SENTIMENT_COMPONENT_METADATA, PDX_INLINE_TIME_COMPONENT_METADATA, PDX_INLINE_TIME_RANGE_COMPONENT_METADATA, PDX_INLINE_TOGGLE_COMPONENT_METADATA, PDX_INLINE_TREE_SELECT_COMPONENT_METADATA, PDX_MATERIAL_AVATAR_COMPONENT_METADATA, PDX_MATERIAL_BUTTON_COMPONENT_METADATA, PDX_MATERIAL_BUTTON_TOGGLE_COMPONENT_METADATA, PDX_MATERIAL_CHECKBOX_GROUP_COMPONENT_METADATA, PDX_MATERIAL_CHIPS_COMPONENT_METADATA, PDX_MATERIAL_COLORPICKER_COMPONENT_METADATA, PDX_MATERIAL_CPF_CNPJ_INPUT_COMPONENT_METADATA, PDX_MATERIAL_CURRENCY_COMPONENT_METADATA, PDX_MATERIAL_DATEPICKER_COMPONENT_METADATA, PDX_MATERIAL_DATE_RANGE_COMPONENT_METADATA, PDX_MATERIAL_FILE_UPLOAD_COMPONENT_METADATA, PDX_MATERIAL_MULTI_SELECT_COMPONENT_METADATA, PDX_MATERIAL_MULTI_SELECT_TREE_COMPONENT_METADATA, PDX_MATERIAL_PRICE_RANGE_COMPONENT_METADATA, PDX_MATERIAL_RADIO_GROUP_COMPONENT_METADATA, PDX_MATERIAL_RANGE_SLIDER_COMPONENT_METADATA, PDX_MATERIAL_RATING_COMPONENT_METADATA, PDX_MATERIAL_SEARCHABLE_SELECT_COMPONENT_METADATA, PDX_MATERIAL_SELECTION_LIST_COMPONENT_METADATA, PDX_MATERIAL_SELECT_COMPONENT_METADATA, PDX_MATERIAL_SLIDER_COMPONENT_METADATA, PDX_MATERIAL_TEXTAREA_COMPONENT_METADATA, PDX_MATERIAL_TIMEPICKER_COMPONENT_METADATA, PDX_MATERIAL_TIME_RANGE_COMPONENT_METADATA, PDX_MATERIAL_TRANSFER_LIST_COMPONENT_METADATA, PDX_MATERIAL_TREE_SELECT_COMPONENT_METADATA, PDX_MONTH_INPUT_COMPONENT_METADATA, PDX_NUMBER_INPUT_COMPONENT_METADATA, PDX_PASSWORD_INPUT_COMPONENT_METADATA, PDX_PHONE_INPUT_COMPONENT_METADATA, PDX_PRELOAD_STATUS_COMPONENT_METADATA, PDX_SEARCH_INPUT_COMPONENT_METADATA, PDX_TEXT_INPUT_COMPONENT_METADATA, PDX_TIME_INPUT_COMPONENT_METADATA, PDX_URL_INPUT_COMPONENT_METADATA, PDX_WEEK_INPUT_COMPONENT_METADATA, PDX_YEAR_INPUT_COMPONENT_METADATA, PRAXIS_DYNAMIC_FIELDS_EN_US, PRAXIS_DYNAMIC_FIELDS_I18N, PRAXIS_DYNAMIC_FIELDS_LOGGER_BACKEND, PRAXIS_DYNAMIC_FIELDS_PT_BR, PRICE_RANGE_AI_CAPABILITIES, PasswordInputComponent, PdxColorPickerComponent, PdxMaterialRangeSliderComponent, PdxMaterialTimeRangeComponent, PdxYearInputComponent, PhoneInputComponent, PraxisErrorStateMatcher, PreloadStatusComponent, RETRY_DELAY, SELECT_CONTROLS_AI_CAPABILITIES, SearchInputComponent, SimpleBaseButtonComponent, SimpleBaseInputComponent, SimpleBaseSelectComponent, TEXT_INPUTS_AI_CAPABILITIES, TIME_RANGE_AI_CAPABILITIES, TOGGLE_CONTROLS_AI_CAPABILITIES, TREE_CONTROLS_AI_CAPABILITIES, TextInputComponent, TimeInputComponent, UrlInputComponent, WeekInputComponent, YEAR_INPUT_AI_CAPABILITIES, bindDynamicFieldsLoggerBackendFromInjector, clearDynamicFieldsLoggerBackend, configureDynamicFieldsLogger, createErrorStateMatcher, createPraxisDynamicFieldsI18nConfig, emitToDynamicFieldsLoggerBackend, enableDebugForComponent, getControlTypeCatalog, getErrorStateMatcherForField, inferErrorStateStrategy, initializeComponentSystem, initializeComponentSystemSync, isBaseDynamicFieldComponent, isLoadingCapableComponent, isValidJsonSchema, isValueBasedComponent, logger, mapJsonSchemaToFields, mapPropertyToFieldMetadata, normalizeFormMetadata, provideMaterialAvatarMetadata, providePraxisDynamicFields, providePraxisDynamicFieldsCore, providePraxisDynamicFieldsCoreNoDefaults, providePraxisDynamicFieldsI18n, providePraxisDynamicFieldsNoDefaults, resolvePraxisDynamicFieldsText, setDynamicFieldsLoggerBackend, silenceComponent, supportsClearButtonControlType };
+export { ActionResolverService, BRAZIL_INPUTS_AI_CAPABILITIES, CACHE_TTL, CHIPS_CONTROLS_AI_CAPABILITIES, CLEAR_BUTTON_CONTROL_TYPES, COLOR_CONTROLS_AI_CAPABILITIES, CONTROL_TYPE_AI_CATALOGS, ColorInputComponent, ComponentPreloaderService, ComponentRegistryService, ConfirmDialogComponent, DATE_CONTROLS_AI_CAPABILITIES, DISPLAY_ACTION_AI_CAPABILITIES, DYNAMIC_FIELDS_PLAYGROUND_CATALOG, DYNAMIC_FIELD_BASE_STATE_RECIPES, DYNAMIC_FIELD_DEFAULT_STATE_RECIPE, DYNAMIC_FIELD_DISABLED_STATE_RECIPE, DYNAMIC_FIELD_ERROR_STATE_RECIPE, DYNAMIC_FIELD_FILLED_STATE_RECIPE, DYNAMIC_FIELD_READONLY_STATE_RECIPE, DateInputComponent, DateUtilsService, DatetimeLocalInputComponent, DynamicFieldLoaderDirective, EmailInputComponent, FILE_UPLOAD_AI_CAPABILITIES, InlineAsyncSelectComponent, InlineAutocompleteComponent, InlineColorLabelComponent, InlineCurrencyComponent, InlineCurrencyRangeComponent, InlineDateComponent, InlineDateRangeComponent, InlineDistanceRadiusComponent, InlineEntityLookupComponent, InlineInputComponent, InlineMonthRangeComponent, InlineMultiSelectComponent, InlineNumberComponent, InlinePeriodRangeComponent, InlinePipelineStatusComponent, InlineRangeSliderComponent, InlineRatingComponent, InlineRelativePeriodComponent, InlineScorePriorityComponent, InlineSearchableSelectComponent, InlineSelectComponent, InlineSentimentComponent, InlineTimeComponent, InlineTimeRangeComponent, InlineToggleComponent, InlineTreeSelectComponent, InlineYearRangeComponent, KeyboardShortcutService, LIST_CONTROLS_AI_CAPABILITIES, LoggerPresets, MAX_LOAD_ATTEMPTS, MaterialAsyncSelectComponent, MaterialAutocompleteComponent, MaterialAvatarComponent, MaterialButtonComponent, MaterialButtonToggleComponent, MaterialCheckboxGroupComponent, MaterialChipsComponent, MaterialColorPickerComponent, MaterialCpfCnpjInputComponent, MaterialCurrencyComponent, MaterialDateRangeComponent, MaterialDatepickerComponent, MaterialFileUploadComponent, MaterialMultiSelectComponent, MaterialMultiSelectTreeComponent, MaterialPriceRangeComponent, MaterialRadioGroupComponent, MaterialRatingComponent, MaterialSearchableSelectComponent, MaterialSelectComponent, MaterialSelectionListComponent, MaterialSlideToggleComponent, MaterialSliderComponent, MaterialTextareaComponent, MaterialTimepickerComponent, MaterialTransferListComponent, MaterialTreeSelectComponent, MonthInputComponent, NUMERIC_INPUTS_AI_CAPABILITIES, NumberInputComponent, OptionStore, PDX_COLOR_INPUT_COMPONENT_METADATA, PDX_COLOR_PICKER_COMPONENT_METADATA, PDX_DATETIME_LOCAL_INPUT_COMPONENT_METADATA, PDX_DATE_INPUT_COMPONENT_METADATA, PDX_EMAIL_INPUT_COMPONENT_METADATA, PDX_FIELD_SHELL_COMPONENT_METADATA, PDX_INLINE_ASYNC_SELECT_COMPONENT_METADATA, PDX_INLINE_AUTOCOMPLETE_COMPONENT_METADATA, PDX_INLINE_COLOR_LABEL_COMPONENT_METADATA, PDX_INLINE_CURRENCY_COMPONENT_METADATA, PDX_INLINE_CURRENCY_RANGE_COMPONENT_METADATA, PDX_INLINE_DATE_COMPONENT_METADATA, PDX_INLINE_DATE_RANGE_COMPONENT_METADATA, PDX_INLINE_DISTANCE_RADIUS_COMPONENT_METADATA, PDX_INLINE_ENTITY_LOOKUP_COMPONENT_METADATA, PDX_INLINE_INPUT_COMPONENT_METADATA, PDX_INLINE_MONTH_RANGE_COMPONENT_METADATA, PDX_INLINE_MULTI_SELECT_COMPONENT_METADATA, PDX_INLINE_NUMBER_COMPONENT_METADATA, PDX_INLINE_PERIOD_RANGE_COMPONENT_METADATA, PDX_INLINE_PIPELINE_STATUS_COMPONENT_METADATA, PDX_INLINE_RANGE_SLIDER_COMPONENT_METADATA, PDX_INLINE_RATING_COMPONENT_METADATA, PDX_INLINE_RELATIVE_PERIOD_COMPONENT_METADATA, PDX_INLINE_SCORE_PRIORITY_COMPONENT_METADATA, PDX_INLINE_SEARCHABLE_SELECT_COMPONENT_METADATA, PDX_INLINE_SELECT_COMPONENT_METADATA, PDX_INLINE_SENTIMENT_COMPONENT_METADATA, PDX_INLINE_TIME_COMPONENT_METADATA, PDX_INLINE_TIME_RANGE_COMPONENT_METADATA, PDX_INLINE_TOGGLE_COMPONENT_METADATA, PDX_INLINE_TREE_SELECT_COMPONENT_METADATA, PDX_INLINE_YEAR_RANGE_COMPONENT_METADATA, PDX_MATERIAL_AVATAR_COMPONENT_METADATA, PDX_MATERIAL_BUTTON_COMPONENT_METADATA, PDX_MATERIAL_BUTTON_TOGGLE_COMPONENT_METADATA, PDX_MATERIAL_CHECKBOX_GROUP_COMPONENT_METADATA, PDX_MATERIAL_CHIPS_COMPONENT_METADATA, PDX_MATERIAL_COLORPICKER_COMPONENT_METADATA, PDX_MATERIAL_CPF_CNPJ_INPUT_COMPONENT_METADATA, PDX_MATERIAL_CURRENCY_COMPONENT_METADATA, PDX_MATERIAL_DATEPICKER_COMPONENT_METADATA, PDX_MATERIAL_DATE_RANGE_COMPONENT_METADATA, PDX_MATERIAL_FILE_UPLOAD_COMPONENT_METADATA, PDX_MATERIAL_MULTI_SELECT_COMPONENT_METADATA, PDX_MATERIAL_MULTI_SELECT_TREE_COMPONENT_METADATA, PDX_MATERIAL_PRICE_RANGE_COMPONENT_METADATA, PDX_MATERIAL_RADIO_GROUP_COMPONENT_METADATA, PDX_MATERIAL_RANGE_SLIDER_COMPONENT_METADATA, PDX_MATERIAL_RATING_COMPONENT_METADATA, PDX_MATERIAL_SEARCHABLE_SELECT_COMPONENT_METADATA, PDX_MATERIAL_SELECTION_LIST_COMPONENT_METADATA, PDX_MATERIAL_SELECT_COMPONENT_METADATA, PDX_MATERIAL_SLIDER_COMPONENT_METADATA, PDX_MATERIAL_TEXTAREA_COMPONENT_METADATA, PDX_MATERIAL_TIMEPICKER_COMPONENT_METADATA, PDX_MATERIAL_TIME_RANGE_COMPONENT_METADATA, PDX_MATERIAL_TRANSFER_LIST_COMPONENT_METADATA, PDX_MATERIAL_TREE_SELECT_COMPONENT_METADATA, PDX_MONTH_INPUT_COMPONENT_METADATA, PDX_NUMBER_INPUT_COMPONENT_METADATA, PDX_PASSWORD_INPUT_COMPONENT_METADATA, PDX_PHONE_INPUT_COMPONENT_METADATA, PDX_PRELOAD_STATUS_COMPONENT_METADATA, PDX_SEARCH_INPUT_COMPONENT_METADATA, PDX_TEXT_INPUT_COMPONENT_METADATA, PDX_TIME_INPUT_COMPONENT_METADATA, PDX_URL_INPUT_COMPONENT_METADATA, PDX_WEEK_INPUT_COMPONENT_METADATA, PDX_YEAR_INPUT_COMPONENT_METADATA, PRAXIS_DYNAMIC_FIELDS_EN_US, PRAXIS_DYNAMIC_FIELDS_I18N, PRAXIS_DYNAMIC_FIELDS_LOGGER_BACKEND, PRAXIS_DYNAMIC_FIELDS_PT_BR, PRICE_RANGE_AI_CAPABILITIES, PasswordInputComponent, PdxColorPickerComponent, PdxMaterialRangeSliderComponent, PdxMaterialTimeRangeComponent, PdxYearInputComponent, PhoneInputComponent, PraxisErrorStateMatcher, PreloadStatusComponent, RETRY_DELAY, SELECT_CONTROLS_AI_CAPABILITIES, SearchInputComponent, SimpleBaseButtonComponent, SimpleBaseInputComponent, SimpleBaseSelectComponent, TEXT_INPUTS_AI_CAPABILITIES, TIME_RANGE_AI_CAPABILITIES, TOGGLE_CONTROLS_AI_CAPABILITIES, TREE_CONTROLS_AI_CAPABILITIES, TextInputComponent, TimeInputComponent, UrlInputComponent, WeekInputComponent, YEAR_INPUT_AI_CAPABILITIES, bindDynamicFieldsLoggerBackendFromInjector, clearDynamicFieldsLoggerBackend, configureDynamicFieldsLogger, createDynamicFieldPreviewRecipe, createErrorStateMatcher, createPraxisDynamicFieldsI18nConfig, emitToDynamicFieldsLoggerBackend, enableDebugForComponent, getControlTypeCatalog, getErrorStateMatcherForField, inferErrorStateStrategy, initializeComponentSystem, initializeComponentSystemSync, isBaseDynamicFieldComponent, isLoadingCapableComponent, isValidJsonSchema, isValueBasedComponent, logger, mapJsonSchemaToFields, mapPropertyToFieldMetadata, normalizeFormMetadata, provideMaterialAvatarMetadata, providePraxisDynamicFields, providePraxisDynamicFieldsCore, providePraxisDynamicFieldsCoreNoDefaults, providePraxisDynamicFieldsI18n, providePraxisDynamicFieldsNoDefaults, resolvePraxisDynamicFieldsText, setDynamicFieldsLoggerBackend, silenceComponent, supportsClearButtonControlType };
 //# sourceMappingURL=praxisui-dynamic-fields.mjs.map