@dbcdk/react-components 0.0.167 → 0.0.169

package/dist/components/search-box/SearchBox.js

@@ -1,291 +0,0 @@
-'use client';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Search } from 'lucide-react';
-import { forwardRef, useState, useId, useRef, useEffect, useCallback } from 'react';
-import { Input } from '../../components/forms/input/Input';
-import { Popover } from '../../components/popover/Popover';
-import { SkeletonLoaderItem } from '../../components/skeleton-loader/skeleton-loader-item/SkeletonLoaderItem';
-import styles from './SearchBox.module.css';
-
-const SearchBox = forwardRef(function SearchBoxInner({
-  inputWidth,
-  maxWidth,
-  inputSize,
-  variant,
-  result,
-  debounce = true,
-  debounceMs = 800,
-  onSearch,
-  onSelect,
-  displayPopover,
-  resultKeys,
-  resultTemplate,
-  initialTemplate,
-  popoverMinWidth = "500px",
-  noResultText = "Ingen resultater",
-  loading,
-  enableHotkey = true,
-  onButtonClick,
-  buttonLabel,
-  buttonIcon,
-  buttonAriaLabel,
-  fullWidth = false,
-  value,
-  onChange,
-  ...rest
-}, ref) {
-  var _a;
-  const isControlled = value !== void 0;
-  const [draft, setDraft] = useState(() => isControlled ? String(value != null ? value : "") : "");
-  const [activeIndex, setActiveIndex] = useState(null);
-  const [popoverOpen, setPopoverOpen] = useState(false);
-  const listboxId = useId();
-  const popoverRef = useRef(null);
-  const internalInputRef = useRef(null);
-  const onSearchRef = useRef(onSearch);
-  useEffect(() => {
-    if (typeof ref === "function") {
-      ref(internalInputRef.current);
-    } else if (ref) {
-      ref.current = internalInputRef.current;
-    }
-  }, [ref]);
-  useEffect(() => {
-    if (!isControlled) return;
-    const next = String(value != null ? value : "");
-    if (next !== draft) setDraft(next);
-  }, [value]);
-  useEffect(() => {
-    onSearchRef.current = onSearch;
-  }, [onSearch]);
-  useEffect(() => {
-    if (!onSearchRef.current) return;
-    if (!debounce) {
-      onSearchRef.current(draft);
-      return;
-    }
-    const handler = setTimeout(() => {
-      var _a2;
-      (_a2 = onSearchRef.current) == null ? void 0 : _a2.call(onSearchRef, draft);
-    }, debounceMs);
-    return () => clearTimeout(handler);
-  }, [draft, debounce, debounceMs]);
-  useEffect(() => {
-    function handleKeyDown(event) {
-      var _a2;
-      if (event.key === "k" && (event.metaKey || event.ctrlKey)) {
-        event.preventDefault();
-        (_a2 = internalInputRef.current) == null ? void 0 : _a2.focus();
-      }
-    }
-    if (enableHotkey) {
-      window.addEventListener("keydown", handleKeyDown);
-      return () => window.removeEventListener("keydown", handleKeyDown);
-    }
-  }, [enableHotkey]);
-  const hasInitialTemplate = initialTemplate !== void 0 && initialTemplate !== null;
-  const hasQuery = draft.trim().length > 0;
-  const canShowPopover = hasQuery || hasInitialTemplate;
-  const handleChange = useCallback(
-    (e) => {
-      var _a2, _b, _c;
-      const nextDraft = e.target.value;
-      const nextHasQuery = nextDraft.trim().length > 0;
-      setDraft(nextDraft);
-      if (nextHasQuery || hasInitialTemplate) {
-        if (!((_a2 = popoverRef.current) == null ? void 0 : _a2.isOpen())) (_b = popoverRef.current) == null ? void 0 : _b.open();
-      } else {
-        (_c = popoverRef.current) == null ? void 0 : _c.close();
-      }
-      onChange == null ? void 0 : onChange(e);
-    },
-    [hasInitialTemplate, onChange]
-  );
-  const handleSelect = useCallback(
-    (item) => {
-      onSelect == null ? void 0 : onSelect(item);
-      reset();
-    },
-    [onSelect]
-  );
-  function reset() {
-    var _a2;
-    setDraft("");
-    setActiveIndex(null);
-    (_a2 = popoverRef.current) == null ? void 0 : _a2.close();
-  }
-  const handleClear = useCallback(() => {
-    var _a2;
-    reset();
-    onSearch == null ? void 0 : onSearch("");
-    (_a2 = internalInputRef.current) == null ? void 0 : _a2.focus();
-  }, [onSearch]);
-  useEffect(() => {
-    setActiveIndex(null);
-  }, [result]);
-  useEffect(() => {
-    var _a2;
-    if (canShowPopover) return;
-    (_a2 = popoverRef.current) == null ? void 0 : _a2.close();
-  }, [canShowPopover]);
-  const showInputIcon = !onButtonClick || !!buttonLabel || !!buttonIcon;
-  const trailingButtonIcon = onButtonClick && !buttonLabel && !buttonIcon ? /* @__PURE__ */ jsx(Search, {}) : buttonIcon;
-  const trailingButtonAriaLabel = buttonAriaLabel != null ? buttonAriaLabel : onButtonClick && !buttonLabel ? "S\xF8g" : void 0;
-  const activeOptionId = activeIndex !== null && (result == null ? void 0 : result.length) ? `${listboxId}-option-${activeIndex}` : void 0;
-  const inputProps = {
-    ...rest,
-    value: draft,
-    onChange: handleChange
-  };
-  if (!displayPopover) {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          ...fullWidth ? { width: "100%" } : void 0,
-          ...maxWidth !== void 0 ? { maxWidth } : void 0
-        },
-        children: /* @__PURE__ */ jsx(
-          Input,
-          {
-            ref: internalInputRef,
-            icon: showInputIcon ? /* @__PURE__ */ jsx(Search, {}) : void 0,
-            minWidth: fullWidth ? void 0 : inputWidth != null ? inputWidth : "300px",
-            fullWidth,
-            inputSize,
-            variant,
-            onClear: handleClear,
-            onButtonClick,
-            buttonLabel,
-            buttonIcon: trailingButtonIcon,
-            buttonAriaLabel: trailingButtonAriaLabel,
-            ...inputProps,
-            placeholder: (_a = rest.placeholder) != null ? _a : "Indtast s\xF8geord"
-          }
-        )
-      }
-    );
-  }
-  const dropdownContent = !canShowPopover ? null : !hasQuery && hasInitialTemplate ? /* @__PURE__ */ jsx("div", { className: styles.resultContainer, children: initialTemplate }) : resultTemplate ? resultTemplate : /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      "ul",
-      {
-        id: listboxId,
-        role: "listbox",
-        "aria-label": "S\xF8geresultater",
-        "aria-busy": loading ? "true" : void 0,
-        className: styles.suggestionList,
-        children: loading ? Array.from({ length: 5 }).map((_, index) => /* @__PURE__ */ jsx("li", { className: styles.suggestionOption, children: resultKeys == null ? void 0 : resultKeys.map((key) => /* @__PURE__ */ jsx(SkeletonLoaderItem, { height: 20, width: "100%" }, key)) }, index)) : result == null ? void 0 : result.map((item, index) => /* @__PURE__ */ jsx(
-          "li",
-          {
-            id: `${listboxId}-option-${index}`,
-            role: "option",
-            "aria-selected": index === activeIndex,
-            className: `${styles.suggestionOption}${index === activeIndex ? ` ${styles.suggestionOptionActive}` : ""}`,
-            onMouseDown: (e) => {
-              e.preventDefault();
-              handleSelect(item);
-            },
-            children: resultKeys == null ? void 0 : resultKeys.map((key) => {
-              const raw = item[key];
-              return raw != null ? /* @__PURE__ */ jsx("span", { className: styles.suggestionCell, children: String(raw) }, key) : null;
-            })
-          },
-          index
-        ))
-      }
-    ),
-    !loading && !(result == null ? void 0 : result.length) && /* @__PURE__ */ jsx("div", { className: styles.resultContainer, children: noResultText })
-  ] });
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      style: {
-        ...fullWidth ? { width: "100%" } : void 0,
-        ...maxWidth !== void 0 ? { maxWidth } : void 0
-      },
-      children: /* @__PURE__ */ jsx(
-        Popover,
-        {
-          ref: popoverRef,
-          minWidth: popoverMinWidth,
-          fullWidth,
-          onOpenChange: setPopoverOpen,
-          trigger: (event) => {
-            var _a2;
-            return /* @__PURE__ */ jsx(
-              Input,
-              {
-                ref: internalInputRef,
-                onFocusCapture: (e) => {
-                  if (!canShowPopover) return;
-                  event(e);
-                },
-                onClick: () => {
-                  var _a3, _b;
-                  if (!canShowPopover) return;
-                  if (!((_a3 = popoverRef.current) == null ? void 0 : _a3.isOpen())) (_b = popoverRef.current) == null ? void 0 : _b.open();
-                },
-                role: "combobox",
-                "aria-haspopup": "listbox",
-                "aria-expanded": popoverOpen,
-                "aria-controls": canShowPopover ? listboxId : void 0,
-                "aria-autocomplete": "list",
-                "aria-activedescendant": activeOptionId,
-                clearAriaLabel: "Ryd s\xF8gning",
-                minWidth: fullWidth ? void 0 : inputWidth != null ? inputWidth : "300px",
-                width: fullWidth ? void 0 : inputWidth != null ? inputWidth : "300px",
-                fullWidth,
-                icon: showInputIcon ? /* @__PURE__ */ jsx(Search, {}) : void 0,
-                inputSize,
-                variant,
-                autoComplete: "off",
-                onClear: handleClear,
-                onButtonClick,
-                buttonLabel,
-                buttonIcon: trailingButtonIcon,
-                buttonAriaLabel: trailingButtonAriaLabel,
-                ...inputProps,
-                onKeyDown: (e) => {
-                  var _a3;
-                  if (result == null ? void 0 : result.length) {
-                    if (e.key === "ArrowDown") {
-                      e.preventDefault();
-                      setActiveIndex(
-                        (prev) => prev === null || prev === result.length - 1 ? 0 : prev + 1
-                      );
-                    } else if (e.key === "ArrowUp") {
-                      e.preventDefault();
-                      setActiveIndex(
-                        (prev) => prev === null || prev === 0 ? result.length - 1 : prev - 1
-                      );
-                    } else if (e.key === "Home") {
-                      e.preventDefault();
-                      setActiveIndex(0);
-                    } else if (e.key === "End") {
-                      e.preventDefault();
-                      setActiveIndex(result.length - 1);
-                    } else if (e.key === "Enter") {
-                      e.preventDefault();
-                      if (activeIndex !== null) {
-                        handleSelect(result[activeIndex]);
-                      } else if (onButtonClick) {
-                        onButtonClick();
-                      }
-                    }
-                  }
-                  if (e.key === "Escape") reset();
-                  (_a3 = inputProps.onKeyDown) == null ? void 0 : _a3.call(inputProps, e);
-                },
-                placeholder: (_a2 = rest.placeholder) != null ? _a2 : "Indtast s\xF8geord"
-              }
-            );
-          },
-          children: dropdownContent
-        }
-      )
-    }
-  );
-});
-
-export { SearchBox };

package/dist/components/search-box/SearchBox.module.css

@@ -1,27 +0,0 @@
-.resultContainer {
-  padding: var(--spacing-sm);
-}
-
-.suggestionList {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  width: 100%;
-}
-
-.suggestionOption {
-  cursor: pointer;
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--spacing-xs);
-  padding: var(--spacing-xs) var(--spacing-sm);
-}
-
-.suggestionOption:hover,
-.suggestionOptionActive {
-  background-color: var(--table-row-bg-hover);
-}
-
-.suggestionCell {
-  white-space: nowrap;
-}

package/dist/components/section-label/SectionLabel.cjs

@@ -1,18 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var styles = require('./SectionLabel.module.css');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var styles__default = /*#__PURE__*/_interopDefault(styles);
-
-function SectionLabel({
-  disableMargin,
-  children
-}) {
-  const className = [styles__default.default.sectionLabel, disableMargin ? styles__default.default.noMargin : ""].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxRuntime.jsx("p", { className, children });
-}
-
-exports.SectionLabel = SectionLabel;

package/dist/components/section-label/SectionLabel.d.ts

@@ -1,5 +0,0 @@
-import React, { PropsWithChildren } from 'react';
-export interface SectionLabelProps {
-    disableMargin?: boolean;
-}
-export declare function SectionLabel({ disableMargin, children, }: PropsWithChildren<SectionLabelProps>): React.JSX.Element;

package/dist/components/section-label/SectionLabel.js

@@ -1,12 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import styles from './SectionLabel.module.css';
-
-function SectionLabel({
-  disableMargin,
-  children
-}) {
-  const className = [styles.sectionLabel, disableMargin ? styles.noMargin : ""].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx("p", { className, children });
-}
-
-export { SectionLabel };

package/dist/components/section-label/SectionLabel.module.css

@@ -1,12 +0,0 @@
-.sectionLabel {
-  margin-block: 0 var(--spacing-xxs);
-  font-size: var(--font-size-xs);
-  font-weight: var(--font-weight-medium);
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-  color: var(--color-fg-subtle);
-}
-
-.noMargin {
-  margin: 0;
-}

package/dist/components/segmented-progress-bar/SegmentedProgressBar.cjs

@@ -1,130 +0,0 @@
-'use client';
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var useTooltipTrigger = require('../../components/overlay/tooltip/useTooltipTrigger');
-var styles = require('./SegmentedProgressBar.module.css');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var styles__default = /*#__PURE__*/_interopDefault(styles);
-
-const sizeTokenMap = {
-  "2xs": "var(--component-size-2xs)",
-  xxs: "var(--component-size-xxs)",
-  xs: "var(--component-size-xs)",
-  sm: "var(--component-size-sm)",
-  md: "var(--component-size-md)",
-  lg: "var(--component-size-lg)"
-};
-function formatNumberDa(value) {
-  return value.toLocaleString("da-DK");
-}
-function SegmentWithTooltip({
-  seg,
-  index,
-  tooltipPlacement
-}) {
-  var _a, _b;
-  const tooltipContent = typeof seg.label !== "undefined" ? seg.label : String((_a = seg.value) != null ? _a : 0);
-  const tooltipEnabled = tooltipContent !== null && tooltipContent !== void 0 && tooltipContent !== "";
-  const { triggerProps } = useTooltipTrigger.useTooltipTrigger({
-    content: tooltipEnabled ? tooltipContent : null,
-    placement: tooltipPlacement,
-    offset: 8
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
-    {
-      className: styles__default.default.segmentWrapper,
-      style: {
-        flex: `${Math.max(seg.value || 0, 0)} 0 0`
-      },
-      ...tooltipEnabled ? triggerProps : {},
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        "span",
-        {
-          className: styles__default.default.progressSegment,
-          "data-index": index,
-          "data-severity": (_b = seg.severity) != null ? _b : "neutral",
-          style: seg.color ? {
-            ["--segment-color"]: seg.color
-          } : void 0
-        }
-      )
-    }
-  );
-}
-const SegmentedProgressBar = ({
-  segments,
-  total,
-  showRemainder = true,
-  remainderSeverity = "missing",
-  centerLabel,
-  size = "sm",
-  rounded = true,
-  trackColor,
-  tooltipPlacement = "top",
-  className,
-  ...aria
-}) => {
-  const sum = segments.reduce((acc, s) => acc + (s.value || 0), 0);
-  const effectiveTotal = total != null ? total : sum;
-  const safeTotal = Math.max(effectiveTotal, 1e-4);
-  const remainder = Math.max(effectiveTotal - sum, 0);
-  const pctFilled = Math.min(100, Math.max(0, Math.min(sum, effectiveTotal) / safeTotal * 100));
-  const computedSegments = [
-    ...segments,
-    ...showRemainder && remainder > 0 ? [{ value: remainder, severity: remainderSeverity }] : []
-  ];
-  const autoNumbers = (() => {
-    const base = segments.map((s) => s.value || 0);
-    if (showRemainder) base.push(remainder);
-    return base.map(formatNumberDa).join("/");
-  })();
-  const filteredSegments = computedSegments.filter((x) => x.value > 0);
-  const rootClass = [styles__default.default.container, className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: rootClass,
-      role: "progressbar",
-      "aria-valuemin": 0,
-      "aria-valuemax": effectiveTotal,
-      "aria-valuenow": Math.min(sum, effectiveTotal),
-      ...aria,
-      children: /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          className: styles__default.default.progressBar,
-          "data-rounded": rounded ? "true" : "false",
-          style: {
-            ["--progress-height"]: sizeTokenMap[size],
-            height: sizeTokenMap[size],
-            background: trackColor != null ? trackColor : "var(--color-bg-surface-subtle)"
-          },
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles__default.default.segmentsContainer, children: filteredSegments.map((seg, i) => /* @__PURE__ */ jsxRuntime.jsx(
-              SegmentWithTooltip,
-              {
-                seg,
-                index: i,
-                tooltipPlacement
-              },
-              `${i}`
-            )) }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: `${styles__default.default.progressCenter} ${filteredSegments.length === 0 ? styles__default.default.emptySegments : ""}`,
-                children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles__default.default.progressCenterLabel, children: centerLabel ? typeof centerLabel === "function" ? centerLabel(pctFilled) : centerLabel : autoNumbers })
-              }
-            )
-          ]
-        }
-      )
-    }
-  );
-};
-
-exports.SegmentedProgressBar = SegmentedProgressBar;

package/dist/components/segmented-progress-bar/SegmentedProgressBar.d.ts

@@ -1,27 +0,0 @@
-import React from 'react';
-import { TooltipPlacement } from '../../components/overlay/tooltip/TooltipProvider';
-import type { Severity } from '../../constants/severity.types';
-type ProgressSeverity = 'done' | 'progress' | 'missing';
-export type Segment = {
-    value: number;
-    severity?: Severity | ProgressSeverity;
-    color?: string;
-    label?: React.ReactNode;
-};
-export type ProgressBarSize = '2xs' | 'xxs' | 'xs' | 'sm' | 'md' | 'lg';
-export interface SegmentedProgressBarProps {
-    segments: Segment[];
-    total?: number;
-    showRemainder?: boolean;
-    remainderSeverity?: Severity | ProgressSeverity;
-    centerLabel?: React.ReactNode | ((filledPct: number) => React.ReactNode);
-    size?: ProgressBarSize;
-    rounded?: boolean;
-    trackColor?: string;
-    tooltipPlacement?: TooltipPlacement;
-    'aria-label'?: string;
-    className?: string;
-    'data-testid'?: string;
-}
-export declare const SegmentedProgressBar: React.FC<SegmentedProgressBarProps>;
-export {};

package/dist/components/segmented-progress-bar/SegmentedProgressBar.js

@@ -1,124 +0,0 @@
-'use client';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useTooltipTrigger } from '../../components/overlay/tooltip/useTooltipTrigger';
-import styles from './SegmentedProgressBar.module.css';
-
-const sizeTokenMap = {
-  "2xs": "var(--component-size-2xs)",
-  xxs: "var(--component-size-xxs)",
-  xs: "var(--component-size-xs)",
-  sm: "var(--component-size-sm)",
-  md: "var(--component-size-md)",
-  lg: "var(--component-size-lg)"
-};
-function formatNumberDa(value) {
-  return value.toLocaleString("da-DK");
-}
-function SegmentWithTooltip({
-  seg,
-  index,
-  tooltipPlacement
-}) {
-  var _a, _b;
-  const tooltipContent = typeof seg.label !== "undefined" ? seg.label : String((_a = seg.value) != null ? _a : 0);
-  const tooltipEnabled = tooltipContent !== null && tooltipContent !== void 0 && tooltipContent !== "";
-  const { triggerProps } = useTooltipTrigger({
-    content: tooltipEnabled ? tooltipContent : null,
-    placement: tooltipPlacement,
-    offset: 8
-  });
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: styles.segmentWrapper,
-      style: {
-        flex: `${Math.max(seg.value || 0, 0)} 0 0`
-      },
-      ...tooltipEnabled ? triggerProps : {},
-      children: /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: styles.progressSegment,
-          "data-index": index,
-          "data-severity": (_b = seg.severity) != null ? _b : "neutral",
-          style: seg.color ? {
-            ["--segment-color"]: seg.color
-          } : void 0
-        }
-      )
-    }
-  );
-}
-const SegmentedProgressBar = ({
-  segments,
-  total,
-  showRemainder = true,
-  remainderSeverity = "missing",
-  centerLabel,
-  size = "sm",
-  rounded = true,
-  trackColor,
-  tooltipPlacement = "top",
-  className,
-  ...aria
-}) => {
-  const sum = segments.reduce((acc, s) => acc + (s.value || 0), 0);
-  const effectiveTotal = total != null ? total : sum;
-  const safeTotal = Math.max(effectiveTotal, 1e-4);
-  const remainder = Math.max(effectiveTotal - sum, 0);
-  const pctFilled = Math.min(100, Math.max(0, Math.min(sum, effectiveTotal) / safeTotal * 100));
-  const computedSegments = [
-    ...segments,
-    ...showRemainder && remainder > 0 ? [{ value: remainder, severity: remainderSeverity }] : []
-  ];
-  const autoNumbers = (() => {
-    const base = segments.map((s) => s.value || 0);
-    if (showRemainder) base.push(remainder);
-    return base.map(formatNumberDa).join("/");
-  })();
-  const filteredSegments = computedSegments.filter((x) => x.value > 0);
-  const rootClass = [styles.container, className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: rootClass,
-      role: "progressbar",
-      "aria-valuemin": 0,
-      "aria-valuemax": effectiveTotal,
-      "aria-valuenow": Math.min(sum, effectiveTotal),
-      ...aria,
-      children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: styles.progressBar,
-          "data-rounded": rounded ? "true" : "false",
-          style: {
-            ["--progress-height"]: sizeTokenMap[size],
-            height: sizeTokenMap[size],
-            background: trackColor != null ? trackColor : "var(--color-bg-surface-subtle)"
-          },
-          children: [
-            /* @__PURE__ */ jsx("span", { className: styles.segmentsContainer, children: filteredSegments.map((seg, i) => /* @__PURE__ */ jsx(
-              SegmentWithTooltip,
-              {
-                seg,
-                index: i,
-                tooltipPlacement
-              },
-              `${i}`
-            )) }),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: `${styles.progressCenter} ${filteredSegments.length === 0 ? styles.emptySegments : ""}`,
-                children: /* @__PURE__ */ jsx("span", { className: styles.progressCenterLabel, children: centerLabel ? typeof centerLabel === "function" ? centerLabel(pctFilled) : centerLabel : autoNumbers })
-              }
-            )
-          ]
-        }
-      )
-    }
-  );
-};
-
-export { SegmentedProgressBar };