@dynatrace/strato-components 0.84.42 → 0.85.0

package/content/progress/ProgressBarLabel.sty.js

@@ -0,0 +1,26 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var ProgressBarLabel_css_exports = {};
+__export(ProgressBarLabel_css_exports, {
+  progressBarLabelCSS: () => progressBarLabelCSS
+});
+module.exports = __toCommonJS(ProgressBarLabel_css_exports);
+var import_container_css_ts_vanilla = require("../../styles/container.css");
+var import_ProgressBarLabel_css_ts_vanilla = require("./ProgressBarLabel.css");
+var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
+var progressBarLabelCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "ProgressBarLabel_progressBarLabelCSS__1ceb8vp0", variantClassNames: { size: { condensed: "ProgressBarLabel_progressBarLabelCSS_size_condensed__1ceb8vp1", "default": "ProgressBarLabel_progressBarLabelCSS_size_default__1ceb8vp2" }, childIsText: { false: "ProgressBarLabel_progressBarLabelCSS_childIsText_false__1ceb8vp3" } }, defaultVariants: {}, compoundVariants: [] });

package/content/progress/ProgressBarValue.css

@@ -0,0 +1,28 @@
+.ProgressBarValue_progressBarValueCSS_variant_onAccent__1ri4i7o1 {
+  color: var(--dt-colors-text-neutral-on-accent-default, #f3f3f6);
+}
+.ProgressBarValue_progressBarValueCSS_variant_primary__1ri4i7o2 {
+  color: var(--dt-colors-text-neutral-subdued, #545587);
+}
+.ProgressBarValue_progressBarValueCSS_variant_success__1ri4i7o3 {
+  color: var(--dt-colors-text-neutral-subdued, #545587);
+}
+.ProgressBarValue_progressBarValueCSS_variant_warning__1ri4i7o4 {
+  color: var(--dt-colors-text-neutral-subdued, #545587);
+}
+.ProgressBarValue_progressBarValueCSS_variant_critical__1ri4i7o5 {
+  color: var(--dt-colors-text-neutral-subdued, #545587);
+}
+.ProgressBarValue_progressBarValueCSS_variant_neutral__1ri4i7o6 {
+  color: var(--dt-colors-text-neutral-subdued, #545587);
+}
+.ProgressBarValue_progressBarValueCSS_size_default__1ri4i7o8 {
+  word-break: break-word;
+}
+.ProgressBarValue_progressBarValueCSS_childIsText_false__1ri4i7oa {
+  word-break: break-word;
+}
+.ProgressBarValue_progressBarValueCSS_compound_0__1ri4i7ob {
+  margin-left: auto;
+  align-self: center;
+}

package/content/progress/ProgressBarValue.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { type DataTestId } from '../../core/types/data-props.js';
+import { type StylingProps } from '../../core/types/styling-props.js';
+import { type WithChildren } from '../../core/types/with-children.js';
+/**
+ * Accepted properties for ProgressBarValue.
+ * @public
+ * */
+export interface ProgressBarValueProps extends WithChildren, StylingProps, DataTestId {
+}
+/**
+ * ProgressBarValue sub-component is rendered inside ProgressBar component.
+ * @public
+ */
+export declare const ProgressBarValue: (props: ProgressBarValueProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;

package/content/progress/ProgressBarValue.js

@@ -0,0 +1,72 @@
+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 ProgressBarValue_exports = {};
+__export(ProgressBarValue_exports, {
+  ProgressBarValue: () => ProgressBarValue
+});
+module.exports = __toCommonJS(ProgressBarValue_exports);
+var import_clsx = __toESM(require("clsx"));
+var import_react = __toESM(require("react"));
+var import_react_intl = require("react-intl");
+var import_useProgressBarPropsContext = require("./hooks/useProgressBarPropsContext.js");
+var import_ProgressBarValue_css = require("./ProgressBarValue.sty.js");
+var import_is_string_children = require("../../core/utils/_is-string-children.js");
+var import_textStyle_css = require("../../styles/textStyle.sty.js");
+const ProgressBarValue = (0, import_react.forwardRef)((props, forwardedRef) => {
+  const {
+    children,
+    className: consumerClassName,
+    style: consumerStyle,
+    "data-testid": dataTestId,
+    ...remainingProps
+  } = props;
+  const intl = (0, import_react_intl.useIntl)();
+  const progressBarDefaultLabel = intl.formatMessage({
+    defaultMessage: "Loading",
+    id: "3J6qHQEUwDxvZuIl",
+    description: "Default label for the progress-bar."
+  });
+  const { variant, density } = (0, import_useProgressBarPropsContext._useSharedProgressBarPropsContext)();
+  const childIsText = (0, import_is_string_children.isStringChildren)(children);
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      "data-testid": dataTestId,
+      ref: forwardedRef,
+      className: (0, import_clsx.default)(
+        consumerClassName,
+        (0, import_ProgressBarValue_css.progressBarValueCSS)({ variant, size: density, childIsText }),
+        (0, import_textStyle_css.textStyleCSS)({ textStyle: "small" })
+      ),
+      style: consumerStyle,
+      ...remainingProps
+    },
+    children || progressBarDefaultLabel
+  );
+});
+ProgressBarValue.displayName = "ProgressBar.Value";

package/content/progress/ProgressBarValue.sty.d.ts

@@ -0,0 +1,34 @@
+export declare const progressBarValueCSS: import("@vanilla-extract/recipes").RuntimeFn<{
+    variant: {
+        onAccent: {
+            color: string;
+        };
+        primary: {
+            color: string;
+        };
+        success: {
+            color: string;
+        };
+        warning: {
+            color: string;
+        };
+        critical: {
+            color: string;
+        };
+        neutral: {
+            color: string;
+        };
+    };
+    size: {
+        condensed: {};
+        default: {
+            wordBreak: "break-word";
+        };
+    };
+    childIsText: {
+        true: {};
+        false: {
+            wordBreak: "break-word";
+        };
+    };
+}>;

package/content/progress/ProgressBarValue.sty.js

@@ -0,0 +1,26 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var ProgressBarValue_css_exports = {};
+__export(ProgressBarValue_css_exports, {
+  progressBarValueCSS: () => progressBarValueCSS
+});
+module.exports = __toCommonJS(ProgressBarValue_css_exports);
+var import_ellipsis_css_ts_vanilla = require("../../styles/ellipsis.css");
+var import_ProgressBarValue_css_ts_vanilla = require("./ProgressBarValue.css");
+var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
+var progressBarValueCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "ProgressBarValue__1ri4i7o0", variantClassNames: { variant: { onAccent: "ProgressBarValue_progressBarValueCSS_variant_onAccent__1ri4i7o1", primary: "ProgressBarValue_progressBarValueCSS_variant_primary__1ri4i7o2", success: "ProgressBarValue_progressBarValueCSS_variant_success__1ri4i7o3", warning: "ProgressBarValue_progressBarValueCSS_variant_warning__1ri4i7o4", critical: "ProgressBarValue_progressBarValueCSS_variant_critical__1ri4i7o5", neutral: "ProgressBarValue_progressBarValueCSS_variant_neutral__1ri4i7o6" }, size: { condensed: "ProgressBarValue_progressBarValueCSS_size_condensed__1ri4i7o7", "default": "ProgressBarValue_progressBarValueCSS_size_default__1ri4i7o8" }, childIsText: { true: "ProgressBarValue_progressBarValueCSS_childIsText_true__1ri4i7o9", false: "ProgressBarValue_progressBarValueCSS_childIsText_false__1ri4i7oa" } }, defaultVariants: {}, compoundVariants: [[{ size: "condensed", childIsText: true }, "ProgressBarValue_progressBarValueCSS_compound_0__1ri4i7ob ellipsis_ellipsisCSS__oqqp1n0"]] });

package/content/progress/ProgressCircle.css

@@ -0,0 +1,52 @@
+@keyframes ProgressCircle_circularIndeterminateKeyframes__kvldjh0 {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+.ProgressCircle_progressCircleRootCSS__kvldjh1 {
+  display: inline-block;
+  color: var(--vars_borderColor__17bwkb02);
+}
+.ProgressCircle_ProgressCircleSVGCSS__kvldjh2 {
+  display: block;
+  transform: rotate(-90deg);
+}
+.ProgressCircle_progressCircleCSS__kvldjh3 {
+  stroke: currentColor;
+  transform-origin: center;
+}
+.ProgressCircle_progressCircleCSS_indeterminate_true__kvldjh4 {
+  stroke-dasharray: 90 360;
+  transform-origin: 50 50;
+  animation-name: ProgressCircle_circularIndeterminateKeyframes__kvldjh0;
+  animation-duration: var(--dt-timings-slow-gentle, 800ms);
+  animation-timing-function: cubic-bezier(0.5, 0.15, 0.5, 0.8);
+  animation-iteration-count: infinite;
+}
+.ProgressCircle_progressCircleCSS_indeterminate_false__kvldjh5 {
+  animation-duration: var(--dt-timings-fast-moderate, 200ms);
+  transition-property: stroke-dashoffset;
+}
+.ProgressCircle_progressCircleBackgroundCSS__kvldjh6 {
+  stroke: var(--dt-colors-border-neutral-default, #d2d3e1);
+}
+.ProgressCircle_progressCircleBackgroundCSS_variant_onAccent__kvldjh7 {
+  stroke: var(--dt-colors-border-neutral-on-accent-disabled, #f3f3f633);
+}
+.ProgressCircle_progressCircleContainerCSS__kvldjhd {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.ProgressCircle_progressCircleContainerCSS_size_small__kvldjhe {
+  gap: var(--dt-spacings-size-8, 8px);
+}
+.ProgressCircle_progressCircleContainerCSS_size_large__kvldjhf {
+  gap: var(--dt-spacings-size-12, 12px);
+}
+.ProgressCircle_progressCircleChildCSS__kvldjhg {
+  color: var(--vars_text__6levse0);
+}

package/content/progress/ProgressCircle.d.ts

@@ -0,0 +1,51 @@
+import React from 'react';
+import { type AriaLabelingProps } from '../../core/types/a11y-props.js';
+import { type DataTestId } from '../../core/types/data-props.js';
+import { type DOMProps } from '../../core/types/dom.js';
+import { type MaskingProps } from '../../core/types/masking-props.js';
+import { type RoleVariantType } from '../../core/types/role-variant.js';
+import { type StylingProps } from '../../core/types/styling-props.js';
+import { type WithChildren } from '../../core/types/with-children.js';
+/**
+ * Accepted properties for ProgressCircle.
+ * @public
+ */
+export interface ProgressCircleProps extends WithChildren, DOMProps, AriaLabelingProps, StylingProps, DataTestId, MaskingProps {
+    /**
+     * The current value.
+     * @defaultValue 'indeterminate'
+     */
+    value?: number | 'indeterminate';
+    /**
+     * The smallest allowed value.
+     * @defaultValue 0
+     */
+    min?: number;
+    /**
+     * The maximum allowed value.
+     * @defaultValue 100
+     */
+    max?: number;
+    /**
+     * Controls the size of the rendered progress.
+     * @defaultValue 'large'
+     */
+    size?: 'small' | 'large';
+    /**
+     * Controls the appearance of the progress.
+     * @defaultValue 'primary'
+     */
+    variant?: RoleVariantType;
+    /**
+     * The aria-valuetext attribute defines the human-readable text alternative of aria-valuenow for a range widget.
+     * Default the value as percentage will be provided. If the value is not a percentage please provide the aria-valuetext.
+     * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-valuetext
+     * @defaultValue the value of the progress as percentage.
+     */
+    'aria-valuetext'?: string;
+}
+/**
+ * The `ProgressCircle` component is used to indicate the progress or completion status of a task or process.
+ * @public
+ * */
+export declare const ProgressCircle: (props: ProgressCircleProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;

package/content/progress/ProgressCircle.js

@@ -0,0 +1,174 @@
+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 ProgressCircle_exports = {};
+__export(ProgressCircle_exports, {
+  ProgressCircle: () => ProgressCircle
+});
+module.exports = __toCommonJS(ProgressCircle_exports);
+var import_clsx = __toESM(require("clsx"));
+var import_react = __toESM(require("react"));
+var import_useProgressAriaProps = require("./hooks/useProgressAriaProps.js");
+var import_ProgressCircle_css = require("./ProgressCircle.sty.js");
+var import_useAriaLabelingProps = require("../../core/hooks/useAriaLabelingProps.js");
+var import_useId = require("../../core/hooks/useId.js");
+var import_useSafeForwardProps = require("../../core/hooks/useSafeForwardProps.js");
+var import_colorUtils_css = require("../../styles/colorUtils.sty.js");
+var import_container_css = require("../../styles/container.sty.js");
+var import_textStyle_css = require("../../styles/textStyle.sty.js");
+const progressCircleSizes = {
+  small: 20,
+  large: 40
+};
+const progressCircleThickness = 5;
+const ProgressCircle = (0, import_react.forwardRef)(
+  (props, forwardedRef) => {
+    const {
+      value: originalValue,
+      min = 0,
+      max = 100,
+      size = "large",
+      variant = "primary",
+      children,
+      id: propId,
+      "aria-valuetext": ariaValuetext,
+      className: consumerClassName,
+      style: consumerStyle,
+      "data-testid": dataTestId,
+      "data-dtrum-mask": dataDtrumMask,
+      "data-dtrum-allow": dataDtrumAllow,
+      ...remainingProps
+    } = props;
+    const { value, isIndeterminate, progressAriaProps } = (0, import_useProgressAriaProps.useProgressAriaProps)(
+      originalValue,
+      min,
+      max,
+      ariaValuetext
+    );
+    const ariaLabelingProps = (0, import_useAriaLabelingProps.useAriaLabelingProps)(remainingProps);
+    const forwardProps = (0, import_useSafeForwardProps.useSafeForwardProps)(remainingProps, ariaLabelingProps);
+    const generatedId = (0, import_useId.useId)({ prefix: "progress-circle" });
+    const id = propId ?? generatedId;
+    const circleStyles = {};
+    const rootProps = {};
+    if (!isIndeterminate && value !== void 0) {
+      const circumference = 2 * Math.PI * ((progressCircleSizes[size] - progressCircleThickness) / 2);
+      circleStyles["strokeDasharray"] = circumference.toFixed(3);
+      const dashOffset = Number(
+        ((max - value) / max * circumference).toFixed(3)
+      );
+      circleStyles["strokeDashoffset"] = `${dashOffset >= 0 ? dashOffset : 0}px`;
+    }
+    if (!children && !ariaLabelingProps["aria-label"] && !ariaLabelingProps["aria-labelledby"]) {
+      // eslint-disable-next-line no-console
+      console.warn(
+        "If no label is provided please make sure to provide an aria label on your progressCircle element."
+      );
+    }
+    return /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        "data-testid": dataTestId,
+        "data-dtrum-mask": dataDtrumMask,
+        "data-dtrum-allow": dataDtrumAllow,
+        ref: forwardedRef,
+        className: (0, import_clsx.default)(
+          consumerClassName,
+          (0, import_container_css.containerColorsCSS)({
+            color: "neutral",
+            variant: variant === "onAccent" ? "accent" : "default"
+          }),
+          (0, import_ProgressCircle_css.progressCircleContainerCSS)({ size })
+        ),
+        style: consumerStyle,
+        ...forwardProps
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        "span",
+        {
+          id,
+          className: (0, import_clsx.default)(
+            (0, import_colorUtils_css.colorUtilsCSS)({ color: variant, variant: "accent" }),
+            import_ProgressCircle_css.progressCircleRootCSS
+          ),
+          style: {
+            height: `${progressCircleSizes[size]}px`,
+            width: `${progressCircleSizes[size]}px`
+          },
+          ...ariaLabelingProps,
+          ...progressAriaProps,
+          ...rootProps
+        },
+        /* @__PURE__ */ import_react.default.createElement(
+          "svg",
+          {
+            className: import_ProgressCircle_css.ProgressCircleSVGCSS,
+            viewBox: `0 0 ${progressCircleSizes[size]} ${progressCircleSizes[size]}`,
+            width: "100%",
+            height: "100%"
+          },
+          /* @__PURE__ */ import_react.default.createElement(
+            "circle",
+            {
+              fill: "none",
+              className: (0, import_clsx.default)((0, import_ProgressCircle_css.progressCircleBackgroundCSS)({ variant })),
+              cx: progressCircleSizes[size] / 2,
+              cy: progressCircleSizes[size] / 2,
+              r: (progressCircleSizes[size] - progressCircleThickness) / 2,
+              strokeWidth: progressCircleThickness
+            }
+          ),
+          /* @__PURE__ */ import_react.default.createElement(
+            "circle",
+            {
+              style: circleStyles,
+              className: (0, import_ProgressCircle_css.progressCircleCSS)({ indeterminate: isIndeterminate }),
+              fill: "none",
+              pathLength: isIndeterminate ? 360 : circleStyles["strokeDasharray"],
+              cx: progressCircleSizes[size] / 2,
+              cy: progressCircleSizes[size] / 2,
+              r: (progressCircleSizes[size] - progressCircleThickness) / 2,
+              strokeWidth: progressCircleThickness
+            }
+          )
+        )
+      ),
+      children && /* @__PURE__ */ import_react.default.createElement(
+        "label",
+        {
+          className: (0, import_clsx.default)(
+            import_ProgressCircle_css.progressCircleChildCSS,
+            (0, import_textStyle_css.textStyleCSS)({ textStyle: size === "small" ? "small" : "base" })
+          ),
+          htmlFor: id
+        },
+        children
+      )
+    );
+  }
+);
+ProgressCircle.displayName = "ProgressCircle";

package/content/progress/ProgressCircle.sty.d.ts

@@ -0,0 +1,41 @@
+export declare const progressCircleRootCSS: string;
+export declare const ProgressCircleSVGCSS: string;
+export declare const progressCircleCSS: import("@vanilla-extract/recipes").RuntimeFn<{
+    indeterminate: {
+        true: {
+            strokeDasharray: "90 360";
+            transformOrigin: "50 50";
+            animationName: string;
+            animationDuration: string;
+            animationTimingFunction: "cubic-bezier(0.5, 0.15, 0.5, 0.8)";
+            animationIterationCount: "infinite";
+        };
+        false: {
+            animationDuration: string;
+            transitionProperty: "stroke-dashoffset";
+        };
+    };
+}>;
+export declare const progressCircleBackgroundCSS: import("@vanilla-extract/recipes").RuntimeFn<{
+    variant: {
+        onAccent: {
+            stroke: string;
+        };
+        primary: {};
+        success: {};
+        warning: {};
+        critical: {};
+        neutral: {};
+    };
+}>;
+export declare const progressCircleContainerCSS: import("@vanilla-extract/recipes").RuntimeFn<{
+    size: {
+        small: {
+            gap: string;
+        };
+        large: {
+            gap: string;
+        };
+    };
+}>;
+export declare const progressCircleChildCSS: string;

package/content/progress/ProgressCircle.sty.js

@@ -0,0 +1,37 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var ProgressCircle_css_exports = {};
+__export(ProgressCircle_css_exports, {
+  ProgressCircleSVGCSS: () => ProgressCircleSVGCSS,
+  progressCircleBackgroundCSS: () => progressCircleBackgroundCSS,
+  progressCircleCSS: () => progressCircleCSS,
+  progressCircleChildCSS: () => progressCircleChildCSS,
+  progressCircleContainerCSS: () => progressCircleContainerCSS,
+  progressCircleRootCSS: () => progressCircleRootCSS
+});
+module.exports = __toCommonJS(ProgressCircle_css_exports);
+var import_colorUtils_css_ts_vanilla = require("../../styles/colorUtils.css");
+var import_container_css_ts_vanilla = require("../../styles/container.css");
+var import_ProgressCircle_css_ts_vanilla = require("./ProgressCircle.css");
+var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
+var ProgressCircleSVGCSS = "ProgressCircle_ProgressCircleSVGCSS__kvldjh2";
+var progressCircleBackgroundCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "ProgressCircle_progressCircleBackgroundCSS__kvldjh6", variantClassNames: { variant: { onAccent: "ProgressCircle_progressCircleBackgroundCSS_variant_onAccent__kvldjh7", primary: "ProgressCircle_progressCircleBackgroundCSS_variant_primary__kvldjh8", success: "ProgressCircle_progressCircleBackgroundCSS_variant_success__kvldjh9", warning: "ProgressCircle_progressCircleBackgroundCSS_variant_warning__kvldjha", critical: "ProgressCircle_progressCircleBackgroundCSS_variant_critical__kvldjhb", neutral: "ProgressCircle_progressCircleBackgroundCSS_variant_neutral__kvldjhc" } }, defaultVariants: {}, compoundVariants: [] });
+var progressCircleCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "ProgressCircle_progressCircleCSS__kvldjh3", variantClassNames: { indeterminate: { true: "ProgressCircle_progressCircleCSS_indeterminate_true__kvldjh4", false: "ProgressCircle_progressCircleCSS_indeterminate_false__kvldjh5" } }, defaultVariants: {}, compoundVariants: [] });
+var progressCircleChildCSS = "ProgressCircle_progressCircleChildCSS__kvldjhg";
+var progressCircleContainerCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "ProgressCircle_progressCircleContainerCSS__kvldjhd", variantClassNames: { size: { small: "ProgressCircle_progressCircleContainerCSS_size_small__kvldjhe", large: "ProgressCircle_progressCircleContainerCSS_size_large__kvldjhf" } }, defaultVariants: {}, compoundVariants: [] });
+var progressCircleRootCSS = "ProgressCircle_progressCircleRootCSS__kvldjh1";

package/content/progress/contexts/SharedProgressBarPropsContext.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { RoleVariantType } from '../../../core/types/role-variant.js';
+export type SharedProgressBarProps = {
+    id: string;
+    variant: RoleVariantType;
+    density: 'default' | 'condensed';
+};
+/** Context provider for `ProgressBarProps` props meant to be provided to all its progressbar-related child nodes. */
+export declare const SharedProgressBarPropsContext: React.Context<SharedProgressBarProps>;

package/content/progress/contexts/SharedProgressBarPropsContext.js

@@ -0,0 +1,38 @@
+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 SharedProgressBarPropsContext_exports = {};
+__export(SharedProgressBarPropsContext_exports, {
+  SharedProgressBarPropsContext: () => SharedProgressBarPropsContext
+});
+module.exports = __toCommonJS(SharedProgressBarPropsContext_exports);
+var import_react = __toESM(require("react"));
+const SharedProgressBarPropsContext = import_react.default.createContext({
+  id: "",
+  density: "default",
+  variant: "neutral"
+});

package/content/progress/hooks/useProgressAriaProps.d.ts

@@ -0,0 +1,38 @@
+interface ProgressAriaValueReturnProps {
+    /**
+     * The properly clamped progress value or undefined if progress is indeterminate.
+     */
+    value: number;
+    /**
+     * indicates if the progress is indeterminate or has a value.
+     */
+    isIndeterminate: false;
+}
+interface ProgressAriaIndeterminateReturnProps {
+    /**
+     * The properly clamped progress value or undefined if progress is indeterminate.
+     */
+    value: undefined;
+    /**
+     * indicates if the progress is indeterminate or has a value.
+     */
+    isIndeterminate: true;
+}
+type ProgressAriaReturnProps = (ProgressAriaValueReturnProps | ProgressAriaIndeterminateReturnProps) & {
+    /**
+     * Aria props for a ProgressBar element that is not a native <progress /> element.
+     */
+    progressAriaProps: {
+        'aria-valuenow'?: number;
+        'aria-valuetext'?: string;
+        'aria-valuemin'?: number;
+        'aria-valuemax'?: number;
+        role: string;
+    };
+};
+/**
+ * Returns aria-props for a progress as well as the properly clamped value property.
+ * @internal
+ */
+export declare function useProgressAriaProps(originalValue: undefined | number | 'indeterminate', min: number, max: number, valueText?: string): ProgressAriaReturnProps;
+export {};