@elliemae/ds-slider 3.5.0-rc.9 → 3.6.0-next.0

package/dist/cjs/DSSlider.js

@@ -30,11 +30,11 @@ __export(DSSlider_exports, {
 });
 module.exports = __toCommonJS(DSSlider_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_SliderImp = __toESM(require("./components/SliderImp"));
 var import_prop_types = require("./prop-types");
-const DSSlider = (props) => /* @__PURE__ */ import_react.default.createElement(import_SliderImp.default, {
+const DSSlider = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SliderImp.default, {
   ...props
 });
 DSSlider.defaultProps = import_prop_types.defaultProps;

package/dist/cjs/DSSlider.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/DSSlider.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport SliderImp from './components/SliderImp';\nimport { defaultProps, sliderPropTypes } from './prop-types';\n\nconst DSSlider = (props) => <SliderImp {...props} />;\n\nDSSlider.defaultProps = defaultProps;\nDSSlider.propTypes = sliderPropTypes;\nDSSlider.displayName = 'DSSlider';\nconst DSSliderWithSchema = describe(DSSlider);\nDSSliderWithSchema.propTypes = sliderPropTypes;\n\nexport { DSSlider, DSSliderWithSchema };\nexport default DSSlider;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAyB;AACzB,uBAAsB;AACtB,wBAA8C;AAE9C,MAAM,WAAW,CAAC,UAAU,6BAAAA,QAAA,cAAC,iBAAAC,SAAA;AAAA,EAAW,GAAG;AAAA,CAAO;AAElD,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,MAAM,yBAAqB,8BAAS,QAAQ;AAC5C,mBAAmB,YAAY;AAG/B,IAAO,mBAAQ;",
-  "names": ["React", "SliderImp"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAyB;AACzB,uBAAsB;AACtB,wBAA8C;AAE9C,MAAM,WAAW,CAAC,UAAU,4CAAC,iBAAAA,SAAA;AAAA,EAAW,GAAG;AAAA,CAAO;AAElD,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,MAAM,yBAAqB,8BAAS,QAAQ;AAC5C,mBAAmB,YAAY;AAG/B,IAAO,mBAAQ;",
+  "names": ["SliderImp"]
 }

package/dist/cjs/components/SliderImp.js

@@ -28,7 +28,8 @@ __export(SliderImp_exports, {
 });
 module.exports = __toCommonJS(SliderImp_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_uuid = require("uuid");
 var import_react_range = require("react-range");
 var import_ds_utilities = require("@elliemae/ds-utilities");
@@ -125,67 +126,87 @@ const SliderImp = (props) => {
     () => (0, import_utils.conformedLabel)(rangeValues, label, labelWithValue, withTwoHandles, customTickMarksValues, parsedStep),
     [rangeValues, label, labelWithValue, withTwoHandles, customTickMarksValues, parsedStep]
   );
-  const SliderLabel = /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_styled.LabelText, null, finalLabelText), finalLabelText && " ", /* @__PURE__ */ import_react.default.createElement(import_styled.ValueText, {
-    disabled
-  }, finalValueText));
+  const SliderLabel = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.LabelText, {
+        children: finalLabelText
+      }),
+      finalLabelText && " ",
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.ValueText, {
+        disabled,
+        children: finalValueText
+      })
+    ]
+  });
   const theme = (0, import_react.useContext)(import_ds_system.ThemeContext);
-  return /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.TooltipTextProvider, null, /* @__PURE__ */ import_react.default.createElement("div", {
-    ref
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    width: "100%",
-    style: { maxWidth: "100%" },
-    containerProps,
-    "data-testid": "slider",
-    alignItems: "center",
-    rows: ["auto", "auto"]
-  }, /* @__PURE__ */ import_react.default.createElement(import_context.SliderContext.Provider, {
-    value: {
-      disabled,
-      sliderUUID,
-      label,
-      labelWithValue,
-      minValue: parsedMinValue,
-      maxValue: parsedMaxValue,
-      step: parsedStep,
-      parsedValuesArray,
-      withTickMarks,
-      withTickMarksValues,
-      withTwoHandles,
-      customTickMarksValues,
-      rangeValues,
-      fullSelectedValues,
-      zIndex: zIndex ?? theme.zIndex.tooltip
-    }
-  }, finalLabelText && /* @__PURE__ */ import_react.default.createElement(import_styled.LabelWrapper, {
-    width
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.default, {
-    value: SliderLabel
-  })), /* @__PURE__ */ import_react.default.createElement(import_styled.StyledRangeWrapper, null, /* @__PURE__ */ import_react.default.createElement(import_react_range.Range, {
-    step: parsedStep,
-    min: parsedMinValue,
-    max: parsedMaxValue,
-    values: rangeValues,
-    disabled,
-    onChange: (values) => {
-      if (withTwoHandles && values[0] === values[1])
-        return;
-      setRangeValues(values);
-      onChange(values);
-    },
-    renderTrack: ({ props: trackProps, children }) => /* @__PURE__ */ import_react.default.createElement(import_Track.default, {
-      props: trackProps
-    }, children),
-    renderThumb: (renderArgs) => {
-      const { index, props: thumbProps, isDragged } = renderArgs;
-      return /* @__PURE__ */ import_react.default.createElement(import_Thumb.default, {
-        key: `${sliderUUID}-${thumbProps.key}`,
-        props: thumbProps,
-        isDragged,
-        index
-      });
-    },
-    allowOverlap: false
-  }))))));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.TooltipTextProvider, {
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+      ref,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {
+        width: "100%",
+        style: { maxWidth: "100%" },
+        containerProps,
+        "data-testid": "slider",
+        alignItems: "center",
+        rows: ["auto", "auto"],
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_context.SliderContext.Provider, {
+          value: {
+            disabled,
+            sliderUUID,
+            label,
+            labelWithValue,
+            minValue: parsedMinValue,
+            maxValue: parsedMaxValue,
+            step: parsedStep,
+            parsedValuesArray,
+            withTickMarks,
+            withTickMarksValues,
+            withTwoHandles,
+            customTickMarksValues,
+            rangeValues,
+            fullSelectedValues,
+            zIndex: zIndex ?? theme.zIndex.tooltip
+          },
+          children: [
+            finalLabelText && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.LabelWrapper, {
+              width,
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.default, {
+                value: SliderLabel
+              })
+            }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledRangeWrapper, {
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_range.Range, {
+                step: parsedStep,
+                min: parsedMinValue,
+                max: parsedMaxValue,
+                values: rangeValues,
+                disabled,
+                onChange: (values) => {
+                  if (withTwoHandles && values[0] === values[1])
+                    return;
+                  setRangeValues(values);
+                  onChange(values);
+                },
+                renderTrack: ({ props: trackProps, children }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Track.default, {
+                  props: trackProps,
+                  children
+                }),
+                renderThumb: (renderArgs) => {
+                  const { index, props: thumbProps, isDragged } = renderArgs;
+                  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Thumb.default, {
+                    props: thumbProps,
+                    isDragged,
+                    index
+                  }, `${sliderUUID}-${thumbProps.key}`);
+                },
+                allowOverlap: false
+              })
+            })
+          ]
+        })
+      })
+    })
+  });
 };
 var SliderImp_default = SliderImp;
 //# sourceMappingURL=SliderImp.js.map

package/dist/cjs/components/SliderImp.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/components/SliderImp.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\nimport React, { useState, useEffect, useRef, useMemo, useContext } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\nimport { Range } from 'react-range';\nimport { usePrevious } from '@elliemae/ds-utilities';\nimport DSTruncatedTooltipText, { TooltipTextProvider } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ThemeContext } from '@elliemae/ds-system';\nimport Track from './Track';\nimport Thumb from './Thumb';\nimport { LabelWrapper, StyledRangeWrapper, LabelText, ValueText } from './styled';\nimport { conformedLabel } from './utils';\nimport { SliderContext } from './context';\n\nconst getSubArrayFromRange = (\n  arr,\n  [minVal, maxVal], // maxValue is undefined when only one handler\n  isCustomTickMarksValues = false,\n) => {\n  const trueMinVal = isCustomTickMarksValues ? arr[minVal] : minVal;\n  const minIndex = arr.findIndex((el) => el === trueMinVal);\n\n  if (maxVal !== undefined) {\n    // if two handlers, return the found slice\n    const trueMaxVal = isCustomTickMarksValues ? arr[maxVal] : maxVal;\n    const maxIndex = arr.findIndex((el) => el === trueMaxVal);\n\n    if (minIndex >= 0 && maxIndex > minIndex) return arr.slice(minIndex, maxIndex + 1);\n    return [];\n  }\n  // if only one handler, return the value in an array\n  return [trueMinVal];\n};\n\nconst SliderImp = (props) => {\n  const {\n    containerProps,\n    disabled,\n    label,\n    labelWithValue,\n    minValue,\n    maxValue,\n    step,\n    onChange,\n    withTickMarks,\n    withTickMarksValues,\n    withTwoHandles,\n    customTickMarksValues,\n    zIndex,\n  } = props;\n  const ref = useRef();\n  const [width, setWidth] = useState(0);\n  const sliderUUID = useMemo(() => uuidv4(), []);\n\n  const parsedMinValue = useMemo(() => {\n    // ensure this works correctly with customTickMarksValues array\n    if (customTickMarksValues?.length) return 0;\n    return minValue;\n  }, [customTickMarksValues?.length, minValue]);\n  const parsedMaxValue = useMemo(() => {\n    // ensure this works correctly with customTickMarksValues array\n    if (customTickMarksValues?.length) return customTickMarksValues?.length - 1;\n    return maxValue;\n  }, [customTickMarksValues?.length, maxValue]);\n  const parsedStep = useMemo(() => {\n    // ensure this works correctly with customTickMarksValues array\n    if (customTickMarksValues?.length) return 1;\n    return step;\n  }, [customTickMarksValues?.length, step]);\n\n  const parsedValuesArray = useMemo(() => {\n    // ensure this works correctly with customTickMarksValues array\n    if (customTickMarksValues?.length) return customTickMarksValues;\n    const newLength = Math.ceil(maxValue / step);\n    const valuesArray = [];\n    for (let i = 0; i <= newLength; i += 1) {\n      valuesArray.push(step * i);\n    }\n\n    return valuesArray;\n  }, [customTickMarksValues?.length, minValue, maxValue, step]);\n\n  const [rangeValues, setRangeValues] = useState(withTwoHandles ? [parsedMinValue, parsedMaxValue] : [parsedMinValue]);\n  // track the full slice of values selected instead of only the limits\n  // this is important to handle the selected range labels colors\n  const [fullSelectedValues, setFullSelectedValues] = useState([]);\n  useEffect(() => {\n    const selectedRangeValues = getSubArrayFromRange(parsedValuesArray, rangeValues, !!customTickMarksValues?.length);\n    setFullSelectedValues(selectedRangeValues);\n  }, [parsedValuesArray, rangeValues, customTickMarksValues?.length]);\n\n  const prevWithTwoHandles = usePrevious(withTwoHandles);\n  const resizeHandler = () => {\n    setWidth(0);\n    setWidth(ref.current?.clientWidth);\n  };\n  useEffect(() => {\n    window.addEventListener('resize', resizeHandler);\n    return () => window.removeEventListener('resize', resizeHandler);\n  });\n  useEffect(() => {\n    if (!prevWithTwoHandles && withTwoHandles) {\n      setRangeValues([parsedMinValue, parsedMaxValue]);\n    } else if (prevWithTwoHandles && !withTwoHandles) {\n      setRangeValues([parsedMinValue]);\n    }\n  }, [withTwoHandles]);\n\n  useEffect(() => {\n    setWidth(ref.current?.clientWidth);\n  }, [ref.current?.clientWidth]);\n\n  const [finalLabelText, finalValueText] = useMemo(\n    () => conformedLabel(rangeValues, label, labelWithValue, withTwoHandles, customTickMarksValues, parsedStep),\n    [rangeValues, label, labelWithValue, withTwoHandles, customTickMarksValues, parsedStep],\n  );\n\n  const SliderLabel = (\n    <>\n      <LabelText>{finalLabelText}</LabelText>\n      {finalLabelText && ' '}\n      <ValueText disabled={disabled}>{finalValueText}</ValueText>\n    </>\n  );\n\n  const theme = useContext(ThemeContext);\n\n  return (\n    <TooltipTextProvider>\n      <div ref={ref}>\n        <Grid\n          width=\"100%\"\n          style={{ maxWidth: '100%' }}\n          containerProps={containerProps}\n          data-testid=\"slider\"\n          alignItems=\"center\"\n          rows={['auto', 'auto']}\n        >\n          <SliderContext.Provider\n            value={{\n              disabled,\n              sliderUUID,\n              label,\n              labelWithValue,\n              minValue: parsedMinValue,\n              maxValue: parsedMaxValue,\n              step: parsedStep,\n              parsedValuesArray,\n              withTickMarks,\n              withTickMarksValues,\n              withTwoHandles,\n              customTickMarksValues,\n              rangeValues,\n              fullSelectedValues,\n              zIndex: zIndex ?? theme.zIndex.tooltip,\n            }}\n          >\n            {finalLabelText && (\n              <LabelWrapper width={width}>\n                <DSTruncatedTooltipText value={SliderLabel} />\n              </LabelWrapper>\n            )}\n            <StyledRangeWrapper>\n              <Range\n                step={parsedStep}\n                min={parsedMinValue}\n                max={parsedMaxValue}\n                values={rangeValues}\n                disabled={disabled}\n                onChange={(values) => {\n                  if (withTwoHandles && values[0] === values[1]) return;\n                  setRangeValues(values);\n                  onChange(values);\n                }}\n                renderTrack={({ props: trackProps, children }) => <Track props={trackProps}>{children}</Track>}\n                renderThumb={(renderArgs) => {\n                  const { index, props: thumbProps, isDragged } = renderArgs;\n                  return (\n                    <Thumb\n                      key={`${sliderUUID}-${thumbProps.key}`}\n                      props={thumbProps}\n                      isDragged={isDragged}\n                      index={index}\n                    />\n                  );\n                }}\n                allowOverlap={false}\n              />\n            </StyledRangeWrapper>\n          </SliderContext.Provider>\n        </Grid>\n      </div>\n    </TooltipTextProvider>\n  );\n};\n\n// SliderImp.propTypes = sliderPropTypes;\n\nexport default SliderImp;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": ["uuidv4", "React", "DSTruncatedTooltipText", "Track", "Thumb"]
+  "mappings": "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",
+  "names": ["uuidv4", "DSTruncatedTooltipText", "Track", "Thumb"]
 }

package/dist/cjs/components/Thumb.js

@@ -28,7 +28,8 @@ __export(Thumb_exports, {
 });
 module.exports = __toCommonJS(Thumb_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_prop_types = __toESM(require("prop-types"));
 var import_ds_tooltip = require("@elliemae/ds-tooltip");
 var import_context = require("./context");
@@ -38,21 +39,21 @@ const Thumb = ({ index, props, isDragged }) => {
   const [isHovered, setIsHovered] = (0, import_react.useState)(false);
   const { disabled, rangeValues, zIndex, customTickMarksValues, step, minValue } = (0, import_react.useContext)(import_context.SliderContext);
   const cleanedProps = { ...props };
-  return /* @__PURE__ */ import_react.default.createElement(import_styled.ThumbStyled, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.ThumbStyled, {
     ...cleanedProps,
     "data-testid": "slider-thumb",
     disabled,
     style: { ...cleanedProps.style, zIndex },
     index,
     onMouseEnter: () => setIsHovered(true),
-    onMouseLeave: () => setIsHovered(false)
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_tooltip.DSTooltipV3, {
-    key: (0, import_utils.conformedThumbLabel)(rangeValues, customTickMarksValues, index, step, minValue),
-    text: (0, import_utils.conformedThumbLabel)(rangeValues, customTickMarksValues, index, step, minValue),
-    showPopover: isDragged || isHovered,
-    customOffset: [0, 20],
-    withoutAnimation: true
-  }));
+    onMouseLeave: () => setIsHovered(false),
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_tooltip.DSTooltipV3, {
+      text: (0, import_utils.conformedThumbLabel)(rangeValues, customTickMarksValues, index, step, minValue),
+      showPopover: isDragged || isHovered,
+      customOffset: [0, 20],
+      withoutAnimation: true
+    }, (0, import_utils.conformedThumbLabel)(rangeValues, customTickMarksValues, index, step, minValue))
+  });
 };
 Thumb.propTypes = {
   index: import_prop_types.default.number,

package/dist/cjs/components/Thumb.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/components/Thumb.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React, { useContext, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip';\nimport { SliderContext } from './context';\nimport { conformedThumbLabel } from './utils';\nimport { ThumbStyled, TooltipContainerStyled, TooltipArrow } from './styled';\n\nconst Thumb = ({ index, props, isDragged }) => {\n  const [isHovered, setIsHovered] = useState(false);\n  const { disabled, rangeValues, zIndex, customTickMarksValues, step, minValue } = useContext(SliderContext);\n\n  const cleanedProps = { ...props };\n  // delete cleanedProps.key;\n  // delete cleanedProps.draggable;\n  return (\n    // ...props is needed because it's received from the library\n    // ...props.style has it own style from the library but has a bug with the zIndex for two thumbs, so that's why it has to be overwrite\n    <ThumbStyled\n      {...cleanedProps}\n      data-testid=\"slider-thumb\"\n      disabled={disabled}\n      // eslint-disable-next-line react/prop-types\n      style={{ ...cleanedProps.style, zIndex }}\n      index={index}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n    >\n      <DSTooltipV3\n        key={conformedThumbLabel(rangeValues, customTickMarksValues, index, step, minValue)}\n        text={conformedThumbLabel(rangeValues, customTickMarksValues, index, step, minValue)}\n        showPopover={isDragged || isHovered}\n        customOffset={[0, 20]}\n        withoutAnimation\n      ></DSTooltipV3>\n    </ThumbStyled>\n  );\n};\n\n/* {createPortal(\n        <TooltipContainerStyled isDragged={isDragged} isHovered={isHovered}>\n          <TooltipText>{</TooltipText>\n          <TooltipArrow />\n        </TooltipContainerStyled>,\n        document.body,\n      )} */\n\nThumb.propTypes = {\n  index: PropTypes.number,\n  props: PropTypes.shape({\n    style: PropTypes.shape({}).isRequired,\n  }).isRequired,\n  isDragged: PropTypes.bool,\n};\n\nexport default Thumb;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA4C;AAE5C,wBAAsB;AACtB,wBAA4B;AAC5B,qBAA8B;AAC9B,mBAAoC;AACpC,oBAAkE;AAElE,MAAM,QAAQ,CAAC,EAAE,OAAO,OAAO,UAAU,MAAM;AAC7C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAChD,QAAM,EAAE,UAAU,aAAa,QAAQ,uBAAuB,MAAM,SAAS,QAAI,yBAAW,4BAAa;AAEzG,QAAM,eAAe,EAAE,GAAG,MAAM;AAGhC,SAGE,6BAAAA,QAAA,cAAC;AAAA,IACE,GAAG;AAAA,IACJ,eAAY;AAAA,IACZ;AAAA,IAEA,OAAO,EAAE,GAAG,aAAa,OAAO,OAAO;AAAA,IACvC;AAAA,IACA,cAAc,MAAM,aAAa,IAAI;AAAA,IACrC,cAAc,MAAM,aAAa,KAAK;AAAA,KAEtC,6BAAAA,QAAA,cAAC;AAAA,IACC,SAAK,kCAAoB,aAAa,uBAAuB,OAAO,MAAM,QAAQ;AAAA,IAClF,UAAM,kCAAoB,aAAa,uBAAuB,OAAO,MAAM,QAAQ;AAAA,IACnF,aAAa,aAAa;AAAA,IAC1B,cAAc,CAAC,GAAG,EAAE;AAAA,IACpB,kBAAgB;AAAA,GACjB,CACH;AAEJ;AAUA,MAAM,YAAY;AAAA,EAChB,OAAO,kBAAAC,QAAU;AAAA,EACjB,OAAO,kBAAAA,QAAU,MAAM;AAAA,IACrB,OAAO,kBAAAA,QAAU,MAAM,CAAC,CAAC,EAAE;AAAA,EAC7B,CAAC,EAAE;AAAA,EACH,WAAW,kBAAAA,QAAU;AACvB;AAEA,IAAO,gBAAQ;",
-  "names": ["React", "PropTypes"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA4C;AAE5C,wBAAsB;AACtB,wBAA4B;AAC5B,qBAA8B;AAC9B,mBAAoC;AACpC,oBAAkE;AAElE,MAAM,QAAQ,CAAC,EAAE,OAAO,OAAO,UAAU,MAAM;AAC7C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAChD,QAAM,EAAE,UAAU,aAAa,QAAQ,uBAAuB,MAAM,SAAS,QAAI,yBAAW,4BAAa;AAEzG,QAAM,eAAe,EAAE,GAAG,MAAM;AAGhC,SAGE,4CAAC;AAAA,IACE,GAAG;AAAA,IACJ,eAAY;AAAA,IACZ;AAAA,IAEA,OAAO,EAAE,GAAG,aAAa,OAAO,OAAO;AAAA,IACvC;AAAA,IACA,cAAc,MAAM,aAAa,IAAI;AAAA,IACrC,cAAc,MAAM,aAAa,KAAK;AAAA,IAEtC,sDAAC;AAAA,MAEC,UAAM,kCAAoB,aAAa,uBAAuB,OAAO,MAAM,QAAQ;AAAA,MACnF,aAAa,aAAa;AAAA,MAC1B,cAAc,CAAC,GAAG,EAAE;AAAA,MACpB,kBAAgB;AAAA,WAJX,kCAAoB,aAAa,uBAAuB,OAAO,MAAM,QAAQ,CAKnF;AAAA,GACH;AAEJ;AAUA,MAAM,YAAY;AAAA,EAChB,OAAO,kBAAAA,QAAU;AAAA,EACjB,OAAO,kBAAAA,QAAU,MAAM;AAAA,IACrB,OAAO,kBAAAA,QAAU,MAAM,CAAC,CAAC,EAAE;AAAA,EAC7B,CAAC,EAAE;AAAA,EACH,WAAW,kBAAAA,QAAU;AACvB;AAEA,IAAO,gBAAQ;",
+  "names": ["PropTypes"]
 }

package/dist/cjs/components/TickMarks.js

@@ -28,7 +28,8 @@ __export(TickMarks_exports, {
 });
 module.exports = __toCommonJS(TickMarks_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_ds_system = require("@elliemae/ds-system");
 var import_ds_system2 = require("@elliemae/ds-system");
 var import_context = require("./context");
@@ -37,16 +38,16 @@ const TickMarks = () => {
   const dots = [];
   for (let index = minValue || 0; index <= maxValue; index += step) {
     const isActive = withTwoHandles ? rangeValues[0] <= index && index < rangeValues[1] : rangeValues[0] > index;
-    dots.push(/* @__PURE__ */ import_react.default.createElement(Dot, {
+    dots.push(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Dot, {
       "data-testid": "slider-dot",
-      isActive,
-      key: index
-    }));
+      isActive
+    }, index));
   }
-  return /* @__PURE__ */ import_react.default.createElement(DotsContainer, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DotsContainer, {
     "data-testid": "slider-tick-marks",
-    zIndex
-  }, dots);
+    zIndex,
+    children: dots
+  });
 };
 const Dot = import_ds_system.styled.div`
   &:after {

package/dist/cjs/components/TickMarks.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/components/TickMarks.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable indent */\nimport React, { useContext } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { SliderContext } from './context';\n\nconst TickMarks = () => {\n  const { minValue, maxValue, rangeValues, step, withTwoHandles, zIndex } = useContext(SliderContext);\n  const dots = [];\n\n  for (let index = minValue || 0; index <= maxValue; index += step) {\n    const isActive = withTwoHandles ? rangeValues[0] <= index && index < rangeValues[1] : rangeValues[0] > index;\n    dots.push(<Dot data-testid=\"slider-dot\" isActive={isActive} key={index} />);\n  }\n\n  return (\n    <DotsContainer data-testid=\"slider-tick-marks\" zIndex={zIndex}>\n      {dots}\n    </DotsContainer>\n  );\n};\n\nconst Dot = styled.div`\n  &:after {\n    content: '';\n    background: ${(props) => (props.isActive ? props.theme.colors.brand[300] : props.theme.colors.neutral[400])};\n    border-radius: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n    display: block;\n    position: relative;\n    width: 2px;\n    height: 2px;\n  }\n`;\n\nconst DotsContainer = styled.div`\n  padding: 0 calc(${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)} * 0.5);\n  align-items: center;\n  display: flex;\n  justify-content: space-between;\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: ${(props) => props.zIndex - 1};\n`;\n\nexport default TickMarks;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkC;AAClC,uBAAuB;AACvB,IAAAA,oBAAyC;AACzC,qBAA8B;AAE9B,MAAM,YAAY,MAAM;AACtB,QAAM,EAAE,UAAU,UAAU,aAAa,MAAM,gBAAgB,OAAO,QAAI,yBAAW,4BAAa;AAClG,QAAM,OAAO,CAAC;AAEd,WAAS,QAAQ,YAAY,GAAG,SAAS,UAAU,SAAS,MAAM;AAChE,UAAM,WAAW,iBAAiB,YAAY,MAAM,SAAS,QAAQ,YAAY,KAAK,YAAY,KAAK;AACvG,SAAK,KAAK,6BAAAC,QAAA,cAAC;AAAA,MAAI,eAAY;AAAA,MAAa;AAAA,MAAoB,KAAK;AAAA,KAAO,CAAE;AAAA,EAC5E;AAEA,SACE,6BAAAA,QAAA,cAAC;AAAA,IAAc,eAAY;AAAA,IAAoB;AAAA,KAC5C,IACH;AAEJ;AAEA,MAAM,MAAM,wBAAO;AAAA;AAAA;AAAA,kBAGD,CAAC,UAAW,MAAM,WAAW,MAAM,MAAM,OAAO,MAAM,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA,qBACrF,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ9E,MAAM,gBAAgB,wBAAO;AAAA,oBACT,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAUhE,CAAC,UAAU,MAAM,SAAS;AAAA;AAGvC,IAAO,oBAAQ;",
-  "names": ["import_ds_system", "React"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAkC;AAClC,uBAAuB;AACvB,IAAAA,oBAAyC;AACzC,qBAA8B;AAE9B,MAAM,YAAY,MAAM;AACtB,QAAM,EAAE,UAAU,UAAU,aAAa,MAAM,gBAAgB,OAAO,QAAI,yBAAW,4BAAa;AAClG,QAAM,OAAO,CAAC;AAEd,WAAS,QAAQ,YAAY,GAAG,SAAS,UAAU,SAAS,MAAM;AAChE,UAAM,WAAW,iBAAiB,YAAY,MAAM,SAAS,QAAQ,YAAY,KAAK,YAAY,KAAK;AACvG,SAAK,KAAK,4CAAC;AAAA,MAAI,eAAY;AAAA,MAAa;AAAA,OAAyB,KAAO,CAAE;AAAA,EAC5E;AAEA,SACE,4CAAC;AAAA,IAAc,eAAY;AAAA,IAAoB;AAAA,IAC5C;AAAA,GACH;AAEJ;AAEA,MAAM,MAAM,wBAAO;AAAA;AAAA;AAAA,kBAGD,CAAC,UAAW,MAAM,WAAW,MAAM,MAAM,OAAO,MAAM,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA,qBACrF,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ9E,MAAM,gBAAgB,wBAAO;AAAA,oBACT,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAUhE,CAAC,UAAU,MAAM,SAAS;AAAA;AAGvC,IAAO,oBAAQ;",
+  "names": ["import_ds_system"]
 }

package/dist/cjs/components/TickMarksValues.js

@@ -28,7 +28,8 @@ __export(TickMarksValues_exports, {
 });
 module.exports = __toCommonJS(TickMarksValues_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_ds_system = require("@elliemae/ds-system");
 var import_ds_system2 = require("@elliemae/ds-system");
 var import_context = require("./context");
@@ -37,17 +38,18 @@ const TickMarks = () => {
   const TickMarksLabels = (0, import_react.useMemo)(
     () => parsedValuesArray.map((value) => {
       const isSelected = fullSelectedValues.findIndex((selectedVal) => selectedVal === value) >= 0;
-      return /* @__PURE__ */ import_react.default.createElement(TickMarkValue, {
-        key: `${sliderUUID}-${value}`,
-        isSelected
-      }, value);
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TickMarkValue, {
+        isSelected,
+        children: value
+      }, `${sliderUUID}-${value}`);
     }),
     [parsedValuesArray, sliderUUID, fullSelectedValues]
   );
   const PureTickMArksValues = (0, import_react.useMemo)(
-    () => /* @__PURE__ */ import_react.default.createElement(TickMarksContainer, {
-      "data-testid": "slider-tick-marks-values"
-    }, TickMarksLabels),
+    () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TickMarksContainer, {
+      "data-testid": "slider-tick-marks-values",
+      children: TickMarksLabels
+    }),
     [TickMarksLabels]
   );
   return PureTickMArksValues;

package/dist/cjs/components/TickMarksValues.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/components/TickMarksValues.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable no-plusplus */\nimport React, { useContext, useMemo } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { SliderContext } from './context';\n\nconst TickMarks = () => {\n  const { parsedValuesArray, fullSelectedValues, sliderUUID } = useContext(SliderContext);\n\n  const TickMarksLabels = useMemo(\n    () =>\n      parsedValuesArray.map((value) => {\n        const isSelected = fullSelectedValues.findIndex((selectedVal) => selectedVal === value) >= 0;\n        return (\n          <TickMarkValue key={`${sliderUUID}-${value}`} isSelected={isSelected}>\n            {value}\n          </TickMarkValue>\n        );\n      }),\n\n    [parsedValuesArray, sliderUUID, fullSelectedValues],\n  );\n\n  const PureTickMArksValues = useMemo(\n    () => <TickMarksContainer data-testid=\"slider-tick-marks-values\">{TickMarksLabels}</TickMarksContainer>,\n    [TickMarksLabels],\n  );\n\n  return PureTickMArksValues;\n};\n\nconst TickMarkValue = styled.div`\n  min-height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n  overflow: visible;\n  transform: translateX(-100%);\n  width: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n  color: ${(props) => (props.isSelected ? props.theme.colors.neutral[800] : props.theme.colors.neutral[500])};\n`;\n\nconst TickMarksContainer = styled.div`\n  display: flex;\n  justify-content: space-between;\n`;\n\nexport default TickMarks;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA2C;AAC3C,uBAAuB;AACvB,IAAAA,oBAAyC;AACzC,qBAA8B;AAE9B,MAAM,YAAY,MAAM;AACtB,QAAM,EAAE,mBAAmB,oBAAoB,WAAW,QAAI,yBAAW,4BAAa;AAEtF,QAAM,sBAAkB;AAAA,IACtB,MACE,kBAAkB,IAAI,CAAC,UAAU;AAC/B,YAAM,aAAa,mBAAmB,UAAU,CAAC,gBAAgB,gBAAgB,KAAK,KAAK;AAC3F,aACE,6BAAAC,QAAA,cAAC;AAAA,QAAc,KAAK,GAAG,cAAc;AAAA,QAAS;AAAA,SAC3C,KACH;AAAA,IAEJ,CAAC;AAAA,IAEH,CAAC,mBAAmB,YAAY,kBAAkB;AAAA,EACpD;AAEA,QAAM,0BAAsB;AAAA,IAC1B,MAAM,6BAAAA,QAAA,cAAC;AAAA,MAAmB,eAAY;AAAA,OAA4B,eAAgB;AAAA,IAClF,CAAC,eAAe;AAAA,EAClB;AAEA,SAAO;AACT;AAEA,MAAM,gBAAgB,wBAAO;AAAA,gBACb,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA,WAG5D,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,WACzD,CAAC,UAAW,MAAM,aAAa,MAAM,MAAM,OAAO,QAAQ,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGvG,MAAM,qBAAqB,wBAAO;AAAA;AAAA;AAAA;AAKlC,IAAO,0BAAQ;",
-  "names": ["import_ds_system", "React"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAA2C;AAC3C,uBAAuB;AACvB,IAAAA,oBAAyC;AACzC,qBAA8B;AAE9B,MAAM,YAAY,MAAM;AACtB,QAAM,EAAE,mBAAmB,oBAAoB,WAAW,QAAI,yBAAW,4BAAa;AAEtF,QAAM,sBAAkB;AAAA,IACtB,MACE,kBAAkB,IAAI,CAAC,UAAU;AAC/B,YAAM,aAAa,mBAAmB,UAAU,CAAC,gBAAgB,gBAAgB,KAAK,KAAK;AAC3F,aACE,4CAAC;AAAA,QAA6C;AAAA,QAC3C;AAAA,SADiB,GAAG,cAAc,OAErC;AAAA,IAEJ,CAAC;AAAA,IAEH,CAAC,mBAAmB,YAAY,kBAAkB;AAAA,EACpD;AAEA,QAAM,0BAAsB;AAAA,IAC1B,MAAM,4CAAC;AAAA,MAAmB,eAAY;AAAA,MAA4B;AAAA,KAAgB;AAAA,IAClF,CAAC,eAAe;AAAA,EAClB;AAEA,SAAO;AACT;AAEA,MAAM,gBAAgB,wBAAO;AAAA,gBACb,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA,WAG5D,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,WACzD,CAAC,UAAW,MAAM,aAAa,MAAM,MAAM,OAAO,QAAQ,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGvG,MAAM,qBAAqB,wBAAO;AAAA;AAAA;AAAA;AAKlC,IAAO,0BAAQ;",
+  "names": ["import_ds_system"]
 }

package/dist/cjs/components/Track.js

@@ -28,7 +28,8 @@ __export(Track_exports, {
 });
 module.exports = __toCommonJS(Track_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_react_range = require("react-range");
 var import_ds_system = require("@elliemae/ds-system");
 var import_ds_system2 = require("@elliemae/ds-system");
@@ -45,14 +46,23 @@ const Track = ({ children, props }) => {
     withTickMarksValues,
     withTwoHandles
   } = (0, import_react.useContext)(import_context.SliderContext);
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(TrackStyled, {
-    ...props,
-    disabled,
-    minValue,
-    maxValue,
-    rangeValues,
-    withTwoHandles
-  }, children, withTickMarks && !disabled && /* @__PURE__ */ import_react.default.createElement(import_TickMarks.default, null)), withTickMarksValues && /* @__PURE__ */ import_react.default.createElement(import_TickMarksValues.default, null));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TrackStyled, {
+        ...props,
+        disabled,
+        minValue,
+        maxValue,
+        rangeValues,
+        withTwoHandles,
+        children: [
+          children,
+          withTickMarks && !disabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TickMarks.default, {})
+        ]
+      }),
+      withTickMarksValues && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TickMarksValues.default, {})
+    ]
+  });
 };
 const TrackStyled = import_ds_system.styled.div`
   position: relative;

package/dist/cjs/components/Track.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/components/Track.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable indent */\n/* eslint-disable react/prop-types */\nimport React, { useContext } from 'react';\nimport { getTrackBackground } from 'react-range';\nimport { styled } from '@elliemae/ds-system';\nimport { __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nimport TickMarks from './TickMarks';\nimport TickMarksValues from './TickMarksValues';\nimport { SliderContext } from './context';\n\nconst Track = ({ children, props }) => {\n  const {\n    disabled,\n    minValue,\n    maxValue,\n    rangeValues,\n    withTickMarks,\n    withTickMarksValues,\n    withTwoHandles,\n  } = useContext(SliderContext);\n\n  return (\n    <>\n      <TrackStyled\n        {...props} // This is needed because it's received from the library\n        disabled={disabled}\n        minValue={minValue}\n        maxValue={maxValue}\n        rangeValues={rangeValues}\n        withTwoHandles={withTwoHandles}\n      >\n        {children}\n        {withTickMarks && !disabled && <TickMarks />}\n      </TrackStyled>\n      {withTickMarksValues && <TickMarksValues />}\n    </>\n  );\n};\n\nconst TrackStyled = styled.div`\n  position: relative;\n  height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n  width: 100%;\n  min-width: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxl)};\n  border-radius: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n  background: ${(props) =>\n    props.disabled\n      ? props.theme.colors.neutral[100]\n      : getTrackBackground({\n          values: props.rangeValues,\n          colors: props.withTwoHandles\n            ? [\n                props.theme.colors.neutral[100],\n                props.theme.colors.brand[600],\n                props.theme.colors.neutral[100],\n              ]\n            : [props.theme.colors.brand[600], props.theme.colors.neutral[100]],\n          min: props.minValue,\n          max: props.maxValue,\n        })};\n`;\n\nexport default Track;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAkC;AAClC,yBAAmC;AACnC,uBAAuB;AACvB,IAAAA,oBAAyC;AAEzC,uBAAsB;AACtB,6BAA4B;AAC5B,qBAA8B;AAE9B,MAAM,QAAQ,CAAC,EAAE,UAAU,MAAM,MAAM;AACrC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,4BAAa;AAE5B,SACE,6BAAAC,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA,cAAC;AAAA,IACE,GAAG;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,KAEC,UACA,iBAAiB,CAAC,YAAY,6BAAAA,QAAA,cAAC,iBAAAC,SAAA,IAAU,CAC5C,GACC,uBAAuB,6BAAAD,QAAA,cAAC,uBAAAE,SAAA,IAAgB,CAC3C;AAEJ;AAEA,MAAM,cAAc,wBAAO;AAAA;AAAA,YAEf,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA,eAEtD,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,mBACrD,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,gBAC5D,CAAC,UACb,MAAM,WACF,MAAM,MAAM,OAAO,QAAQ,WAC3B,uCAAmB;AAAA,EACjB,QAAQ,MAAM;AAAA,EACd,QAAQ,MAAM,iBACV;AAAA,IACE,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,MAAM;AAAA,IACzB,MAAM,MAAM,OAAO,QAAQ;AAAA,EAC7B,IACA,CAAC,MAAM,MAAM,OAAO,MAAM,MAAM,MAAM,MAAM,OAAO,QAAQ,IAAI;AAAA,EACnE,KAAK,MAAM;AAAA,EACX,KAAK,MAAM;AACb,CAAC;AAAA;AAGT,IAAO,gBAAQ;",
-  "names": ["import_ds_system", "React", "TickMarks", "TickMarksValues"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,mBAAkC;AAClC,yBAAmC;AACnC,uBAAuB;AACvB,IAAAA,oBAAyC;AAEzC,uBAAsB;AACtB,6BAA4B;AAC5B,qBAA8B;AAE9B,MAAM,QAAQ,CAAC,EAAE,UAAU,MAAM,MAAM;AACrC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,4BAAa;AAE5B,SACE;AAAA,IACE;AAAA,mDAAC;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,UACA,iBAAiB,CAAC,YAAY,4CAAC,iBAAAC,SAAA,EAAU;AAAA;AAAA,OAC5C;AAAA,MACC,uBAAuB,4CAAC,uBAAAC,SAAA,EAAgB;AAAA;AAAA,GAC3C;AAEJ;AAEA,MAAM,cAAc,wBAAO;AAAA;AAAA,YAEf,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA,eAEtD,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,mBACrD,CAAC,cAAU,4CAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,gBAC5D,CAAC,UACb,MAAM,WACF,MAAM,MAAM,OAAO,QAAQ,WAC3B,uCAAmB;AAAA,EACjB,QAAQ,MAAM;AAAA,EACd,QAAQ,MAAM,iBACV;AAAA,IACE,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,MAAM;AAAA,IACzB,MAAM,MAAM,OAAO,QAAQ;AAAA,EAC7B,IACA,CAAC,MAAM,MAAM,OAAO,MAAM,MAAM,MAAM,MAAM,OAAO,QAAQ,IAAI;AAAA,EACnE,KAAK,MAAM;AAAA,EACX,KAAK,MAAM;AACb,CAAC;AAAA;AAGT,IAAO,gBAAQ;",
+  "names": ["import_ds_system", "TickMarks", "TickMarksValues"]
 }

package/dist/esm/DSSlider.js

@@ -1,9 +1,9 @@
 import * as React from "react";
-import React2 from "react";
+import { jsx } from "react/jsx-runtime";
 import { describe } from "@elliemae/ds-utilities";
 import SliderImp from "./components/SliderImp";
 import { defaultProps, sliderPropTypes } from "./prop-types";
-const DSSlider = (props) => /* @__PURE__ */ React2.createElement(SliderImp, {
+const DSSlider = (props) => /* @__PURE__ */ jsx(SliderImp, {
   ...props
 });
 DSSlider.defaultProps = defaultProps;

package/dist/esm/DSSlider.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSSlider.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport SliderImp from './components/SliderImp';\nimport { defaultProps, sliderPropTypes } from './prop-types';\n\nconst DSSlider = (props) => <SliderImp {...props} />;\n\nDSSlider.defaultProps = defaultProps;\nDSSlider.propTypes = sliderPropTypes;\nDSSlider.displayName = 'DSSlider';\nconst DSSliderWithSchema = describe(DSSlider);\nDSSliderWithSchema.propTypes = sliderPropTypes;\n\nexport { DSSlider, DSSliderWithSchema };\nexport default DSSlider;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,gBAAgB;AACzB,OAAO,eAAe;AACtB,SAAS,cAAc,uBAAuB;AAE9C,MAAM,WAAW,CAAC,UAAU,gBAAAA,OAAA,cAAC;AAAA,EAAW,GAAG;AAAA,CAAO;AAElD,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,MAAM,qBAAqB,SAAS,QAAQ;AAC5C,mBAAmB,YAAY;AAG/B,IAAO,mBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,gBAAgB;AACzB,OAAO,eAAe;AACtB,SAAS,cAAc,uBAAuB;AAE9C,MAAM,WAAW,CAAC,UAAU,oBAAC;AAAA,EAAW,GAAG;AAAA,CAAO;AAElD,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,MAAM,qBAAqB,SAAS,QAAQ;AAC5C,mBAAmB,YAAY;AAG/B,IAAO,mBAAQ;",
+  "names": []
 }

package/dist/esm/components/SliderImp.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useState, useEffect, useRef, useMemo, useContext } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef, useMemo, useContext } from "react";
 import { v4 as uuidv4 } from "uuid";
 import { Range } from "react-range";
 import { usePrevious } from "@elliemae/ds-utilities";
@@ -96,67 +97,87 @@ const SliderImp = (props) => {
     () => conformedLabel(rangeValues, label, labelWithValue, withTwoHandles, customTickMarksValues, parsedStep),
     [rangeValues, label, labelWithValue, withTwoHandles, customTickMarksValues, parsedStep]
   );
-  const SliderLabel = /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(LabelText, null, finalLabelText), finalLabelText && " ", /* @__PURE__ */ React2.createElement(ValueText, {
-    disabled
-  }, finalValueText));
+  const SliderLabel = /* @__PURE__ */ jsxs(Fragment, {
+    children: [
+      /* @__PURE__ */ jsx(LabelText, {
+        children: finalLabelText
+      }),
+      finalLabelText && " ",
+      /* @__PURE__ */ jsx(ValueText, {
+        disabled,
+        children: finalValueText
+      })
+    ]
+  });
   const theme = useContext(ThemeContext);
-  return /* @__PURE__ */ React2.createElement(TooltipTextProvider, null, /* @__PURE__ */ React2.createElement("div", {
-    ref
-  }, /* @__PURE__ */ React2.createElement(Grid, {
-    width: "100%",
-    style: { maxWidth: "100%" },
-    containerProps,
-    "data-testid": "slider",
-    alignItems: "center",
-    rows: ["auto", "auto"]
-  }, /* @__PURE__ */ React2.createElement(SliderContext.Provider, {
-    value: {
-      disabled,
-      sliderUUID,
-      label,
-      labelWithValue,
-      minValue: parsedMinValue,
-      maxValue: parsedMaxValue,
-      step: parsedStep,
-      parsedValuesArray,
-      withTickMarks,
-      withTickMarksValues,
-      withTwoHandles,
-      customTickMarksValues,
-      rangeValues,
-      fullSelectedValues,
-      zIndex: zIndex ?? theme.zIndex.tooltip
-    }
-  }, finalLabelText && /* @__PURE__ */ React2.createElement(LabelWrapper, {
-    width
-  }, /* @__PURE__ */ React2.createElement(DSTruncatedTooltipText, {
-    value: SliderLabel
-  })), /* @__PURE__ */ React2.createElement(StyledRangeWrapper, null, /* @__PURE__ */ React2.createElement(Range, {
-    step: parsedStep,
-    min: parsedMinValue,
-    max: parsedMaxValue,
-    values: rangeValues,
-    disabled,
-    onChange: (values) => {
-      if (withTwoHandles && values[0] === values[1])
-        return;
-      setRangeValues(values);
-      onChange(values);
-    },
-    renderTrack: ({ props: trackProps, children }) => /* @__PURE__ */ React2.createElement(Track, {
-      props: trackProps
-    }, children),
-    renderThumb: (renderArgs) => {
-      const { index, props: thumbProps, isDragged } = renderArgs;
-      return /* @__PURE__ */ React2.createElement(Thumb, {
-        key: `${sliderUUID}-${thumbProps.key}`,
-        props: thumbProps,
-        isDragged,
-        index
-      });
-    },
-    allowOverlap: false
-  }))))));
+  return /* @__PURE__ */ jsx(TooltipTextProvider, {
+    children: /* @__PURE__ */ jsx("div", {
+      ref,
+      children: /* @__PURE__ */ jsx(Grid, {
+        width: "100%",
+        style: { maxWidth: "100%" },
+        containerProps,
+        "data-testid": "slider",
+        alignItems: "center",
+        rows: ["auto", "auto"],
+        children: /* @__PURE__ */ jsxs(SliderContext.Provider, {
+          value: {
+            disabled,
+            sliderUUID,
+            label,
+            labelWithValue,
+            minValue: parsedMinValue,
+            maxValue: parsedMaxValue,
+            step: parsedStep,
+            parsedValuesArray,
+            withTickMarks,
+            withTickMarksValues,
+            withTwoHandles,
+            customTickMarksValues,
+            rangeValues,
+            fullSelectedValues,
+            zIndex: zIndex ?? theme.zIndex.tooltip
+          },
+          children: [
+            finalLabelText && /* @__PURE__ */ jsx(LabelWrapper, {
+              width,
+              children: /* @__PURE__ */ jsx(DSTruncatedTooltipText, {
+                value: SliderLabel
+              })
+            }),
+            /* @__PURE__ */ jsx(StyledRangeWrapper, {
+              children: /* @__PURE__ */ jsx(Range, {
+                step: parsedStep,
+                min: parsedMinValue,
+                max: parsedMaxValue,
+                values: rangeValues,
+                disabled,
+                onChange: (values) => {
+                  if (withTwoHandles && values[0] === values[1])
+                    return;
+                  setRangeValues(values);
+                  onChange(values);
+                },
+                renderTrack: ({ props: trackProps, children }) => /* @__PURE__ */ jsx(Track, {
+                  props: trackProps,
+                  children
+                }),
+                renderThumb: (renderArgs) => {
+                  const { index, props: thumbProps, isDragged } = renderArgs;
+                  return /* @__PURE__ */ jsx(Thumb, {
+                    props: thumbProps,
+                    isDragged,
+                    index
+                  }, `${sliderUUID}-${thumbProps.key}`);
+                },
+                allowOverlap: false
+              })
+            })
+          ]
+        })
+      })
+    })
+  });
 };
 var SliderImp_default = SliderImp;
 export {

package/dist/esm/components/SliderImp.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/SliderImp.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\nimport React, { useState, useEffect, useRef, useMemo, useContext } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\nimport { Range } from 'react-range';\nimport { usePrevious } from '@elliemae/ds-utilities';\nimport DSTruncatedTooltipText, { TooltipTextProvider } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ThemeContext } from '@elliemae/ds-system';\nimport Track from './Track';\nimport Thumb from './Thumb';\nimport { LabelWrapper, StyledRangeWrapper, LabelText, ValueText } from './styled';\nimport { conformedLabel } from './utils';\nimport { SliderContext } from './context';\n\nconst getSubArrayFromRange = (\n  arr,\n  [minVal, maxVal], // maxValue is undefined when only one handler\n  isCustomTickMarksValues = false,\n) => {\n  const trueMinVal = isCustomTickMarksValues ? arr[minVal] : minVal;\n  const minIndex = arr.findIndex((el) => el === trueMinVal);\n\n  if (maxVal !== undefined) {\n    // if two handlers, return the found slice\n    const trueMaxVal = isCustomTickMarksValues ? arr[maxVal] : maxVal;\n    const maxIndex = arr.findIndex((el) => el === trueMaxVal);\n\n    if (minIndex >= 0 && maxIndex > minIndex) return arr.slice(minIndex, maxIndex + 1);\n    return [];\n  }\n  // if only one handler, return the value in an array\n  return [trueMinVal];\n};\n\nconst SliderImp = (props) => {\n  const {\n    containerProps,\n    disabled,\n    label,\n    labelWithValue,\n    minValue,\n    maxValue,\n    step,\n    onChange,\n    withTickMarks,\n    withTickMarksValues,\n    withTwoHandles,\n    customTickMarksValues,\n    zIndex,\n  } = props;\n  const ref = useRef();\n  const [width, setWidth] = useState(0);\n  const sliderUUID = useMemo(() => uuidv4(), []);\n\n  const parsedMinValue = useMemo(() => {\n    // ensure this works correctly with customTickMarksValues array\n    if (customTickMarksValues?.length) return 0;\n    return minValue;\n  }, [customTickMarksValues?.length, minValue]);\n  const parsedMaxValue = useMemo(() => {\n    // ensure this works correctly with customTickMarksValues array\n    if (customTickMarksValues?.length) return customTickMarksValues?.length - 1;\n    return maxValue;\n  }, [customTickMarksValues?.length, maxValue]);\n  const parsedStep = useMemo(() => {\n    // ensure this works correctly with customTickMarksValues array\n    if (customTickMarksValues?.length) return 1;\n    return step;\n  }, [customTickMarksValues?.length, step]);\n\n  const parsedValuesArray = useMemo(() => {\n    // ensure this works correctly with customTickMarksValues array\n    if (customTickMarksValues?.length) return customTickMarksValues;\n    const newLength = Math.ceil(maxValue / step);\n    const valuesArray = [];\n    for (let i = 0; i <= newLength; i += 1) {\n      valuesArray.push(step * i);\n    }\n\n    return valuesArray;\n  }, [customTickMarksValues?.length, minValue, maxValue, step]);\n\n  const [rangeValues, setRangeValues] = useState(withTwoHandles ? [parsedMinValue, parsedMaxValue] : [parsedMinValue]);\n  // track the full slice of values selected instead of only the limits\n  // this is important to handle the selected range labels colors\n  const [fullSelectedValues, setFullSelectedValues] = useState([]);\n  useEffect(() => {\n    const selectedRangeValues = getSubArrayFromRange(parsedValuesArray, rangeValues, !!customTickMarksValues?.length);\n    setFullSelectedValues(selectedRangeValues);\n  }, [parsedValuesArray, rangeValues, customTickMarksValues?.length]);\n\n  const prevWithTwoHandles = usePrevious(withTwoHandles);\n  const resizeHandler = () => {\n    setWidth(0);\n    setWidth(ref.current?.clientWidth);\n  };\n  useEffect(() => {\n    window.addEventListener('resize', resizeHandler);\n    return () => window.removeEventListener('resize', resizeHandler);\n  });\n  useEffect(() => {\n    if (!prevWithTwoHandles && withTwoHandles) {\n      setRangeValues([parsedMinValue, parsedMaxValue]);\n    } else if (prevWithTwoHandles && !withTwoHandles) {\n      setRangeValues([parsedMinValue]);\n    }\n  }, [withTwoHandles]);\n\n  useEffect(() => {\n    setWidth(ref.current?.clientWidth);\n  }, [ref.current?.clientWidth]);\n\n  const [finalLabelText, finalValueText] = useMemo(\n    () => conformedLabel(rangeValues, label, labelWithValue, withTwoHandles, customTickMarksValues, parsedStep),\n    [rangeValues, label, labelWithValue, withTwoHandles, customTickMarksValues, parsedStep],\n  );\n\n  const SliderLabel = (\n    <>\n      <LabelText>{finalLabelText}</LabelText>\n      {finalLabelText && ' '}\n      <ValueText disabled={disabled}>{finalValueText}</ValueText>\n    </>\n  );\n\n  const theme = useContext(ThemeContext);\n\n  return (\n    <TooltipTextProvider>\n      <div ref={ref}>\n        <Grid\n          width=\"100%\"\n          style={{ maxWidth: '100%' }}\n          containerProps={containerProps}\n          data-testid=\"slider\"\n          alignItems=\"center\"\n          rows={['auto', 'auto']}\n        >\n          <SliderContext.Provider\n            value={{\n              disabled,\n              sliderUUID,\n              label,\n              labelWithValue,\n              minValue: parsedMinValue,\n              maxValue: parsedMaxValue,\n              step: parsedStep,\n              parsedValuesArray,\n              withTickMarks,\n              withTickMarksValues,\n              withTwoHandles,\n              customTickMarksValues,\n              rangeValues,\n              fullSelectedValues,\n              zIndex: zIndex ?? theme.zIndex.tooltip,\n            }}\n          >\n            {finalLabelText && (\n              <LabelWrapper width={width}>\n                <DSTruncatedTooltipText value={SliderLabel} />\n              </LabelWrapper>\n            )}\n            <StyledRangeWrapper>\n              <Range\n                step={parsedStep}\n                min={parsedMinValue}\n                max={parsedMaxValue}\n                values={rangeValues}\n                disabled={disabled}\n                onChange={(values) => {\n                  if (withTwoHandles && values[0] === values[1]) return;\n                  setRangeValues(values);\n                  onChange(values);\n                }}\n                renderTrack={({ props: trackProps, children }) => <Track props={trackProps}>{children}</Track>}\n                renderThumb={(renderArgs) => {\n                  const { index, props: thumbProps, isDragged } = renderArgs;\n                  return (\n                    <Thumb\n                      key={`${sliderUUID}-${thumbProps.key}`}\n                      props={thumbProps}\n                      isDragged={isDragged}\n                      index={index}\n                    />\n                  );\n                }}\n                allowOverlap={false}\n              />\n            </StyledRangeWrapper>\n          </SliderContext.Provider>\n        </Grid>\n      </div>\n    </TooltipTextProvider>\n  );\n};\n\n// SliderImp.propTypes = sliderPropTypes;\n\nexport default SliderImp;\n"],
-  "mappings": "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",
-  "names": ["React"]
+  "mappings": "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",
+  "names": []
 }

package/dist/esm/components/Thumb.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useContext, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useContext, useState } from "react";
 import PropTypes from "prop-types";
 import { DSTooltipV3 } from "@elliemae/ds-tooltip";
 import { SliderContext } from "./context";
@@ -9,21 +10,21 @@ const Thumb = ({ index, props, isDragged }) => {
   const [isHovered, setIsHovered] = useState(false);
   const { disabled, rangeValues, zIndex, customTickMarksValues, step, minValue } = useContext(SliderContext);
   const cleanedProps = { ...props };
-  return /* @__PURE__ */ React2.createElement(ThumbStyled, {
+  return /* @__PURE__ */ jsx(ThumbStyled, {
     ...cleanedProps,
     "data-testid": "slider-thumb",
     disabled,
     style: { ...cleanedProps.style, zIndex },
     index,
     onMouseEnter: () => setIsHovered(true),
-    onMouseLeave: () => setIsHovered(false)
-  }, /* @__PURE__ */ React2.createElement(DSTooltipV3, {
-    key: conformedThumbLabel(rangeValues, customTickMarksValues, index, step, minValue),
-    text: conformedThumbLabel(rangeValues, customTickMarksValues, index, step, minValue),
-    showPopover: isDragged || isHovered,
-    customOffset: [0, 20],
-    withoutAnimation: true
-  }));
+    onMouseLeave: () => setIsHovered(false),
+    children: /* @__PURE__ */ jsx(DSTooltipV3, {
+      text: conformedThumbLabel(rangeValues, customTickMarksValues, index, step, minValue),
+      showPopover: isDragged || isHovered,
+      customOffset: [0, 20],
+      withoutAnimation: true
+    }, conformedThumbLabel(rangeValues, customTickMarksValues, index, step, minValue))
+  });
 };
 Thumb.propTypes = {
   index: PropTypes.number,

package/dist/esm/components/Thumb.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/Thumb.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip';\nimport { SliderContext } from './context';\nimport { conformedThumbLabel } from './utils';\nimport { ThumbStyled, TooltipContainerStyled, TooltipArrow } from './styled';\n\nconst Thumb = ({ index, props, isDragged }) => {\n  const [isHovered, setIsHovered] = useState(false);\n  const { disabled, rangeValues, zIndex, customTickMarksValues, step, minValue } = useContext(SliderContext);\n\n  const cleanedProps = { ...props };\n  // delete cleanedProps.key;\n  // delete cleanedProps.draggable;\n  return (\n    // ...props is needed because it's received from the library\n    // ...props.style has it own style from the library but has a bug with the zIndex for two thumbs, so that's why it has to be overwrite\n    <ThumbStyled\n      {...cleanedProps}\n      data-testid=\"slider-thumb\"\n      disabled={disabled}\n      // eslint-disable-next-line react/prop-types\n      style={{ ...cleanedProps.style, zIndex }}\n      index={index}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n    >\n      <DSTooltipV3\n        key={conformedThumbLabel(rangeValues, customTickMarksValues, index, step, minValue)}\n        text={conformedThumbLabel(rangeValues, customTickMarksValues, index, step, minValue)}\n        showPopover={isDragged || isHovered}\n        customOffset={[0, 20]}\n        withoutAnimation\n      ></DSTooltipV3>\n    </ThumbStyled>\n  );\n};\n\n/* {createPortal(\n        <TooltipContainerStyled isDragged={isDragged} isHovered={isHovered}>\n          <TooltipText>{</TooltipText>\n          <TooltipArrow />\n        </TooltipContainerStyled>,\n        document.body,\n      )} */\n\nThumb.propTypes = {\n  index: PropTypes.number,\n  props: PropTypes.shape({\n    style: PropTypes.shape({}).isRequired,\n  }).isRequired,\n  isDragged: PropTypes.bool,\n};\n\nexport default Thumb;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,UAAS,YAAY,gBAAgB;AAE5C,OAAO,eAAe;AACtB,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,2BAA2B;AACpC,SAAS,mBAAyD;AAElE,MAAM,QAAQ,CAAC,EAAE,OAAO,OAAO,UAAU,MAAM;AAC7C,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,EAAE,UAAU,aAAa,QAAQ,uBAAuB,MAAM,SAAS,IAAI,WAAW,aAAa;AAEzG,QAAM,eAAe,EAAE,GAAG,MAAM;AAGhC,SAGE,gBAAAA,OAAA,cAAC;AAAA,IACE,GAAG;AAAA,IACJ,eAAY;AAAA,IACZ;AAAA,IAEA,OAAO,EAAE,GAAG,aAAa,OAAO,OAAO;AAAA,IACvC;AAAA,IACA,cAAc,MAAM,aAAa,IAAI;AAAA,IACrC,cAAc,MAAM,aAAa,KAAK;AAAA,KAEtC,gBAAAA,OAAA,cAAC;AAAA,IACC,KAAK,oBAAoB,aAAa,uBAAuB,OAAO,MAAM,QAAQ;AAAA,IAClF,MAAM,oBAAoB,aAAa,uBAAuB,OAAO,MAAM,QAAQ;AAAA,IACnF,aAAa,aAAa;AAAA,IAC1B,cAAc,CAAC,GAAG,EAAE;AAAA,IACpB,kBAAgB;AAAA,GACjB,CACH;AAEJ;AAUA,MAAM,YAAY;AAAA,EAChB,OAAO,UAAU;AAAA,EACjB,OAAO,UAAU,MAAM;AAAA,IACrB,OAAO,UAAU,MAAM,CAAC,CAAC,EAAE;AAAA,EAC7B,CAAC,EAAE;AAAA,EACH,WAAW,UAAU;AACvB;AAEA,IAAO,gBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AAAA,SAAgB,YAAY,gBAAgB;AAE5C,OAAO,eAAe;AACtB,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,2BAA2B;AACpC,SAAS,mBAAyD;AAElE,MAAM,QAAQ,CAAC,EAAE,OAAO,OAAO,UAAU,MAAM;AAC7C,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,EAAE,UAAU,aAAa,QAAQ,uBAAuB,MAAM,SAAS,IAAI,WAAW,aAAa;AAEzG,QAAM,eAAe,EAAE,GAAG,MAAM;AAGhC,SAGE,oBAAC;AAAA,IACE,GAAG;AAAA,IACJ,eAAY;AAAA,IACZ;AAAA,IAEA,OAAO,EAAE,GAAG,aAAa,OAAO,OAAO;AAAA,IACvC;AAAA,IACA,cAAc,MAAM,aAAa,IAAI;AAAA,IACrC,cAAc,MAAM,aAAa,KAAK;AAAA,IAEtC,8BAAC;AAAA,MAEC,MAAM,oBAAoB,aAAa,uBAAuB,OAAO,MAAM,QAAQ;AAAA,MACnF,aAAa,aAAa;AAAA,MAC1B,cAAc,CAAC,GAAG,EAAE;AAAA,MACpB,kBAAgB;AAAA,OAJX,oBAAoB,aAAa,uBAAuB,OAAO,MAAM,QAAQ,CAKnF;AAAA,GACH;AAEJ;AAUA,MAAM,YAAY;AAAA,EAChB,OAAO,UAAU;AAAA,EACjB,OAAO,UAAU,MAAM;AAAA,IACrB,OAAO,UAAU,MAAM,CAAC,CAAC,EAAE;AAAA,EAC7B,CAAC,EAAE;AAAA,EACH,WAAW,UAAU;AACvB;AAEA,IAAO,gBAAQ;",
+  "names": []
 }

package/dist/esm/components/TickMarks.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useContext } from "react";
 import { styled } from "@elliemae/ds-system";
 import { __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
 import { SliderContext } from "./context";
@@ -8,16 +9,16 @@ const TickMarks = () => {
   const dots = [];
   for (let index = minValue || 0; index <= maxValue; index += step) {
     const isActive = withTwoHandles ? rangeValues[0] <= index && index < rangeValues[1] : rangeValues[0] > index;
-    dots.push(/* @__PURE__ */ React2.createElement(Dot, {
+    dots.push(/* @__PURE__ */ jsx(Dot, {
       "data-testid": "slider-dot",
-      isActive,
-      key: index
-    }));
+      isActive
+    }, index));
   }
-  return /* @__PURE__ */ React2.createElement(DotsContainer, {
+  return /* @__PURE__ */ jsx(DotsContainer, {
     "data-testid": "slider-tick-marks",
-    zIndex
-  }, dots);
+    zIndex,
+    children: dots
+  });
 };
 const Dot = styled.div`
   &:after {

package/dist/esm/components/TickMarks.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/TickMarks.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\nimport React, { useContext } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { SliderContext } from './context';\n\nconst TickMarks = () => {\n  const { minValue, maxValue, rangeValues, step, withTwoHandles, zIndex } = useContext(SliderContext);\n  const dots = [];\n\n  for (let index = minValue || 0; index <= maxValue; index += step) {\n    const isActive = withTwoHandles ? rangeValues[0] <= index && index < rangeValues[1] : rangeValues[0] > index;\n    dots.push(<Dot data-testid=\"slider-dot\" isActive={isActive} key={index} />);\n  }\n\n  return (\n    <DotsContainer data-testid=\"slider-tick-marks\" zIndex={zIndex}>\n      {dots}\n    </DotsContainer>\n  );\n};\n\nconst Dot = styled.div`\n  &:after {\n    content: '';\n    background: ${(props) => (props.isActive ? props.theme.colors.brand[300] : props.theme.colors.neutral[400])};\n    border-radius: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n    display: block;\n    position: relative;\n    width: 2px;\n    height: 2px;\n  }\n`;\n\nconst DotsContainer = styled.div`\n  padding: 0 calc(${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)} * 0.5);\n  align-items: center;\n  display: flex;\n  justify-content: space-between;\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: ${(props) => props.zIndex - 1};\n`;\n\nexport default TickMarks;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,OAAOA,UAAS,kBAAkB;AAClC,SAAS,cAAc;AACvB,SAAS,gCAAgC;AACzC,SAAS,qBAAqB;AAE9B,MAAM,YAAY,MAAM;AACtB,QAAM,EAAE,UAAU,UAAU,aAAa,MAAM,gBAAgB,OAAO,IAAI,WAAW,aAAa;AAClG,QAAM,OAAO,CAAC;AAEd,WAAS,QAAQ,YAAY,GAAG,SAAS,UAAU,SAAS,MAAM;AAChE,UAAM,WAAW,iBAAiB,YAAY,MAAM,SAAS,QAAQ,YAAY,KAAK,YAAY,KAAK;AACvG,SAAK,KAAK,gBAAAA,OAAA,cAAC;AAAA,MAAI,eAAY;AAAA,MAAa;AAAA,MAAoB,KAAK;AAAA,KAAO,CAAE;AAAA,EAC5E;AAEA,SACE,gBAAAA,OAAA,cAAC;AAAA,IAAc,eAAY;AAAA,IAAoB;AAAA,KAC5C,IACH;AAEJ;AAEA,MAAM,MAAM,OAAO;AAAA;AAAA;AAAA,kBAGD,CAAC,UAAW,MAAM,WAAW,MAAM,MAAM,OAAO,MAAM,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA,qBACrF,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ9E,MAAM,gBAAgB,OAAO;AAAA,oBACT,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAUhE,CAAC,UAAU,MAAM,SAAS;AAAA;AAGvC,IAAO,oBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAgB,kBAAkB;AAClC,SAAS,cAAc;AACvB,SAAS,gCAAgC;AACzC,SAAS,qBAAqB;AAE9B,MAAM,YAAY,MAAM;AACtB,QAAM,EAAE,UAAU,UAAU,aAAa,MAAM,gBAAgB,OAAO,IAAI,WAAW,aAAa;AAClG,QAAM,OAAO,CAAC;AAEd,WAAS,QAAQ,YAAY,GAAG,SAAS,UAAU,SAAS,MAAM;AAChE,UAAM,WAAW,iBAAiB,YAAY,MAAM,SAAS,QAAQ,YAAY,KAAK,YAAY,KAAK;AACvG,SAAK,KAAK,oBAAC;AAAA,MAAI,eAAY;AAAA,MAAa;AAAA,OAAyB,KAAO,CAAE;AAAA,EAC5E;AAEA,SACE,oBAAC;AAAA,IAAc,eAAY;AAAA,IAAoB;AAAA,IAC5C;AAAA,GACH;AAEJ;AAEA,MAAM,MAAM,OAAO;AAAA;AAAA;AAAA,kBAGD,CAAC,UAAW,MAAM,WAAW,MAAM,MAAM,OAAO,MAAM,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA,qBACrF,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ9E,MAAM,gBAAgB,OAAO;AAAA,oBACT,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAUhE,CAAC,UAAU,MAAM,SAAS;AAAA;AAGvC,IAAO,oBAAQ;",
+  "names": []
 }

package/dist/esm/components/TickMarksValues.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useContext, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useContext, useMemo } from "react";
 import { styled } from "@elliemae/ds-system";
 import { __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
 import { SliderContext } from "./context";
@@ -8,17 +9,18 @@ const TickMarks = () => {
   const TickMarksLabels = useMemo(
     () => parsedValuesArray.map((value) => {
       const isSelected = fullSelectedValues.findIndex((selectedVal) => selectedVal === value) >= 0;
-      return /* @__PURE__ */ React2.createElement(TickMarkValue, {
-        key: `${sliderUUID}-${value}`,
-        isSelected
-      }, value);
+      return /* @__PURE__ */ jsx(TickMarkValue, {
+        isSelected,
+        children: value
+      }, `${sliderUUID}-${value}`);
     }),
     [parsedValuesArray, sliderUUID, fullSelectedValues]
   );
   const PureTickMArksValues = useMemo(
-    () => /* @__PURE__ */ React2.createElement(TickMarksContainer, {
-      "data-testid": "slider-tick-marks-values"
-    }, TickMarksLabels),
+    () => /* @__PURE__ */ jsx(TickMarksContainer, {
+      "data-testid": "slider-tick-marks-values",
+      children: TickMarksLabels
+    }),
     [TickMarksLabels]
   );
   return PureTickMArksValues;

package/dist/esm/components/TickMarksValues.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/TickMarksValues.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-plusplus */\nimport React, { useContext, useMemo } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { SliderContext } from './context';\n\nconst TickMarks = () => {\n  const { parsedValuesArray, fullSelectedValues, sliderUUID } = useContext(SliderContext);\n\n  const TickMarksLabels = useMemo(\n    () =>\n      parsedValuesArray.map((value) => {\n        const isSelected = fullSelectedValues.findIndex((selectedVal) => selectedVal === value) >= 0;\n        return (\n          <TickMarkValue key={`${sliderUUID}-${value}`} isSelected={isSelected}>\n            {value}\n          </TickMarkValue>\n        );\n      }),\n\n    [parsedValuesArray, sliderUUID, fullSelectedValues],\n  );\n\n  const PureTickMArksValues = useMemo(\n    () => <TickMarksContainer data-testid=\"slider-tick-marks-values\">{TickMarksLabels}</TickMarksContainer>,\n    [TickMarksLabels],\n  );\n\n  return PureTickMArksValues;\n};\n\nconst TickMarkValue = styled.div`\n  min-height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n  overflow: visible;\n  transform: translateX(-100%);\n  width: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n  color: ${(props) => (props.isSelected ? props.theme.colors.neutral[800] : props.theme.colors.neutral[500])};\n`;\n\nconst TickMarksContainer = styled.div`\n  display: flex;\n  justify-content: space-between;\n`;\n\nexport default TickMarks;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,OAAOA,UAAS,YAAY,eAAe;AAC3C,SAAS,cAAc;AACvB,SAAS,gCAAgC;AACzC,SAAS,qBAAqB;AAE9B,MAAM,YAAY,MAAM;AACtB,QAAM,EAAE,mBAAmB,oBAAoB,WAAW,IAAI,WAAW,aAAa;AAEtF,QAAM,kBAAkB;AAAA,IACtB,MACE,kBAAkB,IAAI,CAAC,UAAU;AAC/B,YAAM,aAAa,mBAAmB,UAAU,CAAC,gBAAgB,gBAAgB,KAAK,KAAK;AAC3F,aACE,gBAAAA,OAAA,cAAC;AAAA,QAAc,KAAK,GAAG,cAAc;AAAA,QAAS;AAAA,SAC3C,KACH;AAAA,IAEJ,CAAC;AAAA,IAEH,CAAC,mBAAmB,YAAY,kBAAkB;AAAA,EACpD;AAEA,QAAM,sBAAsB;AAAA,IAC1B,MAAM,gBAAAA,OAAA,cAAC;AAAA,MAAmB,eAAY;AAAA,OAA4B,eAAgB;AAAA,IAClF,CAAC,eAAe;AAAA,EAClB;AAEA,SAAO;AACT;AAEA,MAAM,gBAAgB,OAAO;AAAA,gBACb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA,WAG5D,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,WACzD,CAAC,UAAW,MAAM,aAAa,MAAM,MAAM,OAAO,QAAQ,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGvG,MAAM,qBAAqB,OAAO;AAAA;AAAA;AAAA;AAKlC,IAAO,0BAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAgB,YAAY,eAAe;AAC3C,SAAS,cAAc;AACvB,SAAS,gCAAgC;AACzC,SAAS,qBAAqB;AAE9B,MAAM,YAAY,MAAM;AACtB,QAAM,EAAE,mBAAmB,oBAAoB,WAAW,IAAI,WAAW,aAAa;AAEtF,QAAM,kBAAkB;AAAA,IACtB,MACE,kBAAkB,IAAI,CAAC,UAAU;AAC/B,YAAM,aAAa,mBAAmB,UAAU,CAAC,gBAAgB,gBAAgB,KAAK,KAAK;AAC3F,aACE,oBAAC;AAAA,QAA6C;AAAA,QAC3C;AAAA,SADiB,GAAG,cAAc,OAErC;AAAA,IAEJ,CAAC;AAAA,IAEH,CAAC,mBAAmB,YAAY,kBAAkB;AAAA,EACpD;AAEA,QAAM,sBAAsB;AAAA,IAC1B,MAAM,oBAAC;AAAA,MAAmB,eAAY;AAAA,MAA4B;AAAA,KAAgB;AAAA,IAClF,CAAC,eAAe;AAAA,EAClB;AAEA,SAAO;AACT;AAEA,MAAM,gBAAgB,OAAO;AAAA,gBACb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA,WAG5D,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,WACzD,CAAC,UAAW,MAAM,aAAa,MAAM,MAAM,OAAO,QAAQ,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGvG,MAAM,qBAAqB,OAAO;AAAA;AAAA;AAAA;AAKlC,IAAO,0BAAQ;",
+  "names": []
 }

package/dist/esm/components/Track.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useContext } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useContext } from "react";
 import { getTrackBackground } from "react-range";
 import { styled } from "@elliemae/ds-system";
 import { __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
@@ -16,14 +17,23 @@ const Track = ({ children, props }) => {
     withTickMarksValues,
     withTwoHandles
   } = useContext(SliderContext);
-  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(TrackStyled, {
-    ...props,
-    disabled,
-    minValue,
-    maxValue,
-    rangeValues,
-    withTwoHandles
-  }, children, withTickMarks && !disabled && /* @__PURE__ */ React2.createElement(TickMarks, null)), withTickMarksValues && /* @__PURE__ */ React2.createElement(TickMarksValues, null));
+  return /* @__PURE__ */ jsxs(Fragment, {
+    children: [
+      /* @__PURE__ */ jsxs(TrackStyled, {
+        ...props,
+        disabled,
+        minValue,
+        maxValue,
+        rangeValues,
+        withTwoHandles,
+        children: [
+          children,
+          withTickMarks && !disabled && /* @__PURE__ */ jsx(TickMarks, {})
+        ]
+      }),
+      withTickMarksValues && /* @__PURE__ */ jsx(TickMarksValues, {})
+    ]
+  });
 };
 const TrackStyled = styled.div`
   position: relative;

package/dist/esm/components/Track.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/Track.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\n/* eslint-disable react/prop-types */\nimport React, { useContext } from 'react';\nimport { getTrackBackground } from 'react-range';\nimport { styled } from '@elliemae/ds-system';\nimport { __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nimport TickMarks from './TickMarks';\nimport TickMarksValues from './TickMarksValues';\nimport { SliderContext } from './context';\n\nconst Track = ({ children, props }) => {\n  const {\n    disabled,\n    minValue,\n    maxValue,\n    rangeValues,\n    withTickMarks,\n    withTickMarksValues,\n    withTwoHandles,\n  } = useContext(SliderContext);\n\n  return (\n    <>\n      <TrackStyled\n        {...props} // This is needed because it's received from the library\n        disabled={disabled}\n        minValue={minValue}\n        maxValue={maxValue}\n        rangeValues={rangeValues}\n        withTwoHandles={withTwoHandles}\n      >\n        {children}\n        {withTickMarks && !disabled && <TickMarks />}\n      </TrackStyled>\n      {withTickMarksValues && <TickMarksValues />}\n    </>\n  );\n};\n\nconst TrackStyled = styled.div`\n  position: relative;\n  height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n  width: 100%;\n  min-width: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxl)};\n  border-radius: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n  background: ${(props) =>\n    props.disabled\n      ? props.theme.colors.neutral[100]\n      : getTrackBackground({\n          values: props.rangeValues,\n          colors: props.withTwoHandles\n            ? [\n                props.theme.colors.neutral[100],\n                props.theme.colors.brand[600],\n                props.theme.colors.neutral[100],\n              ]\n            : [props.theme.colors.brand[600], props.theme.colors.neutral[100]],\n          min: props.minValue,\n          max: props.maxValue,\n        })};\n`;\n\nexport default Track;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACEvB,OAAOA,UAAS,kBAAkB;AAClC,SAAS,0BAA0B;AACnC,SAAS,cAAc;AACvB,SAAS,gCAAgC;AAEzC,OAAO,eAAe;AACtB,OAAO,qBAAqB;AAC5B,SAAS,qBAAqB;AAE9B,MAAM,QAAQ,CAAC,EAAE,UAAU,MAAM,MAAM;AACrC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,aAAa;AAE5B,SACE,gBAAAA,OAAA,cAAAA,OAAA,gBACE,gBAAAA,OAAA,cAAC;AAAA,IACE,GAAG;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,KAEC,UACA,iBAAiB,CAAC,YAAY,gBAAAA,OAAA,cAAC,eAAU,CAC5C,GACC,uBAAuB,gBAAAA,OAAA,cAAC,qBAAgB,CAC3C;AAEJ;AAEA,MAAM,cAAc,OAAO;AAAA;AAAA,YAEf,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA,eAEtD,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,mBACrD,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,gBAC5D,CAAC,UACb,MAAM,WACF,MAAM,MAAM,OAAO,QAAQ,OAC3B,mBAAmB;AAAA,EACjB,QAAQ,MAAM;AAAA,EACd,QAAQ,MAAM,iBACV;AAAA,IACE,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,MAAM;AAAA,IACzB,MAAM,MAAM,OAAO,QAAQ;AAAA,EAC7B,IACA,CAAC,MAAM,MAAM,OAAO,MAAM,MAAM,MAAM,MAAM,OAAO,QAAQ,IAAI;AAAA,EACnE,KAAK,MAAM;AAAA,EACX,KAAK,MAAM;AACb,CAAC;AAAA;AAGT,IAAO,gBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AAEA,SAAgB,kBAAkB;AAClC,SAAS,0BAA0B;AACnC,SAAS,cAAc;AACvB,SAAS,gCAAgC;AAEzC,OAAO,eAAe;AACtB,OAAO,qBAAqB;AAC5B,SAAS,qBAAqB;AAE9B,MAAM,QAAQ,CAAC,EAAE,UAAU,MAAM,MAAM;AACrC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,aAAa;AAE5B,SACE;AAAA,IACE;AAAA,2BAAC;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,UACA,iBAAiB,CAAC,YAAY,oBAAC,aAAU;AAAA;AAAA,OAC5C;AAAA,MACC,uBAAuB,oBAAC,mBAAgB;AAAA;AAAA,GAC3C;AAEJ;AAEA,MAAM,cAAc,OAAO;AAAA;AAAA,YAEf,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA;AAAA,eAEtD,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,mBACrD,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,gBAC5D,CAAC,UACb,MAAM,WACF,MAAM,MAAM,OAAO,QAAQ,OAC3B,mBAAmB;AAAA,EACjB,QAAQ,MAAM;AAAA,EACd,QAAQ,MAAM,iBACV;AAAA,IACE,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3B,MAAM,MAAM,OAAO,MAAM;AAAA,IACzB,MAAM,MAAM,OAAO,QAAQ;AAAA,EAC7B,IACA,CAAC,MAAM,MAAM,OAAO,MAAM,MAAM,MAAM,MAAM,OAAO,QAAQ,IAAI;AAAA,EACnE,KAAK,MAAM;AAAA,EACX,KAAK,MAAM;AACb,CAAC;AAAA;AAGT,IAAO,gBAAQ;",
+  "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-slider",
-  "version": "3.5.0-rc.9",
+  "version": "3.6.0-next.0",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Slider",
   "files": [
@@ -75,11 +75,11 @@
     "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-grid": "3.5.0-rc.9",
-    "@elliemae/ds-system": "3.5.0-rc.9",
-    "@elliemae/ds-tooltip": "3.5.0-rc.9",
-    "@elliemae/ds-truncated-tooltip-text": "3.5.0-rc.9",
-    "@elliemae/ds-utilities": "3.5.0-rc.9",
+    "@elliemae/ds-grid": "3.6.0-next.0",
+    "@elliemae/ds-system": "3.6.0-next.0",
+    "@elliemae/ds-tooltip": "3.6.0-next.0",
+    "@elliemae/ds-truncated-tooltip-text": "3.6.0-next.0",
+    "@elliemae/ds-utilities": "3.6.0-next.0",
     "prop-types": "~15.8.1",
     "react-range": "~1.8.12",
     "uuid": "~8.3.2"