@tylertech/forge 3.3.4 → 3.3.5

package/esm/field/field-adapter.d.ts

@@ -9,11 +9,12 @@ import { FieldLabelPosition } from './base/base-field-constants';
 import { IFieldComponent } from './field';
 export interface IFieldAdapter extends IBaseAdapter<IFieldComponent> {
     readonly focusIndicator: IFocusIndicatorComponent;
+    readonly hasSlottedLabel: boolean;
     addRootListener(name: keyof HTMLElementEventMap, listener: EventListener): void;
     addPopoverIconClickListener(listener: EventListener): void;
     removePopoverIconClickListener(listener: EventListener): void;
     setLabelPosition(value: FieldLabelPosition): void;
-    setFloatingLabel(value: boolean, skipAnimation?: boolean): void;
+    setFloatingLabel(value: boolean): void;
     handleSlotChange(slot: HTMLSlotElement): void;
     initializeSlots(): void;
 }
@@ -22,9 +23,11 @@ export declare class FieldAdapter extends BaseAdapter<IFieldComponent> implement
     private readonly _containerElement;
     private readonly _inputContainerElement;
     private readonly _labelElement;
+    private readonly _labelSlotElement;
     private readonly _popoverIconElement;
     private readonly _focusIndicatorElement;
     get focusIndicator(): IFocusIndicatorComponent;
+    get hasSlottedLabel(): boolean;
     constructor(component: IFieldComponent);
     addRootListener(name: keyof HTMLElementEventMap, listener: EventListener): void;
     addPopoverIconClickListener(listener: EventListener): void;
@@ -37,7 +40,7 @@ export declare class FieldAdapter extends BaseAdapter<IFieldComponent> implement
     /**
      * Adds or removes animation classes on the root element.
      */
-    setFloatingLabel(value: boolean, skipAnimation?: boolean): void;
+    setFloatingLabel(value: boolean): void;
     /**
      * Adds or removes a class from the root element indicating whether the slot has any assigned
      * nodes.

package/esm/field/field-adapter.js

@@ -11,12 +11,16 @@ export class FieldAdapter extends BaseAdapter {
     get focusIndicator() {
         return this._focusIndicatorElement;
     }
+    get hasSlottedLabel() {
+        return !!this._labelSlotElement.assignedNodes({ flatten: true }).length;
+    }
     constructor(component) {
         super(component);
         this._rootElement = getShadowElement(component, FIELD_CONSTANTS.selectors.ROOT);
         this._containerElement = getShadowElement(component, FIELD_CONSTANTS.selectors.CONTAINER);
         this._inputContainerElement = getShadowElement(component, FIELD_CONSTANTS.selectors.INPUT_CONTAINER);
         this._labelElement = getShadowElement(component, FIELD_CONSTANTS.selectors.LABEL);
+        this._labelSlotElement = getShadowElement(component, FIELD_CONSTANTS.selectors.LABEL_SLOT);
         this._popoverIconElement = getShadowElement(component, FIELD_CONSTANTS.selectors.POPOVER_ICON);
         this._focusIndicatorElement = getShadowElement(component, FOCUS_INDICATOR_CONSTANTS.elementName);
     }
@@ -45,10 +49,7 @@ export class FieldAdapter extends BaseAdapter {
     /**
      * Adds or removes animation classes on the root element.
      */
-    setFloatingLabel(value, skipAnimation = false) {
-        if (skipAnimation || !this._labelElement) {
-            return;
-        }
+    setFloatingLabel(value) {
         // Temporarily lock the input container element width to its current width before the animation starts
         // to ensure that the element cannot collapse while the animation is executing. The width will be
         // removed after the animation completes.

package/esm/field/field-constants.d.ts

@@ -61,6 +61,7 @@ export declare const FIELD_CONSTANTS: {
         CONTAINER: string;
         INPUT_CONTAINER: string;
         LABEL: string;
+        LABEL_SLOT: string;
         POPOVER_ICON: string;
         LABEL_ELEMENTS: string;
         POPOVER_TARGET: string;

package/esm/field/field-constants.js

@@ -32,6 +32,7 @@ const selectors = {
     CONTAINER: '#container',
     INPUT_CONTAINER: '#input',
     LABEL: '#label',
+    LABEL_SLOT: 'slot[name=label]',
     POPOVER_ICON: '#popover-icon',
     LABEL_ELEMENTS: `:where(label, ${LABEL_CONSTANTS.elementName})`,
     POPOVER_TARGET: '.popover-target'

package/esm/field/field-core.js

@@ -44,7 +44,6 @@ export class FieldCore {
     floatLabelWithoutAnimation(value) {
         if (this._floatLabel !== value) {
             this._floatLabel = value;
-            this._adapter.setFloatingLabel(this._floatLabel, true);
             this._adapter.toggleHostAttribute(FIELD_CONSTANTS.attributes.FLOAT_LABEL, this._floatLabel);
         }
     }
@@ -76,7 +75,9 @@ export class FieldCore {
     set floatLabel(value) {
         if (this._floatLabel !== value) {
             this._floatLabel = value;
-            this._adapter.setFloatingLabel(this._floatLabel);
+            if (this._adapter.hasSlottedLabel) {
+                this._adapter.setFloatingLabel(this._floatLabel);
+            }
             this._adapter.toggleHostAttribute(FIELD_CONSTANTS.attributes.FLOAT_LABEL, this._floatLabel);
         }
     }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tylertech/forge",
   "description": "Tyler Forge™ Web Components library",
-  "version": "3.3.4",
+  "version": "3.3.5",
   "author": "Tyler Technologies, Inc.",
   "license": "Apache-2.0",
   "repository": {