@oracle/oraclejet-preact 14.0.5 → 14.0.7

package/amd/MeterCircle-bb948163.js

@@ -0,0 +1,547 @@
+/* @oracle/oraclejet-preact: 14.0.7 */
+define(['exports', './tslib.es6-71b1ba5b', 'preact/jsx-runtime', './hooks/UNSAFE_useUser', 'module', 'preact/hooks', './utils/UNSAFE_mergeProps', './utils/UNSAFE_classNames', './PRIVATE_Meter', './utils/PRIVATE_meterUtils', './hooks/PRIVATE_useDvtMeterEvents', './hooks/UNSAFE_useTabbableMode', './classNames-027de734'], (function (exports, tslib_es6, jsxRuntime, hooks_UNSAFE_useUser, linaria, hooks, utils_UNSAFE_mergeProps, utils_UNSAFE_classNames, PRIVATE_Meter, utils_PRIVATE_meterUtils, hooks_PRIVATE_useDvtMeterEvents, hooks_UNSAFE_useTabbableMode, classNames) { 'use strict';
+
+    function CircularReferenceLine({
+      color,
+      angle,
+      radius,
+      length,
+      section = 'full'
+    }) {
+      const centerCoord = utils_PRIVATE_meterUtils.getCenterCoord(section);
+      const yOffset = `calc(${centerCoord.y * 100}% - ((${Math.sin(angle * 2 * Math.PI / 360)} * ${radius})))`;
+      const xOffset = `calc(${centerCoord.x * 100}%  + ((${Math.cos(angle * 2 * Math.PI / 360)} * ${radius})))`;
+      return jsxRuntime.jsx("div", {
+        class: referenceLineStyles.base,
+        style: {
+          left: xOffset,
+          top: yOffset,
+          width: `calc(${length})`,
+          transform: `translate(0, -1px) rotate(${360 - angle}deg)`,
+          backgroundColor: color ? color : 'var(--oj-c-PRIVATE-DO-NOT-USE-dvt-reference-object-line-color)',
+          borderBottom: '1px solid var(--oj-c-PRIVATE-DO-NOT-USE-dvt-contrast-line-color)'
+        }
+      });
+    }
+    const referenceLineStyles = {
+      base: "base-vukcy8"
+    };
+
+    /**
+     * @license
+     * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+     * The Universal Permissive License (UPL), Version 1.0
+     * as shown at https://oss.oracle.com/licenses/upl/
+     * @ignore
+     */
+    /**
+     * Returns the true dimensions of the meter circle after initial render. All dimensions are 0 for initial render.
+     * @param element The HTML element that wraps the track and indicator div.
+     * @param section The section in which the meter circle lies.
+     * @returns The dimensions of the meter circle.
+     */
+    function getDimensions(element, section) {
+        if (!element) {
+            return {
+                width: 0,
+                height: 0,
+                innerRadius: 0,
+                outerRadius: 0
+            };
+        }
+        const circleTrack = element.children[0];
+        const rect = circleTrack.getBoundingClientRect();
+        return Object.assign({ width: Math.round(rect.width), height: Math.round(rect.height) }, getInnerAndOuterRadius(circleTrack, rect, section));
+    }
+    /**
+     * Returns the inner and outer radius of the meter circle.
+     * @param element The HTML element that wraps the track and indicator div.
+     * @param rect The bounding rect of the wrapper HTML element.
+     * @param section The section in which the meter circle lies.
+     * @returns The inner and outer radius of the meter circle.
+     */
+    function getInnerAndOuterRadius(element, rect, section) {
+        const width = element.clientWidth;
+        const height = element.clientHeight;
+        if (section === 'bottom' || section === 'top') {
+            return { outerRadius: rect.width / 2, innerRadius: height };
+        }
+        else if (section === 'left' || section === 'right') {
+            return { outerRadius: rect.height / 2, innerRadius: width };
+        }
+        return { innerRadius: width / 2, outerRadius: rect.width / 2 };
+    }
+    /**
+     * Returns the value corresponding to clicked point in the meter circle. Returns undefined if the clicked point is
+     * outside the track of the meter circle.
+     * @param pageX The pageX of the click event
+     * @param pageY The pageY of the click event
+     * @param max The max value of the meter circle.
+     * @param min The min value of the meter circle.
+     * @param step The step of the metercircle.
+     * @param dimensionsRef The ref that stores dimensions reference of meter circle.
+     * @param startAngle The startAngle of the meter circle.
+     * @param angleExtent The angleExtent of the meter circle
+     * @returns {number} The value corresponding to clicked point in the meter circle.
+     */
+    function getValue(event, min, max, step, dimensionsRef, startAngle, angleExtent, section, isRtl) {
+        const dims = dimensionsRef.current;
+        if (!dims) {
+            return undefined;
+        }
+        const center = utils_PRIVATE_meterUtils.getCenterCoord(section);
+        const { angle } = utils_PRIVATE_meterUtils.convertToPolar(dims.width * center.x, dims.height * center.y, event.offsetX, event.offsetY);
+        const positiveAngle = utils_PRIVATE_meterUtils.getPositiveAngle(angle);
+        let val;
+        if (isRtl && startAngle + angleExtent > positiveAngle) {
+            val = (utils_PRIVATE_meterUtils.getPositiveAngle(angle - startAngle) / angleExtent) * (max - min);
+        }
+        if (!isRtl) {
+            const clockwiseArc = utils_PRIVATE_meterUtils.getPositiveAngle(startAngle - positiveAngle);
+            if (clockwiseArc <= angleExtent) {
+                val = (clockwiseArc * (max - min)) / angleExtent;
+            }
+        }
+        if (val != undefined) {
+            val = Math.round(val / step) * step;
+        }
+        return val;
+    }
+    /**
+     * Returns the fraction of angle extent for given delta.
+     * @param delta The delta of metric values.
+     * @param min The minimum value of the meter circle.
+     * @param max The maximum value of the meter circle.
+     * @param angleExtent The angle extent of the meter circle.
+     * @returns The angle extent corresponding to delta in metric value.
+     */
+    function getAngleExtentFromDelta(delta, min, max, angleExtent) {
+        return (delta * angleExtent) / (max - min);
+    }
+    /**
+     * Returns the start angle for given metric value.
+     * @param value The metric value
+     * @param min The minimum value of the meter circle.
+     * @param max The maximum value of the meter circle.
+     * @param startAngle The startAngle of the meter circle.
+     * @param angleExtent The angleExtent of the meter circle.
+     * @param isRtl Whether the reading mode is 'rtl'
+     * @returns The startAngle for the metric value.
+     */
+    function getStartAngleForValue(value, min, max, startAngle, angleExtent, isRtl) {
+        const extent = getAngleExtentFromDelta(value - min, min, max, angleExtent);
+        return startAngle + (isRtl ? 1 : -1) * extent;
+    }
+    /**
+     * Returns the center context of for the meter circle.
+     */
+    function getCenterContext(dimensionsRef, section) {
+        const dims = dimensionsRef.current;
+        if (!dims) {
+            return;
+        }
+        const center = utils_PRIVATE_meterUtils.getCenterCoord(section);
+        const cx = center.x * dims.width;
+        const cy = center.y * dims.height;
+        const isHoriz = section === 'top' || section === 'bottom';
+        let innerX, innerY, innerW, innerH;
+        let outerX, outerY, outerW, outerH;
+        if (isHoriz || section === 'full') {
+            outerW = 2 * dims.innerRadius;
+            outerH = section === 'full' ? 2 * dims.innerRadius : dims.innerRadius;
+            outerX = cx - dims.innerRadius;
+            outerY = section === 'bottom' ? 0 : cy - dims.innerRadius;
+            innerW = Math.sqrt(2) * dims.innerRadius;
+            innerH = section === 'full' ? innerW : dims.innerRadius / Math.sqrt(2);
+            innerX = cx - dims.innerRadius / Math.sqrt(2);
+            innerY = section === 'bottom' ? 0 : cy - dims.innerRadius / Math.sqrt(2);
+        }
+        else {
+            outerH = 2 * dims.innerRadius;
+            outerW = dims.innerRadius;
+            outerX = section === 'left' ? cx - dims.innerRadius : 0;
+            outerY = cy - dims.innerRadius;
+            innerH = Math.sqrt(2) * dims.innerRadius;
+            innerW = dims.innerRadius / Math.sqrt(2);
+            innerX = section === 'left' ? cx - dims.innerRadius / Math.sqrt(2) : 0;
+            innerY = cy - dims.innerRadius / Math.sqrt(2);
+        }
+        return {
+            outerBounds: {
+                x: outerX,
+                y: outerY,
+                width: outerW,
+                height: outerH
+            },
+            innerBounds: {
+                x: innerX,
+                y: innerY,
+                width: innerW,
+                height: innerH
+            }
+        };
+    }
+
+    /**
+     * @license
+     * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+     * The Universal Permissive License (UPL), Version 1.0
+     * as shown at https://oss.oracle.com/licenses/upl/
+     * @ignore
+     */
+    /**
+     * Returns the css variable corresponding to the default size of the meter circle.
+     * @param size The size of the meter circle.
+     * @returns The css variable corresponding to the default size of the meter circle.
+     */
+    function getSizeVar(size) {
+        return `var(--oj-c-PRIVATE-DO-NOT-USE-meter-circle-${size}-size)`;
+    }
+    /**
+     * Returns the css variable corresponding to the default track size of the meter circle.
+     * @param size The size of the meter circle.
+     * @returns The css variable corresponding to the default track size of the meter circle.
+     */
+    function getTrackSizeVar(size) {
+        return `var(--oj-c-PRIVATE-DO-NOT-USE-meter-circle-${size}-track-size)`;
+    }
+    /**
+     * Returns the calculated css variable string for the inner radius when given size and innerRadius of meter circle.
+     * @param size The size of the meter circle.
+     * @param innerRadius The inner radius of the meter circle.
+     * @returns {string} CSS varible string for the calculated inner radius of the meter circle.
+     */
+    function getInnerRadius(size, innerRadius) {
+        if (innerRadius != undefined) {
+            return `(${getSizeVar(size)} * ${innerRadius / 2})`;
+        }
+        return `(${getSizeVar(size)} * 0.5 - ${getTrackSizeVar(size)})`;
+    }
+    /**
+     * Returns the calculated css variable string for meter circle track for a given size and innerRadius of meter circle.
+     * @param size The size of the meter circle.
+     * @param innerRadius The inner radius of the meter circle.
+     * @returns {string} CSS variable for the calculated track size of the meter circle.
+     */
+    function getTrackSize(size, innerRadius) {
+        if (innerRadius != undefined) {
+            return `(${getSizeVar(size)} * ${1 - innerRadius} / 2)`;
+        }
+        return getTrackSizeVar(size);
+    }
+    /**
+     * Returns the calculated length of reference line for given size and inner radius of meter circle.
+     * The length of reference line runs from the inner radius to slight outside the outer radius.
+     * The length outside the outer radius depends on size of the meter circle.
+     * @param size The size of the meter circle.
+     * @param innerRadius The inner radius of the meter circle.
+     * @returns The calculated CSS var for the length of reference line.
+     */
+    function getRefLineLength(size, innerRadius) {
+        const outerExtent = { sm: '1rem', md: '0.75rem', lg: '0.5rem' };
+        return `${getTrackSize(size, innerRadius)} + ${outerExtent[size]}`;
+    }
+    /**
+     * Returns the array of calculated props for InnerCircle representing each threshold.
+     * @param meterInfo MeterInfo object containing info about given meter circle.
+     * @param thresholds thresholds array of the meter circle.
+     * @param isTrackRendered Whether track is rendered.
+     * @param trackColor The track color of the meter circle.
+     * @param innerRadius The inner radius of the meter circle.
+     * @returns Array of calculated props object for InnerCircle representing each threshold.
+     */
+    function getThresholdsProps(meterInfo, thresholds, isTrackRendered, trackColor, innerRadius) {
+        const { min, max, startAngle, angleExtent, size, section, isRtl, innerRadius: innerDim } = meterInfo;
+        const trackSize = `calc(${getTrackSize(size, innerRadius)})`;
+        const thresholdProps = [];
+        const validThresholds = thresholds
+            .filter((threshold) => threshold.max > min && threshold.max <= max)
+            .sort((a, b) => a.max - b.max);
+        const numOfThreshold = validThresholds.length;
+        for (let i = 0; i < numOfThreshold; i++) {
+            const threshold = validThresholds[i];
+            const startValue = i === 0 ? min : validThresholds[i - 1].max;
+            const diff = i === 0 ? threshold.max : threshold.max - validThresholds[i - 1].max;
+            let thresholdStart = getStartAngleForValue(startValue, min, max, startAngle, angleExtent, isRtl);
+            let thresholdExtent = getAngleExtentFromDelta(diff, min, max, angleExtent);
+            const { startOffset, extentOffset } = getThresholdsBuffer(innerDim, angleExtent, i === 0, threshold.max === max, isRtl);
+            const clipPath = utils_PRIVATE_meterUtils.getClipPath(thresholdStart + startOffset, thresholdExtent + extentOffset, isRtl, section);
+            thresholdProps.push({
+                clipPath,
+                color: threshold === null || threshold === void 0 ? void 0 : threshold.color,
+                size: trackSize,
+                section
+            });
+            if (i === numOfThreshold - 1 && threshold.max < max && isTrackRendered) {
+                thresholdStart = thresholdStart + (isRtl ? 1 : -1) * thresholdExtent;
+                thresholdExtent = getAngleExtentFromDelta(max - threshold.max, min, max, angleExtent);
+                const { startOffset, extentOffset } = getThresholdsBuffer(innerDim, angleExtent, false, true, isRtl);
+                thresholdProps.push({
+                    clipPath: utils_PRIVATE_meterUtils.getClipPath(thresholdStart + startOffset, thresholdExtent + extentOffset, isRtl, section),
+                    color: trackColor,
+                    size: trackSize,
+                    section
+                });
+            }
+        }
+        return thresholdProps;
+    }
+    /**
+     * Returns the calculated props for CircularReferenceLine.
+     * @param meterInfo MeterInfo object containing info about the meter circle.
+     * @param refLine The CircularRefLine object
+     * @param innerRadius The innerRadius of the meter circle.
+     * @returns An bject with calculated props for CircularReferenceLine.
+     */
+    function getReferenceLinesProps(meterInfo, refLine, innerRadius) {
+        const { min, max, startAngle, angleExtent, size, isRtl } = meterInfo;
+        return {
+            radius: getInnerRadius(size, innerRadius),
+            length: getRefLineLength(size, innerRadius),
+            angle: getStartAngleForValue(refLine.value, min, max, startAngle, angleExtent, isRtl),
+            color: refLine.color
+        };
+    }
+    /**
+     * Returns the calculated props for InnerCircle representing the track.
+     * @param meterInfo MeterInfo object containing info about the meter circle.
+     * @param trackColor The color of the track.
+     * @param istrackRendered Whether the track is rendered.
+     * @param thresholdDisplay Specifies whether the current threshold is displayed in the track, on the indicator, or if all thresholds are displayed in the track.
+     * @param innerRadius The innerRadius of the meter circle.
+     * @param thresholds thresholds array of the meter circle.
+     * @returns An object with calculated props for InnerCircle that represents the track.
+     */
+    function getTrackProps(meterInfo, isTrackRendered, thresholdDisplay, trackColor, innerRadius, thresholds) {
+        const { startAngle, angleExtent, size, section, isRtl } = meterInfo;
+        const color = !isTrackRendered
+            ? 'transparent'
+            : thresholdDisplay === 'all' && thresholds
+                ? 'var(--oj-c-PRIVATE-DO-NOT-USE-dvt-contrast-line-color)'
+                : trackColor;
+        return {
+            section,
+            color,
+            clipPath: utils_PRIVATE_meterUtils.getClipPath(startAngle, angleExtent, isRtl, section),
+            size: `calc(${getTrackSize(size, innerRadius)})`
+        };
+    }
+    /**
+     * Returns the calculated props for InnerCircle representing the indicator.
+     * @param meterInfo MeterInfo object containing info about the meter circle.
+     * @param indicatorSize Relative thickness of the indicator to the track.
+     * @param innerRadius The innerRadius of the meter circle.
+     * @returns An object with calculated props for InnerCircle that represents the indicator.
+     */
+    function getIndicatorProps(meterInfo, indicatorSize, innerRadius) {
+        const { value, min, max, startAngle, angleExtent, size, section, isRtl } = meterInfo;
+        const valueExtent = ((value - min) * angleExtent) / (max - min);
+        const validIndicatorSize = Math.min(Math.max(0, indicatorSize), 1);
+        const isHoriz = section === 'left' || section === 'right';
+        const isVert = section === 'top' || section === 'bottom';
+        const valueTrackSize = `calc(${getTrackSize(size, innerRadius)} * ${validIndicatorSize})`;
+        const diameter = `${getSizeVar(size)} - ((1 - ${validIndicatorSize}) * ${getTrackSize(size, innerRadius)})`;
+        const radius = `(${diameter}) / 2`;
+        return {
+            section,
+            width: isHoriz ? `calc(${radius})` : `calc(${diameter})`,
+            height: isVert ? `calc(${radius})` : `calc(${diameter})`,
+            size: valueTrackSize,
+            clipPath: utils_PRIVATE_meterUtils.getClipPath(startAngle, valueExtent, isRtl, section)
+        };
+    }
+    /**
+     * Returns the threshold offsets to create the whitespace between the thresholds.
+     * @param innerRadius The innerRadius of the meter circle.
+     * @param angleExtent The angleExtent of the meter circle.
+     * @param firstThreshold Whether the current threshold is the first threshold.
+     * @param lastThreshold  Whether the current threshold is the last threshold.
+     * @param isRtl Whether the document reading mode is 'rtl'
+     * @returns The offsets (startOffset and extentOffset) to add to calculated threshold startAngle and threhsold extent.
+     */
+    function getThresholdsBuffer(innerRadius, angleExtent, firstThreshold, lastThreshold, isRtl) {
+        if (!innerRadius) {
+            return { startOffset: 0, extentOffset: 0 };
+        }
+        const offset = 360 / (2 * Math.PI * innerRadius);
+        let startOffset = (offset / 2) * (isRtl ? 1 : -1);
+        let extentOffset = -1 * offset;
+        if (firstThreshold && angleExtent < 360) {
+            startOffset = 0;
+            extentOffset = -0.5 * offset;
+        }
+        if (lastThreshold && angleExtent < 360) {
+            extentOffset = -0.5 * offset;
+        }
+        return { startOffset, extentOffset };
+    }
+
+    /**
+     * A Meter circle displays information graphically in a circular bar, highlighting a specific metric value's progress in relation to its min, max, or thresholds.
+     */
+
+    function MeterCircle(_a) {
+      var _b;
+
+      var {
+        max = 100,
+        min = 0,
+        value = 0,
+        step = 1,
+        size = 'lg',
+        startAngle = 90,
+        angleExtent = 360,
+        isTrackRendered = true,
+        thresholdDisplay = 'all',
+        indicatorSize = 1
+      } = _a,
+          props = tslib_es6.__rest(_a, ["max", "min", "value", "step", "size", "startAngle", "angleExtent", "isTrackRendered", "thresholdDisplay", "indicatorSize"]);
+
+      utils_PRIVATE_meterUtils.validateRange(min, max, value, step);
+      const {
+        direction
+      } = hooks_UNSAFE_useUser.useUser();
+      const isRtl = direction === 'rtl';
+      const section = utils_PRIVATE_meterUtils.getCircleSection(startAngle, angleExtent, isRtl);
+      const dimensionsRef = hooks.useRef(getDimensions(null, section));
+      const circleWrapperRef = hooks.useRef(null);
+      const [isDimsReady, setDimsReady] = hooks.useState(false);
+      hooks.useEffect(() => {
+        if (props.onCommit || props.onInput || props.children) {
+          dimensionsRef.current = getDimensions(circleWrapperRef.current, section);
+          setDimsReady(true);
+        }
+      }, [size, props.onCommit, props.onInput, props.children]);
+
+      const getValueFromEvent = event => {
+        const circleContainer = circleWrapperRef.current;
+
+        if (event.target == circleContainer) {
+          return getValue(event, min, max, step, dimensionsRef, startAngle, angleExtent, section, isRtl);
+        }
+
+        return;
+      };
+
+      const pointerEventsProps = hooks_PRIVATE_useDvtMeterEvents.usePointerEvents(value, getValueFromEvent, circleWrapperRef, props.onCommit, props.onInput);
+      const keyboardEventsProps = hooks_PRIVATE_useDvtMeterEvents.useKeyboardEvents(value, min, max, step, props.onCommit, props.onInput);
+      const {
+        datatipContent,
+        datatipProps
+      } = hooks_PRIVATE_useDvtMeterEvents.useMeterDatatip(value, props.datatip, props.ariaDescribedBy);
+      const ariaProps = utils_PRIVATE_meterUtils.getMeterAriaProps(value, min, max, `${value}`, props.accessibleLabel, props.ariaLabelledBy, props.thresholds);
+      const mergedProps = utils_UNSAFE_mergeProps.mergeProps(pointerEventsProps, keyboardEventsProps, datatipProps, ariaProps);
+      const {
+        trackColor,
+        indicatorColor
+      } = utils_PRIVATE_meterUtils.getTrackAndIndicatorColor(value, thresholdDisplay, props.trackColor, props.indicatorColor, props.thresholds);
+      const orientation = section === 'bottom' || section === 'top' ? 'Horizontal' : section === 'left' || section === 'right' ? 'Vertical' : 'Full';
+      const meterInfo = {
+        min,
+        max,
+        value,
+        startAngle,
+        angleExtent,
+        size,
+        section,
+        isRtl,
+        innerRadius: dimensionsRef.current.innerRadius
+      };
+      const isInteractive = props.onCommit || props.onInput;
+      const {
+        isTabbable
+      } = hooks_UNSAFE_useTabbableMode.useTabbableMode();
+      const centerContext = getCenterContext(dimensionsRef, section);
+      return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [jsxRuntime.jsx("div", Object.assign({
+          class: classNames.classNames([component.base, isInteractive ? component.interactive : '']),
+          tabIndex: !isTabbable ? -1 : 0,
+          role: "slider"
+        }, mergedProps, {
+          children: jsxRuntime.jsxs(PRIVATE_Meter.CircleWrapper, Object.assign({
+            ref: circleWrapperRef,
+            class: classNames.classNames([circleWrapper.base, props.referenceLines && props.referenceLines.length > 0 ? styles[`${size}${section}`] : '', styles[`${size}${orientation}`]])
+          }, {
+            children: [jsxRuntime.jsx(PRIVATE_Meter.CircleInner, Object.assign({
+              class: classNames.classNames([circleTrack.base, styles[section]])
+            }, getTrackProps(meterInfo, isTrackRendered, thresholdDisplay, trackColor, props.innerRadius, props.thresholds))), thresholdDisplay === 'all' && props.thresholds && getThresholdsProps(meterInfo, props.thresholds, isTrackRendered, trackColor, props.innerRadius).map(threshold => {
+              return jsxRuntime.jsx(PRIVATE_Meter.CircleInner, Object.assign({
+                class: classNames.classNames([circleTrack.base, styles[section], styles.thresholds])
+              }, threshold));
+            }), jsxRuntime.jsx(PRIVATE_Meter.CircleInner, Object.assign({
+              color: indicatorColor,
+              class: classNames.classNames([circleValue.base, circleValue[section], styles[section]])
+            }, getIndicatorProps(meterInfo, indicatorSize, props.innerRadius))), (_b = props.referenceLines) === null || _b === void 0 ? void 0 : _b.map(refLine => {
+              return jsxRuntime.jsx(CircularReferenceLine, Object.assign({}, getReferenceLinesProps(meterInfo, refLine, props.innerRadius), {
+                section: section
+              }));
+            }), isDimsReady && props.children && centerContext && jsxRuntime.jsx("div", Object.assign({
+              class: classNames.classNames([styles.centerContent, childrenStyles])
+            }, {
+              children: props.children(centerContext)
+            }))]
+          }))
+        })), datatipContent]
+      });
+    }
+    const component = {
+      base: "base-lckyb",
+      interactive: "interactive-1whrt2o"
+    };
+    const styles = {
+      full: "full-5l06ry",
+      top: "top-387lj5",
+      bottom: "bottom-15z6flu",
+      right: "right-4q07bm",
+      left: "left-yyknjz",
+      smtop: "smtop-jjpvlt",
+      mdtop: "mdtop-exvji5",
+      lgtop: "lgtop-l2k2yt",
+      smbottom: "smbottom-9fq5s0",
+      mdbottom: "mdbottom-10wb0ou",
+      lgbottom: "lgbottom-uf3bay",
+      smleft: "smleft-15p8w3a",
+      mdleft: "mdleft-mhz8ey",
+      lgleft: "lgleft-lw7239",
+      smright: "smright-1pvuocz",
+      mdright: "mdright-1snjhj8",
+      lgright: "lgright-z6xmec",
+      smfull: "smfull-m7cikl",
+      mdfull: "mdfull-1fi7z3z",
+      lgfull: "lgfull-14kwda6",
+      lgHorizontal: "lgHorizontal-1b0yh1",
+      lgVertical: "lgVertical-1mwgk5c",
+      smHorizontal: "smHorizontal-zen3qj",
+      smVertical: "smVertical-pyxlwd",
+      mdHorizontal: "mdHorizontal-qsylpp",
+      mdVertical: "mdVertical-f02hie",
+      smFull: "smFull-u61n4j",
+      mdFull: "mdFull-1rr5wic",
+      lgFull: "lgFull-kqzt2t",
+      centerContent: "centerContent-ohkmnn",
+      thresholds: "thresholds-1ez23es"
+    };
+    const childrenStyles = "childrenStyles-1dq5vfr";
+    const circleWrapper = {
+      base: "base-1m0jp3h"
+    };
+    const circleTrack = {
+      base: "base-ktml39",
+      sm: "sm-j9bak7",
+      md: "md-onear4",
+      lg: "lg-156wrqs"
+    };
+    const circleValue = {
+      base: "base-1agz56t",
+      full: "full-1gtvv8a",
+      top: "top-3g49ab",
+      right: "right-lpifjv",
+      left: "left-1ijytjs",
+      bottom: "bottom-yul437"
+    };
+
+    exports.MeterCircle = MeterCircle;
+
+}));
+/*  */
+//# sourceMappingURL=MeterCircle-bb948163.js.map