@salt-ds/lab 1.0.0-alpha.12 → 1.0.0-alpha.14

package/dist-cjs/stepped-tracker/StepLabel/StepLabel.js

@@ -0,0 +1,42 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var clsx = require('clsx');
+var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var StepLabel$1 = require('./StepLabel.css.js');
+var SteppedTrackerContext = require('../SteppedTrackerContext.js');
+require('../TrackerStep/TrackerStep.js');
+var TrackerStepTooltipContext = require('../TrackerStep/TrackerStepTooltipContext.js');
+
+const withBaseName = core.makePrefixer("saltStepLabel");
+const StepLabel = React.forwardRef(
+  function StepLabel2({ children, className, ...rest }, ref) {
+    const id = core.useIdMemo();
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-step-label",
+      css: StepLabel$1,
+      window: targetWindow
+    });
+    const { getOverflowRef } = SteppedTrackerContext.useSteppedTrackerContext();
+    const overflowRef = React.useMemo(() => getOverflowRef(id), [id, getOverflowRef]);
+    const isInTooltip = TrackerStepTooltipContext.useTrackerStepTooltipContext();
+    const combinedRef = core.useForkRef(overflowRef, ref);
+    return isInTooltip ? /* @__PURE__ */ jsxRuntime.jsx("span", {
+      children
+    }) : /* @__PURE__ */ jsxRuntime.jsx(core.Label, {
+      className: clsx.clsx(withBaseName(), className),
+      ref: combinedRef,
+      ...rest,
+      children
+    });
+  }
+);
+
+exports.StepLabel = StepLabel;
+//# sourceMappingURL=StepLabel.js.map

package/dist-cjs/stepped-tracker/StepLabel/StepLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepLabel.js","sources":["../src/stepped-tracker/StepLabel/StepLabel.tsx"],"sourcesContent":["import {\n  forwardRef,\n  ReactNode,\n  useMemo,\n  ComponentPropsWithoutRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useForkRef, makePrefixer, useIdMemo, Label } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport stepLabelCss from \"./StepLabel.css\";\n\nimport { useSteppedTrackerContext } from \"../SteppedTrackerContext\";\nimport { useTrackerStepTooltipContext } from \"../TrackerStep\";\n\nconst withBaseName = makePrefixer(\"saltStepLabel\");\n\nexport interface StepLabelProps extends ComponentPropsWithoutRef<\"label\"> {\n  children: ReactNode;\n}\n\nexport const StepLabel = forwardRef<HTMLLabelElement, StepLabelProps>(\n  function StepLabel({ children, className, ...rest }, ref?) {\n    const id = useIdMemo();\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-step-label\",\n      css: stepLabelCss,\n      window: targetWindow,\n    });\n\n    const { getOverflowRef } = useSteppedTrackerContext();\n    const overflowRef = useMemo(() => getOverflowRef(id), [id, getOverflowRef]);\n\n    const isInTooltip = useTrackerStepTooltipContext();\n\n    const combinedRef = useForkRef<HTMLLabelElement>(overflowRef, ref);\n\n    return isInTooltip ? (\n      <span>{children}</span>\n    ) : (\n      <Label\n        className={clsx(withBaseName(), className)}\n        ref={combinedRef}\n        {...rest}\n      >\n        {children}\n      </Label>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","StepLabel","useIdMemo","useWindow","useComponentCssInjection","stepLabelCss","useSteppedTrackerContext","useMemo","useTrackerStepTooltipContext","useForkRef","jsx","Label","clsx"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA,CAAA;AAM1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UAAU,CAAA,EAAE,UAAU,SAAc,EAAA,GAAA,IAAA,IAAQ,GAAM,EAAA;AACzD,IAAA,MAAM,KAAKC,cAAU,EAAA,CAAA;AAErB,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,EAAE,cAAe,EAAA,GAAIC,8CAAyB,EAAA,CAAA;AACpD,IAAM,MAAA,WAAA,GAAcC,cAAQ,MAAM,cAAA,CAAe,EAAE,CAAG,EAAA,CAAC,EAAI,EAAA,cAAc,CAAC,CAAA,CAAA;AAE1E,IAAA,MAAM,cAAcC,sDAA6B,EAAA,CAAA;AAEjD,IAAM,MAAA,WAAA,GAAcC,eAA6B,CAAA,WAAA,EAAa,GAAG,CAAA,CAAA;AAEjE,IAAA,OAAO,8BACJC,cAAA,CAAA,MAAA,EAAA;AAAA,MAAM,QAAA;AAAA,KAAS,oBAEfA,cAAA,CAAAC,UAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAK,EAAA,WAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/stepped-tracker/SteppedTracker.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltSteppedTracker {\n  margin: 0;\n  padding: 0;\n  text-indent: 0;\n  list-style-type: none;\n  display: flex;\n  flex-direction: row;\n  gap: var(--salt-spacing-50);\n  width: 100%;\n  position: relative;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=SteppedTracker.css.js.map

package/dist-cjs/stepped-tracker/SteppedTracker.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SteppedTracker.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/stepped-tracker/SteppedTracker.js

@@ -0,0 +1,64 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var clsx = require('clsx');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var core = require('@salt-ds/core');
+var useDetectTruncatedText = require('./useDetectTruncatedText.js');
+var SteppedTrackerContext = require('./SteppedTrackerContext.js');
+var SteppedTracker$1 = require('./SteppedTracker.css.js');
+
+const withBaseName = core.makePrefixer("saltSteppedTracker");
+const useCheckInvalidChildren = (children) => {
+  React.useEffect(() => {
+    if (process.env.NODE_ENV !== "production") {
+      let hasInvalidChild = false;
+      React.Children.forEach(children, (child) => {
+        if (!React.isValidElement(child)) {
+          hasInvalidChild = true;
+        }
+      });
+      if (hasInvalidChild) {
+        console.error(
+          "Invalid child: children of SteppedTracker must be a TrackerStep component"
+        );
+      }
+    }
+  }, [children]);
+};
+const SteppedTracker = React.forwardRef(
+  function SteppedTracker2({ children, className, activeStep, ...restProps }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-stepped-tracker",
+      css: SteppedTracker$1,
+      window: targetWindow
+    });
+    useCheckInvalidChildren(children);
+    const [hasTooltips, setHasTooltips] = React.useState(false);
+    const getOverflowRef = useDetectTruncatedText(setHasTooltips);
+    const totalSteps = React.Children.count(children);
+    return /* @__PURE__ */ jsxRuntime.jsx(SteppedTrackerContext.SteppedTrackerProvider, {
+      hasTooltips,
+      getOverflowRef,
+      totalSteps,
+      activeStep,
+      children: /* @__PURE__ */ jsxRuntime.jsx("ul", {
+        className: clsx.clsx(withBaseName(), className),
+        ref,
+        ...restProps,
+        children: React.Children.map(children, (child, i) => /* @__PURE__ */ jsxRuntime.jsx(SteppedTrackerContext.TrackerStepProvider, {
+          stepNumber: i,
+          children: child
+        }))
+      })
+    });
+  }
+);
+
+exports.SteppedTracker = SteppedTracker;
+//# sourceMappingURL=SteppedTracker.js.map

package/dist-cjs/stepped-tracker/SteppedTracker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SteppedTracker.js","sources":["../src/stepped-tracker/SteppedTracker.tsx"],"sourcesContent":["import {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  ReactElement,\n  ReactNode,\n  Children,\n  useState,\n  isValidElement,\n  useEffect,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { makePrefixer } from \"@salt-ds/core\";\n\nimport useDetectTruncatedText from \"./useDetectTruncatedText\";\nimport {\n  SteppedTrackerProvider,\n  TrackerStepProvider,\n} from \"./SteppedTrackerContext\";\n\nimport steppedTrackerCss from \"./SteppedTracker.css\";\n\nconst withBaseName = makePrefixer(\"saltSteppedTracker\");\n\nexport interface SteppedTrackerProps extends ComponentPropsWithoutRef<\"ul\"> {\n  /**\n   * The index of the current activeStep\n   */\n  activeStep: number;\n  /**\n   * Should be one or more TrackerStep components\n   */\n  children: ReactNode;\n}\n\nconst useCheckInvalidChildren = (children: ReactNode) => {\n  useEffect(() => {\n    if (process.env.NODE_ENV !== \"production\") {\n      let hasInvalidChild = false;\n      Children.forEach(children, (child) => {\n        if (!isValidElement(child)) {\n          hasInvalidChild = true;\n        }\n      });\n\n      if (hasInvalidChild) {\n        console.error(\n          \"Invalid child: children of SteppedTracker must be a TrackerStep component\"\n        );\n      }\n    }\n  }, [children]);\n};\n\nexport const SteppedTracker = forwardRef<HTMLUListElement, SteppedTrackerProps>(\n  function SteppedTracker(\n    { children, className, activeStep, ...restProps },\n    ref?\n  ): ReactElement<SteppedTrackerProps> {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-stepped-tracker\",\n      css: steppedTrackerCss,\n      window: targetWindow,\n    });\n\n    useCheckInvalidChildren(children);\n    const [hasTooltips, setHasTooltips] = useState(false);\n    // A factory function used to get a callback ref for checking truncation.\n    const getOverflowRef = useDetectTruncatedText(setHasTooltips);\n    const totalSteps = Children.count(children);\n\n    return (\n      <SteppedTrackerProvider\n        hasTooltips={hasTooltips}\n        getOverflowRef={getOverflowRef}\n        totalSteps={totalSteps}\n        activeStep={activeStep}\n      >\n        <ul\n          className={clsx(withBaseName(), className)}\n          ref={ref}\n          {...restProps}\n        >\n          {Children.map(children, (child, i) => (\n            <TrackerStepProvider stepNumber={i}>{child}</TrackerStepProvider>\n          ))}\n        </ul>\n      </SteppedTrackerProvider>\n    );\n  }\n);\n"],"names":["makePrefixer","useEffect","Children","isValidElement","forwardRef","SteppedTracker","useWindow","useComponentCssInjection","steppedTrackerCss","useState","jsx","SteppedTrackerProvider","clsx","TrackerStepProvider"],"mappings":";;;;;;;;;;;;;;AAuBA,MAAM,YAAA,GAAeA,kBAAa,oBAAoB,CAAA,CAAA;AAatD,MAAM,uBAAA,GAA0B,CAAC,QAAwB,KAAA;AACvD,EAAAC,eAAA,CAAU,MAAM;AACd,IAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,MAAA,IAAI,eAAkB,GAAA,KAAA,CAAA;AACtB,MAASC,cAAA,CAAA,OAAA,CAAQ,QAAU,EAAA,CAAC,KAAU,KAAA;AACpC,QAAI,IAAA,CAACC,oBAAe,CAAA,KAAK,CAAG,EAAA;AAC1B,UAAkB,eAAA,GAAA,IAAA,CAAA;AAAA,SACpB;AAAA,OACD,CAAA,CAAA;AAED,MAAA,IAAI,eAAiB,EAAA;AACnB,QAAQ,OAAA,CAAA,KAAA;AAAA,UACN,2EAAA;AAAA,SACF,CAAA;AAAA,OACF;AAAA,KACF;AAAA,GACF,EAAG,CAAC,QAAQ,CAAC,CAAA,CAAA;AACf,CAAA,CAAA;AAEO,MAAM,cAAiB,GAAAC,gBAAA;AAAA,EAC5B,SAASC,gBACP,EAAE,QAAA,EAAU,WAAW,UAAe,EAAA,GAAA,SAAA,IACtC,GACmC,EAAA;AACnC,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,gBAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBAAA,CAAwB,QAAQ,CAAA,CAAA;AAChC,IAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAIC,eAAS,KAAK,CAAA,CAAA;AAEpD,IAAM,MAAA,cAAA,GAAiB,uBAAuB,cAAc,CAAA,CAAA;AAC5D,IAAM,MAAA,UAAA,GAAaP,cAAS,CAAA,KAAA,CAAM,QAAQ,CAAA,CAAA;AAE1C,IAAA,uBACGQ,cAAA,CAAAC,4CAAA,EAAA;AAAA,MACC,WAAA;AAAA,MACA,cAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,MAEA,QAAC,kBAAAD,cAAA,CAAA,IAAA,EAAA;AAAA,QACC,SAAW,EAAAE,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,SAAA;AAAA,QAEH,yBAAS,GAAI,CAAA,QAAA,EAAU,CAAC,KAAA,EAAO,sBAC7BF,cAAA,CAAAG,yCAAA,EAAA;AAAA,UAAoB,UAAY,EAAA,CAAA;AAAA,UAAI,QAAA,EAAA,KAAA;AAAA,SAAM,CAC5C,CAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/stepped-tracker/SteppedTrackerContext.js

@@ -0,0 +1,57 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+
+const defaultSteppedTrackerContext = {
+  activeStep: 0,
+  hasTooltips: false,
+  totalSteps: 1,
+  getOverflowRef: () => void 0,
+  isWithinSteppedTracker: false
+};
+const SteppedTrackerContext = React.createContext(
+  defaultSteppedTrackerContext
+);
+const SteppedTrackerProvider = ({
+  activeStep,
+  getOverflowRef,
+  hasTooltips,
+  totalSteps,
+  children
+}) => {
+  const steppedTrackerContextValue = React.useMemo(
+    () => ({
+      activeStep,
+      getOverflowRef,
+      hasTooltips,
+      totalSteps,
+      isWithinSteppedTracker: true
+    }),
+    [activeStep, getOverflowRef, hasTooltips, totalSteps]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(SteppedTrackerContext.Provider, {
+    value: steppedTrackerContextValue,
+    children
+  });
+};
+const useSteppedTrackerContext = () => React.useContext(SteppedTrackerContext);
+const TrackerStepContext = React.createContext(0);
+const useTrackerStepContext = () => React.useContext(TrackerStepContext);
+const TrackerStepProvider = ({
+  children,
+  stepNumber
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(TrackerStepContext.Provider, {
+    value: stepNumber,
+    children
+  });
+};
+
+exports.SteppedTrackerProvider = SteppedTrackerProvider;
+exports.TrackerStepProvider = TrackerStepProvider;
+exports.useSteppedTrackerContext = useSteppedTrackerContext;
+exports.useTrackerStepContext = useTrackerStepContext;
+//# sourceMappingURL=SteppedTrackerContext.js.map

package/dist-cjs/stepped-tracker/SteppedTrackerContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SteppedTrackerContext.js","sources":["../src/stepped-tracker/SteppedTrackerContext.tsx"],"sourcesContent":["import { createContext, useContext, ReactNode, useMemo } from \"react\";\n\nimport { GetOverflowRef } from \"./useDetectTruncatedText\";\n\nexport type SteppedTrackerContextType = {\n  activeStep: number;\n  getOverflowRef: GetOverflowRef;\n  hasTooltips: boolean;\n  totalSteps: number;\n  isWithinSteppedTracker: boolean;\n};\n\nconst defaultSteppedTrackerContext = {\n  activeStep: 0,\n  hasTooltips: false,\n  totalSteps: 1,\n  getOverflowRef: () => undefined,\n  isWithinSteppedTracker: false,\n};\n\nconst SteppedTrackerContext = createContext(\n  defaultSteppedTrackerContext as unknown as SteppedTrackerContextType\n);\n\ntype SteppedTrackerProviderProps = Omit<\n  SteppedTrackerContextType,\n  \"isWithinSteppedTracker\"\n> & {\n  children: ReactNode;\n};\n\nexport const SteppedTrackerProvider = ({\n  activeStep,\n  getOverflowRef,\n  hasTooltips,\n  totalSteps,\n  children,\n}: SteppedTrackerProviderProps) => {\n  const steppedTrackerContextValue: SteppedTrackerContextType = useMemo(\n    () => ({\n      activeStep,\n      getOverflowRef,\n      hasTooltips,\n      totalSteps,\n      isWithinSteppedTracker: true,\n    }),\n    [activeStep, getOverflowRef, hasTooltips, totalSteps]\n  );\n\n  return (\n    <SteppedTrackerContext.Provider value={steppedTrackerContextValue}>\n      {children}\n    </SteppedTrackerContext.Provider>\n  );\n};\n\nexport const useSteppedTrackerContext = () => useContext(SteppedTrackerContext);\n\ntype TrackerStepNumberContextType = number;\n\nconst TrackerStepContext = createContext<TrackerStepNumberContextType>(0);\n\nexport const useTrackerStepContext = () => useContext(TrackerStepContext);\n\ntype TrackerStepProivderProps = {\n  stepNumber: number;\n  children: ReactNode;\n};\n\nexport const TrackerStepProvider = ({\n  children,\n  stepNumber,\n}: TrackerStepProivderProps) => {\n  return (\n    <TrackerStepContext.Provider value={stepNumber}>\n      {children}\n    </TrackerStepContext.Provider>\n  );\n};\n"],"names":["createContext","useMemo","jsx","useContext"],"mappings":";;;;;;;AAYA,MAAM,4BAA+B,GAAA;AAAA,EACnC,UAAY,EAAA,CAAA;AAAA,EACZ,WAAa,EAAA,KAAA;AAAA,EACb,UAAY,EAAA,CAAA;AAAA,EACZ,gBAAgB,MAAM,KAAA,CAAA;AAAA,EACtB,sBAAwB,EAAA,KAAA;AAC1B,CAAA,CAAA;AAEA,MAAM,qBAAwB,GAAAA,mBAAA;AAAA,EAC5B,4BAAA;AACF,CAAA,CAAA;AASO,MAAM,yBAAyB,CAAC;AAAA,EACrC,UAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,UAAA;AAAA,EACA,QAAA;AACF,CAAmC,KAAA;AACjC,EAAA,MAAM,0BAAwD,GAAAC,aAAA;AAAA,IAC5D,OAAO;AAAA,MACL,UAAA;AAAA,MACA,cAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,sBAAwB,EAAA,IAAA;AAAA,KAC1B,CAAA;AAAA,IACA,CAAC,UAAA,EAAY,cAAgB,EAAA,WAAA,EAAa,UAAU,CAAA;AAAA,GACtD,CAAA;AAEA,EACE,uBAAAC,cAAA,CAAC,sBAAsB,QAAtB,EAAA;AAAA,IAA+B,KAAO,EAAA,0BAAA;AAAA,IACpC,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,EAAA;AAEa,MAAA,wBAAA,GAA2B,MAAMC,gBAAA,CAAW,qBAAqB,EAAA;AAI9E,MAAM,kBAAA,GAAqBH,oBAA4C,CAAC,CAAA,CAAA;AAE3D,MAAA,qBAAA,GAAwB,MAAMG,gBAAA,CAAW,kBAAkB,EAAA;AAOjE,MAAM,sBAAsB,CAAC;AAAA,EAClC,QAAA;AAAA,EACA,UAAA;AACF,CAAgC,KAAA;AAC9B,EACE,uBAAAD,cAAA,CAAC,mBAAmB,QAAnB,EAAA;AAAA,IAA4B,KAAO,EAAA,UAAA;AAAA,IACjC,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;;;;"}

package/dist-cjs/stepped-tracker/TrackerConnector/TrackerConnector.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltTrackerConnector {\n  --trackerConnector-style-default: var(--saltTrackerConnector-style-default, var(--salt-track-borderStyle-incomplete));\n  --trackerConnector-style-active: var(--saltTrackerConnector-style-active, var(--salt-track-borderStyle-active));\n  --trackerConnector-color: var(--saltTrackerConnector-color, var(--salt-track-borderColor));\n  --trackerConnector-thickness: var(--saltTrackerConnector-thickness, var(--salt-track-borderWidth));\n  --trackerConnector-margin: var(--saltTrackerConnector-margin, var(--salt-spacing-100));\n}\n\n.saltTrackerConnector {\n  height: 0;\n  border-top-width: var(--trackerConnector-thickness);\n  border-top-style: var(--trackerConnector-style-default);\n  border-top-color: var(--trackerConnector-color);\n  position: absolute;\n  width: calc(100% - (var(--saltIcon-size)) - (var(--trackerConnector-margin) * 2));\n  left: calc(50% + (var(--saltIcon-size) / 2) + var(--trackerConnector-margin));\n  top: calc(var(--saltIcon-size) / 2);\n}\n\n.saltTrackerConnector.saltTrackerConnector-active {\n  border-top-style: var(--trackerConnector-style-active);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=TrackerConnector.css.js.map

package/dist-cjs/stepped-tracker/TrackerConnector/TrackerConnector.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackerConnector.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/stepped-tracker/TrackerConnector/TrackerConnector.js

@@ -0,0 +1,26 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var clsx = require('clsx');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var TrackerConnector$1 = require('./TrackerConnector.css.js');
+
+const withBaseName = core.makePrefixer("saltTrackerConnector");
+const TrackerConnector = ({ state }) => {
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "salt-tracker-connector",
+    css: TrackerConnector$1,
+    window: targetWindow
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx("span", {
+    className: clsx.clsx(withBaseName(), withBaseName(state))
+  });
+};
+
+exports.TrackerConnector = TrackerConnector;
+//# sourceMappingURL=TrackerConnector.js.map

package/dist-cjs/stepped-tracker/TrackerConnector/TrackerConnector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackerConnector.js","sources":["../src/stepped-tracker/TrackerConnector/TrackerConnector.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport trackerConnectorCss from \"./TrackerConnector.css\";\n\nconst withBaseName = makePrefixer(\"saltTrackerConnector\");\n\ntype ConnectorState = \"default\" | \"active\";\n\ntype TrackerConnectorProps = {\n  /**\n   * The state of the connector, which acts as an indicator of whether the active step is ahead/behind\n   */\n  state: ConnectorState;\n};\n\nexport const TrackerConnector = ({ state }: TrackerConnectorProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-tracker-connector\",\n    css: trackerConnectorCss,\n    window: targetWindow,\n  });\n\n  return <span className={clsx(withBaseName(), withBaseName(state))} />;\n};\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","trackerConnectorCss","jsx","clsx"],"mappings":";;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,kBAAa,sBAAsB,CAAA,CAAA;AAWjD,MAAM,gBAAmB,GAAA,CAAC,EAAE,KAAA,EAAmC,KAAA;AACpE,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAC,kBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBAAQC,cAAA,CAAA,MAAA,EAAA;AAAA,IAAK,WAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA,YAAA,CAAa,KAAK,CAAC,CAAA;AAAA,GAAG,CAAA,CAAA;AACrE;;;;"}

package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltTrackerStep {\n  --trackerStep-icon-color-active: var(--saltTrackerStep-icon-color-active, var(--salt-status-info-foreground));\n  --trackerStep-icon-color-completed: var(--saltTrackerStep-icon-color-completed, var(--salt-status-success-foreground));\n\n  --trackerStep-icon-color: var(--saltTrackerStep-icon-color, var(--salt-status-static-foreground));\n\n  --saltIcon-color: var(--trackerStep-icon-color);\n  /* We redefine Icon Size so we can use it in calc functions in the trackerConnector */\n  --saltIcon-size: var(--saltTrackerStep-icon-size, max(var(--salt-icon-size-base), 12px));\n}\n\n.saltTrackerStep {\n  margin: 0;\n  padding: 0;\n  text-indent: 0;\n  list-style-type: none;\n  flex: 1;\n  position: relative;\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  width: var(--saltTrackerStep-width, 100%);\n  gap: var(--salt-spacing-50);\n  color: var(--salt-text-primary-foreground);\n  font-size: var(--salt-text-label-fontSize);\n  line-height: var(--salt-text-label-lineHeight);\n}\n\n/* Pseudo-class applied to the root element on focus */\n.saltTrackerStep:focus-visible {\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-offset: var(--salt-focused-outlineOffset);\n}\n\n.saltTrackerStep .saltTrackerStep-body {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n}\n\n.saltTrackerStep.saltTrackerStep-active {\n  --trackerStep-icon-color: var(--trackerStep-icon-color-active);\n}\n\n.saltTrackerStep.saltTrackerStep-completed {\n  --trackerStep-icon-color: var(--trackerStep-icon-color-completed);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=TrackerStep.css.js.map

package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackerStep.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js

@@ -0,0 +1,111 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var clsx = require('clsx');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var core = require('@salt-ds/core');
+var icons = require('@salt-ds/icons');
+var TrackerConnector = require('../TrackerConnector/TrackerConnector.js');
+var SteppedTrackerContext = require('../SteppedTrackerContext.js');
+var TrackerStep$1 = require('./TrackerStep.css.js');
+var TrackerStepTooltipContext = require('./TrackerStepTooltipContext.js');
+
+const withBaseName = core.makePrefixer("saltTrackerStep");
+const iconMap = {
+  default: icons.StepDefaultIcon,
+  completed: icons.StepSuccessIcon
+};
+const getStateIcon = ({
+  isActive,
+  state
+}) => {
+  if (state === "default" && isActive) {
+    return icons.StepActiveIcon;
+  }
+  return iconMap[state];
+};
+const getState = ({
+  isActive,
+  state
+}) => {
+  if (state === "default" && isActive) {
+    return "active";
+  }
+  return state;
+};
+const useCheckWithinSteppedTracker = (isWithinSteppedTracker) => {
+  React.useEffect(() => {
+    if (process.env.NODE_ENV !== "production") {
+      if (!isWithinSteppedTracker) {
+        console.error(
+          "The TrackerStep component must be placed within a SteppedTracker component"
+        );
+      }
+    }
+  }, [isWithinSteppedTracker]);
+};
+const TrackerStep = React.forwardRef(
+  function TrackerStep2(props, ref) {
+    const {
+      state = "default",
+      style,
+      className,
+      children,
+      ...restProps
+    } = props;
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-tracker-step",
+      css: TrackerStep$1,
+      window: targetWindow
+    });
+    const { activeStep, totalSteps, hasTooltips, isWithinSteppedTracker } = SteppedTrackerContext.useSteppedTrackerContext();
+    const stepNumber = SteppedTrackerContext.useTrackerStepContext();
+    useCheckWithinSteppedTracker(isWithinSteppedTracker);
+    const isActive = activeStep === stepNumber;
+    const Icon = getStateIcon({ isActive, state });
+    const resolvedState = getState({ isActive, state });
+    const connectorState = activeStep > stepNumber ? "active" : "default";
+    const hasConnector = stepNumber < totalSteps - 1;
+    const innerStyle = {
+      ...style,
+      "--saltTrackerStep-width": `${100 / totalSteps}%`
+    };
+    const Inner = /* @__PURE__ */ jsxRuntime.jsxs("li", {
+      className: clsx.clsx(withBaseName(), withBaseName(resolvedState), className),
+      style: innerStyle,
+      tabIndex: hasTooltips ? 0 : void 0,
+      "aria-current": isActive ? "step" : void 0,
+      "data-state": state,
+      ref,
+      ...restProps,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
+        hasConnector && /* @__PURE__ */ jsxRuntime.jsx(TrackerConnector.TrackerConnector, {
+          state: connectorState
+        }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: withBaseName("body"),
+          children
+        })
+      ]
+    });
+    if (!hasTooltips) {
+      return Inner;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(core.Tooltip, {
+      placement: "top",
+      content: /* @__PURE__ */ jsxRuntime.jsx(TrackerStepTooltipContext.TrackStepTooltipProvider, {
+        children
+      }),
+      children: Inner
+    });
+  }
+);
+
+exports.TrackerStep = TrackerStep;
+//# sourceMappingURL=TrackerStep.js.map

package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackerStep.js","sources":["../src/stepped-tracker/TrackerStep/TrackerStep.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, useEffect } from \"react\";\nimport { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { makePrefixer, Tooltip } from \"@salt-ds/core\";\nimport {\n  StepActiveIcon,\n  StepDefaultIcon,\n  StepSuccessIcon,\n} from \"@salt-ds/icons\";\nimport { TrackerConnector } from \"../TrackerConnector\";\n\nimport {\n  useSteppedTrackerContext,\n  useTrackerStepContext,\n} from \"../SteppedTrackerContext\";\n\nimport trackerStepCss from \"./TrackerStep.css\";\nimport { TrackStepTooltipProvider } from \"./TrackerStepTooltipContext\";\n\nconst withBaseName = makePrefixer(\"saltTrackerStep\");\n\ntype State = \"default\" | \"completed\";\n\ntype StateWithActive = State | \"active\";\n\nexport interface TrackerStepProps extends ComponentPropsWithoutRef<\"li\"> {\n  /**\n   * The state of the TrackerStep\n   */\n  state?: State;\n}\n\nconst iconMap = {\n  default: StepDefaultIcon,\n  completed: StepSuccessIcon,\n};\n\nconst getStateIcon = ({\n  isActive,\n  state,\n}: {\n  isActive: boolean;\n  state: State;\n}) => {\n  if (state === \"default\" && isActive) {\n    return StepActiveIcon;\n  }\n  return iconMap[state];\n};\n\nconst getState = ({\n  isActive,\n  state,\n}: {\n  isActive: boolean;\n  state: State;\n}): StateWithActive => {\n  if (state === \"default\" && isActive) {\n    return \"active\";\n  }\n  return state;\n};\n\nconst useCheckWithinSteppedTracker = (isWithinSteppedTracker: boolean) => {\n  useEffect(() => {\n    if (process.env.NODE_ENV !== \"production\") {\n      if (!isWithinSteppedTracker) {\n        console.error(\n          \"The TrackerStep component must be placed within a SteppedTracker component\"\n        );\n      }\n    }\n  }, [isWithinSteppedTracker]);\n};\n\nexport const TrackerStep = forwardRef<HTMLLIElement, TrackerStepProps>(\n  function TrackerStep(props, ref?) {\n    const {\n      state = \"default\",\n      style,\n      className,\n      children,\n      ...restProps\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-tracker-step\",\n      css: trackerStepCss,\n      window: targetWindow,\n    });\n\n    const { activeStep, totalSteps, hasTooltips, isWithinSteppedTracker } =\n      useSteppedTrackerContext();\n    const stepNumber = useTrackerStepContext();\n\n    useCheckWithinSteppedTracker(isWithinSteppedTracker);\n\n    const isActive = activeStep === stepNumber;\n    const Icon = getStateIcon({ isActive, state });\n    const resolvedState = getState({ isActive, state });\n    const connectorState = activeStep > stepNumber ? \"active\" : \"default\";\n    const hasConnector = stepNumber < totalSteps - 1;\n\n    const innerStyle = {\n      ...style,\n      \"--saltTrackerStep-width\": `${100 / totalSteps}%`,\n    };\n\n    const Inner = (\n      <li\n        className={clsx(withBaseName(), withBaseName(resolvedState), className)}\n        style={innerStyle}\n        tabIndex={hasTooltips ? 0 : undefined}\n        aria-current={isActive ? \"step\" : undefined}\n        data-state={state}\n        ref={ref}\n        {...restProps}\n      >\n        <Icon />\n        {hasConnector && <TrackerConnector state={connectorState} />}\n        <div className={withBaseName(\"body\")}>{children}</div>\n      </li>\n    );\n\n    if (!hasTooltips) {\n      return Inner;\n    }\n\n    return (\n      <Tooltip\n        placement=\"top\"\n        content={\n          <TrackStepTooltipProvider>{children}</TrackStepTooltipProvider>\n        }\n      >\n        {Inner}\n      </Tooltip>\n    );\n  }\n);\n"],"names":["makePrefixer","StepDefaultIcon","StepSuccessIcon","StepActiveIcon","useEffect","forwardRef","TrackerStep","useWindow","useComponentCssInjection","trackerStepCss","useSteppedTrackerContext","useTrackerStepContext","jsxs","clsx","jsx","TrackerConnector","Tooltip","TrackStepTooltipProvider"],"mappings":"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"}

package/dist-cjs/stepped-tracker/TrackerStep/TrackerStepTooltipContext.js

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+
+const TrackerStepTooltipContext = React.createContext(false);
+const TrackStepTooltipProvider = ({
+  children
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(TrackerStepTooltipContext.Provider, {
+    value: true,
+    children
+  });
+};
+const useTrackerStepTooltipContext = () => React.useContext(TrackerStepTooltipContext);
+
+exports.TrackStepTooltipProvider = TrackStepTooltipProvider;
+exports.useTrackerStepTooltipContext = useTrackerStepTooltipContext;
+//# sourceMappingURL=TrackerStepTooltipContext.js.map

package/dist-cjs/stepped-tracker/TrackerStep/TrackerStepTooltipContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackerStepTooltipContext.js","sources":["../src/stepped-tracker/TrackerStep/TrackerStepTooltipContext.tsx"],"sourcesContent":["import { createContext, ReactNode, useContext } from \"react\";\n\nconst TrackerStepTooltipContext = createContext<boolean>(false);\n\ntype TrackStepTooltipProps = {\n  children: ReactNode;\n};\n\nexport const TrackStepTooltipProvider = ({\n  children,\n}: TrackStepTooltipProps) => {\n  return (\n    <TrackerStepTooltipContext.Provider value={true}>\n      {children}\n    </TrackerStepTooltipContext.Provider>\n  );\n};\n\nexport const useTrackerStepTooltipContext = () =>\n  useContext(TrackerStepTooltipContext);\n"],"names":["createContext","jsx","useContext"],"mappings":";;;;;;;AAEA,MAAM,yBAAA,GAA4BA,oBAAuB,KAAK,CAAA,CAAA;AAMvD,MAAM,2BAA2B,CAAC;AAAA,EACvC,QAAA;AACF,CAA6B,KAAA;AAC3B,EACE,uBAAAC,cAAA,CAAC,0BAA0B,QAA1B,EAAA;AAAA,IAAmC,KAAO,EAAA,IAAA;AAAA,IACxC,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,EAAA;AAEa,MAAA,4BAAA,GAA+B,MAC1CC,gBAAA,CAAW,yBAAyB;;;;;"}

package/dist-cjs/stepped-tracker/useDetectTruncatedText.js

@@ -0,0 +1,71 @@
+'use strict';
+
+var React = require('react');
+
+const useDetectTruncatedText = (callback) => {
+  const [observedMap] = React.useState(() => /* @__PURE__ */ new Map());
+  const callbackRef = React.useRef(callback);
+  React.useEffect(() => {
+    callbackRef.current = callback;
+  }, [callback]);
+  const isTruncatedRef = React.useRef(false);
+  const checkEntries = React.useCallback(() => {
+    let anyEntriesTruncated = false;
+    observedMap.forEach((entry) => {
+      if (entry.offsetWidth < entry.scrollWidth) {
+        anyEntriesTruncated = true;
+      }
+    });
+    if (anyEntriesTruncated !== isTruncatedRef.current) {
+      isTruncatedRef.current = anyEntriesTruncated;
+      callbackRef.current(anyEntriesTruncated);
+    }
+  }, [observedMap]);
+  const getRo = React.useCallback(() => {
+    return new ResizeObserver(checkEntries);
+  }, [checkEntries]);
+  const [ro, setRo] = React.useState(() => getRo());
+  React.useEffect(() => {
+    return () => {
+      ro.disconnect();
+    };
+  }, [ro]);
+  React.useEffect(() => {
+    setRo(getRo());
+  }, [getRo]);
+  const observeAndUnobserveRef = React.useCallback(
+    (id, el) => {
+      if (!el) {
+        const existingRef = observedMap.get(id);
+        if (existingRef) {
+          ro.unobserve(existingRef);
+          observedMap.delete(id);
+        }
+      } else {
+        const existingRef = observedMap.get(id);
+        if (el === existingRef) {
+          return;
+        }
+        if (existingRef) {
+          ro.unobserve(existingRef);
+        }
+        observedMap.set(id, el);
+        ro.observe(el);
+        checkEntries();
+      }
+    },
+    [observedMap, ro, checkEntries]
+  );
+  const getOverflowRef = React.useCallback(
+    (id) => {
+      return (el) => {
+        observeAndUnobserveRef(id, el);
+      };
+    },
+    [observeAndUnobserveRef]
+  );
+  return getOverflowRef;
+};
+
+module.exports = useDetectTruncatedText;
+//# sourceMappingURL=useDetectTruncatedText.js.map

package/dist-cjs/stepped-tracker/useDetectTruncatedText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDetectTruncatedText.js","sources":["../src/stepped-tracker/useDetectTruncatedText.ts"],"sourcesContent":["import { useState, useRef, useEffect, useCallback, RefCallback } from \"react\";\n\ntype OnTruncatedCallback = (isTruncated: boolean) => void;\nexport type GetOverflowRef = (id: string) => RefCallback<HTMLElement>;\n\n/**\n * Hook to detect truncation of any child TrackerStep components, using a ResizeObserver to update on element resizes.\n * The desired behaviour is whenever any of the individual steps is truncated, all steps become foccusable with Tooltips.\n * @param {OnTruncatedCallback} callback - The callback which will called when the isTruncated state changes\n * @returns {GetOverflowRef} getOverflowRef - A factory function which when passed a child index will return an appropriate ref callback for observing am element\n */\nconst useDetectTruncatedText = (\n  callback: OnTruncatedCallback\n): GetOverflowRef => {\n  // Used for tracking creation/destruction of child elements\n  const [observedMap] = useState(() => new Map<string, HTMLElement>());\n\n  // Store callback as a ref to prevent re-creating ResizeObserver, update using an effect\n  const callbackRef = useRef<(isOverflowing: boolean) => void>(callback);\n  useEffect(() => {\n    callbackRef.current = callback;\n  }, [callback]);\n  const isTruncatedRef = useRef(false);\n\n  const checkEntries = useCallback(() => {\n    let anyEntriesTruncated = false;\n\n    observedMap.forEach((entry) => {\n      if (entry.offsetWidth < entry.scrollWidth) {\n        anyEntriesTruncated = true;\n      }\n    });\n\n    if (anyEntriesTruncated !== isTruncatedRef.current) {\n      isTruncatedRef.current = anyEntriesTruncated;\n      callbackRef.current(anyEntriesTruncated);\n    }\n  }, [observedMap]);\n\n  // Creation of the ResizeObserver, should only happen once\n  const getRo = useCallback(() => {\n    return new ResizeObserver(checkEntries);\n  }, [checkEntries]);\n\n  // Management of the ResizeObserver lifecycle. It should only be created once for each StepTracker compoenent\n  const [ro, setRo] = useState(() => getRo());\n  useEffect(() => {\n    return () => {\n      ro.disconnect();\n    };\n  }, [ro]);\n  useEffect(() => {\n    setRo(getRo());\n  }, [getRo]);\n\n  // Function for managing the observing/unobserving of elements based on their ref callbacks\n  const observeAndUnobserveRef = useCallback(\n    (id: string, el: HTMLElement | null) => {\n      if (!el) {\n        const existingRef = observedMap.get(id);\n        if (existingRef) {\n          ro.unobserve(existingRef);\n          observedMap.delete(id);\n        }\n      } else {\n        const existingRef = observedMap.get(id);\n        if (el === existingRef) {\n          return;\n        }\n\n        if (existingRef) {\n          ro.unobserve(existingRef);\n        }\n\n        observedMap.set(id, el);\n        ro.observe(el);\n        checkEntries();\n      }\n    },\n    [observedMap, ro, checkEntries]\n  );\n\n  // Factory function which creates a suitable html ref callback which includes the index\n  const getOverflowRef = useCallback<GetOverflowRef>(\n    (id: string) => {\n      return (el: HTMLElement | null) => {\n        observeAndUnobserveRef(id, el);\n      };\n    },\n    [observeAndUnobserveRef]\n  );\n\n  return getOverflowRef;\n};\n\nexport default useDetectTruncatedText;\n"],"names":["useState","useRef","useEffect","useCallback"],"mappings":"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"}

package/dist-cjs/tabs/Tabstrip.js

@@ -11,7 +11,6 @@ require('../dropdown/DropdownBase.js');
 require('../dropdown/DropdownButton.js');
 var Dropdown = require('../dropdown/Dropdown.js');
 require('../responsive/useResizeObserver.js');
-require('../utils/useFloatingUI.js');
 var useOverflowCollectionItems = require('../responsive/useOverflowCollectionItems.js');
 var useOverflowLayout = require('../responsive/useOverflowLayout.js');
 require('../form-field-context-legacy/FormFieldLegacyContext.js');