igniteui-webcomponents 7.2.4 → 7.3.0-beta.1

package/components/popover/popover.js

@@ -7,25 +7,23 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { arrow, autoUpdate, computePosition, flip, inline, limitShift, offset, shift, size, } from '@floating-ui/dom';
 import { html, LitElement } from 'lit';
 import { property, query } from 'lit/decorators.js';
-import { addSlotController, setSlots, } from '../common/controllers/slot.js';
-import { registerComponent } from '../common/definitions/register.js';
-import { first, getElementByIdFromRoot, getRoot, isString, roundByDPR, setStyles, } from '../common/util.js';
+import { addSlotController, setSlots, } from '#internals/controllers/slot.js';
+import { registerComponent } from '#internals/definitions/register.js';
+import { firstOf } from '#internals/utils/arrays.js';
+import { getElementByIdFromRoot, hasStickyAncestor, isPopoverOpen, roundByDPR, setStyles, } from '#internals/utils/dom.js';
+import { isString } from '#internals/utils/types.js';
 import { styles } from './themes/light/popover.base.css.js';
-function hasStickyAncestor(element) {
-    let node = element;
-    while (node) {
-        if (getComputedStyle(node).position === 'sticky') {
-            return true;
-        }
-        const root = getRoot(node);
-        node =
-            node.parentElement ?? (root instanceof ShadowRoot ? root.host : null);
-    }
-    return false;
-}
+const OPPOSITE_SIDE = {
+    top: 'bottom',
+    right: 'left',
+    bottom: 'top',
+    left: 'right',
+};
+const SIDES = Object.keys(OPPOSITE_SIDE);
 export default class IgcPopoverComponent extends LitElement {
     constructor() {
         super(...arguments);
+        this._positionId = 0;
         this._strategy = 'absolute';
         this._slots = addSlotController(this, {
             slots: setSlots('anchor'),
@@ -44,123 +42,126 @@ export default class IgcPopoverComponent extends LitElement {
     }
     static { this.tagName = 'igc-popover'; }
     static { this.styles = styles; }
-    static { this._oppositeArrowSide = new Map(Object.entries({
-        top: 'bottom',
-        right: 'left',
-        bottom: 'top',
-        left: 'right',
-    })); }
     static register() {
         registerComponent(IgcPopoverComponent);
     }
     update(properties) {
-        let targetChanged = false;
-        if (properties.has('anchor')) {
-            const target = isString(this.anchor)
-                ? getElementByIdFromRoot(this, this.anchor)
-                : this.anchor;
-            if (target) {
-                this._target = target;
-                targetChanged = true;
+        if (this.hasUpdated) {
+            this._middleware = undefined;
+            if (properties.has('sameWidth') && !this.sameWidth) {
+                setStyles(this._container, { width: '' });
+            }
+            if (properties.has('open') || properties.has('anchor')) {
+                this._setOpenState(this.open);
+            }
+            else if (this.open) {
+                this._updatePosition();
             }
-        }
-        if (this.hasUpdated && properties.has('open')) {
-            this._setOpenState(this.open);
-        }
-        else if (this.hasUpdated && this.open) {
-            targetChanged ? this._resetAutoUpdate() : this._updatePosition();
         }
         super.update(properties);
     }
+    firstUpdated() {
+        this._setOpenState(this.open);
+    }
     connectedCallback() {
         super.connectedCallback();
-        this.updateComplete.then(() => {
+        if (this.hasUpdated) {
             this._setOpenState(this.open);
-        });
+        }
     }
     disconnectedCallback() {
         super.disconnectedCallback();
         this._setOpenState(false);
     }
     _handleSlotChange({ isDefault, }) {
-        if (isDefault) {
+        if (isDefault || this.anchor) {
             return;
         }
-        const possibleTarget = first(this._slots.getAssignedElements('anchor', { flatten: true }));
-        if (this.anchor || !possibleTarget) {
-            return;
+        this._setOpenState(this.open);
+    }
+    _handleToggle() {
+        if (!isPopoverOpen(this._container)) {
+            this._clearDispose();
         }
-        this._target = possibleTarget;
-        if (this.open) {
-            this._resetAutoUpdate();
+    }
+    _resolveTarget() {
+        if (isString(this.anchor)) {
+            return getElementByIdFromRoot(this, this.anchor) ?? this._target;
         }
+        return (this.anchor ??
+            firstOf(this._slots.getAssignedElements('anchor', { flatten: true })));
     }
     _setOpenState(state) {
-        state ? this._setDispose() : this._clearDispose();
+        this._clearDispose();
+        if (state) {
+            this._target = this._resolveTarget();
+            if (this._target) {
+                this._strategy = hasStickyAncestor(this._target) ? 'fixed' : 'absolute';
+                this._dispose = autoUpdate(this._target, this._container, this._updatePosition.bind(this));
+            }
+        }
         this._setPopoverState(state);
     }
-    _setPopoverState(open) {
-        if (!this._target) {
+    _setPopoverState(state) {
+        const container = this._container;
+        if (!container) {
             return;
         }
-        open ? this._container?.showPopover() : this._container?.hidePopover();
-    }
-    _setDispose() {
-        if (!this._target) {
-            return;
+        const shouldOpen = state && this._target != null;
+        if (shouldOpen !== isPopoverOpen(container)) {
+            shouldOpen ? container.showPopover() : container.hidePopover();
         }
-        this._strategy = hasStickyAncestor(this._target) ? 'fixed' : 'absolute';
-        this._dispose = autoUpdate(this._target, this._container, this._updatePosition.bind(this));
     }
     _clearDispose() {
         this._dispose?.();
         this._dispose = undefined;
     }
-    _resetAutoUpdate() {
-        this._clearDispose();
-        this._setDispose();
+    get _placement() {
+        return this.placement ?? 'bottom-start';
     }
     _createMiddleware() {
-        const middleware = [];
-        const container = this._container;
-        if (this.offset) {
-            middleware.push(offset(this.offset));
-        }
-        if (this.inline) {
-            middleware.push(inline());
-        }
-        if (this.shift) {
-            middleware.push(shift({
-                padding: this.shiftPadding,
-                limiter: limitShift(),
-            }));
-        }
-        if (this.arrow) {
-            middleware.push(arrow({ element: this.arrow }));
-        }
-        if (this.flip) {
-            middleware.push(flip());
-        }
-        if (this.sameWidth) {
-            middleware.push(size({
-                apply: ({ rects }) => setStyles(container, { width: `${rects.reference.width}px` }),
-            }));
-        }
-        else {
-            setStyles(container, { width: '' });
-        }
-        return middleware;
+        const shiftMiddleware = this.shift
+            ? shift({ padding: this.shiftPadding, limiter: limitShift() })
+            : null;
+        const flipMiddleware = this.flip ? flip() : null;
+        const positioners = this._placement.includes('-')
+            ? [flipMiddleware, shiftMiddleware]
+            : [shiftMiddleware, flipMiddleware];
+        const chain = [
+            this.offset !== 0 ? offset(this.offset) : null,
+            this.inline ? inline() : null,
+            ...positioners,
+            this.sameWidth
+                ? size({
+                    apply: ({ rects }) => setStyles(this._container, {
+                        width: `${rects.reference.width}px`,
+                    }),
+                })
+                : null,
+            this.arrow ? arrow({ element: this.arrow }) : null,
+        ];
+        return chain.filter((entry) => entry !== null);
     }
     async _updatePosition() {
-        if (!(this.open && this._target)) {
+        if (!this.open) {
             return;
         }
+        if (!this._target?.isConnected) {
+            this._target = undefined;
+            this._clearDispose();
+            this._setPopoverState(false);
+            return;
+        }
+        const positionId = ++this._positionId;
         const strategy = this._strategy;
         const { x, y, middlewareData, placement } = await computePosition(this._target, this._container, {
-            placement: this.placement ?? 'bottom-start',
-            middleware: this._createMiddleware(),
+            placement: this._placement,
+            middleware: (this._middleware ??= this._createMiddleware()),
             strategy,
         });
+        if (positionId !== this._positionId || !this.open) {
+            return;
+        }
         setStyles(this._container, {
             position: strategy,
             left: '0',
@@ -170,25 +171,39 @@ export default class IgcPopoverComponent extends LitElement {
         this._updateArrowPosition(placement, middlewareData);
     }
     _updateArrowPosition(placement, data) {
-        if (!(data.arrow && this.arrow)) {
+        const element = this.arrow;
+        if (!(data.arrow && element)) {
             return;
         }
         const { x, y } = data.arrow;
-        const arrow = this.arrow;
         const offset = this.arrowOffset;
-        const currentPlacement = first(placement.split('-'));
-        const staticSide = IgcPopoverComponent._oppositeArrowSide.get(currentPlacement);
-        arrow.part = currentPlacement;
-        setStyles(arrow, {
-            left: x != null ? `${roundByDPR(x + offset)}px` : '',
+        const [side] = placement.split('-');
+        const staticSide = OPPOSITE_SIDE[side];
+        if (!element.part.contains(side)) {
+            element.part.remove(...SIDES);
+            element.part.add(side);
+        }
+        const inset = staticSide === 'top' || staticSide === 'bottom'
+            ? element.offsetHeight
+            : element.offsetWidth;
+        const styles = {
             top: y != null ? `${roundByDPR(y + offset)}px` : '',
-            [staticSide]: '-4px',
-        });
+            right: '',
+            bottom: '',
+            left: x != null ? `${roundByDPR(x + offset)}px` : '',
+        };
+        styles[staticSide] = `${-inset}px`;
+        setStyles(element, styles);
     }
     render() {
         return html `
       <slot name="anchor"></slot>
-      <div id="container" part="container" popover="manual">
+      <div
+        id="container"
+        part="container"
+        popover="manual"
+        @toggle=${this._handleToggle}
+      >
         <slot></slot>
       </div>
     `;

package/components/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sourceRoot":"","sources":["../../../src/components/popover/popover.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,KAAK,EACL,UAAU,EACV,eAAe,EACf,IAAI,EACJ,MAAM,EACN,UAAU,EAGV,MAAM,EAEN,KAAK,EACL,IAAI,GACL,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,UAAU,EAAuB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EACL,iBAAiB,EAEjB,QAAQ,GACT,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EACL,KAAK,EACL,sBAAsB,EACtB,OAAO,EACP,QAAQ,EACR,UAAU,EACV,SAAS,GACV,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAuB5D,SAAS,iBAAiB,CAAC,OAAgB;IACzC,IAAI,IAAI,GAAmB,OAAO,CAAC;IAEnC,OAAO,IAAI,EAAE,CAAC;QACZ,IAAI,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ,KAAK,QAAQ,EAAE,CAAC;YACjD,OAAO,IAAI,CAAC;QACd,CAAC;QAED,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;QAC3B,IAAI;YACF,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,YAAY,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAC1E,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC;AAWD,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,UAAU;IAA3D;;QA+BU,cAAS,GAAyB,UAAU,CAAC;QAEpC,WAAM,GAAG,iBAAiB,CAAC,IAAI,EAAE;YAChD,KAAK,EAAE,QAAQ,CAAC,QAAQ,CAAC;YACzB,QAAQ,EAAE,IAAI,CAAC,iBAAiB;SACjC,CAAC,CAAC;QAoBI,UAAK,GAAuB,IAAI,CAAC;QAIjC,gBAAW,GAAG,CAAC,CAAC;QAOhB,WAAM,GAAG,KAAK,CAAC;QAOf,SAAI,GAAG,KAAK,CAAC;QAMb,WAAM,GAAG,CAAC,CAAC;QAMX,SAAI,GAAG,KAAK,CAAC;QAMb,cAAS,GAAqB,cAAc,CAAC;QAM7C,cAAS,GAAG,KAAK,CAAC;QAOlB,UAAK,GAAG,KAAK,CAAC;QAMd,iBAAY,GAAG,CAAC,CAAC;IAoN1B,CAAC;aAlUwB,YAAO,GAAG,aAAa,AAAhB,CAAiB;aACxB,WAAM,GAAG,MAAM,AAAT,CAAU;aAExB,uBAAkB,GAAG,IAAI,GAAG,CACzC,MAAM,CAAC,OAAO,CAAC;QACb,GAAG,EAAE,QAAQ;QACb,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,KAAK;QACb,IAAI,EAAE,OAAO;KACd,CAAC,CACH,AAPgC,CAO/B;IAGK,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;IACzC,CAAC;IAqGkB,MAAM,CAAC,UAAgC;QACxD,IAAI,aAAa,GAAG,KAAK,CAAC;QAE1B,IAAI,UAAU,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC7B,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC;gBAClC,CAAC,CAAC,sBAAsB,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC;gBAC3C,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC;YAEhB,IAAI,MAAM,EAAE,CAAC;gBACX,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;gBACtB,aAAa,GAAG,IAAI,CAAC;YACvB,CAAC;QACH,CAAC;QAED,IAAI,IAAI,CAAC,UAAU,IAAI,UAAU,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;YAC9C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAChC,CAAC;aAAM,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACxC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;QACnE,CAAC;QAED,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IAC3B,CAAC;IAGe,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE;YAC5B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAChC,CAAC,CAAC,CAAC;IACL,CAAC;IAGe,oBAAoB;QAClC,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC;IAIO,iBAAiB,CAAC,EACxB,SAAS,GAC6B;QACtC,IAAI,SAAS,EAAE,CAAC;YACd,OAAO;QACT,CAAC;QAED,MAAM,cAAc,GAAG,KAAK,CAC1B,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAC7D,CAAC;QAEF,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;YACnC,OAAO;QACT,CAAC;QAED,IAAI,CAAC,OAAO,GAAG,cAAc,CAAC;QAE9B,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC1B,CAAC;IACH,CAAC;IAGO,aAAa,CAAC,KAAc;QAClC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;QAClD,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAEO,gBAAgB,CAAC,IAAa;QACpC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YAClB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,EAAE,WAAW,EAAE,CAAC;IACzE,CAAC;IAEO,WAAW;QACjB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YAClB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,SAAS,GAAG,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC;QAExE,IAAI,CAAC,QAAQ,GAAG,UAAU,CACxB,IAAI,CAAC,OAAO,EACZ,IAAI,CAAC,UAAU,EACf,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAChC,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC;QAClB,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;IAC5B,CAAC;IAEO,gBAAgB;QACtB,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,IAAI,CAAC,WAAW,EAAE,CAAC;IACrB,CAAC;IAKO,iBAAiB;QACvB,MAAM,UAAU,GAAiB,EAAE,CAAC;QACpC,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC;QAElC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;QACvC,CAAC;QAED,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,UAAU,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;QAC5B,CAAC;QAED,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,UAAU,CAAC,IAAI,CACb,KAAK,CAAC;gBACJ,OAAO,EAAE,IAAI,CAAC,YAAY;gBAC1B,OAAO,EAAE,UAAU,EAAE;aACtB,CAAC,CACH,CAAC;QACJ,CAAC;QAED,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAClD,CAAC;QAED,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;QAC1B,CAAC;QAED,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,UAAU,CAAC,IAAI,CACb,IAAI,CAAC;gBACH,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACnB,SAAS,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,IAAI,EAAE,CAAC;aAChE,CAAC,CACH,CAAC;QACJ,CAAC;aAAM,CAAC;YACN,SAAS,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;QACtC,CAAC;QAED,OAAO,UAAU,CAAC;IACpB,CAAC;IAEO,KAAK,CAAC,eAAe;QAC3B,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;YACjC,OAAO;QACT,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC;QAEhC,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,eAAe,CAC/D,IAAI,CAAC,OAAO,EACZ,IAAI,CAAC,UAAU,EACf;YACE,SAAS,EAAE,IAAI,CAAC,SAAS,IAAI,cAAc;YAC3C,UAAU,EAAE,IAAI,CAAC,iBAAiB,EAAE;YACpC,QAAQ;SACT,CACF,CAAC;QAEF,SAAS,CAAC,IAAI,CAAC,UAAU,EAAE;YACzB,QAAQ,EAAE,QAAQ;YAClB,IAAI,EAAE,GAAG;YACT,GAAG,EAAE,GAAG;YACR,SAAS,EAAE,aAAa,UAAU,CAAC,CAAC,CAAC,MAAM,UAAU,CAAC,CAAC,CAAC,KAAK;SAC9D,CAAC,CAAC;QAEH,IAAI,CAAC,oBAAoB,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IACvD,CAAC;IAEO,oBAAoB,CAAC,SAAoB,EAAE,IAAoB;QACrE,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;YAChC,OAAO;QACT,CAAC;QAED,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5B,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,MAAM,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC;QAGhC,MAAM,gBAAgB,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC;QAGrD,MAAM,UAAU,GACd,mBAAmB,CAAC,kBAAkB,CAAC,GAAG,CAAC,gBAAgB,CAAE,CAAC;QAEhE,KAAK,CAAC,IAAI,GAAG,gBAAgB,CAAC;QAE9B,SAAS,CAAC,KAAK,EAAE;YACf,IAAI,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;YACpD,GAAG,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;YACnD,CAAC,UAAU,CAAC,EAAE,MAAM;SACrB,CAAC,CAAC;IACL,CAAC;IAIkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;KAKV,CAAC;IACJ,CAAC;;AA3RgB;IADhB,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC;uDACgB;AAWnC;IADN,QAAQ,EAAE;mDACsB;AAM1B;IADN,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;kDACS;AAIjC;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;wDAC/B;AAOhB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACrB;AAOf;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACvB;AAMb;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDACT;AAMX;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACvB;AAMb;IADN,QAAQ,EAAE;sDACyC;AAM7C;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;sDAC3C;AAOlB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;kDACtB;AAMd;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;yDAC/B","sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  computePosition,\n  flip,\n  inline,\n  limitShift,\n  type Middleware,\n  type MiddlewareData,\n  offset,\n  type Placement,\n  shift,\n  size,\n} from '@floating-ui/dom';\nimport { html, LitElement, type PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport {\n  addSlotController,\n  type SlotChangeCallbackParameters,\n  setSlots,\n} from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport {\n  first,\n  getElementByIdFromRoot,\n  getRoot,\n  isString,\n  roundByDPR,\n  setStyles,\n} from '../common/util.js';\nimport { styles } from './themes/light/popover.base.css.js';\n\n/**\n * Describes the preferred placement of a toggle component.\n */\nexport type PopoverPlacement =\n  | 'top'\n  | 'top-start'\n  | 'top-end'\n  | 'bottom'\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'right'\n  | 'right-start'\n  | 'right-end'\n  | 'left'\n  | 'left-start'\n  | 'left-end';\n\n/**\n * Walks up the DOM tree of the given element, crossing shadow boundaries, and\n * returns whether any ancestor is positioned as `sticky`.\n */\nfunction hasStickyAncestor(element: Element): boolean {\n  let node: Element | null = element;\n\n  while (node) {\n    if (getComputedStyle(node).position === 'sticky') {\n      return true;\n    }\n\n    const root = getRoot(node);\n    node =\n      node.parentElement ?? (root instanceof ShadowRoot ? root.host : null);\n  }\n\n  return false;\n}\n\n/* blazorSuppress */\n/**\n * @element igc-popover\n *\n * @slot - Content of the popover.\n * @slot anchor - The element the popover will be anchored to.\n *\n * @csspart container - The container wrapping the slotted content in the popover.\n */\nexport default class IgcPopoverComponent extends LitElement {\n  public static readonly tagName = 'igc-popover';\n  public static override styles = styles;\n\n  private static _oppositeArrowSide = new Map(\n    Object.entries({\n      top: 'bottom',\n      right: 'left',\n      bottom: 'top',\n      left: 'right',\n    })\n  );\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcPopoverComponent);\n  }\n\n  //#region Internal properties and state\n\n  private _dispose?: ReturnType<typeof autoUpdate>;\n  private _target?: Element;\n\n  /**\n   * The positioning strategy resolved when the popover is opened. The `fixed`\n   * strategy is used when the anchor has a `position: sticky` ancestor, otherwise\n   * the default `absolute` strategy is used. Cached here to avoid repeated DOM\n   * traversals and style reflows on every scroll/resize reposition.\n   *\n   * Also, time to migrate to CSS Anchor positioning!!!\n   */\n  private _strategy: 'absolute' | 'fixed' = 'absolute';\n\n  private readonly _slots = addSlotController(this, {\n    slots: setSlots('anchor'),\n    onChange: this._handleSlotChange,\n  });\n\n  @query('#container', true)\n  private readonly _container!: HTMLElement;\n\n  //#endregion\n\n  //#region Public attributes and properties\n\n  /**\n   * Pass an IDREF or an DOM element reference to use as the\n   * anchor target for the floating element.\n   */\n  @property()\n  public anchor?: Element | string;\n\n  /**\n   * Element to render as an \"arrow\" element for the current popover.\n   */\n  @property({ attribute: false })\n  public arrow: HTMLElement | null = null;\n\n  /** Additional offset to apply to the arrow element if enabled. */\n  @property({ type: Number, attribute: 'arrow-offset' })\n  public arrowOffset = 0;\n\n  /**\n   * Improves positioning for inline reference elements that span over multiple lines.\n   * Useful for tooltips or similar components.\n   */\n  @property({ type: Boolean, reflect: true })\n  public inline = false;\n\n  /**\n   * When enabled this changes the placement of the floating element in order to keep it\n   * in view along the main axis.\n   */\n  @property({ type: Boolean, reflect: true })\n  public flip = false;\n\n  /**\n   * Placement modifier which translates the floating element along the main axis.\n   */\n  @property({ type: Number })\n  public offset = 0;\n\n  /**\n   * The visibility state of the popover component.\n   */\n  @property({ type: Boolean, reflect: true })\n  public open = false;\n\n  /**\n   * Where to place the floating element relative to the parent anchor element.\n   */\n  @property()\n  public placement: PopoverPlacement = 'bottom-start';\n\n  /**\n   * When enabled the floating element will match the width of its parent anchor element.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'same-width' })\n  public sameWidth = false;\n\n  /**\n   * When enabled this tries to shift the floating element along the main axis\n   * keeping it in view, preventing overflow while maintaining the desired placement.\n   */\n  @property({ type: Boolean, reflect: true })\n  public shift = false;\n\n  /**\n   * Virtual padding for the resolved overflow detection offsets in pixels.\n   */\n  @property({ type: Number, attribute: 'shift-padding' })\n  public shiftPadding = 0;\n\n  //#endregion\n\n  //#region Life-cycle hooks\n\n  protected override update(properties: PropertyValues<this>): void {\n    let targetChanged = false;\n\n    if (properties.has('anchor')) {\n      const target = isString(this.anchor)\n        ? getElementByIdFromRoot(this, this.anchor)\n        : this.anchor;\n\n      if (target) {\n        this._target = target;\n        targetChanged = true;\n      }\n    }\n\n    if (this.hasUpdated && properties.has('open')) {\n      this._setOpenState(this.open);\n    } else if (this.hasUpdated && this.open) {\n      targetChanged ? this._resetAutoUpdate() : this._updatePosition();\n    }\n\n    super.update(properties);\n  }\n\n  /** @internal */\n  public override connectedCallback(): void {\n    super.connectedCallback();\n    this.updateComplete.then(() => {\n      this._setOpenState(this.open);\n    });\n  }\n\n  /** @internal */\n  public override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this._setOpenState(false);\n  }\n\n  //#endregion\n\n  private _handleSlotChange({\n    isDefault,\n  }: SlotChangeCallbackParameters<unknown>): void {\n    if (isDefault) {\n      return;\n    }\n\n    const possibleTarget = first(\n      this._slots.getAssignedElements('anchor', { flatten: true })\n    );\n\n    if (this.anchor || !possibleTarget) {\n      return;\n    }\n\n    this._target = possibleTarget;\n\n    if (this.open) {\n      this._resetAutoUpdate();\n    }\n  }\n\n  //#region Internal open state API\n  private _setOpenState(state: boolean): void {\n    state ? this._setDispose() : this._clearDispose();\n    this._setPopoverState(state);\n  }\n\n  private _setPopoverState(open: boolean): void {\n    if (!this._target) {\n      return;\n    }\n    open ? this._container?.showPopover() : this._container?.hidePopover();\n  }\n\n  private _setDispose(): void {\n    if (!this._target) {\n      return;\n    }\n\n    this._strategy = hasStickyAncestor(this._target) ? 'fixed' : 'absolute';\n\n    this._dispose = autoUpdate(\n      this._target,\n      this._container,\n      this._updatePosition.bind(this)\n    );\n  }\n\n  private _clearDispose(): void {\n    this._dispose?.();\n    this._dispose = undefined;\n  }\n\n  private _resetAutoUpdate(): void {\n    this._clearDispose();\n    this._setDispose();\n  }\n  //#endregion\n\n  //#region Internal position API\n\n  private _createMiddleware(): Middleware[] {\n    const middleware: Middleware[] = [];\n    const container = this._container;\n\n    if (this.offset) {\n      middleware.push(offset(this.offset));\n    }\n\n    if (this.inline) {\n      middleware.push(inline());\n    }\n\n    if (this.shift) {\n      middleware.push(\n        shift({\n          padding: this.shiftPadding,\n          limiter: limitShift(),\n        })\n      );\n    }\n\n    if (this.arrow) {\n      middleware.push(arrow({ element: this.arrow }));\n    }\n\n    if (this.flip) {\n      middleware.push(flip());\n    }\n\n    if (this.sameWidth) {\n      middleware.push(\n        size({\n          apply: ({ rects }) =>\n            setStyles(container, { width: `${rects.reference.width}px` }),\n        })\n      );\n    } else {\n      setStyles(container, { width: '' });\n    }\n\n    return middleware;\n  }\n\n  private async _updatePosition(): Promise<void> {\n    if (!(this.open && this._target)) {\n      return;\n    }\n\n    const strategy = this._strategy;\n\n    const { x, y, middlewareData, placement } = await computePosition(\n      this._target,\n      this._container,\n      {\n        placement: this.placement ?? 'bottom-start',\n        middleware: this._createMiddleware(),\n        strategy,\n      }\n    );\n\n    setStyles(this._container, {\n      position: strategy,\n      left: '0',\n      top: '0',\n      transform: `translate(${roundByDPR(x)}px,${roundByDPR(y)}px)`,\n    });\n\n    this._updateArrowPosition(placement, middlewareData);\n  }\n\n  private _updateArrowPosition(placement: Placement, data: MiddlewareData) {\n    if (!(data.arrow && this.arrow)) {\n      return;\n    }\n\n    const { x, y } = data.arrow;\n    const arrow = this.arrow;\n    const offset = this.arrowOffset;\n\n    // The current placement of the popover along the x/y axis\n    const currentPlacement = first(placement.split('-'));\n\n    // The opposite side where the arrow element should render based on the `currentPlacement`\n    const staticSide =\n      IgcPopoverComponent._oppositeArrowSide.get(currentPlacement)!;\n\n    arrow.part = currentPlacement;\n\n    setStyles(arrow, {\n      left: x != null ? `${roundByDPR(x + offset)}px` : '',\n      top: y != null ? `${roundByDPR(y + offset)}px` : '',\n      [staticSide]: '-4px',\n    });\n  }\n\n  //#endregion\n\n  protected override render() {\n    return html`\n      <slot name=\"anchor\"></slot>\n      <div id=\"container\" part=\"container\" popover=\"manual\">\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-popover': IgcPopoverComponent;\n  }\n}\n"]}
+{"version":3,"file":"popover.js","sourceRoot":"","sources":["../../../src/components/popover/popover.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  computePosition,\n  flip,\n  inline,\n  limitShift,\n  type Middleware,\n  type MiddlewareData,\n  offset,\n  type Placement,\n  shift,\n  size,\n} from '@floating-ui/dom';\nimport { html, LitElement, type PropertyValues } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport {\n  addSlotController,\n  type SlotChangeCallbackParameters,\n  setSlots,\n} from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { firstOf } from '#internals/utils/arrays.js';\nimport {\n  getElementByIdFromRoot,\n  hasStickyAncestor,\n  isPopoverOpen,\n  roundByDPR,\n  setStyles,\n} from '#internals/utils/dom.js';\nimport { isString } from '#internals/utils/types.js';\nimport { styles } from './themes/light/popover.base.css.js';\n\n/**\n * Describes the preferred placement of a toggle component.\n */\nexport type PopoverPlacement =\n  | 'top'\n  | 'top-start'\n  | 'top-end'\n  | 'bottom'\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'right'\n  | 'right-start'\n  | 'right-end'\n  | 'left'\n  | 'left-start'\n  | 'left-end';\n\nconst OPPOSITE_SIDE = {\n  top: 'bottom',\n  right: 'left',\n  bottom: 'top',\n  left: 'right',\n} as const;\n\ntype PopoverSide = keyof typeof OPPOSITE_SIDE;\n\nconst SIDES = Object.keys(OPPOSITE_SIDE) as PopoverSide[];\n\n/* blazorSuppress */\n/**\n * @element igc-popover\n *\n * @slot - Content of the popover.\n * @slot anchor - The element the popover will be anchored to.\n *\n * @csspart container - The container wrapping the slotted content in the popover.\n */\nexport default class IgcPopoverComponent extends LitElement {\n  public static readonly tagName = 'igc-popover';\n  public static override styles = styles;\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcPopoverComponent);\n  }\n\n  //#region Internal properties and state\n\n  private _dispose?: ReturnType<typeof autoUpdate>;\n  private _target?: Element;\n  private _middleware?: Middleware[];\n  private _positionId = 0;\n\n  /**\n   * The positioning strategy resolved when the popover is opened. The `fixed`\n   * strategy is used when the anchor has a `position: sticky` ancestor, otherwise\n   * the default `absolute` strategy is used. Cached here to avoid repeated DOM\n   * traversals and style reflows on every scroll/resize reposition.\n   *\n   * Also, time to migrate to CSS Anchor positioning!!!\n   */\n  private _strategy: 'absolute' | 'fixed' = 'absolute';\n\n  private readonly _slots = addSlotController(this, {\n    slots: setSlots('anchor'),\n    onChange: this._handleSlotChange,\n  });\n\n  @query('#container', true)\n  private readonly _container!: HTMLElement;\n\n  //#endregion\n\n  //#region Public attributes and properties\n\n  /**\n   * Pass an IDREF or an DOM element reference to use as the\n   * anchor target for the floating element.\n   */\n  @property()\n  public anchor?: Element | string;\n\n  /**\n   * Element to render as an \"arrow\" element for the current popover.\n   */\n  @property({ attribute: false })\n  public arrow: HTMLElement | null = null;\n\n  /** Additional offset to apply to the arrow element if enabled. */\n  @property({ type: Number, attribute: 'arrow-offset' })\n  public arrowOffset = 0;\n\n  /**\n   * Improves positioning for inline reference elements that span over multiple lines.\n   * Useful for tooltips or similar components.\n   */\n  @property({ type: Boolean, reflect: true })\n  public inline = false;\n\n  /**\n   * When enabled this changes the placement of the floating element in order to keep it\n   * in view along the main axis.\n   */\n  @property({ type: Boolean, reflect: true })\n  public flip = false;\n\n  /**\n   * Placement modifier which translates the floating element along the main axis.\n   */\n  @property({ type: Number })\n  public offset = 0;\n\n  /**\n   * The visibility state of the popover component.\n   */\n  @property({ type: Boolean, reflect: true })\n  public open = false;\n\n  /**\n   * Where to place the floating element relative to the parent anchor element.\n   */\n  @property()\n  public placement: PopoverPlacement = 'bottom-start';\n\n  /**\n   * When enabled the floating element will match the width of its parent anchor element.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'same-width' })\n  public sameWidth = false;\n\n  /**\n   * When enabled this tries to shift the floating element along the main axis\n   * keeping it in view, preventing overflow while maintaining the desired placement.\n   */\n  @property({ type: Boolean, reflect: true })\n  public shift = false;\n\n  /**\n   * Virtual padding for the resolved overflow detection offsets in pixels.\n   */\n  @property({ type: Number, attribute: 'shift-padding' })\n  public shiftPadding = 0;\n\n  //#endregion\n\n  //#region Life-cycle hooks\n\n  protected override update(properties: PropertyValues<this>): void {\n    if (this.hasUpdated) {\n      this._middleware = undefined;\n\n      if (properties.has('sameWidth') && !this.sameWidth) {\n        setStyles(this._container, { width: '' });\n      }\n\n      if (properties.has('open') || properties.has('anchor')) {\n        this._setOpenState(this.open);\n      } else if (this.open) {\n        this._updatePosition();\n      }\n    }\n\n    super.update(properties);\n  }\n\n  protected override firstUpdated(): void {\n    this._setOpenState(this.open);\n  }\n\n  /** @internal */\n  public override connectedCallback(): void {\n    super.connectedCallback();\n\n    if (this.hasUpdated) {\n      this._setOpenState(this.open);\n    }\n  }\n\n  /** @internal */\n  public override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this._setOpenState(false);\n  }\n\n  //#endregion\n\n  private _handleSlotChange({\n    isDefault,\n  }: SlotChangeCallbackParameters<unknown>): void {\n    if (isDefault || this.anchor) {\n      return;\n    }\n\n    this._setOpenState(this.open);\n  }\n\n  private _handleToggle(): void {\n    if (!isPopoverOpen(this._container)) {\n      this._clearDispose();\n    }\n  }\n\n  //#region Internal open state API\n\n  /**\n   * An unresolved IDREF keeps the current target, so that an anchor rendered\n   * after this popover is picked up the next time it opens.\n   */\n  private _resolveTarget(): Element | undefined {\n    if (isString(this.anchor)) {\n      return getElementByIdFromRoot(this, this.anchor) ?? this._target;\n    }\n\n    return (\n      this.anchor ??\n      firstOf(this._slots.getAssignedElements('anchor', { flatten: true }))\n    );\n  }\n\n  private _setOpenState(state: boolean): void {\n    this._clearDispose();\n\n    if (state) {\n      this._target = this._resolveTarget();\n\n      if (this._target) {\n        this._strategy = hasStickyAncestor(this._target) ? 'fixed' : 'absolute';\n        this._dispose = autoUpdate(\n          this._target,\n          this._container,\n          this._updatePosition.bind(this)\n        );\n      }\n    }\n\n    this._setPopoverState(state);\n  }\n\n  private _setPopoverState(state: boolean): void {\n    const container = this._container;\n\n    if (!container) {\n      return;\n    }\n\n    const shouldOpen = state && this._target != null;\n\n    if (shouldOpen !== isPopoverOpen(container)) {\n      shouldOpen ? container.showPopover() : container.hidePopover();\n    }\n  }\n\n  private _clearDispose(): void {\n    this._dispose?.();\n    this._dispose = undefined;\n  }\n\n  //#endregion\n\n  //#region Internal position API\n\n  private get _placement(): PopoverPlacement {\n    return this.placement ?? 'bottom-start';\n  }\n\n  private _createMiddleware(): Middleware[] {\n    const shiftMiddleware = this.shift\n      ? shift({ padding: this.shiftPadding, limiter: limitShift() })\n      : null;\n    const flipMiddleware = this.flip ? flip() : null;\n\n    // Aligned placements flip before shifting, base placements shift first.\n    // See https://floating-ui.com/docs/flip\n    const positioners = this._placement.includes('-')\n      ? [flipMiddleware, shiftMiddleware]\n      : [shiftMiddleware, flipMiddleware];\n\n    const chain = [\n      this.offset !== 0 ? offset(this.offset) : null,\n      this.inline ? inline() : null,\n      ...positioners,\n      this.sameWidth\n        ? size({\n            apply: ({ rects }) =>\n              setStyles(this._container, {\n                width: `${rects.reference.width}px`,\n              }),\n          })\n        : null,\n      this.arrow ? arrow({ element: this.arrow }) : null,\n    ];\n\n    return chain.filter((entry): entry is Middleware => entry !== null);\n  }\n\n  private async _updatePosition(): Promise<void> {\n    if (!this.open) {\n      return;\n    }\n\n    if (!this._target?.isConnected) {\n      this._target = undefined;\n      this._clearDispose();\n      this._setPopoverState(false);\n      return;\n    }\n\n    const positionId = ++this._positionId;\n    const strategy = this._strategy;\n\n    const { x, y, middlewareData, placement } = await computePosition(\n      this._target,\n      this._container,\n      {\n        placement: this._placement,\n        middleware: (this._middleware ??= this._createMiddleware()),\n        strategy,\n      }\n    );\n\n    if (positionId !== this._positionId || !this.open) {\n      return;\n    }\n\n    setStyles(this._container, {\n      position: strategy,\n      left: '0',\n      top: '0',\n      transform: `translate(${roundByDPR(x)}px,${roundByDPR(y)}px)`,\n    });\n\n    this._updateArrowPosition(placement, middlewareData);\n  }\n\n  private _updateArrowPosition(\n    placement: Placement,\n    data: MiddlewareData\n  ): void {\n    const element = this.arrow;\n\n    if (!(data.arrow && element)) {\n      return;\n    }\n\n    const { x, y } = data.arrow;\n    const offset = this.arrowOffset;\n    const [side] = placement.split('-') as [PopoverSide];\n    const staticSide = OPPOSITE_SIDE[side];\n\n    if (!element.part.contains(side)) {\n      element.part.remove(...SIDES);\n      element.part.add(side);\n    }\n\n    // Measured after the part switch, since it is what gives the arrow its size.\n    const inset =\n      staticSide === 'top' || staticSide === 'bottom'\n        ? element.offsetHeight\n        : element.offsetWidth;\n\n    // Every side is reset, otherwise the inset of the previous placement is left\n    // behind and over-constrains the arrow.\n    const styles: Partial<CSSStyleDeclaration> = {\n      top: y != null ? `${roundByDPR(y + offset)}px` : '',\n      right: '',\n      bottom: '',\n      left: x != null ? `${roundByDPR(x + offset)}px` : '',\n    };\n\n    styles[staticSide] = `${-inset}px`;\n\n    setStyles(element, styles);\n  }\n\n  //#endregion\n\n  protected override render() {\n    return html`\n      <slot name=\"anchor\"></slot>\n      <div\n        id=\"container\"\n        part=\"container\"\n        popover=\"manual\"\n        @toggle=${this._handleToggle}\n      >\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-popover': IgcPopoverComponent;\n  }\n}\n"]}

package/components/progress/base.d.ts

@@ -1,9 +1,8 @@
-import { LitElement } from 'lit';
+import { LitElement, type PropertyValues } from 'lit';
 import type { StyleInfo } from 'lit/directives/style-map.js';
-import type { SlotController } from '../common/controllers/slot.js';
+import type { SlotController } from '#internals/controllers/slot.js';
 import type { StyleVariant } from '../types.js';
 export declare abstract class IgcProgressBaseComponent extends LitElement {
-    private readonly _internals;
     protected abstract _slots: SlotController<any>;
     protected _base: HTMLElement;
     protected _percentage: number;
@@ -48,11 +47,9 @@ export declare abstract class IgcProgressBaseComponent extends LitElement {
      * @attr label-format
      */
     labelFormat: string;
-    protected _indeterminateChange(): void;
-    protected _maxChange(): void;
-    protected _valueChange(): void;
-    protected updated(): void;
-    private _updateARIA;
+    constructor();
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    private get _labelText();
     private _updateProgress;
     protected _renderLabel(): import("lit-html").TemplateResult<1>;
     protected _renderLabelFormat(): string;

package/components/progress/base.js

@@ -6,20 +6,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, LitElement, nothing } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
-import { addInternalsController } from '../common/controllers/internals.js';
-import { watch } from '../common/decorators/watch.js';
-import { partMap } from '../common/part-map.js';
-import { asPercent, clamp, formatString } from '../common/util.js';
+import { addInternalsController } from '#internals/controllers/internals.js';
+import { partMap } from '#internals/part-map.js';
+import { asPercent, clamp } from '#internals/utils/math.js';
+import { formatString } from '#internals/utils/strings.js';
 export class IgcProgressBaseComponent extends LitElement {
     constructor() {
-        super(...arguments);
-        this._internals = addInternalsController(this, {
-            initialARIA: {
-                role: 'progressbar',
-                ariaValueMin: '0',
-                ariaValueNow: '0',
-            },
-        });
+        super();
         this._percentage = 0;
         this._progress = 0;
         this._hasFraction = false;
@@ -35,39 +28,32 @@ export class IgcProgressBaseComponent extends LitElement {
         this.animationDuration = 500;
         this.indeterminate = false;
         this.hideLabel = false;
+        addInternalsController(this, {
+            initialARIA: {
+                role: 'progressbar',
+                ariaValueMin: '0',
+                ariaValueNow: '0',
+            },
+            aria: () => ({
+                ariaValueMax: this.max.toString(),
+                ariaValueNow: this.indeterminate ? null : this.value.toString(),
+                ariaValueText: this.indeterminate ? null : this._labelText,
+            }),
+        });
     }
-    _indeterminateChange() {
-        if (!this.indeterminate) {
-            this._updateProgress();
-        }
-    }
-    _maxChange() {
+    willUpdate(changedProperties) {
+        const progressChanged = changedProperties.has('animationDuration') ||
+            changedProperties.has('indeterminate') ||
+            changedProperties.has('max') ||
+            changedProperties.has('value');
         this.max = Math.max(0, this.max);
-        if (this.value > this.max) {
-            this.value = this.max;
-        }
-        if (!this.indeterminate) {
-            this._updateProgress();
-        }
-    }
-    _valueChange() {
         this.value = clamp(this.value, 0, this.max);
-        if (!this.indeterminate) {
+        if (progressChanged && !this.indeterminate) {
             this._updateProgress();
         }
     }
-    updated() {
-        this._updateARIA();
-    }
-    _updateARIA() {
-        const text = this.labelFormat
-            ? this._renderLabelFormat()
-            : `${this.value}%`;
-        this._internals.setARIA({
-            ariaValueMax: this.max.toString(),
-            ariaValueNow: this.indeterminate ? null : this.value.toString(),
-            ariaValueText: this.indeterminate ? null : text,
-        });
+    get _labelText() {
+        return this.labelFormat ? this._renderLabelFormat() : `${this.value}%`;
     }
     _updateProgress() {
         const percentage = asPercent(this.value, Math.max(1, this.max));
@@ -139,13 +125,4 @@ __decorate([
 __decorate([
     property({ attribute: 'label-format' })
 ], IgcProgressBaseComponent.prototype, "labelFormat", void 0);
-__decorate([
-    watch('indeterminate')
-], IgcProgressBaseComponent.prototype, "_indeterminateChange", null);
-__decorate([
-    watch('max')
-], IgcProgressBaseComponent.prototype, "_maxChange", null);
-__decorate([
-    watch('value')
-], IgcProgressBaseComponent.prototype, "_valueChange", null);
 //# sourceMappingURL=base.js.map

package/components/progress/base.js.map

@@ -1 +1 @@
-{"version":3,"file":"base.js","sourceRoot":"","sources":["../../../src/components/progress/base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport type { StyleInfo } from 'lit/directives/style-map.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport type { SlotController } from '../common/controllers/slot.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { partMap } from '../common/part-map.js';\nimport { asPercent, clamp, formatString } from '../common/util.js';\nimport type { StyleVariant } from '../types.js';\n\nexport abstract class IgcProgressBaseComponent extends LitElement {\n  private readonly _internals = addInternalsController(this, {\n    initialARIA: {\n      role: 'progressbar',\n      ariaValueMin: '0',\n      ariaValueNow: '0',\n    },\n  });\n\n  protected abstract _slots: SlotController<any>;\n\n  @query('[part=\"base\"]', true)\n  protected _base!: HTMLElement;\n\n  @state()\n  protected _percentage = 0;\n\n  @state()\n  protected _progress = 0;\n\n  @state()\n  protected _hasFraction = false;\n\n  @state()\n  protected _styleInfo: StyleInfo = {\n    '--_progress-whole': '0.00',\n    '--_progress-integer': '0',\n    '--_progress-fraction': '0',\n    '--_transition-duration': '0ms',\n  };\n\n  /**\n   * Maximum value of the control.\n   * @attr\n   */\n  @property({ type: Number })\n  public max = 100;\n\n  /**\n   * The value of the control.\n   * @attr\n   */\n  @property({ type: Number })\n  public value = 0;\n\n  /**\n   * The variant of the control.\n   * @attr\n   */\n  @property({ reflect: true })\n  public variant: StyleVariant = 'primary';\n\n  /**\n   * Animation duration in milliseconds.\n   * @attr animation-duration\n   */\n  @property({ type: Number, attribute: 'animation-duration' })\n  public animationDuration = 500;\n\n  /**\n   * The indeterminate state of the control.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: false })\n  public indeterminate = false;\n\n  /**\n   * Shows/hides the label of the control.\n   * @attr hide-label\n   */\n  @property({ type: Boolean, attribute: 'hide-label', reflect: false })\n  public hideLabel = false;\n\n  /**\n   * Format string for the default label of the control.\n   * Placeholders:\n   *  {0} - current value of the control.\n   *  {1} - max value of the control.\n   * @attr label-format\n   */\n  @property({ attribute: 'label-format' })\n  public labelFormat!: string;\n\n  @watch('indeterminate')\n  protected _indeterminateChange(): void {\n    if (!this.indeterminate) {\n      this._updateProgress();\n    }\n  }\n\n  @watch('max')\n  protected _maxChange(): void {\n    this.max = Math.max(0, this.max);\n    if (this.value > this.max) {\n      this.value = this.max;\n    }\n\n    if (!this.indeterminate) {\n      this._updateProgress();\n    }\n  }\n\n  @watch('value')\n  protected _valueChange(): void {\n    this.value = clamp(this.value, 0, this.max);\n\n    if (!this.indeterminate) {\n      this._updateProgress();\n    }\n  }\n\n  protected override updated(): void {\n    this._updateARIA();\n  }\n\n  private _updateARIA(): void {\n    const text = this.labelFormat\n      ? this._renderLabelFormat()\n      : `${this.value}%`;\n\n    this._internals.setARIA({\n      ariaValueMax: this.max.toString(),\n      ariaValueNow: this.indeterminate ? null : this.value.toString(),\n      ariaValueText: this.indeterminate ? null : text,\n    });\n  }\n\n  private _updateProgress(): void {\n    const percentage = asPercent(this.value, Math.max(1, this.max));\n    const fractionValue = Math.round((percentage % 1) * 100);\n    this._hasFraction = fractionValue > 0;\n\n    this._styleInfo = {\n      '--_progress-whole': percentage.toFixed(2),\n      '--_progress-integer': Math.floor(percentage),\n      '--_progress-fraction': fractionValue,\n      '--_transition-duration': `${this.animationDuration}ms`,\n    };\n  }\n\n  protected _renderLabel() {\n    const parts = {\n      label: true,\n      value: true,\n      fraction: this._hasFraction,\n    };\n\n    return this.labelFormat\n      ? html`<span part=${partMap(parts)}>${this._renderLabelFormat()}</span>`\n      : html`<span part=${partMap({ ...parts, counter: true })}></span>`;\n  }\n\n  protected _renderLabelFormat(): string {\n    return formatString(this.labelFormat, this.value, this.max);\n  }\n\n  protected _renderDefaultSlot() {\n    const hideDefaultLabel =\n      this.indeterminate ||\n      this.hideLabel ||\n      this._slots.hasAssignedElements('[default]');\n\n    return html`\n      <slot part=\"label\"></slot>\n      ${hideDefaultLabel ? nothing : this._renderLabel()}\n    `;\n  }\n}\n"]}
+{"version":3,"file":"base.js","sourceRoot":"","sources":["../../../src/components/progress/base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, type PropertyValues } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport type { StyleInfo } from 'lit/directives/style-map.js';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport type { SlotController } from '#internals/controllers/slot.js';\nimport { partMap } from '#internals/part-map.js';\nimport { asPercent, clamp } from '#internals/utils/math.js';\nimport { formatString } from '#internals/utils/strings.js';\nimport type { StyleVariant } from '../types.js';\n\n/* omitModule */\nexport abstract class IgcProgressBaseComponent extends LitElement {\n  protected abstract _slots: SlotController<any>;\n\n  @query('[part=\"base\"]', true)\n  protected _base!: HTMLElement;\n\n  @state()\n  protected _percentage = 0;\n\n  @state()\n  protected _progress = 0;\n\n  @state()\n  protected _hasFraction = false;\n\n  @state()\n  protected _styleInfo: StyleInfo = {\n    '--_progress-whole': '0.00',\n    '--_progress-integer': '0',\n    '--_progress-fraction': '0',\n    '--_transition-duration': '0ms',\n  };\n\n  /**\n   * Maximum value of the control.\n   * @attr\n   */\n  @property({ type: Number })\n  public max = 100;\n\n  /**\n   * The value of the control.\n   * @attr\n   */\n  @property({ type: Number })\n  public value = 0;\n\n  /**\n   * The variant of the control.\n   * @attr\n   */\n  @property({ reflect: true })\n  public variant: StyleVariant = 'primary';\n\n  /**\n   * Animation duration in milliseconds.\n   * @attr animation-duration\n   */\n  @property({ type: Number, attribute: 'animation-duration' })\n  public animationDuration = 500;\n\n  /**\n   * The indeterminate state of the control.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: false })\n  public indeterminate = false;\n\n  /**\n   * Shows/hides the label of the control.\n   * @attr hide-label\n   */\n  @property({ type: Boolean, attribute: 'hide-label', reflect: false })\n  public hideLabel = false;\n\n  /**\n   * Format string for the default label of the control.\n   * Placeholders:\n   *  {0} - current value of the control.\n   *  {1} - max value of the control.\n   * @attr label-format\n   */\n  @property({ attribute: 'label-format' })\n  public labelFormat!: string;\n\n  constructor() {\n    super();\n\n    addInternalsController(this, {\n      initialARIA: {\n        role: 'progressbar',\n        ariaValueMin: '0',\n        ariaValueNow: '0',\n      },\n      aria: () => ({\n        ariaValueMax: this.max.toString(),\n        ariaValueNow: this.indeterminate ? null : this.value.toString(),\n        ariaValueText: this.indeterminate ? null : this._labelText,\n      }),\n    });\n  }\n\n  protected override willUpdate(changedProperties: PropertyValues<this>): void {\n    const progressChanged =\n      changedProperties.has('animationDuration') ||\n      changedProperties.has('indeterminate') ||\n      changedProperties.has('max') ||\n      changedProperties.has('value');\n\n    // Both writes are idempotent, so they are applied unconditionally. A clamp\n    // that does change a value lands it in `changedProperties` for this pass.\n    this.max = Math.max(0, this.max);\n    this.value = clamp(this.value, 0, this.max);\n\n    if (progressChanged && !this.indeterminate) {\n      this._updateProgress();\n    }\n  }\n\n  private get _labelText(): string {\n    return this.labelFormat ? this._renderLabelFormat() : `${this.value}%`;\n  }\n\n  private _updateProgress(): void {\n    const percentage = asPercent(this.value, Math.max(1, this.max));\n    const fractionValue = Math.round((percentage % 1) * 100);\n    this._hasFraction = fractionValue > 0;\n\n    this._styleInfo = {\n      '--_progress-whole': percentage.toFixed(2),\n      '--_progress-integer': Math.floor(percentage),\n      '--_progress-fraction': fractionValue,\n      '--_transition-duration': `${this.animationDuration}ms`,\n    };\n  }\n\n  protected _renderLabel() {\n    const parts = {\n      label: true,\n      value: true,\n      fraction: this._hasFraction,\n    };\n\n    return this.labelFormat\n      ? html`<span part=${partMap(parts)}>${this._renderLabelFormat()}</span>`\n      : html`<span part=${partMap({ ...parts, counter: true })}></span>`;\n  }\n\n  protected _renderLabelFormat(): string {\n    return formatString(this.labelFormat, this.value, this.max);\n  }\n\n  protected _renderDefaultSlot() {\n    const hideDefaultLabel =\n      this.indeterminate ||\n      this.hideLabel ||\n      this._slots.hasAssignedElements('[default]');\n\n    return html`\n      <slot part=\"label\"></slot>\n      ${hideDefaultLabel ? nothing : this._renderLabel()}\n    `;\n  }\n}\n"]}

package/components/progress/circular-gradient.d.ts

@@ -1,7 +1,7 @@
 import { LitElement } from 'lit';
 /**
- * Used for defining gradient stops in the igc-circular-progress.
- * For each `igc-circular-gradient` defined as `gradient` slot of `igc-circular-progress` element would be created a SVG stop element.
+ * Used for defining gradient stops in the circular progress component.
+ * For each circular gradient, defined as `gradient` slot of the circular progress, would be created a SVG stop element.
  * The values passed as `color`, `offset` and `opacity` would be set as
  * `stop-color`, `offset` and `stop-opacity` of the SVG element without further validations.
  *

package/components/progress/circular-gradient.js

@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { LitElement, nothing } from 'lit';
 import { property } from 'lit/decorators.js';
-import { registerComponent } from '../common/definitions/register.js';
+import { registerComponent } from '#internals/definitions/register.js';
 export default class IgcCircularGradientComponent extends LitElement {
     constructor() {
         super(...arguments);

package/components/progress/circular-gradient.js.map

@@ -1 +1 @@
-{"version":3,"file":"circular-gradient.js","sourceRoot":"","sources":["../../../src/components/progress/circular-gradient.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAWtE,MAAM,CAAC,OAAO,OAAO,4BAA6B,SAAQ,UAAU;IAApE;;QAaS,WAAM,GAAG,IAAI,CAAC;QAOd,UAAK,GAAG,OAAO,CAAC;QAOhB,YAAO,GAAG,CAAC,CAAC;IAKrB,CAAC;aA/BwB,YAAO,GAAG,uBAAuB,AAA1B,CAA2B;IAGlD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,4BAA4B,CAAC,CAAC;IAClD,CAAC;IAuBkB,MAAM;QACvB,OAAO,OAAO,CAAC;IACjB,CAAC;;AAlBM;IADN,QAAQ,EAAE;4DACU;AAOd;IADN,QAAQ,EAAE;2DACY;AAOhB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6DACR","sourcesContent":["import { LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { registerComponent } from '../common/definitions/register.js';\n\n/**\n * Used for defining gradient stops in the igc-circular-progress.\n * For each `igc-circular-gradient` defined as `gradient` slot of `igc-circular-progress` element would be created a SVG stop element.\n * The values passed as `color`, `offset` and `opacity` would be set as\n * `stop-color`, `offset` and `stop-opacity` of the SVG element without further validations.\n *\n * @element igc-circular-gradient\n *\n */\nexport default class IgcCircularGradientComponent extends LitElement {\n  public static readonly tagName = 'igc-circular-gradient';\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcCircularGradientComponent);\n  }\n\n  /**\n   * Defines where the gradient stop is placed along the gradient vector\n   * @attr\n   */\n  @property()\n  public offset = '0%';\n\n  /**\n   * Defines the color of the gradient stop\n   * @attr\n   */\n  @property()\n  public color = 'black';\n\n  /**\n   * Defines the opacity of the gradient stop\n   * @attr\n   */\n  @property({ type: Number })\n  public opacity = 1;\n\n  protected override render() {\n    return nothing;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-circular-gradient': IgcCircularGradientComponent;\n  }\n}\n"]}
+{"version":3,"file":"circular-gradient.js","sourceRoot":"","sources":["../../../src/components/progress/circular-gradient.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAWvE,MAAM,CAAC,OAAO,OAAO,4BAA6B,SAAQ,UAAU;IAApE;;QAaS,WAAM,GAAG,IAAI,CAAC;QAOd,UAAK,GAAG,OAAO,CAAC;QAOhB,YAAO,GAAG,CAAC,CAAC;IAKrB,CAAC;aA/BwB,YAAO,GAAG,uBAAuB,AAA1B,CAA2B;IAGlD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,4BAA4B,CAAC,CAAC;IAClD,CAAC;IAuBkB,MAAM;QACvB,OAAO,OAAO,CAAC;IACjB,CAAC;;AAlBM;IADN,QAAQ,EAAE;4DACU;AAOd;IADN,QAAQ,EAAE;2DACY;AAOhB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6DACR","sourcesContent":["import { LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { registerComponent } from '#internals/definitions/register.js';\n\n/**\n * Used for defining gradient stops in the circular progress component.\n * For each circular gradient, defined as `gradient` slot of the circular progress, would be created a SVG stop element.\n * The values passed as `color`, `offset` and `opacity` would be set as\n * `stop-color`, `offset` and `stop-opacity` of the SVG element without further validations.\n *\n * @element igc-circular-gradient\n *\n */\nexport default class IgcCircularGradientComponent extends LitElement {\n  public static readonly tagName = 'igc-circular-gradient';\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcCircularGradientComponent);\n  }\n\n  /**\n   * Defines where the gradient stop is placed along the gradient vector\n   * @attr\n   */\n  @property()\n  public offset = '0%';\n\n  /**\n   * Defines the color of the gradient stop\n   * @attr\n   */\n  @property()\n  public color = 'black';\n\n  /**\n   * Defines the opacity of the gradient stop\n   * @attr\n   */\n  @property({ type: Number })\n  public opacity = 1;\n\n  protected override render() {\n    return nothing;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-circular-gradient': IgcCircularGradientComponent;\n  }\n}\n"]}