@eui/eds-react 22.0.0-alpha.12 → 22.0.0-alpha.13

package/eds-popover/eds-popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eds-popover.js","sourceRoot":"","sources":["../../src/eds-popover/eds-popover.tsx"],"names":[],"mappings":"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"}

package/eds-popover/index.d.ts

@@ -0,0 +1,5 @@
+export { EdsPopover } from './eds-popover.js';
+export type { EdsPopoverProps, EdsPopoverPosition, EdsPopoverSize, EdsPopoverTrigger, } from './eds-popover.js';
+export { useEdsConnectedPosition } from './use-eds-connected-position.js';
+export type { EdsConnectedPlacement, EdsConnectedAlign, EdsConnectedPositionResult, } from './use-eds-connected-position.js';
+//# sourceMappingURL=index.d.ts.map

package/eds-popover/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/eds-popover/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,YAAY,EACR,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,iBAAiB,GACpB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAC1E,YAAY,EACR,qBAAqB,EACrB,iBAAiB,EACjB,0BAA0B,GAC7B,MAAM,iCAAiC,CAAC"}

package/eds-popover/index.js

@@ -0,0 +1,3 @@
+export { EdsPopover } from './eds-popover.js';
+export { useEdsConnectedPosition } from './use-eds-connected-position.js';
+//# sourceMappingURL=index.js.map

package/eds-popover/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/eds-popover/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAQ9C,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC"}

package/eds-popover/use-eds-connected-position.d.ts

@@ -0,0 +1,90 @@
+/**
+ * `useEdsConnectedPosition` — pure-React reimplementation of the Angular CDK
+ * `FlexibleConnectedPositionStrategy` used by `eds-popover` (and reusable by the Batch C
+ * connected-overlay components: dropdown / autocomplete / multiselect).
+ *
+ * ## What the Angular source did (and this replaces)
+ *
+ * The Angular `eds-popover` opened a CDK overlay with
+ * `overlay.position().flexibleConnectedTo(origin).withPositions(preferredPositions)`, where the
+ * preferred positions were four `ConnectionPositionPair`s (`TOP`, `BOTTOM`, `LEFT`, `RIGHT` in
+ * `eds-popover-position.ts`) and the preferred order rotated by the `position` input:
+ *
+ * | `position` input | preferred order (first that fits wins) |
+ * |------------------|----------------------------------------|
+ * | `'top'`          | `[TOP, BOTTOM, LEFT, RIGHT]`            |
+ * | `'right'`        | `[RIGHT, LEFT, TOP, BOTTOM]`            |
+ * | `'left'`         | `[LEFT, RIGHT, TOP, BOTTOM]`            |
+ * | `'bottom'` (def) | `[BOTTOM, TOP, LEFT, RIGHT]`            |
+ *
+ * Each `ConnectionPositionPair` anchored an origin point to an overlay point (the CDK
+ * `originX/originY` ↔ `overlayX/overlayY` contract), with `withFlexibleDimensions(false)` and
+ * `withLockedPosition(true)`. The four EDS pairs were:
+ *
+ * - `TOP`    — origin `center/top`    ↔ overlay `center/bottom` (panel above, centered).
+ * - `BOTTOM` — origin `center/bottom` ↔ overlay `center/top`    (panel below, centered).
+ * - `LEFT`   — origin `start/center`  ↔ overlay `end/center`    (panel to the left, centered).
+ * - `RIGHT`  — origin `end/center`    ↔ overlay `start/center`  (panel to the right, centered).
+ *
+ * The active pair reported back a resolved `EdsConnectedPlacement` (`top|bottom|left|right`),
+ * which the popover fed to the arrow-positioning logic. This hook reproduces all of that with
+ * `getBoundingClientRect` math and a viewport-fit fallback loop — no CDK.
+ *
+ * ## Placement union (⛔ preserved verbatim from the source for downstream reuse)
+ *
+ * The Angular `EdsPopoverPosition` union is exactly `'top' | 'right' | 'bottom' | 'left'` — four
+ * side placements, always center-aligned along the cross axis (the CDK pairs used `center` for
+ * the cross axis on every side). This hook exposes that same four-value union as
+ * {@link EdsConnectedPlacement}. Batch C components that need start/center/end cross-axis
+ * alignments should extend this union and the anchor-point map rather than redefine the math.
+ *
+ * ## Behavior
+ *
+ * - Computes fixed (viewport) coordinates for the panel from the anchor's
+ *   `getBoundingClientRect()` and the panel's own measured size.
+ * - Tries the preferred placement first, then the source's fallback order; the first placement
+ *   that fully fits in the viewport wins. If none fit, the preferred placement is used (locked,
+ *   matching `withLockedPosition(true)` — the panel is not squeezed/resized, mirroring
+ *   `withFlexibleDimensions(false)`).
+ * - Recomputes on `scroll` (capture, catches ancestor scrolls) and `resize` while `open`,
+ *   mirroring the CDK reposition scroll strategy.
+ *
+ * @param anchorRef ref to the trigger/origin element the panel is positioned against.
+ * @param panelRef  ref to the floating panel element being positioned.
+ * @param placement preferred side placement (default `'bottom'`, matching the Angular default).
+ * @param open      whether the panel is currently open (positioning + listeners are active only when true).
+ * @param offset    gap in px between the anchor and the panel (default `0`, matching the CDK pairs' `0,0` offsets).
+ * @returns `{ style, placement }` — `style` is a `position: fixed` style object to spread on the
+ *   panel; `placement` is the resolved side actually used (for arrow orientation).
+ */
+export type EdsConnectedPlacement = 'top' | 'right' | 'bottom' | 'left';
+/**
+ * Cross-axis alignment of the panel against the anchor — an EXTENSION over the popover's
+ * center-only pairs, added for `eds-dropdown`.
+ *
+ * The Angular `eds-dropdown` did NOT center the panel: for `top`/`bottom` placements it aligned
+ * the panel's horizontal edge to the trigger (CDK `originX/overlayX` = `start`/`start`, or
+ * `end`/`end` when `isDropDownRightAligned`), and for `left`/`right` it aligned the vertical
+ * center (`overlayY: center`). The popover only ever used `center`, so this hook gained an
+ * optional `align` parameter to reproduce the dropdown's edge alignment without forking the math:
+ *
+ * - `'start'`  — top/bottom: panel left edge on the anchor left edge. left/right: panel top edge
+ *   on the anchor top edge.
+ * - `'center'` — the original popover behavior (cross-axis centered). This is the default, so the
+ *   popover's calls are unchanged.
+ * - `'end'`    — top/bottom: panel right edge on the anchor right edge. left/right: panel bottom
+ *   edge on the anchor bottom edge.
+ */
+export type EdsConnectedAlign = 'start' | 'center' | 'end';
+export interface EdsConnectedPositionResult {
+    /** `position: fixed` style (top/left in px) to spread onto the panel element. */
+    style: {
+        position: 'fixed';
+        top: number;
+        left: number;
+    };
+    /** The side placement actually resolved after the viewport-fit fallback. */
+    placement: EdsConnectedPlacement;
+}
+export declare function useEdsConnectedPosition(anchorRef: React.RefObject<HTMLElement | null>, panelRef: React.RefObject<HTMLElement | null>, placement?: EdsConnectedPlacement, open?: boolean, offset?: number, align?: EdsConnectedAlign): EdsConnectedPositionResult;
+//# sourceMappingURL=use-eds-connected-position.d.ts.map

package/eds-popover/use-eds-connected-position.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-eds-connected-position.d.ts","sourceRoot":"","sources":["../../src/eds-popover/use-eds-connected-position.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DG;AACH,MAAM,MAAM,qBAAqB,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAExE;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,iBAAiB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAE3D,MAAM,WAAW,0BAA0B;IACvC,iFAAiF;IACjF,KAAK,EAAE;QACH,QAAQ,EAAE,OAAO,CAAC;QAClB,GAAG,EAAE,MAAM,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,4EAA4E;IAC5E,SAAS,EAAE,qBAAqB,CAAC;CACpC;AAmFD,wBAAgB,uBAAuB,CACnC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAC7C,SAAS,GAAE,qBAAgC,EAC3C,IAAI,GAAE,OAAe,EACrB,MAAM,GAAE,MAAU,EAClB,KAAK,GAAE,iBAA4B,GACpC,0BAA0B,CA8D5B"}

package/eds-popover/use-eds-connected-position.js

@@ -0,0 +1,127 @@
+import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
+/** Fallback order per preferred placement — ported verbatim from the Angular `preferredPositions` computed. */
+const FALLBACK_ORDER = {
+    top: ['top', 'bottom', 'left', 'right'],
+    right: ['right', 'left', 'top', 'bottom'],
+    left: ['left', 'right', 'top', 'bottom'],
+    bottom: ['bottom', 'top', 'left', 'right'],
+};
+/**
+ * Compute the top-left viewport coordinates for a panel of size `panel` placed on `side` of the
+ * `anchor` rect, center-aligned on the cross axis with a `offset` gap. Mirrors the CDK
+ * origin↔overlay point pairs (TOP/BOTTOM/LEFT/RIGHT) from `eds-popover-position.ts`.
+ */
+function computeCoords(anchor, panel, side, offset, align = 'center') {
+    // Cross-axis alignment: for top/bottom the cross axis is horizontal (left); for left/right
+    // it is vertical (top). `center` reproduces the original popover behavior verbatim.
+    const alignHorizontal = () => {
+        switch (align) {
+            case 'start':
+                return anchor.left;
+            case 'end':
+                return anchor.right - panel.width;
+            default:
+                return anchor.left + anchor.width / 2 - panel.width / 2;
+        }
+    };
+    const alignVertical = () => {
+        switch (align) {
+            case 'start':
+                return anchor.top;
+            case 'end':
+                return anchor.bottom - panel.height;
+            default:
+                return anchor.top + anchor.height / 2 - panel.height / 2;
+        }
+    };
+    switch (side) {
+        case 'top':
+            // origin <align>/top ↔ overlay <align>/bottom
+            return {
+                top: anchor.top - panel.height - offset,
+                left: alignHorizontal(),
+            };
+        case 'bottom':
+            // origin <align>/bottom ↔ overlay <align>/top
+            return {
+                top: anchor.bottom + offset,
+                left: alignHorizontal(),
+            };
+        case 'left':
+            // origin start/<align> ↔ overlay end/<align>
+            return {
+                top: alignVertical(),
+                left: anchor.left - panel.width - offset,
+            };
+        case 'right':
+            // origin end/<align> ↔ overlay start/<align>
+            return {
+                top: alignVertical(),
+                left: anchor.right + offset,
+            };
+    }
+}
+/** Whether a panel placed at `coords` fully fits inside the current viewport. */
+function fitsInViewport(coords, panel) {
+    return (coords.top >= 0 &&
+        coords.left >= 0 &&
+        coords.top + panel.height <= window.innerHeight &&
+        coords.left + panel.width <= window.innerWidth);
+}
+export function useEdsConnectedPosition(anchorRef, panelRef, placement = 'bottom', open = false, offset = 0, align = 'center') {
+    const [result, setResult] = useState({
+        style: { position: 'fixed', top: 0, left: 0 },
+        placement,
+    });
+    // Keep the latest resolved placement so listeners don't re-subscribe on every recompute.
+    const resolvedRef = useRef(placement);
+    const recompute = useCallback(() => {
+        const anchor = anchorRef.current;
+        const panel = panelRef.current;
+        if (!anchor || !panel) {
+            return;
+        }
+        const anchorRect = anchor.getBoundingClientRect();
+        const panelSize = { width: panel.offsetWidth, height: panel.offsetHeight };
+        const order = FALLBACK_ORDER[placement];
+        let chosenSide = order[0];
+        let chosenCoords = computeCoords(anchorRect, panelSize, chosenSide, offset, align);
+        // First placement that fully fits wins; otherwise keep the preferred (locked) position.
+        for (const side of order) {
+            const coords = computeCoords(anchorRect, panelSize, side, offset, align);
+            if (fitsInViewport(coords, panelSize)) {
+                chosenSide = side;
+                chosenCoords = coords;
+                break;
+            }
+        }
+        resolvedRef.current = chosenSide;
+        setResult({
+            style: { position: 'fixed', top: chosenCoords.top, left: chosenCoords.left },
+            placement: chosenSide,
+        });
+    }, [anchorRef, panelRef, placement, offset, align]);
+    // Position after the panel renders (needs its measured size), and on open/placement change.
+    useLayoutEffect(() => {
+        if (!open) {
+            return;
+        }
+        recompute();
+    }, [open, recompute]);
+    // Recompute on scroll (capture → catches ancestor scrolls) and resize, matching the CDK
+    // reposition scroll strategy. Active only while open.
+    useEffect(() => {
+        if (!open) {
+            return;
+        }
+        const onScrollOrResize = () => recompute();
+        window.addEventListener('scroll', onScrollOrResize, true);
+        window.addEventListener('resize', onScrollOrResize);
+        return () => {
+            window.removeEventListener('scroll', onScrollOrResize, true);
+            window.removeEventListener('resize', onScrollOrResize);
+        };
+    }, [open, recompute]);
+    return result;
+}
+//# sourceMappingURL=use-eds-connected-position.js.map

package/eds-popover/use-eds-connected-position.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-eds-connected-position.js","sourceRoot":"","sources":["../../src/eds-popover/use-eds-connected-position.ts"],"names":[],"mappings":"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"}

package/eds-progress-bar/eds-progress-bar.css

@@ -0,0 +1,152 @@
+/*
+ * eds-progress-bar — pure React port of eds-progress-bar.scss.
+ *
+ * Angular emulated-encapsulation mapping (no shadow DOM here):
+ *   :host                        -> .eds-progress-bar (root class on the rendered element)
+ *   &.eds-progress-bar--modifier -> .eds-progress-bar.eds-progress-bar--modifier
+ *   nested .eds-progress-bar__x   -> .eds-progress-bar .eds-progress-bar__x (descendant)
+ * This is a class-based (pre-String-Props) source, so the BEM modifier classes are kept
+ * verbatim (guide rule 9) rather than translated to [data-*] selectors.
+ * The --eds-* tokens are unchanged; they cascade in from the .eui-21 context (required on
+ * an ancestor), exactly like the Angular component.
+ */
+
+.eds-progress-bar {
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    position: relative;
+    width: 100%;
+}
+
+.eds-progress-bar .eds-progress-bar__header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: var(--eds-sp-xs);
+}
+
+.eds-progress-bar .eds-progress-bar__header-label {
+    font: var(--eds-f-label-s-semi-bold);
+    color: var(--eds-c-foreground);
+}
+
+.eds-progress-bar .eds-progress-bar__header-status {
+    display: flex;
+    align-items: center;
+}
+
+.eds-progress-bar .eds-progress-bar__track {
+    background-color: var(--eds-c-surface-elevation-sunken);
+    border-radius: var(--eds-br-xs);
+    height: var(--eds-sp-2xs);
+    position: relative;
+    overflow: hidden;
+    width: 100%;
+}
+
+.eds-progress-bar .eds-progress-bar__indicator {
+    background-color: var(--eds-c-surface-primary);
+    border-radius: var(--eds-br-xs);
+    height: 100%;
+    transition: width 0.25s ease;
+}
+
+/* Size variants */
+.eds-progress-bar.eds-progress-bar--size-xs .eds-progress-bar__track {
+    height: var(--eds-sp-3xs);
+}
+
+.eds-progress-bar.eds-progress-bar--size-s .eds-progress-bar__track {
+    height: var(--eds-sp-2xs);
+}
+
+.eds-progress-bar.eds-progress-bar--size-m .eds-progress-bar__track {
+    height: var(--eds-sp-xs);
+}
+
+.eds-progress-bar.eds-progress-bar--size-l .eds-progress-bar__track {
+    height: var(--eds-sp-s);
+}
+
+/* Color variants */
+.eds-progress-bar.eds-progress-bar--success .eds-progress-bar__indicator {
+    background-color: var(--eds-c-surface-success);
+}
+
+.eds-progress-bar.eds-progress-bar--info .eds-progress-bar__indicator {
+    background-color: var(--eds-c-surface-info);
+}
+
+.eds-progress-bar.eds-progress-bar--warning .eds-progress-bar__indicator {
+    background-color: var(--eds-c-surface-warning);
+}
+
+.eds-progress-bar.eds-progress-bar--critical .eds-progress-bar__indicator {
+    background-color: var(--eds-c-surface-critical);
+}
+
+/* Indeterminate animation */
+.eds-progress-bar.eds-progress-bar--indeterminate .eds-progress-bar__indicator {
+    width: 100% !important;
+    background-color: transparent;
+    background-image: linear-gradient(
+        to right,
+        transparent 0%,
+        var(--eds-c-surface-primary) 30%,
+        var(--eds-c-surface-primary) 60%,
+        transparent 100%
+    );
+    background-size: 40% 100%;
+    background-repeat: no-repeat;
+    animation: eds-progress-indeterminate 1.5s infinite ease-in-out;
+}
+
+.eds-progress-bar.eds-progress-bar--indeterminate.eds-progress-bar--success .eds-progress-bar__indicator {
+    background-image: linear-gradient(
+        to right,
+        transparent 0%,
+        var(--eds-c-surface-success) 30%,
+        var(--eds-c-surface-success) 60%,
+        transparent 100%
+    );
+}
+
+.eds-progress-bar.eds-progress-bar--indeterminate.eds-progress-bar--info .eds-progress-bar__indicator {
+    background-image: linear-gradient(
+        to right,
+        transparent 0%,
+        var(--eds-c-surface-info) 30%,
+        var(--eds-c-surface-info) 60%,
+        transparent 100%
+    );
+}
+
+.eds-progress-bar.eds-progress-bar--indeterminate.eds-progress-bar--warning .eds-progress-bar__indicator {
+    background-image: linear-gradient(
+        to right,
+        transparent 0%,
+        var(--eds-c-surface-warning) 30%,
+        var(--eds-c-surface-warning) 60%,
+        transparent 100%
+    );
+}
+
+.eds-progress-bar.eds-progress-bar--indeterminate.eds-progress-bar--critical .eds-progress-bar__indicator {
+    background-image: linear-gradient(
+        to right,
+        transparent 0%,
+        var(--eds-c-surface-critical) 30%,
+        var(--eds-c-surface-critical) 60%,
+        transparent 100%
+    );
+}
+
+@keyframes eds-progress-indeterminate {
+    0% {
+        background-position: -40% 0;
+    }
+    100% {
+        background-position: 140% 0;
+    }
+}

package/eds-progress-bar/eds-progress-bar.d.ts

@@ -0,0 +1,69 @@
+import * as React from 'react';
+/**
+ * Local narrowed status (color-variant) union — the progress-bar's semantic color contract.
+ *
+ * The Angular `eds-progress-bar` drives its color variant through `EdsColorDirective`
+ * (`edsColorVariant` / boolean shorthands), but only these four values are styled by the
+ * SCSS (`--success | --info | --warning | --critical`). This prop reproduces that variant
+ * axis; the empty default matches the directive's `''` resolved value (no color class).
+ */
+export type EdsProgressBarStatus = '' | 'success' | 'info' | 'warning' | 'critical';
+/**
+ * Local narrowed size union — the progress-bar's size contract, ported from the SCSS
+ * (`--size-xs | --size-s | --size-m | --size-l`). Matches `EdsSizeDirective` values used here.
+ */
+export type EdsProgressBarSize = 'xs' | 's' | 'm' | 'l';
+export interface EdsProgressBarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'> {
+    /** Optional label displayed above the progress bar. @default '' */
+    label?: string;
+    /**
+     * Human-readable text alternative for the current value (maps to `aria-valuetext`).
+     * @default ''
+     */
+    valueText?: string;
+    /**
+     * Current progress value (0–100). Values outside the range are clamped automatically.
+     * @default 0
+     */
+    progress?: number;
+    /**
+     * When true, shows an indeterminate progress animation instead of a specific value.
+     * @default false
+     */
+    isIndeterminate?: boolean;
+    /**
+     * When true, displays a status icon based on the current status (color) variant.
+     * @default false
+     */
+    hasStatusIcon?: boolean;
+    /**
+     * Semantic color variant (`success | info | warning | critical`). Drives the BEM
+     * modifier class and the header status icon. @default ''
+     */
+    status?: EdsProgressBarStatus;
+    /**
+     * Size variant (`xs | s | m | l`). Falls back to `s` when unset. @default 's'
+     */
+    size?: EdsProgressBarSize;
+    /**
+     * Custom CSS color value for the progress indicator fill. When set, overrides the
+     * variant surface color (e.g. `'#4285f4'`, `'var(--eds-c-foreground-info)'`). @default ''
+     */
+    color?: string;
+    /** Accessible label for the progressbar (defaults to `label`). */
+    ariaLabel?: string | null;
+}
+/**
+ * `EdsProgressBar` — pure React port of the Angular `eds-progress-bar`.
+ *
+ * Horizontal progress indicator visualizing task completion or loading states. Supports
+ * determinate progress (percentage) and an indeterminate animation, an optional label and
+ * status icon, plus semantic color and size variants.
+ *
+ * This is a class-based (pre-String-Props) source, so the BEM modifier classes
+ * (`eds-progress-bar--size-*`, `eds-progress-bar--<status>`, `--indeterminate`,
+ * `--has-status-icon`) are reproduced verbatim on the root `className` (guide rule 9),
+ * not reflected as `data-*` attributes.
+ */
+export declare const EdsProgressBar: React.ForwardRefExoticComponent<EdsProgressBarProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=eds-progress-bar.d.ts.map

package/eds-progress-bar/eds-progress-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"eds-progress-bar.d.ts","sourceRoot":"","sources":["../../src/eds-progress-bar/eds-progress-bar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B;;;;;;;GAOG;AACH,MAAM,MAAM,oBAAoB,GAAG,EAAE,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,CAAC;AAEpF;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAExD,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC5F,mEAAmE;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B;;OAEG;IACH,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kEAAkE;IAClE,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC7B;AAKD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,cAAc,4FA4EzB,CAAC"}

package/eds-progress-bar/eds-progress-bar.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { EdsIconState } from '../eds-icon-state/eds-icon-state.js';
+/** Clamp a progress value into the 0–100 range (mirrors the Angular `progressTransform`). */
+const clampProgress = (value) => Math.max(0, Math.min(Number.isFinite(value) ? value : 0, 100));
+/**
+ * `EdsProgressBar` — pure React port of the Angular `eds-progress-bar`.
+ *
+ * Horizontal progress indicator visualizing task completion or loading states. Supports
+ * determinate progress (percentage) and an indeterminate animation, an optional label and
+ * status icon, plus semantic color and size variants.
+ *
+ * This is a class-based (pre-String-Props) source, so the BEM modifier classes
+ * (`eds-progress-bar--size-*`, `eds-progress-bar--<status>`, `--indeterminate`,
+ * `--has-status-icon`) are reproduced verbatim on the root `className` (guide rule 9),
+ * not reflected as `data-*` attributes.
+ */
+export const EdsProgressBar = React.forwardRef(function EdsProgressBar({ label = '', valueText = '', progress = 0, isIndeterminate = false, hasStatusIcon = false, status = '', size = 's', color = '', ariaLabel, className, ...rest }, ref) {
+    const clamped = clampProgress(progress);
+    // hostClasses() — reproduced verbatim from the Angular computed().
+    const sizeClass = size ? `eds-progress-bar--size-${size}` : '';
+    const colorClass = status ? `eds-progress-bar--${status}` : '';
+    const hostClasses = [
+        'eds-progress-bar',
+        sizeClass || 'eds-progress-bar--size-s',
+        colorClass,
+        isIndeterminate ? 'eds-progress-bar--indeterminate' : '',
+        hasStatusIcon ? 'eds-progress-bar--has-status-icon' : '',
+    ]
+        .join(' ')
+        .trim()
+        .replace(/\s+/g, ' ');
+    const rootClassName = className ? `${hostClasses} ${className}` : hostClasses;
+    // Header renders when there is a label or a status icon (mirrors the template @if).
+    const showHeader = !!label || hasStatusIcon;
+    // Angular: [color]="colorDirective.resolvedColor() || 'info'" — only the styled variants exist.
+    const iconStateColor = (status || 'info');
+    const resolvedAriaLabel = ariaLabel !== undefined ? ariaLabel : label || undefined;
+    return (_jsxs("div", { ref: ref, className: rootClassName, role: "progressbar", "data-e2e": "eds-progress-bar", "aria-valuenow": !isIndeterminate ? clamped : undefined, "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": resolvedAriaLabel ?? undefined, "aria-valuetext": valueText || undefined, ...rest, children: [showHeader && (_jsxs("div", { className: "eds-progress-bar__header", children: [label && _jsx("span", { className: "eds-progress-bar__header-label", children: label }), hasStatusIcon && (_jsx("span", { className: "eds-progress-bar__header-status", children: _jsx(EdsIconState, { color: iconStateColor, size: "s" }) }))] })), _jsx("div", { className: "eds-progress-bar__track", children: _jsx("div", { className: "eds-progress-bar__indicator", style: {
+                        width: !isIndeterminate ? `${clamped}%` : undefined,
+                        backgroundColor: color || undefined,
+                    } }) })] }));
+});
+//# sourceMappingURL=eds-progress-bar.js.map

package/eds-progress-bar/eds-progress-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eds-progress-bar.js","sourceRoot":"","sources":["../../src/eds-progress-bar/eds-progress-bar.tsx"],"names":[],"mappings":"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"}

package/eds-progress-bar/index.d.ts

@@ -0,0 +1,3 @@
+export { EdsProgressBar } from './eds-progress-bar.js';
+export type { EdsProgressBarProps, EdsProgressBarStatus, EdsProgressBarSize } from './eds-progress-bar.js';
+//# sourceMappingURL=index.d.ts.map

package/eds-progress-bar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/eds-progress-bar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,YAAY,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC"}

package/eds-progress-bar/index.js

@@ -0,0 +1,2 @@
+export { EdsProgressBar } from './eds-progress-bar.js';
+//# sourceMappingURL=index.js.map

package/eds-progress-bar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/eds-progress-bar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC"}