@elliemae/ds-progress-indicator 3.80.0-next.2 → 3.80.0-next.20

package/dist/cjs/DSProgressIndicator.js

@@ -39,49 +39,83 @@ var import_react = require("react");
 var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
 var import_ProgressCounter = __toESM(require("./ProgressCounter.js"));
 var import_ProgressBar = __toESM(require("./ProgressBar.js"));
-var import_classedComponents = require("./classedComponents.js");
+var import_useProgressIndicator = require("./config/useProgressIndicator.js");
 var import_styled = require("./styled.js");
-const DSProgressIndicator = ({
-  containerProps = {},
-  innerRef,
-  title = "",
-  counterRenderer,
-  now = 0,
-  min = 0,
-  max = 0,
-  disabled = false,
-  segments = [],
-  style = {}
-}) => {
+var import_utils = require("./utils.js");
+var import_react_desc_prop_types = require("./react-desc-prop-types.js");
+const DSProgressIndicator = (props) => {
+  const { propsWithDefault, globalProps, titleId } = (0, import_useProgressIndicator.useProgressIndicator)(props);
+  const { containerProps, innerRef, title, counterRenderer, now, min, max, disabled, segments, style } = propsWithDefault;
+  const { getOwnerProps, getOwnerPropsArguments } = (0, import_ds_props_helpers.useOwnerProps)(propsWithDefault);
+  const labelledBy = title ? titleId : void 0;
+  const valueRenderer = counterRenderer ?? import_utils.defaultCounterRenderer;
   const renderProgressBar = (0, import_react.useMemo)(
-    () => segments.length ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ProgressBar.default, { children: segments.map(
-      (segmentProps, i) => !(segmentProps.now < segmentProps.min) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ProgressBar.default.Segment, { ...segmentProps }, i)
-    ) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ProgressBar.default, { max, min, now }),
-    [segments, min, max, now]
+    () => segments.length ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_ProgressBar.default,
+      {
+        valueTextRenderer: valueRenderer,
+        getOwnerProps,
+        getOwnerPropsArguments,
+        children: segments.map(
+          (segmentProps, i) => !(segmentProps.now < segmentProps.min) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_ProgressBar.default.Segment,
+            {
+              ...segmentProps,
+              labelledBy,
+              valueTextRenderer: valueRenderer,
+              getOwnerProps,
+              getOwnerPropsArguments
+            },
+            i
+          )
+        )
+      }
+    ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_ProgressBar.default,
+      {
+        max,
+        min,
+        now,
+        labelledBy,
+        valueTextRenderer: valueRenderer,
+        getOwnerProps,
+        getOwnerPropsArguments
+      }
+    ),
+    [segments, min, max, now, labelledBy, valueRenderer, getOwnerProps, getOwnerPropsArguments]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_styled.StyledProgressIndicatorRoot,
+    {
+      ...globalProps,
+      innerRef,
+      "aria-disabled": disabled,
+      ...containerProps,
+      className: (0, import_styled.legacyRootClassName)(disabled, globalProps.className, containerProps?.className),
+      style,
+      getOwnerProps,
+      getOwnerPropsArguments,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.Title, { id: titleId, getOwnerProps, getOwnerPropsArguments, children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_ProgressCounter.default,
+          {
+            max,
+            min,
+            now,
+            renderer: valueRenderer,
+            getOwnerProps,
+            getOwnerPropsArguments
+          }
+        ),
+        renderProgressBar
+      ]
+    }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_classedComponents.Wrapper, { ref: innerRef, "aria-disabled": disabled, classProps: { disabled }, ...containerProps, style, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.Title, { children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ProgressCounter.default, { max, min, now, renderer: counterRenderer }),
-    renderProgressBar
-  ] });
-};
-const variants = ["default", "success", "warning", "info", "error"];
-const progressIndicatorProps = {
-  containerProps: import_ds_props_helpers.PropTypes.object.description("Set of Properties attached to the main container"),
-  innerRef: import_ds_props_helpers.PropTypes.object.description("ref to the components container"),
-  title: import_ds_props_helpers.PropTypes.string.description("components title"),
-  variant: import_ds_props_helpers.PropTypes.oneOf(variants).description("Progress intent variation"),
-  now: import_ds_props_helpers.PropTypes.number.description("Total current value"),
-  min: import_ds_props_helpers.PropTypes.number.description("min value"),
-  max: import_ds_props_helpers.PropTypes.number.description("max value"),
-  disabled: import_ds_props_helpers.PropTypes.bool.description("Whether the progress indicator disabled or not").defaultValue(false),
-  counterRenderer: import_ds_props_helpers.PropTypes.func.description("Render a custom counter"),
-  segments: import_ds_props_helpers.PropTypes.array.description("An array of multiple progress objects"),
-  style: import_ds_props_helpers.PropTypes.object.description("css inline style")
 };
 DSProgressIndicator.displayName = "DSProgressIndicator";
 const ProgressIndicatorWithSchema = (0, import_ds_props_helpers.describe)(DSProgressIndicator);
-ProgressIndicatorWithSchema.propTypes = progressIndicatorProps;
+ProgressIndicatorWithSchema.propTypes = import_react_desc_prop_types.DSProgressIndicatorPropTypesSchema;
 DSProgressIndicator.ProgressBar = import_ProgressBar.default;
 var DSProgressIndicator_default = DSProgressIndicator;
 //# sourceMappingURL=DSProgressIndicator.js.map

package/dist/cjs/DSProgressIndicator.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DSProgressIndicator.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react/no-array-index-key */\nimport React, { useMemo, type WeakValidationMap } from 'react';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\nimport Counter from './ProgressCounter.js';\nimport ProgressBar from './ProgressBar.js';\nimport { Wrapper } from './classedComponents.js';\nimport { Title } from './styled.js';\nimport type { DSProgressIndicatorT } from './react-desc-prop-types.js';\n\nconst DSProgressIndicator = ({\n  containerProps = {},\n  innerRef,\n  title = '',\n  counterRenderer,\n  now = 0,\n  min = 0,\n  max = 0,\n  disabled = false,\n  segments = [],\n  style = {},\n}: DSProgressIndicatorT.Props) => {\n  const renderProgressBar = useMemo(\n    () =>\n      segments.length ? (\n        <ProgressBar>\n          {segments.map(\n            (segmentProps, i) =>\n              !(segmentProps.now < segmentProps.min) && <ProgressBar.Segment key={i} {...segmentProps} />,\n          )}\n        </ProgressBar>\n      ) : (\n        <ProgressBar max={max} min={min} now={now} />\n      ),\n    [segments, min, max, now],\n  );\n\n  return (\n    <Wrapper ref={innerRef} aria-disabled={disabled} classProps={{ disabled }} {...containerProps} style={style}>\n      <Title>{title}</Title>\n      <Counter max={max} min={min} now={now} renderer={counterRenderer} />\n      {renderProgressBar}\n    </Wrapper>\n  );\n};\n\nconst variants = ['default', 'success', 'warning', 'info', 'error'];\n\nconst progressIndicatorProps = {\n  containerProps: PropTypes.object.description('Set of Properties attached to the main container'),\n  innerRef: PropTypes.object.description('ref to the components container'),\n  title: PropTypes.string.description('components title'),\n  variant: PropTypes.oneOf(variants).description('Progress intent variation'),\n  now: PropTypes.number.description('Total current value'),\n  min: PropTypes.number.description('min value'),\n  max: PropTypes.number.description('max value'),\n  disabled: PropTypes.bool.description('Whether the progress indicator disabled or not').defaultValue(false),\n  counterRenderer: PropTypes.func.description('Render a custom counter'),\n  segments: PropTypes.array.description('An array of multiple progress objects'),\n  style: PropTypes.object.description('css inline style'),\n} as WeakValidationMap<unknown>;\n\nDSProgressIndicator.displayName = 'DSProgressIndicator';\nconst ProgressIndicatorWithSchema = describe(DSProgressIndicator);\nProgressIndicatorWithSchema.propTypes = progressIndicatorProps;\n\nDSProgressIndicator.ProgressBar = ProgressBar;\n\nexport { DSProgressIndicator, ProgressIndicatorWithSchema };\nexport default DSProgressIndicator;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2BiC;AA1BxD,mBAAuD;AACvD,8BAAoC;AACpC,6BAAoB;AACpB,yBAAwB;AACxB,+BAAwB;AACxB,oBAAsB;AAGtB,MAAM,sBAAsB,CAAC;AAAA,EAC3B,iBAAiB,CAAC;AAAA,EAClB;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,WAAW;AAAA,EACX,WAAW,CAAC;AAAA,EACZ,QAAQ,CAAC;AACX,MAAkC;AAChC,QAAM,wBAAoB;AAAA,IACxB,MACE,SAAS,SACP,4CAAC,mBAAAA,SAAA,EACE,mBAAS;AAAA,MACR,CAAC,cAAc,MACb,EAAE,aAAa,MAAM,aAAa,QAAQ,4CAAC,mBAAAA,QAAY,SAAZ,EAA6B,GAAG,gBAAP,CAAqB;AAAA,IAC7F,GACF,IAEA,4CAAC,mBAAAA,SAAA,EAAY,KAAU,KAAU,KAAU;AAAA,IAE/C,CAAC,UAAU,KAAK,KAAK,GAAG;AAAA,EAC1B;AAEA,SACE,6CAAC,oCAAQ,KAAK,UAAU,iBAAe,UAAU,YAAY,EAAE,SAAS,GAAI,GAAG,gBAAgB,OAC7F;AAAA,gDAAC,uBAAO,iBAAM;AAAA,IACd,4CAAC,uBAAAC,SAAA,EAAQ,KAAU,KAAU,KAAU,UAAU,iBAAiB;AAAA,IACjE;AAAA,KACH;AAEJ;AAEA,MAAM,WAAW,CAAC,WAAW,WAAW,WAAW,QAAQ,OAAO;AAElE,MAAM,yBAAyB;AAAA,EAC7B,gBAAgB,kCAAU,OAAO,YAAY,kDAAkD;AAAA,EAC/F,UAAU,kCAAU,OAAO,YAAY,iCAAiC;AAAA,EACxE,OAAO,kCAAU,OAAO,YAAY,kBAAkB;AAAA,EACtD,SAAS,kCAAU,MAAM,QAAQ,EAAE,YAAY,2BAA2B;AAAA,EAC1E,KAAK,kCAAU,OAAO,YAAY,qBAAqB;AAAA,EACvD,KAAK,kCAAU,OAAO,YAAY,WAAW;AAAA,EAC7C,KAAK,kCAAU,OAAO,YAAY,WAAW;AAAA,EAC7C,UAAU,kCAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,KAAK;AAAA,EACzG,iBAAiB,kCAAU,KAAK,YAAY,yBAAyB;AAAA,EACrE,UAAU,kCAAU,MAAM,YAAY,uCAAuC;AAAA,EAC7E,OAAO,kCAAU,OAAO,YAAY,kBAAkB;AACxD;AAEA,oBAAoB,cAAc;AAClC,MAAM,kCAA8B,kCAAS,mBAAmB;AAChE,4BAA4B,YAAY;AAExC,oBAAoB,cAAc,mBAAAD;AAGlC,IAAO,8BAAQ;",
+  "sourcesContent": ["/* eslint-disable react/no-array-index-key */\nimport React, { useMemo } from 'react';\nimport { describe, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport Counter from './ProgressCounter.js';\nimport ProgressBar from './ProgressBar.js';\nimport { useProgressIndicator } from './config/useProgressIndicator.js';\nimport { legacyRootClassName, StyledProgressIndicatorRoot, Title } from './styled.js';\nimport { defaultCounterRenderer } from './utils.js';\nimport { type DSProgressIndicatorT, DSProgressIndicatorPropTypesSchema } from './react-desc-prop-types.js';\n\nconst DSProgressIndicator = (props: DSProgressIndicatorT.Props) => {\n  const { propsWithDefault, globalProps, titleId } = useProgressIndicator(props);\n  const { containerProps, innerRef, title, counterRenderer, now, min, max, disabled, segments, style } =\n    propsWithDefault;\n\n  const { getOwnerProps, getOwnerPropsArguments } = useOwnerProps<DSProgressIndicatorT.Props>(propsWithDefault);\n\n  // A titleless progress indicator has nothing to be labelled by, so the fallback aria-label is kept instead.\n  const labelledBy = title ? titleId : undefined;\n  // Resolved once so the visible counter and every progressbar's aria-valuetext share the exact same text.\n  const valueRenderer = counterRenderer ?? defaultCounterRenderer;\n\n  const renderProgressBar = useMemo(\n    () =>\n      segments.length ? (\n        <ProgressBar\n          valueTextRenderer={valueRenderer}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n        >\n          {segments.map(\n            (segmentProps, i) =>\n              !(segmentProps.now < segmentProps.min) && (\n                <ProgressBar.Segment\n                  key={i}\n                  {...segmentProps}\n                  labelledBy={labelledBy}\n                  valueTextRenderer={valueRenderer}\n                  getOwnerProps={getOwnerProps}\n                  getOwnerPropsArguments={getOwnerPropsArguments}\n                />\n              ),\n          )}\n        </ProgressBar>\n      ) : (\n        <ProgressBar\n          max={max}\n          min={min}\n          now={now}\n          labelledBy={labelledBy}\n          valueTextRenderer={valueRenderer}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n        />\n      ),\n    [segments, min, max, now, labelledBy, valueRenderer, getOwnerProps, getOwnerPropsArguments],\n  );\n\n  return (\n    <StyledProgressIndicatorRoot\n      {...globalProps}\n      // the public innerRef contract is MutableRefObject<unknown>; the styled root is a div. Casting here\n      // keeps the published prop type unchanged rather than narrowing it on consumers.\n      innerRef={innerRef as React.RefObject<HTMLDivElement>}\n      aria-disabled={disabled}\n      {...containerProps}\n      // after the spreads on purpose: aggregatedClasses used to append a consumer className to the legacy\n      // contract rather than let it replace them, and that ordering is part of the compatibility surface\n      className={legacyRootClassName(disabled, globalProps.className, containerProps?.className)}\n      style={style}\n      getOwnerProps={getOwnerProps}\n      getOwnerPropsArguments={getOwnerPropsArguments}\n    >\n      <Title id={titleId} getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n        {title}\n      </Title>\n      <Counter\n        max={max}\n        min={min}\n        now={now}\n        renderer={valueRenderer}\n        getOwnerProps={getOwnerProps}\n        getOwnerPropsArguments={getOwnerPropsArguments}\n      />\n      {renderProgressBar}\n    </StyledProgressIndicatorRoot>\n  );\n};\n\nDSProgressIndicator.displayName = 'DSProgressIndicator';\nconst ProgressIndicatorWithSchema = describe(DSProgressIndicator);\nProgressIndicatorWithSchema.propTypes = DSProgressIndicatorPropTypesSchema;\n\nDSProgressIndicator.ProgressBar = ProgressBar;\n\nexport { DSProgressIndicator, ProgressIndicatorWithSchema };\nexport default DSProgressIndicator;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiCP;AAhChB,mBAA+B;AAC/B,8BAAwC;AACxC,6BAAoB;AACpB,yBAAwB;AACxB,kCAAqC;AACrC,oBAAwE;AACxE,mBAAuC;AACvC,mCAA8E;AAE9E,MAAM,sBAAsB,CAAC,UAAsC;AACjE,QAAM,EAAE,kBAAkB,aAAa,QAAQ,QAAI,kDAAqB,KAAK;AAC7E,QAAM,EAAE,gBAAgB,UAAU,OAAO,iBAAiB,KAAK,KAAK,KAAK,UAAU,UAAU,MAAM,IACjG;AAEF,QAAM,EAAE,eAAe,uBAAuB,QAAI,uCAA0C,gBAAgB;AAG5G,QAAM,aAAa,QAAQ,UAAU;AAErC,QAAM,gBAAgB,mBAAmB;AAEzC,QAAM,wBAAoB;AAAA,IACxB,MACE,SAAS,SACP;AAAA,MAAC,mBAAAA;AAAA,MAAA;AAAA,QACC,mBAAmB;AAAA,QACnB;AAAA,QACA;AAAA,QAEC,mBAAS;AAAA,UACR,CAAC,cAAc,MACb,EAAE,aAAa,MAAM,aAAa,QAChC;AAAA,YAAC,mBAAAA,QAAY;AAAA,YAAZ;AAAA,cAEE,GAAG;AAAA,cACJ;AAAA,cACA,mBAAmB;AAAA,cACnB;AAAA,cACA;AAAA;AAAA,YALK;AAAA,UAMP;AAAA,QAEN;AAAA;AAAA,IACF,IAEA;AAAA,MAAC,mBAAAA;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,mBAAmB;AAAA,QACnB;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IAEJ,CAAC,UAAU,KAAK,KAAK,KAAK,YAAY,eAAe,eAAe,sBAAsB;AAAA,EAC5F;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MAGJ;AAAA,MACA,iBAAe;AAAA,MACd,GAAG;AAAA,MAGJ,eAAW,mCAAoB,UAAU,YAAY,WAAW,gBAAgB,SAAS;AAAA,MACzF;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,oDAAC,uBAAM,IAAI,SAAS,eAA8B,wBAC/C,iBACH;AAAA,QACA;AAAA,UAAC,uBAAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,UAAU;AAAA,YACV;AAAA,YACA;AAAA;AAAA,QACF;AAAA,QACC;AAAA;AAAA;AAAA,EACH;AAEJ;AAEA,oBAAoB,cAAc;AAClC,MAAM,kCAA8B,kCAAS,mBAAmB;AAChE,4BAA4B,YAAY;AAExC,oBAAoB,cAAc,mBAAAD;AAGlC,IAAO,8BAAQ;",
   "names": ["ProgressBar", "Counter"]
 }

package/dist/cjs/ProgressBar.js

@@ -33,33 +33,85 @@ __export(ProgressBar_exports, {
 module.exports = __toCommonJS(ProgressBar_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_classedComponents = require("./classedComponents.js");
+var import_styled = require("./styled.js");
 var import_utils = require("./utils.js");
-function useProgressTrait({ now = 0, min = 0, max = 0 }) {
+function useProgressTrait({
+  now = 0,
+  min = 0,
+  max = 0,
+  labelledBy,
+  label,
+  valueTextRenderer
+}) {
+  const rangeIsValid = (0, import_utils.hasValidRange)(min, max);
   const percentage = (0, import_utils.getPercentage)(now, min, max);
+  const valueText = valueTextRenderer?.({ now, min, max });
+  const hasTextualValue = typeof valueText === "string" || typeof valueText === "number";
   return {
     role: "progressbar",
-    "aria-valuenow": now,
-    "aria-valuemin": min,
-    "aria-valuemax": max,
-    "aria-label": "progress bar",
+    // An invalid range — `max` omitted, or 0 while data loads — is an indeterminate progress, and WAI-ARIA says an
+    // indeterminate progressbar omits aria-valuenow. AT then announces "busy" instead of the invalid "0 of 0"
+    // range this used to emit. When the range is valid, aria-valuenow is clamped so it never leaves [min, max].
+    ...rangeIsValid ? { "aria-valuenow": (0, import_utils.clamp)(now, min, max), "aria-valuemin": min, "aria-valuemax": max } : {},
+    // Mirrors the visible counter so screen readers hear the same formatted value sighted users see, not just
+    // the raw number. Uses the same renderer as the counter, applied to this bar's own values — for a segment
+    // that is the segment's range, which is what its aria-valuenow describes.
+    ...rangeIsValid && hasTextualValue ? { "aria-valuetext": String(valueText) } : {},
+    // Precedence: a per-segment label wins, because it is the only thing that tells two segments apart
+    // once they share the indicator title. Then the visible title. `aria-label` is the last-resort fallback
+    // for a titleless indicator, which would otherwise have no accessible name at all.
+    ...label ? { "aria-label": label } : {},
+    ...!label && labelledBy ? { "aria-labelledby": labelledBy } : {},
+    ...!label && !labelledBy ? { "aria-label": "progress bar" } : {},
     style: {
       width: `${percentage}%`
     }
   };
 }
 const Progress = (props) => {
-  const { variant = "default" } = props;
+  const { variant = "default", getOwnerProps, getOwnerPropsArguments } = props;
   const progressTraitProps = useProgressTrait(props);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_classedComponents.ProgressBarProgress, { classProps: { variant }, ...progressTraitProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_styled.StyledProgress,
+    {
+      className: (0, import_styled.legacyProgressClassName)(variant),
+      getOwnerProps,
+      getOwnerPropsArguments,
+      ...progressTraitProps
+    }
+  );
 };
 const ProgressBar = ({
   variant = "default",
   now = void 0,
   min = void 0,
   max = void 0,
-  children: progressSegments
-}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_classedComponents.ProgressBarStatusBar, { children: progressSegments || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Progress, { max, min, now, variant }) });
+  labelledBy = void 0,
+  valueTextRenderer = void 0,
+  children: progressSegments,
+  getOwnerProps,
+  getOwnerPropsArguments
+}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  import_styled.StyledProgressBar,
+  {
+    className: (0, import_styled.legacyBarClassName)(),
+    getOwnerProps,
+    getOwnerPropsArguments,
+    children: progressSegments || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      Progress,
+      {
+        max,
+        min,
+        now,
+        variant,
+        labelledBy,
+        valueTextRenderer,
+        getOwnerProps,
+        getOwnerPropsArguments
+      }
+    )
+  }
+);
 ProgressBar.Segment = Progress;
 var ProgressBar_default = ProgressBar;
 //# sourceMappingURL=ProgressBar.js.map

package/dist/cjs/ProgressBar.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/ProgressBar.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { ProgressBarProgress, ProgressBarStatusBar } from './classedComponents.js';\nimport { getPercentage } from './utils.js';\n\nfunction useProgressTrait({ now = 0, min = 0, max = 0 }: { now?: number; min?: number; max?: number }) {\n  const percentage = getPercentage(now, min, max);\n  return {\n    role: 'progressbar',\n    'aria-valuenow': now,\n    'aria-valuemin': min,\n    'aria-valuemax': max,\n    'aria-label': 'progress bar',\n    style: {\n      width: `${percentage}%`,\n    },\n  };\n}\n\nconst Progress = (props: { variant: string; now?: number; min?: number; max?: number }) => {\n  const { variant = 'default' } = props;\n\n  const progressTraitProps = useProgressTrait(props);\n\n  return <ProgressBarProgress classProps={{ variant }} {...progressTraitProps} />;\n};\n\nconst ProgressBar = ({\n  variant = 'default',\n  now = undefined,\n  min = undefined,\n  max = undefined,\n  children: progressSegments,\n}: {\n  variant?: string;\n  now?: number;\n  min?: number;\n  max?: number;\n  children?: React.ReactNode;\n}) => (\n  <ProgressBarStatusBar>\n    {progressSegments || <Progress max={max} min={min} now={now} variant={variant} />}\n  </ProgressBarStatusBar>\n);\n\nProgressBar.Segment = Progress;\n\nexport default ProgressBar;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBd;AAtBT,+BAA0D;AAC1D,mBAA8B;AAE9B,SAAS,iBAAiB,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,GAAiD;AACrG,QAAM,iBAAa,4BAAc,KAAK,KAAK,GAAG;AAC9C,SAAO;AAAA,IACL,MAAM;AAAA,IACN,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd,OAAO;AAAA,MACL,OAAO,GAAG,UAAU;AAAA,IACtB;AAAA,EACF;AACF;AAEA,MAAM,WAAW,CAAC,UAAyE;AACzF,QAAM,EAAE,UAAU,UAAU,IAAI;AAEhC,QAAM,qBAAqB,iBAAiB,KAAK;AAEjD,SAAO,4CAAC,gDAAoB,YAAY,EAAE,QAAQ,GAAI,GAAG,oBAAoB;AAC/E;AAEA,MAAM,cAAc,CAAC;AAAA,EACnB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,UAAU;AACZ,MAOE,4CAAC,iDACE,8BAAoB,4CAAC,YAAS,KAAU,KAAU,KAAU,SAAkB,GACjF;AAGF,YAAY,UAAU;AAEtB,IAAO,sBAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport { legacyBarClassName, legacyProgressClassName, StyledProgress, StyledProgressBar } from './styled.js';\nimport { clamp, getPercentage, hasValidRange } from './utils.js';\nimport type { DSProgressIndicatorT } from './react-desc-prop-types.js';\n\ntype OwnerPropsPassthrough = {\n  getOwnerProps?: () => object;\n  getOwnerPropsArguments?: () => object;\n};\n\nfunction useProgressTrait({\n  now = 0,\n  min = 0,\n  max = 0,\n  labelledBy,\n  label,\n  valueTextRenderer,\n}: {\n  now?: number;\n  min?: number;\n  max?: number;\n  labelledBy?: string;\n  label?: string;\n  valueTextRenderer?: DSProgressIndicatorT.DefaultRendererT;\n}) {\n  const rangeIsValid = hasValidRange(min, max);\n  const percentage = getPercentage(now, min, max);\n  // Only text is a valid aria-valuetext. The renderer type says string, but a JS consumer can return JSX for\n  // a styled counter \u2014 React would then set the attribute to \"[object Object]\", which is worse than omitting\n  // it and letting AT fall back to the numeric range, exactly as it did before aria-valuetext existed.\n  const valueText = valueTextRenderer?.({ now, min, max }) as unknown;\n  const hasTextualValue = typeof valueText === 'string' || typeof valueText === 'number';\n  return {\n    role: 'progressbar',\n    // An invalid range \u2014 `max` omitted, or 0 while data loads \u2014 is an indeterminate progress, and WAI-ARIA says an\n    // indeterminate progressbar omits aria-valuenow. AT then announces \"busy\" instead of the invalid \"0 of 0\"\n    // range this used to emit. When the range is valid, aria-valuenow is clamped so it never leaves [min, max].\n    ...(rangeIsValid ? { 'aria-valuenow': clamp(now, min, max), 'aria-valuemin': min, 'aria-valuemax': max } : {}),\n    // Mirrors the visible counter so screen readers hear the same formatted value sighted users see, not just\n    // the raw number. Uses the same renderer as the counter, applied to this bar's own values \u2014 for a segment\n    // that is the segment's range, which is what its aria-valuenow describes.\n    ...(rangeIsValid && hasTextualValue ? { 'aria-valuetext': String(valueText) } : {}),\n    // Precedence: a per-segment label wins, because it is the only thing that tells two segments apart\n    // once they share the indicator title. Then the visible title. `aria-label` is the last-resort fallback\n    // for a titleless indicator, which would otherwise have no accessible name at all.\n    ...(label ? { 'aria-label': label } : {}),\n    ...(!label && labelledBy ? { 'aria-labelledby': labelledBy } : {}),\n    ...(!label && !labelledBy ? { 'aria-label': 'progress bar' } : {}),\n    style: {\n      width: `${percentage}%`,\n    },\n  };\n}\n\nconst Progress = (\n  props: {\n    variant: string;\n    now?: number;\n    min?: number;\n    max?: number;\n    labelledBy?: string;\n    label?: string;\n    valueTextRenderer?: DSProgressIndicatorT.DefaultRendererT;\n  } & OwnerPropsPassthrough,\n) => {\n  const { variant = 'default', getOwnerProps, getOwnerPropsArguments } = props;\n\n  const progressTraitProps = useProgressTrait(props);\n\n  return (\n    <StyledProgress\n      className={legacyProgressClassName(variant)}\n      getOwnerProps={getOwnerProps}\n      getOwnerPropsArguments={getOwnerPropsArguments}\n      {...progressTraitProps}\n    />\n  );\n};\n\nconst ProgressBar = ({\n  variant = 'default',\n  now = undefined,\n  min = undefined,\n  max = undefined,\n  labelledBy = undefined,\n  valueTextRenderer = undefined,\n  children: progressSegments,\n  getOwnerProps,\n  getOwnerPropsArguments,\n}: {\n  variant?: string;\n  now?: number;\n  min?: number;\n  max?: number;\n  labelledBy?: string;\n  children?: React.ReactNode;\n  valueTextRenderer?: DSProgressIndicatorT.DefaultRendererT;\n} & OwnerPropsPassthrough) => (\n  <StyledProgressBar\n    className={legacyBarClassName()}\n    getOwnerProps={getOwnerProps}\n    getOwnerPropsArguments={getOwnerPropsArguments}\n  >\n    {progressSegments || (\n      <Progress\n        max={max}\n        min={min}\n        now={now}\n        variant={variant}\n        labelledBy={labelledBy}\n        valueTextRenderer={valueTextRenderer}\n        getOwnerProps={getOwnerProps}\n        getOwnerPropsArguments={getOwnerPropsArguments}\n      />\n    )}\n  </StyledProgressBar>\n);\n\nProgressBar.Segment = Progress;\n\nexport default ProgressBar;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsEnB;AArEJ,oBAA+F;AAC/F,mBAAoD;AAQpD,SAAS,iBAAiB;AAAA,EACxB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN;AAAA,EACA;AAAA,EACA;AACF,GAOG;AACD,QAAM,mBAAe,4BAAc,KAAK,GAAG;AAC3C,QAAM,iBAAa,4BAAc,KAAK,KAAK,GAAG;AAI9C,QAAM,YAAY,oBAAoB,EAAE,KAAK,KAAK,IAAI,CAAC;AACvD,QAAM,kBAAkB,OAAO,cAAc,YAAY,OAAO,cAAc;AAC9E,SAAO;AAAA,IACL,MAAM;AAAA;AAAA;AAAA;AAAA,IAIN,GAAI,eAAe,EAAE,qBAAiB,oBAAM,KAAK,KAAK,GAAG,GAAG,iBAAiB,KAAK,iBAAiB,IAAI,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA,IAI5G,GAAI,gBAAgB,kBAAkB,EAAE,kBAAkB,OAAO,SAAS,EAAE,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA,IAIjF,GAAI,QAAQ,EAAE,cAAc,MAAM,IAAI,CAAC;AAAA,IACvC,GAAI,CAAC,SAAS,aAAa,EAAE,mBAAmB,WAAW,IAAI,CAAC;AAAA,IAChE,GAAI,CAAC,SAAS,CAAC,aAAa,EAAE,cAAc,eAAe,IAAI,CAAC;AAAA,IAChE,OAAO;AAAA,MACL,OAAO,GAAG,UAAU;AAAA,IACtB;AAAA,EACF;AACF;AAEA,MAAM,WAAW,CACf,UASG;AACH,QAAM,EAAE,UAAU,WAAW,eAAe,uBAAuB,IAAI;AAEvE,QAAM,qBAAqB,iBAAiB,KAAK;AAEjD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,uCAAwB,OAAO;AAAA,MAC1C;AAAA,MACA;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,MAAM,cAAc,CAAC;AAAA,EACnB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,aAAa;AAAA,EACb,oBAAoB;AAAA,EACpB,UAAU;AAAA,EACV;AAAA,EACA;AACF,MASE;AAAA,EAAC;AAAA;AAAA,IACC,eAAW,kCAAmB;AAAA,IAC9B;AAAA,IACA;AAAA,IAEC,8BACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF;AAAA;AAEJ;AAGF,YAAY,UAAU;AAEtB,IAAO,sBAAQ;",
   "names": []
 }

package/dist/cjs/ProgressCounter.js

@@ -34,21 +34,30 @@ module.exports = __toCommonJS(ProgressCounter_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_utils = require("./utils.js");
-var import_classedComponents = require("./classedComponents.js");
-const defaultRenderer = ({ now, max, min }) => `${min || now} of ${max}`;
+var import_styled = require("./styled.js");
 const percentageRenderer = ({ now, max, min }) => {
   const percentage = (0, import_utils.getPercentage)(now, min, max);
   return `${percentage}%`;
 };
 const renderers = {
-  default: defaultRenderer,
+  default: import_utils.defaultCounterRenderer,
   percentage: percentageRenderer
 };
 const ProgressCounter = ({
-  now,
-  max,
-  min,
-  renderer = renderers.default
-}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_classedComponents.ProgressIndicatorCounter, { children: renderer({ now, max, min }) });
+  now = 0,
+  max = 0,
+  min = 0,
+  renderer = renderers.default,
+  getOwnerProps,
+  getOwnerPropsArguments
+}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  import_styled.StyledProgressIndicatorCounter,
+  {
+    className: (0, import_styled.legacyCounterClassName)(),
+    getOwnerProps,
+    getOwnerPropsArguments,
+    children: renderer({ now, max, min })
+  }
+);
 var ProgressCounter_default = ProgressCounter;
 //# sourceMappingURL=ProgressCounter.js.map

package/dist/cjs/ProgressCounter.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/ProgressCounter.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { getPercentage } from './utils.js';\nimport { ProgressIndicatorCounter } from './classedComponents.js';\nimport type { DSProgressIndicatorT } from './react-desc-prop-types.js';\n\nconst defaultRenderer: DSProgressIndicatorT.DefaultRendererT = ({ now, max, min }) => `${min || now} of ${max}`;\n\nconst percentageRenderer = ({ now, max, min }: DSProgressIndicatorT.PercentageT) => {\n  const percentage = getPercentage(now, min, max);\n  return `${percentage}%`;\n};\n\nconst renderers = {\n  default: defaultRenderer,\n  percentage: percentageRenderer,\n};\n\nconst ProgressCounter = ({\n  now,\n  max,\n  min,\n  renderer = renderers.default,\n}: DSProgressIndicatorT.PercentageT & { renderer?: DSProgressIndicatorT.DefaultRendererT }) => (\n  <ProgressIndicatorCounter>{renderer({ now, max, min })}</ProgressIndicatorCounter>\n);\n\nexport default ProgressCounter;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBrB;AAtBF,mBAA8B;AAC9B,+BAAyC;AAGzC,MAAM,kBAAyD,CAAC,EAAE,KAAK,KAAK,IAAI,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG;AAE7G,MAAM,qBAAqB,CAAC,EAAE,KAAK,KAAK,IAAI,MAAwC;AAClF,QAAM,iBAAa,4BAAc,KAAK,KAAK,GAAG;AAC9C,SAAO,GAAG,UAAU;AACtB;AAEA,MAAM,YAAY;AAAA,EAChB,SAAS;AAAA,EACT,YAAY;AACd;AAEA,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW,UAAU;AACvB,MACE,4CAAC,qDAA0B,mBAAS,EAAE,KAAK,KAAK,IAAI,CAAC,GAAE;AAGzD,IAAO,0BAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport { defaultCounterRenderer, getPercentage } from './utils.js';\nimport { legacyCounterClassName, StyledProgressIndicatorCounter } from './styled.js';\nimport type { DSProgressIndicatorT } from './react-desc-prop-types.js';\n\nconst percentageRenderer = ({ now, max, min }: DSProgressIndicatorT.PercentageT) => {\n  const percentage = getPercentage(now, min, max);\n  return `${percentage}%`;\n};\n\nconst renderers = {\n  default: defaultCounterRenderer,\n  percentage: percentageRenderer,\n};\n\nconst ProgressCounter = ({\n  now = 0,\n  max = 0,\n  min = 0,\n  renderer = renderers.default,\n  getOwnerProps,\n  getOwnerPropsArguments,\n}: Partial<DSProgressIndicatorT.PercentageT> & {\n  renderer?: DSProgressIndicatorT.DefaultRendererT;\n  getOwnerProps?: () => object;\n  getOwnerPropsArguments?: () => object;\n}) => (\n  <StyledProgressIndicatorCounter\n    className={legacyCounterClassName()}\n    getOwnerProps={getOwnerProps}\n    getOwnerPropsArguments={getOwnerPropsArguments}\n  >\n    {renderer({ now, max, min })}\n  </StyledProgressIndicatorCounter>\n);\n\nexport default ProgressCounter;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2BrB;AA1BF,mBAAsD;AACtD,oBAAuE;AAGvE,MAAM,qBAAqB,CAAC,EAAE,KAAK,KAAK,IAAI,MAAwC;AAClF,QAAM,iBAAa,4BAAc,KAAK,KAAK,GAAG;AAC9C,SAAO,GAAG,UAAU;AACtB;AAEA,MAAM,YAAY;AAAA,EAChB,SAAS;AAAA,EACT,YAAY;AACd;AAEA,MAAM,kBAAkB,CAAC;AAAA,EACvB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,WAAW,UAAU;AAAA,EACrB;AAAA,EACA;AACF,MAKE;AAAA,EAAC;AAAA;AAAA,IACC,eAAW,sCAAuB;AAAA,IAClC;AAAA,IACA;AAAA,IAEC,mBAAS,EAAE,KAAK,KAAK,IAAI,CAAC;AAAA;AAC7B;AAGF,IAAO,0BAAQ;",
   "names": []
 }

package/dist/cjs/config/useProgressIndicator.js

@@ -0,0 +1,67 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useProgressIndicator_exports = {};
+__export(useProgressIndicator_exports, {
+  useProgressIndicator: () => useProgressIndicator
+});
+module.exports = __toCommonJS(useProgressIndicator_exports);
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_react_desc_prop_types = require("../react-desc-prop-types.js");
+var import_useValidateProps = require("./useValidateProps.js");
+var import_utils = require("../utils.js");
+var import_constants = require("../constants/index.js");
+const useProgressIndicator = (propsFromUser) => {
+  const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(
+    propsFromUser,
+    import_react_desc_prop_types.defaultProps
+  );
+  (0, import_useValidateProps.useValidateProps)(propsWithDefault, import_react_desc_prop_types.DSProgressIndicatorPropTypes);
+  const { title, style, min, max, disabled, ...globalPropsWithoutConsumedKeywords } = propsWithDefault;
+  const globalProps = (0, import_ds_props_helpers.useGetGlobalAttributes)(globalPropsWithoutConsumedKeywords);
+  const reactId = import_react.default.useId();
+  const titleId = `ds-progress-indicator-title-${reactId}`;
+  import_react.default.useEffect(() => {
+    if (!(0, import_utils.hasValidRange)(min, max)) {
+      console.warn(
+        `Warning: ${import_constants.DSProgressIndicatorName}:: "max" must be a finite number greater than "min" (received min=${String(min)}, max=${String(max)}). A determinate progress cannot be computed, so the progressbar is rendered as indeterminate.`
+      );
+    }
+  }, [min, max]);
+  return import_react.default.useMemo(
+    () => ({
+      propsWithDefault,
+      globalProps,
+      titleId
+    }),
+    [propsWithDefault, globalProps, titleId]
+  );
+};
+//# sourceMappingURL=useProgressIndicator.js.map

package/dist/cjs/config/useProgressIndicator.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/config/useProgressIndicator.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { useGetGlobalAttributes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport type { ValidationMap } from '@elliemae/ds-props-helpers';\nimport { type DSProgressIndicatorT, DSProgressIndicatorPropTypes, defaultProps } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\nimport { hasValidRange } from '../utils.js';\nimport { DSProgressIndicatorName } from '../constants/index.js';\n\nexport interface ProgressIndicatorCTX {\n  propsWithDefault: DSProgressIndicatorT.InternalProps;\n  globalProps: ReturnType<typeof useGetGlobalAttributes>;\n  titleId: string;\n}\n\nexport const useProgressIndicator = (propsFromUser: DSProgressIndicatorT.Props): ProgressIndicatorCTX => {\n  // =============================================================================\n  // MERGE WITH DEFAULT AND VALIDATE PROPS\n  // =============================================================================\n  const propsWithDefault = useMemoMergePropsWithDefault<DSProgressIndicatorT.InternalProps>(\n    propsFromUser,\n    defaultProps as unknown as Partial<DSProgressIndicatorT.InternalProps>,\n  );\n  useValidateProps(propsWithDefault, DSProgressIndicatorPropTypes as unknown as ValidationMap<unknown>);\n  // =============================================================================\n  // GLOBAL ATTRIBUTES\n  // =============================================================================\n  // These five props are consumed by this component but are also HTML global attributes, so spreading them\n  // onto the root would emit attributes the component has never rendered: `title` would add a native browser\n  // tooltip, `min`/`max`/`disabled` are not even valid on a div, and `style` is forwarded explicitly further\n  // down. Everything else still flows through so consumers can reach the root with id/className/data-*/aria-*.\n  const { title, style, min, max, disabled, ...globalPropsWithoutConsumedKeywords } = propsWithDefault;\n  const globalProps = useGetGlobalAttributes(globalPropsWithoutConsumedKeywords);\n  // =============================================================================\n  // AD HOC PER COMPONENT LOGIC\n  // =============================================================================\n  // The progressbar takes its accessible name from the visible title via aria-labelledby, which needs a\n  // stable unique id per instance. See the Accessibility Expert Validation doc for this component.\n  const reactId = React.useId();\n  const titleId = `ds-progress-indicator-title-${reactId}`;\n\n  // `max` is functionally required for a determinate progress but stays optional in the public contract \u2014 making\n  // it required would break every consumer that omits it today, at compile time for TS users and at render time\n  // for JS users (PropTypes `isRequired` throws). So an invalid range renders safely as an indeterminate\n  // progressbar, and this is the signal the consumer gets instead: a dev-only warning, once per range. It is\n  // step 1 of the breaking-change protocol should `max` ever become required. PUI-18672.\n  React.useEffect(() => {\n    if (process.env.NODE_ENV !== 'production' && !hasValidRange(min, max)) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `Warning: ${DSProgressIndicatorName}:: \"max\" must be a finite number greater than \"min\" (received min=${String(min)}, max=${String(max)}). A determinate progress cannot be computed, so the progressbar is rendered as indeterminate.`,\n      );\n    }\n  }, [min, max]);\n\n  return React.useMemo(\n    () => ({\n      propsWithDefault,\n      globalProps,\n      titleId,\n    }),\n    [propsWithDefault, globalProps, titleId],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,8BAAqE;AAErE,mCAAsF;AACtF,8BAAiC;AACjC,mBAA8B;AAC9B,uBAAwC;AAQjC,MAAM,uBAAuB,CAAC,kBAAoE;AAIvG,QAAM,uBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AACA,gDAAiB,kBAAkB,yDAAiE;AAQpG,QAAM,EAAE,OAAO,OAAO,KAAK,KAAK,UAAU,GAAG,mCAAmC,IAAI;AACpF,QAAM,kBAAc,gDAAuB,kCAAkC;AAM7E,QAAM,UAAU,aAAAA,QAAM,MAAM;AAC5B,QAAM,UAAU,+BAA+B,OAAO;AAOtD,eAAAA,QAAM,UAAU,MAAM;AACpB,QAA6C,KAAC,4BAAc,KAAK,GAAG,GAAG;AAErE,cAAQ;AAAA,QACN,YAAY,wCAAuB,qEAAqE,OAAO,GAAG,CAAC,SAAS,OAAO,GAAG,CAAC;AAAA,MACzI;AAAA,IACF;AAAA,EACF,GAAG,CAAC,KAAK,GAAG,CAAC;AAEb,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB,aAAa,OAAO;AAAA,EACzC;AACF;",
+  "names": ["React"]
+}

package/dist/cjs/{classedComponents.js → config/useValidateProps.js}

@@ -26,25 +26,15 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var classedComponents_exports = {};
-__export(classedComponents_exports, {
-  ProgressBarProgress: () => ProgressBarProgress,
-  ProgressBarStatusBar: () => ProgressBarStatusBar,
-  ProgressIndicatorCounter: () => ProgressIndicatorCounter,
-  Wrapper: () => Wrapper,
-  blockName: () => blockName
+var useValidateProps_exports = {};
+__export(useValidateProps_exports, {
+  useValidateProps: () => useValidateProps
 });
-module.exports = __toCommonJS(classedComponents_exports);
+module.exports = __toCommonJS(useValidateProps_exports);
 var React = __toESM(require("react"));
-var import_ds_classnames = require("@elliemae/ds-classnames");
-const blockName = "determinate-progress-indicator";
-const progressBlockName = "progress-bar";
-const Wrapper = (0, import_ds_classnames.aggregatedClasses)("div")(blockName, null, ({ disabled }) => ({
-  disabled
-}));
-const ProgressIndicatorCounter = (0, import_ds_classnames.aggregatedClasses)("span")(blockName, "counter");
-const ProgressBarStatusBar = (0, import_ds_classnames.aggregatedClasses)("div")(progressBlockName);
-const ProgressBarProgress = (0, import_ds_classnames.aggregatedClasses)("div")(progressBlockName, "progress", ({ variant }) => ({
-  [variant]: true
-}));
-//# sourceMappingURL=classedComponents.js.map
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_constants = require("../constants/index.js");
+const useValidateProps = (props, propTypes) => {
+  (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(props, propTypes, import_constants.DSProgressIndicatorName);
+};
+//# sourceMappingURL=useValidateProps.js.map

package/dist/cjs/config/useValidateProps.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/config/useValidateProps.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { ValidationMap } from '@elliemae/ds-props-helpers';\nimport { type DSProgressIndicatorT } from '../react-desc-prop-types.js';\nimport { DSProgressIndicatorName } from '../constants/index.js';\n\nexport const useValidateProps = (\n  props: DSProgressIndicatorT.InternalProps,\n  propTypes: ValidationMap<unknown>,\n): void => {\n  useValidateTypescriptPropTypes(props, propTypes, DSProgressIndicatorName);\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA+C;AAG/C,uBAAwC;AAEjC,MAAM,mBAAmB,CAC9B,OACA,cACS;AACT,8DAA+B,OAAO,WAAW,wCAAuB;AAC1E;",
+  "names": []
+}

package/dist/cjs/constants/index.js

@@ -0,0 +1,50 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var constants_exports = {};
+__export(constants_exports, {
+  DSProgressIndicatorName: () => DSProgressIndicatorName,
+  PROGRESS_INDICATOR_DATA_TESTID: () => PROGRESS_INDICATOR_DATA_TESTID,
+  PROGRESS_INDICATOR_SLOTS: () => PROGRESS_INDICATOR_SLOTS
+});
+module.exports = __toCommonJS(constants_exports);
+var React = __toESM(require("react"));
+var import_ds_system = require("@elliemae/ds-system");
+const DSProgressIndicatorName = "DSProgressindicator";
+const PROGRESS_INDICATOR_SLOTS = {
+  ROOT: "root",
+  TITLE: "title",
+  COUNTER: "counter",
+  PROGRESS_BAR: "progress-bar",
+  PROGRESS: "progress"
+};
+const PROGRESS_INDICATOR_DATA_TESTID = (0, import_ds_system.slotObjectToDataTestIds)(
+  DSProgressIndicatorName,
+  PROGRESS_INDICATOR_SLOTS
+);
+//# sourceMappingURL=index.js.map

package/dist/cjs/constants/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/constants/index.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSProgressIndicatorName = 'DSProgressindicator';\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const PROGRESS_INDICATOR_SLOTS = {\n  ROOT: 'root',\n  TITLE: 'title',\n  COUNTER: 'counter',\n  PROGRESS_BAR: 'progress-bar',\n  PROGRESS: 'progress',\n} as const;\n\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const PROGRESS_INDICATOR_DATA_TESTID = slotObjectToDataTestIds(\n  DSProgressIndicatorName,\n  PROGRESS_INDICATOR_SLOTS,\n);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,0BAA0B;AAGhC,MAAM,2BAA2B;AAAA,EACtC,MAAM;AAAA,EACN,OAAO;AAAA,EACP,SAAS;AAAA,EACT,cAAc;AAAA,EACd,UAAU;AACZ;AAGO,MAAM,qCAAiC;AAAA,EAC5C;AAAA,EACA;AACF;",
+  "names": []
+}

package/dist/cjs/index.js

@@ -5,6 +5,10 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
 var __copyProps = (to, from, except, desc) => {
   if (from && typeof from === "object" || typeof from === "function") {
     for (let key of __getOwnPropNames(from))
@@ -13,7 +17,6 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
   // If the importer is in node compatibility mode or this is not an ESM
   // file that has been converted to a CommonJS file using a Babel-
@@ -24,7 +27,15 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var index_exports = {};
+__export(index_exports, {
+  DSProgressIndicator: () => import_DSProgressIndicator.DSProgressIndicator,
+  DSProgressIndicatorName: () => import_constants.DSProgressIndicatorName,
+  PROGRESS_INDICATOR_DATA_TESTID: () => import_constants.PROGRESS_INDICATOR_DATA_TESTID,
+  PROGRESS_INDICATOR_SLOTS: () => import_constants.PROGRESS_INDICATOR_SLOTS,
+  ProgressIndicatorWithSchema: () => import_DSProgressIndicator.ProgressIndicatorWithSchema
+});
 module.exports = __toCommonJS(index_exports);
 var React = __toESM(require("react"));
-__reExport(index_exports, require("./DSProgressIndicator.js"), module.exports);
+var import_DSProgressIndicator = require("./DSProgressIndicator.js");
+var import_constants = require("./constants/index.js");
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export * from './DSProgressIndicator.js';\nexport { type DSProgressIndicatorT } from './react-desc-prop-types.js';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAc,qCAAd;",
+  "sourcesContent": ["export { DSProgressIndicator, ProgressIndicatorWithSchema } from './DSProgressIndicator.js';\nexport { type DSProgressIndicatorT } from './react-desc-prop-types.js';\nexport {\n  DSProgressIndicatorName,\n  PROGRESS_INDICATOR_SLOTS,\n  PROGRESS_INDICATOR_DATA_TESTID,\n} from './constants/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,iCAAiE;AAEjE,uBAIO;",
   "names": []
 }