@salt-ds/lab 1.0.0-alpha.6 → 1.0.0-alpha.60

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

@@ -0,0 +1 @@
+{"version":3,"file":"Step.js","sources":["../src/stepped-tracker/Step.tsx"],"sourcesContent":["import { makePrefixer, useControlled, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport clsx from \"clsx\";\nimport { type CSSProperties, useContext, useEffect } from \"react\";\n\nimport { StepConnector } from \"./Step.Connector\";\nimport { StepDescription } from \"./Step.Description\";\nimport { StepExpandTrigger } from \"./Step.ExpandTrigger\";\nimport { StepIcon } from \"./Step.Icon\";\nimport { StepLabel } from \"./Step.Label\";\nimport { StepSROnly } from \"./Step.SROnly\";\nimport stepCSS from \"./Step.css\";\nimport { SteppedTracker } from \"./SteppedTracker\";\nimport { DepthContext } from \"./SteppedTracker.Provider\";\n\nimport type { StepProps } from \"./Step.types\";\n\nconst withBaseName = makePrefixer(\"saltStep\");\n\nexport function Step({\n  id: idProp,\n  label,\n  description,\n  status,\n  stage = \"pending\",\n  expanded: expandedProp,\n  defaultExpanded,\n  onToggle,\n  className,\n  style,\n  substeps,\n  children,\n  ...props\n}: StepProps) {\n  const id = useId(idProp);\n  const targetWindow = useWindow();\n  const depth = useContext(DepthContext);\n\n  const [expanded, setExpanded] = useControlled({\n    name: \"Step\",\n    state: \"expanded\",\n    controlled: expandedProp,\n    default: Boolean(defaultExpanded),\n  });\n\n  useComponentCssInjection({\n    testId: \"salt-step\",\n    css: stepCSS,\n    window: targetWindow,\n  });\n\n  useEffect(() => {\n    if (process.env.NODE_ENV !== \"production\") {\n      if (depth === -1) {\n        console.warn(\n          \"<Step /> should be used within a <SteppedTracker /> component!\",\n        );\n      }\n\n      if (depth > 2) {\n        console.warn(\"<Step /> should not be nested more than 2 levels deep!\");\n      }\n    }\n  }, [depth]);\n\n  const ariaCurrent = stage === \"active\" ? \"step\" : undefined;\n  const iconSizeMultiplier = depth === 0 ? 1.5 : 1;\n  const hasNestedSteps = !!children || !!substeps;\n  const state = status || stage;\n\n  const labelId = `${id}-label`;\n  const descriptionId = `${id}-description`;\n  const expandTriggerId = `${id}-expand-trigger`;\n  const nestedSteppedTrackerId = `${id}-nested-stepped-tracker`;\n\n  const srOnly = {\n    stateId: `${id}-sr-only-state`,\n    stateText: state !== \"active\" ? state : undefined,\n    substepsId: `${id}-sr-only-substeps`,\n    substepsText: \"substeps\",\n    toggleSubstepsId: `${id}-sr-only-toggle-substeps`,\n    toggleSubstepsText: \"toggle substeps\",\n  };\n\n  return (\n    <li\n      id={id}\n      data-stage={stage}\n      data-status={status}\n      data-depth={depth}\n      aria-current={ariaCurrent}\n      className={clsx(\n        withBaseName(),\n        withBaseName(`stage-${stage}`),\n        withBaseName(`depth-${depth}`),\n        status && withBaseName(`status-${status}`),\n        !hasNestedSteps && withBaseName(\"terminal\"),\n        hasNestedSteps && expanded && withBaseName(\"expanded\"),\n        hasNestedSteps && !expanded && withBaseName(\"collapsed\"),\n        className,\n      )}\n      style={\n        {\n          \"--saltStep-depth\": depth,\n          ...style,\n        } as CSSProperties\n      }\n      {...props}\n    >\n      <StepSROnly>\n        {label} {description} {srOnly.stateText}\n      </StepSROnly>\n      <StepSROnly id={srOnly.toggleSubstepsId} aria-hidden>\n        {srOnly.toggleSubstepsText}\n      </StepSROnly>\n      <StepSROnly id={srOnly.substepsId} aria-hidden>\n        {srOnly.substepsText}\n      </StepSROnly>\n      <StepSROnly id={srOnly.stateId} aria-hidden>\n        {srOnly.stateText}\n      </StepSROnly>\n      <StepConnector />\n      <StepIcon\n        stage={stage}\n        status={status}\n        sizeMultiplier={iconSizeMultiplier}\n        aria-hidden\n      />\n      {label && (\n        <StepLabel id={labelId} aria-hidden>\n          {label}\n        </StepLabel>\n      )}\n      {description && (\n        <StepDescription id={descriptionId} aria-hidden>\n          {description}\n        </StepDescription>\n      )}\n      {hasNestedSteps && (\n        <StepExpandTrigger\n          id={expandTriggerId}\n          aria-expanded={expanded}\n          aria-controls={nestedSteppedTrackerId}\n          aria-labelledby={[\n            labelId,\n            descriptionId,\n            srOnly.stateId,\n            srOnly.toggleSubstepsId,\n          ].join(\" \")}\n          expanded={expanded}\n          onClick={(event) => {\n            onToggle?.(event);\n            setExpanded(!expanded);\n          }}\n        />\n      )}\n      {hasNestedSteps && (\n        <SteppedTracker\n          id={nestedSteppedTrackerId}\n          aria-labelledby={[labelId, srOnly.substepsId].join(\" \")}\n          aria-hidden={!expanded}\n          hidden={!expanded}\n        >\n          {children}\n          {substeps?.map((step) => (\n            <Step key={step.id} {...step} />\n          ))}\n        </SteppedTracker>\n      )}\n    </li>\n  );\n}\n"],"names":["makePrefixer","useId","useWindow","useContext","DepthContext","useControlled","useComponentCssInjection","stepCSS","useEffect","jsxs","StepSROnly","jsx","StepConnector","StepIcon","StepLabel","StepDescription","StepExpandTrigger","SteppedTracker"],"mappings":"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"}

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

@@ -0,0 +1,19 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+
+const DepthContext = react.createContext(-1);
+const OrientationContext = react.createContext("horizontal");
+function SteppedTrackerProvider({
+  orientation: orientationProp,
+  children
+}) {
+  const depth = react.useContext(DepthContext);
+  return /* @__PURE__ */ jsxRuntime.jsx(OrientationContext.Provider, { value: orientationProp, children: /* @__PURE__ */ jsxRuntime.jsx(DepthContext.Provider, { value: depth + 1, children }) });
+}
+
+exports.DepthContext = DepthContext;
+exports.OrientationContext = OrientationContext;
+exports.SteppedTrackerProvider = SteppedTrackerProvider;
+//# sourceMappingURL=SteppedTracker.Provider.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SteppedTracker.Provider.js","sources":["../src/stepped-tracker/SteppedTracker.Provider.tsx"],"sourcesContent":["import { type ReactNode, createContext, useContext } from \"react\";\n\nimport type { StepDepth } from \"./Step.types\";\nimport type { SteppedTrackerOrientation } from \"./SteppedTracker.types\";\n\nexport const DepthContext = createContext<StepDepth>(-1);\nexport const OrientationContext =\n  createContext<SteppedTrackerOrientation>(\"horizontal\");\n\nexport interface SteppedTrackerProviderProps {\n  orientation: SteppedTrackerOrientation;\n  children: ReactNode;\n}\n\nexport function SteppedTrackerProvider({\n  orientation: orientationProp,\n  children,\n}: SteppedTrackerProviderProps) {\n  const depth = useContext(DepthContext);\n\n  return (\n    <OrientationContext.Provider value={orientationProp}>\n      <DepthContext.Provider value={depth + 1}>\n        {children}\n      </DepthContext.Provider>\n    </OrientationContext.Provider>\n  );\n}\n"],"names":["createContext","useContext","jsx"],"mappings":";;;;;AAKa,MAAA,YAAA,GAAeA,oBAAyB,CAAE,CAAA;AAC1C,MAAA,kBAAA,GACXA,oBAAyC,YAAY;AAOhD,SAAS,sBAAuB,CAAA;AAAA,EACrC,WAAa,EAAA,eAAA;AAAA,EACb;AACF,CAAgC,EAAA;AAC9B,EAAM,MAAA,KAAA,GAAQC,iBAAW,YAAY,CAAA;AAErC,EAAA,uBACGC,cAAA,CAAA,kBAAA,CAAmB,QAAnB,EAAA,EAA4B,OAAO,eAClC,EAAA,QAAA,kBAAAA,cAAA,CAAC,YAAa,CAAA,QAAA,EAAb,EAAsB,KAAA,EAAO,KAAQ,GAAA,CAAA,EACnC,UACH,CACF,EAAA,CAAA;AAEJ;;;;;;"}

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

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltSteppedTracker {\n  grid-area: stepped-tracker;\n  width: 100%;\n  height: 100%;\n\n  margin: 0;\n  padding: 0;\n  list-style-type: none;\n  transition-duration: var(--salt-duration-perceptible);\n  transition-timing-function: ease-in-out;\n  transition-property: opacity, visibility;\n}\n\n@media (prefers-reduced-motion) {\n  .saltSteppedTracker {\n    transition-duration: var(--salt-duration-instant);\n  }\n}\n\n.saltSteppedTracker-horizontal {\n  display: flex;\n  flex-direction: row;\n}\n\n.saltSteppedTracker-vertical {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.saltSteppedTracker-vertical > .saltStep.saltStep-expanded > .saltSteppedTracker {\n  opacity: 1;\n  visibility: visible;\n}\n\n.saltSteppedTracker-vertical > .saltStep.saltStep-collapsed > .saltSteppedTracker {\n  opacity: 0;\n  visibility: hidden;\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,36 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var react = require('react');
+var SteppedTracker_Provider = require('./SteppedTracker.Provider.js');
+var SteppedTracker$1 = require('./SteppedTracker.css.js');
+
+const withBaseName = core.makePrefixer("saltSteppedTracker");
+const SteppedTracker = react.forwardRef(
+  function SteppedTracker2({ orientation: orientationProp, children, className, ...props }, ref) {
+    const targetWindow = window.useWindow();
+    const orientationContext = react.useContext(SteppedTracker_Provider.OrientationContext);
+    const orientation = orientationProp || orientationContext;
+    styles.useComponentCssInjection({
+      testId: "salt-SteppedTracker",
+      css: SteppedTracker$1,
+      window: targetWindow
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx(SteppedTracker_Provider.SteppedTrackerProvider, { orientation, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "ol",
+      {
+        className: clsx.clsx(withBaseName(), withBaseName(orientation), className),
+        ref,
+        ...props,
+        children
+      }
+    ) });
+  }
+);
+
+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 { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, useContext } from \"react\";\n\nimport {\n  OrientationContext,\n  SteppedTrackerProvider,\n} from \"./SteppedTracker.Provider\";\nimport SteppedTrackerCSS from \"./SteppedTracker.css\";\nimport type { SteppedTrackerProps } from \"./SteppedTracker.types\";\n\nconst withBaseName = makePrefixer(\"saltSteppedTracker\");\n\nexport const SteppedTracker = forwardRef<HTMLOListElement, SteppedTrackerProps>(\n  function SteppedTracker(\n    { orientation: orientationProp, children, className, ...props },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    const orientationContext = useContext(OrientationContext);\n    const orientation = orientationProp || orientationContext;\n\n    useComponentCssInjection({\n      testId: \"salt-SteppedTracker\",\n      css: SteppedTrackerCSS,\n      window: targetWindow,\n    });\n\n    return (\n      <SteppedTrackerProvider orientation={orientation}>\n        <ol\n          className={clsx(withBaseName(), withBaseName(orientation), className)}\n          ref={ref}\n          {...props}\n        >\n          {children}\n        </ol>\n      </SteppedTrackerProvider>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","SteppedTracker","useWindow","useContext","OrientationContext","useComponentCssInjection","SteppedTrackerCSS","jsx","SteppedTrackerProvider","clsx"],"mappings":";;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,kBAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAiB,GAAAC,gBAAA;AAAA,EAC5B,SAASC,eACP,CAAA,EAAE,WAAa,EAAA,eAAA,EAAiB,UAAU,SAAW,EAAA,GAAG,KAAM,EAAA,EAC9D,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAM,MAAA,kBAAA,GAAqBC,iBAAWC,0CAAkB,CAAA;AACxD,IAAA,MAAM,cAAc,eAAmB,IAAA,kBAAA;AAEvC,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,gBAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAAC,cAAA,CAACC,kDAAuB,WACtB,EAAA,QAAA,kBAAAD,cAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAWE,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,WAAW,GAAG,SAAS,CAAA;AAAA,QACpE,GAAA;AAAA,QACC,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KAEL,EAAA,CAAA;AAAA;AAGN;;;;"}

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

@@ -0,0 +1,109 @@
+'use strict';
+
+var utils = require('./utils.js');
+
+function stepReducer(state, action) {
+  var _a, _b;
+  if (action.type === "next") {
+    if (((_a = state.activeStep) == null ? void 0 : _a.status) === "error") {
+      return state;
+    }
+    const steps = utils.resetSteps(state.steps);
+    const flatSteps = utils.flattenSteps(steps);
+    if (state.nextStep) {
+      const activeStepIndex2 = state.activeStepIndex + 1;
+      const activeStep2 = flatSteps[activeStepIndex2];
+      const previousStep2 = flatSteps[activeStepIndex2 - 1] || null;
+      const nextStep2 = flatSteps[activeStepIndex2 + 1] || null;
+      if (activeStep2) {
+        activeStep2.stage = "active";
+      }
+      return {
+        steps: utils.autoStageSteps(steps),
+        flatSteps,
+        activeStepIndex: activeStepIndex2,
+        activeStep: activeStep2,
+        previousStep: previousStep2,
+        nextStep: nextStep2,
+        started: true,
+        ended: false
+      };
+    }
+    const activeStepIndex = flatSteps.length;
+    const previousStep = flatSteps.at(-1);
+    const activeStep = null;
+    const nextStep = null;
+    return {
+      steps: utils.assignSteps(steps, "completed"),
+      flatSteps,
+      activeStepIndex,
+      activeStep,
+      previousStep,
+      nextStep,
+      started: true,
+      ended: true
+    };
+  }
+  if (action.type === "previous") {
+    if (((_b = state.activeStep) == null ? void 0 : _b.status) === "error") {
+      return state;
+    }
+    const steps = utils.resetSteps(state.steps);
+    const flatSteps = utils.flattenSteps(steps);
+    if (state.previousStep) {
+      const activeStepIndex2 = state.activeStepIndex - 1;
+      const activeStep2 = flatSteps[activeStepIndex2];
+      const previousStep2 = flatSteps[activeStepIndex2 - 1] || null;
+      const nextStep2 = flatSteps[activeStepIndex2 + 1] || null;
+      if (activeStep2) {
+        activeStep2.stage = "active";
+      }
+      return {
+        steps: utils.autoStageSteps(steps),
+        flatSteps,
+        activeStepIndex: activeStepIndex2,
+        activeStep: activeStep2,
+        previousStep: previousStep2,
+        nextStep: nextStep2,
+        started: true,
+        ended: false
+      };
+    }
+    const activeStepIndex = -1;
+    const activeStep = null;
+    const previousStep = null;
+    const nextStep = flatSteps.at(0);
+    return {
+      steps: utils.assignSteps(steps, "pending"),
+      flatSteps,
+      activeStepIndex,
+      activeStep,
+      previousStep,
+      nextStep,
+      ended: false,
+      started: false
+    };
+  }
+  if (action.type === "error") {
+    if (state.activeStep) {
+      state.activeStep.status = "error";
+      return { ...state };
+    }
+  }
+  if (action.type === "warning") {
+    if (state.activeStep) {
+      state.activeStep.status = "warning";
+      return { ...state };
+    }
+  }
+  if (action.type === "clear") {
+    if (state.activeStep) {
+      state.activeStep.status = void 0;
+      return { ...state };
+    }
+  }
+  return state;
+}
+
+module.exports = stepReducer;
+//# sourceMappingURL=stepReducer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"stepReducer.js","sources":["../src/stepped-tracker/stepReducer.ts"],"sourcesContent":["import type { StepReducerAction, StepReducerState } from \"./stepReducer.types\";\nimport { assignSteps, autoStageSteps, flattenSteps, resetSteps } from \"./utils\";\n\nexport default function stepReducer(\n  state: StepReducerState,\n  action: StepReducerAction,\n) {\n  if (action.type === \"next\") {\n    if (state.activeStep?.status === \"error\") {\n      return state;\n    }\n\n    const steps = resetSteps(state.steps);\n    const flatSteps = flattenSteps(steps);\n\n    if (state.nextStep) {\n      const activeStepIndex = state.activeStepIndex + 1;\n      const activeStep = flatSteps[activeStepIndex];\n      const previousStep = flatSteps[activeStepIndex - 1] || null;\n      const nextStep = flatSteps[activeStepIndex + 1] || null;\n\n      if (activeStep) {\n        activeStep.stage = \"active\";\n      }\n\n      return {\n        steps: autoStageSteps(steps),\n        flatSteps,\n        activeStepIndex,\n        activeStep,\n        previousStep,\n        nextStep,\n        started: true,\n        ended: false,\n      };\n    }\n\n    const activeStepIndex = flatSteps.length;\n    const previousStep = flatSteps.at(-1);\n    const activeStep = null;\n    const nextStep = null;\n\n    return {\n      steps: assignSteps(steps, \"completed\"),\n      flatSteps,\n      activeStepIndex,\n      activeStep,\n      previousStep,\n      nextStep,\n      started: true,\n      ended: true,\n    } as StepReducerState;\n  }\n\n  if (action.type === \"previous\") {\n    if (state.activeStep?.status === \"error\") {\n      return state;\n    }\n\n    const steps = resetSteps(state.steps);\n    const flatSteps = flattenSteps(steps);\n\n    if (state.previousStep) {\n      const activeStepIndex = state.activeStepIndex - 1;\n      const activeStep = flatSteps[activeStepIndex];\n      const previousStep = flatSteps[activeStepIndex - 1] || null;\n      const nextStep = flatSteps[activeStepIndex + 1] || null;\n\n      if (activeStep) {\n        activeStep.stage = \"active\";\n      }\n\n      return {\n        steps: autoStageSteps(steps),\n        flatSteps,\n        activeStepIndex,\n        activeStep,\n        previousStep,\n        nextStep,\n        started: true,\n        ended: false,\n      } as StepReducerState;\n    }\n\n    const activeStepIndex = -1;\n    const activeStep = null;\n    const previousStep = null;\n    const nextStep = flatSteps.at(0);\n\n    return {\n      steps: assignSteps(steps, \"pending\"),\n      flatSteps,\n      activeStepIndex,\n      activeStep,\n      previousStep,\n      nextStep,\n      ended: false,\n      started: false,\n    } as StepReducerState;\n  }\n\n  if (action.type === \"error\") {\n    if (state.activeStep) {\n      state.activeStep.status = \"error\";\n      return { ...state };\n    }\n  }\n\n  if (action.type === \"warning\") {\n    if (state.activeStep) {\n      state.activeStep.status = \"warning\";\n      return { ...state };\n    }\n  }\n\n  if (action.type === \"clear\") {\n    if (state.activeStep) {\n      state.activeStep.status = undefined;\n      return { ...state };\n    }\n  }\n\n  return state;\n}\n"],"names":["resetSteps","flattenSteps","activeStepIndex","activeStep","previousStep","nextStep","autoStageSteps","assignSteps"],"mappings":"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"}

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

@@ -0,0 +1,16 @@
+'use strict';
+
+var react = require('react');
+var stepReducer = require('./stepReducer.js');
+var utils = require('./utils.js');
+
+function useStepReducer(initialSteps, options) {
+  const state = react.useMemo(
+    () => utils.initStepReducerState(initialSteps, options),
+    [initialSteps, options]
+  );
+  return react.useReducer(stepReducer, state);
+}
+
+exports.useStepReducer = useStepReducer;
+//# sourceMappingURL=useStepReducer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useStepReducer.js","sources":["../src/stepped-tracker/useStepReducer.ts"],"sourcesContent":["import { useMemo, useReducer } from \"react\";\n\nimport stepReducer from \"./stepReducer\";\nimport { initStepReducerState } from \"./utils\";\n\nimport type { StepRecord } from \"./Step.types\";\nimport type { StepReducerOptions } from \"./stepReducer.types\";\n\nexport function useStepReducer(\n  initialSteps: StepRecord[],\n  options?: StepReducerOptions,\n) {\n  const state = useMemo(\n    () => initStepReducerState(initialSteps, options),\n    [initialSteps, options],\n  );\n\n  return useReducer(stepReducer, state);\n}\n"],"names":["useMemo","initStepReducerState","useReducer"],"mappings":";;;;;;AAQgB,SAAA,cAAA,CACd,cACA,OACA,EAAA;AACA,EAAA,MAAM,KAAQ,GAAAA,aAAA;AAAA,IACZ,MAAMC,0BAAqB,CAAA,YAAA,EAAc,OAAO,CAAA;AAAA,IAChD,CAAC,cAAc,OAAO;AAAA,GACxB;AAEA,EAAO,OAAAC,gBAAA,CAAW,aAAa,KAAK,CAAA;AACtC;;;;"}

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

@@ -0,0 +1,86 @@
+'use strict';
+
+function assignSteps(steps, stage) {
+  return steps.map((step) => {
+    step.stage = stage;
+    if (step.substeps) {
+      step.substeps = assignSteps(step.substeps, stage);
+    }
+    return step;
+  });
+}
+function resetSteps(steps) {
+  return assignSteps(steps, void 0);
+}
+function autoStageSteps(steps, options) {
+  function autoStageHelper(steps2) {
+    const pivotIndex = steps2.findIndex(
+      (step) => (step == null ? void 0 : step.id) && (options == null ? void 0 : options.activeStepId) && step.id === options.activeStepId || step.stage === "active" || step.stage === "inprogress"
+    );
+    if (pivotIndex !== -1) {
+      const activeStep = steps2[pivotIndex];
+      activeStep.stage ||= "active";
+      const previousSteps = assignSteps(
+        steps2.slice(0, pivotIndex),
+        "completed"
+      );
+      const nextSteps = assignSteps(steps2.slice(pivotIndex + 1), "pending");
+      return [...previousSteps, activeStep, ...nextSteps];
+    }
+    return steps2.reduce(
+      (acc, step, index) => {
+        if (step.substeps) {
+          const substeps = autoStageHelper(step.substeps);
+          if (substeps) {
+            steps2[index].substeps = substeps;
+            steps2[index].stage = "inprogress";
+            return autoStageHelper(steps2);
+          }
+        }
+        return acc;
+      },
+      null
+    );
+  }
+  return autoStageHelper(steps) || assignSteps(steps, steps[0].stage || "pending");
+}
+function flattenSteps(steps) {
+  return steps.reduce((acc, step) => {
+    if (step.substeps) {
+      acc.push(...flattenSteps(step.substeps));
+      return acc;
+    }
+    acc.push(step);
+    return acc;
+  }, []);
+}
+function initStepReducerState(initialSteps, options) {
+  const steps = autoStageSteps(initialSteps, options);
+  const flatSteps = flattenSteps(steps);
+  const started = !flatSteps.every((step) => step.stage === "pending");
+  const ended = flatSteps.every((step) => step.stage === "completed");
+  let activeStepIndex = flatSteps.findIndex((step) => step.stage === "active");
+  if (activeStepIndex === -1 && ended) {
+    activeStepIndex = flatSteps.length;
+  }
+  const activeStep = flatSteps[activeStepIndex] || null;
+  const previousStep = flatSteps[activeStepIndex - 1] || null;
+  const nextStep = flatSteps[activeStepIndex + 1] || null;
+  return {
+    steps,
+    flatSteps,
+    activeStep,
+    previousStep,
+    nextStep,
+    activeStepIndex,
+    ended,
+    started
+  };
+}
+
+exports.assignSteps = assignSteps;
+exports.autoStageSteps = autoStageSteps;
+exports.flattenSteps = flattenSteps;
+exports.initStepReducerState = initStepReducerState;
+exports.resetSteps = resetSteps;
+//# sourceMappingURL=utils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../src/stepped-tracker/utils.ts"],"sourcesContent":["import type { StepRecord, StepStage } from \"./Step.types\";\nimport type { StepReducerOptions, StepReducerState } from \"./stepReducer.types\";\n\nexport function assignSteps(\n  steps: StepRecord[],\n  stage?: StepStage,\n): StepRecord[] {\n  return steps.map((step) => {\n    step.stage = stage;\n    if (step.substeps) {\n      step.substeps = assignSteps(step.substeps, stage);\n    }\n\n    return step;\n  });\n}\n\nexport function resetSteps(steps: StepRecord[]): StepRecord[] {\n  return assignSteps(steps, undefined);\n}\n\nexport function autoStageSteps(\n  steps: StepRecord[],\n  options?: StepReducerOptions,\n): StepRecord[] {\n  function autoStageHelper(steps: StepRecord[]): StepRecord[] | null {\n    const pivotIndex = steps.findIndex(\n      (step) =>\n        (step?.id &&\n          options?.activeStepId &&\n          step.id === options.activeStepId) ||\n        step.stage === \"active\" ||\n        step.stage === \"inprogress\",\n    );\n\n    if (pivotIndex !== -1) {\n      const activeStep = steps[pivotIndex];\n\n      activeStep.stage ||= \"active\";\n\n      const previousSteps = assignSteps(\n        steps.slice(0, pivotIndex),\n        \"completed\",\n      );\n      const nextSteps = assignSteps(steps.slice(pivotIndex + 1), \"pending\");\n\n      return [...previousSteps, activeStep, ...nextSteps] as StepRecord[];\n    }\n\n    return steps.reduce(\n      (acc, step, index) => {\n        if (step.substeps) {\n          const substeps = autoStageHelper(step.substeps);\n\n          if (substeps) {\n            steps[index].substeps = substeps;\n            steps[index].stage = \"inprogress\";\n\n            return autoStageHelper(steps);\n          }\n        }\n\n        return acc;\n      },\n      null as StepRecord[] | null,\n    );\n  }\n\n  return (\n    autoStageHelper(steps) || assignSteps(steps, steps[0].stage || \"pending\")\n  );\n}\n\nexport function flattenSteps(steps: StepRecord[]): StepRecord[] {\n  return steps.reduce((acc, step) => {\n    if (step.substeps) {\n      acc.push(...flattenSteps(step.substeps));\n\n      return acc;\n    }\n\n    acc.push(step);\n\n    return acc;\n  }, [] as StepRecord[]);\n}\n\nexport function initStepReducerState(\n  initialSteps: StepRecord[],\n  options?: StepReducerOptions,\n) {\n  const steps = autoStageSteps(initialSteps, options);\n  const flatSteps = flattenSteps(steps);\n  const started = !flatSteps.every((step) => step.stage === \"pending\");\n  const ended = flatSteps.every((step) => step.stage === \"completed\");\n\n  let activeStepIndex = flatSteps.findIndex((step) => step.stage === \"active\");\n\n  if (activeStepIndex === -1 && ended) {\n    activeStepIndex = flatSteps.length;\n  }\n\n  const activeStep = flatSteps[activeStepIndex] || null;\n  const previousStep = flatSteps[activeStepIndex - 1] || null;\n  const nextStep = flatSteps[activeStepIndex + 1] || null;\n\n  return {\n    steps,\n    flatSteps,\n    activeStep,\n    previousStep,\n    nextStep,\n    activeStepIndex,\n    ended,\n    started,\n  } as StepReducerState;\n}\n"],"names":["steps"],"mappings":"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"}

package/dist-cjs/stepper-input/StepperInput.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = "/* Styles applied to stepper container */\n.saltStepperInput {\n  --stepperInput-border: none;\n  --stepperInput-borderColor: var(--salt-editable-borderColor);\n  --stepperInput-borderStyle: var(--salt-editable-borderStyle);\n  --stepperInput-outlineColor: var(--salt-focused-outlineColor);\n  --stepperInput-borderWidth: var(--salt-size-border);\n\n  align-items: center;\n  color: var(--salt-content-primary-foreground);\n  display: inline-flex;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  height: var(--salt-size-base);\n  line-height: var(--salt-text-lineHeight);\n  min-height: var(--salt-size-base);\n  min-width: 4em;\n  width: 100%;\n  box-sizing: border-box;\n\n  gap: var(--salt-spacing-50);\n}\n\n.saltStepperInput:hover {\n  --stepperInput-borderStyle: var(--salt-editable-borderStyle-hover);\n  --stepperInput-borderColor: var(--salt-editable-borderColor-hover);\n\n  background: var(--stepperInput-background-hover);\n  cursor: var(--salt-editable-cursor-hover);\n}\n\n.saltStepperInput:active {\n  --stepperInput-borderColor: var(--salt-editable-borderColor-active);\n  --stepperInput-borderStyle: var(--salt-editable-borderStyle-active);\n  --stepperInput-borderWidth: var(--salt-editable-borderWidth-active);\n\n  background: var(--stepperInput-background-active);\n  cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltStepperInput-primary {\n  --stepperInput-background: var(--salt-editable-primary-background);\n  --stepperInput-background-active: var(--salt-editable-primary-background-active);\n  --stepperInput-background-hover: var(--salt-editable-primary-background-hover);\n  --stepperInput-background-disabled: var(--salt-editable-primary-background-disabled);\n  --stepperInput-background-readonly: var(--salt-editable-primary-background-readonly);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltStepperInput-secondary {\n  --stepperInput-background: var(--salt-editable-secondary-background);\n  --stepperInput-background-active: var(--salt-editable-secondary-background-active);\n  --stepperInput-background-hover: var(--salt-editable-secondary-background-active);\n  --stepperInput-background-disabled: var(--salt-editable-secondary-background-disabled);\n  --stepperInput-background-readonly: var(--salt-editable-secondary-background-readonly);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltStepperInput-error,\n.saltStepperInput-error:hover {\n  --stepperInput-background: var(--salt-status-error-background);\n  --stepperInput-background-active: var(--salt-status-error-background);\n  --stepperInput-background-hover: var(--salt-status-error-background);\n  --stepperInput-borderColor: var(--salt-status-error-borderColor);\n  --stepperInput-outlineColor: var(--salt-status-error-borderColor);\n  --stepperInput-background-readonly: var(--salt-status-error-background);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltStepperInput-warning,\n.saltStepperInput-warning:hover {\n  --stepperInput-background: var(--salt-status-warning-background);\n  --stepperInput-background-active: var(--salt-status-warning-background);\n  --stepperInput-background-hover: var(--salt-status-warning-background);\n  --stepperInput-borderColor: var(--salt-status-warning-borderColor);\n  --stepperInput-outlineColor: var(--salt-status-warning-borderColor);\n  --stepperInput-background-readonly: var(--salt-status-warning-background);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltStepperInput-success,\n.saltStepperInput-success:hover {\n  --stepperInput-background: var(--salt-status-success-background);\n  --stepperInput-background-active: var(--salt-status-success-background);\n  --stepperInput-background-hover: var(--salt-status-success-background);\n  --stepperInput-borderColor: var(--salt-status-success-borderColor);\n  --stepperInput-outlineColor: var(--salt-status-success-borderColor);\n  --stepperInput-background-readonly: var(--salt-status-success-background);\n}\n\n.saltStepperInput-inputContainer {\n  display: flex;\n  background: var(--stepperInput-background);\n  border-radius: var(--salt-palette-corner-weak, 0);\n  border: var(--stepperInput-border);\n  box-sizing: border-box;\n  height: var(--salt-size-base);\n  min-height: var(--salt-size-base);\n  overflow: hidden;\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  position: relative;\n  flex-grow: 1;\n}\n\n/* Style applied to inner input component */\n.saltStepperInput-input {\n  background: none;\n  border: none;\n  box-sizing: content-box;\n  color: inherit;\n  cursor: inherit;\n  display: block;\n  flex: 1;\n  font: inherit;\n  height: 100%;\n  letter-spacing: var(--saltStepperInput-letterSpacing, 0);\n  margin: 0;\n  min-width: 0;\n  overflow: hidden;\n  padding: 0;\n  text-align: var(--stepperInput-textAlign);\n  width: 100%;\n}\n\n.saltStepperInput-input:focus {\n  outline: none;\n}\n\n/* Style applied to selected input */\n.saltStepperInput-input::selection {\n  background: var(--salt-content-foreground-highlight);\n}\n\n/* Style applied to placeholder text */\n.saltStepperInput-input::placeholder {\n  color: var(--salt-content-secondary-foreground);\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Styling when focused */\n.saltStepperInput-focused {\n  --stepperInput-borderColor: var(--stepperInput-outlineColor);\n  --stepperInput-borderWidth: var(--salt-editable-borderWidth-active);\n\n  outline: var(--saltStepperInput-outline, var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--stepperInput-outlineColor));\n}\n\n/* Style applied if `readOnly={true}` */\n.saltStepperInput-readOnly {\n  --stepperInput-borderColor: var(--salt-editable-borderColor-readonly);\n  --stepperInput-borderStyle: var(--salt-editable-borderStyle-readonly);\n  --stepperInput-borderWidth: var(--salt-size-border);\n\n  background: var(--stepperInput-background-readonly);\n  cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Styling when focused if `disabled={true}` */\n.saltStepperInput-focused.saltStepperInput-disabled {\n  --stepperInput-borderWidth: var(--salt-size-border);\n  outline: none;\n}\n\n/* Styling when focused if `readOnly={true}` */\n.saltStepperInput-focused.saltStepperInput-readOnly {\n  --stepperInput-borderWidth: var(--salt-size-border);\n}\n\n/* Style applied to selected input if `disabled={true}` */\n.saltStepperInput-disabled .saltStepperInput-input::selection {\n  background: none;\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltStepperInput-disabled,\n.saltStepperInput-disabled:hover,\n.saltStepperInput-disabled:active {\n  --stepperInput-borderColor: var(--salt-editable-borderColor-disabled);\n  --stepperInput-borderStyle: var(--salt-editable-borderStyle-disabled);\n  --stepperInput-borderWidth: var(--salt-size-border);\n\n  background: var(--stepperInput-background-disabled);\n  cursor: var(--salt-editable-cursor-disabled);\n  color: var(--saltStepperInput-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n.saltStepperInput-activationIndicator {\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  position: absolute;\n  border-bottom: var(--stepperInput-borderWidth) var(--stepperInput-borderStyle) var(--stepperInput-borderColor);\n}\n\n/* Style applied if `bordered={true}` */\n.saltStepperInput-bordered {\n  --stepperInput-border: var(--salt-size-border) var(--salt-container-borderStyle) var(--stepperInput-borderColor);\n  --stepperInput-borderWidth: 0;\n}\n\n/* Style applied if focused or active when `bordered={true}` */\n.saltStepperInput-bordered.saltStepperInput-focused,\n.saltStepperInput-bordered:active {\n  --stepperInput-borderWidth: var(--salt-editable-borderWidth-active);\n}\n\n/* Styling when focused if `disabled={true}` or `readOnly={true}` when `bordered={true}` */\n.saltStepperInput-bordered.saltStepperInput-readOnly,\n.saltStepperInput-bordered.saltStepperInput-disabled:hover {\n  --stepperInput-borderWidth: 0;\n}\n\n/* Style applied to start adornments */\n.saltStepperInput-startAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  padding-right: var(--salt-spacing-100);\n  column-gap: var(--salt-spacing-100);\n}\n\n/* Style applied to end adornments */\n.saltStepperInput-endAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  padding-left: var(--salt-spacing-100);\n  column-gap: var(--salt-spacing-100);\n}\n\n.saltStepperInput-readOnly .saltStepperInput-startAdornmentContainer {\n  margin-left: var(--salt-spacing-50);\n}\n\n.saltStepperInput-startAdornmentContainer .saltButton ~ .saltButton {\n  margin-left: calc(-1 * var(--salt-spacing-50));\n}\n\n.saltStepperInput-endAdornmentContainer .saltButton ~ .saltButton {\n  margin-left: calc(-1 * var(--salt-spacing-50));\n}\n\n.saltStepperInput-startAdornmentContainer .saltButton:first-child {\n  margin-left: calc(var(--salt-spacing-50) * -1);\n}\n\n.saltStepperInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n.saltStepperInput-startAdornmentContainer > .saltButton,\n.saltStepperInput-endAdornmentContainer > .saltButton {\n  --saltButton-padding: calc(var(--salt-spacing-50) - var(--salt-size-border));\n  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n  --saltButton-borderRadius: var(--salt-palette-corner-weaker);\n}\n\n.saltStepperInput-inputTextAlignLeft {\n  text-align: left;\n}\n\n.saltStepperInput-inputTextAlignCenter {\n  text-align: center;\n}\n\n.saltStepperInput-inputTextAlignRight {\n  text-align: right;\n}\n\n/* --- Buttons --- */\n\n/* Styles applied to stepper buttons container */\n.saltStepperInput-buttonContainer {\n  --stepperInput-buttonGap: var(--salt-size-border-strong);\n  display: flex;\n  flex-direction: column;\n  gap: var(--stepperInput-buttonGap);\n}\n\n/* Styles applied to stepper buttons */\n.saltStepperInput-stepperButton {\n  --saltButton-height: calc((var(--salt-size-base) - var(--stepperInput-buttonGap)) * 0.5);\n  --saltButton-width: var(--salt-size-base);\n}\n\n.saltStepperInput-stepperButtonIncrement {\n  --saltButton-borderRadius: var(--salt-palette-corner-weak, 0) var(--salt-palette-corner-weak, 0) 0 0;\n}\n.saltStepperInput-stepperButtonDecrement {\n  --saltButton-borderRadius: 0 0 var(--salt-palette-corner-weak, 0) var(--salt-palette-corner-weak, 0);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=StepperInput.css.js.map

package/dist-cjs/stepper-input/StepperInput.css.js.map

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

package/dist-cjs/stepper-input/StepperInput.js

@@ -0,0 +1,253 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var react = require('react');
+var utils = require('./internal/utils.js');
+var StepperInput$1 = require('./StepperInput.css.js');
+var useStepperInput = require('./useStepperInput.js');
+
+const withBaseName = core.makePrefixer("saltStepperInput");
+const StepperInput = react.forwardRef(
+  function StepperInput2({
+    bordered,
+    className: classNameProp,
+    decimalPlaces = 0,
+    defaultValue: defaultValueProp,
+    disabled,
+    emptyReadOnlyMarker = "\u2014",
+    endAdornment,
+    hideButtons,
+    inputProps: inputPropsProp = {},
+    inputRef: inputRefProp,
+    max = Number.MAX_SAFE_INTEGER,
+    min = Number.MIN_SAFE_INTEGER,
+    onChange: onChangeProp,
+    placeholder,
+    readOnly: readOnlyProp,
+    startAdornment,
+    step = 1,
+    stepBlock = 10,
+    textAlign = "left",
+    validationStatus: validationStatusProp,
+    value: valueProp,
+    variant = "primary",
+    ...restProps
+  }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-stepper-input",
+      css: StepperInput$1,
+      window: targetWindow
+    });
+    const { IncreaseIcon, DecreaseIcon } = core.useIcon();
+    const {
+      a11yProps: {
+        "aria-describedby": formFieldDescribedBy,
+        "aria-labelledby": formFieldLabelledBy
+      } = {},
+      disabled: formFieldDisabled,
+      readOnly: formFieldReadOnly,
+      necessity: formFieldRequired,
+      validationStatus: formFieldValidationStatus
+    } = core.useFormFieldProps();
+    const isDisabled = disabled || formFieldDisabled;
+    const isReadOnly = readOnlyProp || formFieldReadOnly;
+    const validationStatus = formFieldValidationStatus ?? validationStatusProp;
+    const {
+      "aria-describedby": inputDescribedBy,
+      "aria-labelledby": inputLabelledBy,
+      className: inputClassName,
+      onBlur: inputOnBlur,
+      onChange: inputOnChange,
+      onFocus: inputOnFocus,
+      required: inputRequired,
+      onKeyDown: inputOnKeyDown,
+      ...restInputProps
+    } = inputPropsProp;
+    const isRequired = formFieldRequired ? ["required", "asterisk"].includes(formFieldRequired) : inputRequired;
+    const [value, setValue] = core.useControlled({
+      controlled: valueProp,
+      default: typeof defaultValueProp === "number" ? utils.toFixedDecimalPlaces(defaultValueProp, decimalPlaces) : defaultValueProp,
+      name: "StepperInput",
+      state: "value"
+    });
+    const [focused, setFocused] = react.useState(false);
+    const inputRef = react.useRef(null);
+    const forkedInputRef = core.useForkRef(inputRef, inputRefProp);
+    const {
+      decrementButtonProps,
+      decrementValue,
+      incrementButtonProps,
+      incrementValue
+    } = useStepperInput.useStepperInput({
+      inputRef,
+      setValue,
+      decimalPlaces,
+      disabled,
+      max,
+      min,
+      onChange: onChangeProp,
+      readOnly: isReadOnly,
+      step,
+      stepBlock,
+      value
+    });
+    const handleInputFocus = (event) => {
+      setFocused(true);
+      inputOnFocus == null ? void 0 : inputOnFocus(event);
+    };
+    const handleInputBlur = (event) => {
+      setFocused(false);
+      if (value === void 0) return;
+      const floatValue = utils.toFloat(value);
+      if (Number.isNaN(floatValue)) {
+        setValue(value);
+        onChangeProp == null ? void 0 : onChangeProp(event, value);
+      } else {
+        const roundedValue = utils.toFixedDecimalPlaces(floatValue, decimalPlaces);
+        if (value !== "" && !utils.isAllowedNonNumeric(value)) {
+          setValue(roundedValue);
+        }
+        onChangeProp == null ? void 0 : onChangeProp(event, roundedValue);
+      }
+      inputOnBlur == null ? void 0 : inputOnBlur(event);
+    };
+    const handleInputChange = (event) => {
+      const changedValue = event.target.value;
+      setValue(utils.sanitizedInput(changedValue));
+      onChangeProp == null ? void 0 : onChangeProp(event, utils.sanitizedInput(changedValue));
+      inputOnChange == null ? void 0 : inputOnChange(event);
+    };
+    const handleInputKeyDown = (event) => {
+      switch (event.key) {
+        case "ArrowUp": {
+          event.preventDefault();
+          const block = event.shiftKey;
+          incrementValue(event, block);
+          break;
+        }
+        case "ArrowDown": {
+          event.preventDefault();
+          const block = event.shiftKey;
+          decrementValue(event, block);
+          break;
+        }
+        case "Home": {
+          event.preventDefault();
+          setValue(min);
+          onChangeProp == null ? void 0 : onChangeProp(event, min);
+          break;
+        }
+        case "End": {
+          event.preventDefault();
+          setValue(max);
+          onChangeProp == null ? void 0 : onChangeProp(event, max);
+          break;
+        }
+        case "PageUp": {
+          event.preventDefault();
+          incrementValue(event, true);
+          break;
+        }
+        case "PageDown": {
+          event.preventDefault();
+          decrementValue(event, true);
+          break;
+        }
+      }
+      inputOnKeyDown == null ? void 0 : inputOnKeyDown(event);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: clsx.clsx(withBaseName(), classNameProp),
+        ...restProps,
+        ref,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: clsx.clsx(
+                withBaseName("inputContainer"),
+                withBaseName(variant),
+                {
+                  [withBaseName("focused")]: !isDisabled && focused,
+                  [withBaseName("disabled")]: isDisabled,
+                  [withBaseName("readOnly")]: isReadOnly,
+                  [withBaseName(validationStatus || "")]: validationStatus,
+                  [withBaseName("bordered")]: bordered
+                }
+              ),
+              children: [
+                startAdornment && /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("startAdornmentContainer"), children: startAdornment }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "input",
+                  {
+                    "aria-describedby": clsx.clsx(formFieldDescribedBy, inputDescribedBy),
+                    "aria-invalid": utils.isOutOfRange(value, min, max),
+                    "aria-labelledby": clsx.clsx(formFieldLabelledBy, inputLabelledBy),
+                    "aria-valuemax": utils.toFloat(utils.toFixedDecimalPlaces(max, decimalPlaces)),
+                    "aria-valuemin": utils.toFloat(utils.toFixedDecimalPlaces(min, decimalPlaces)),
+                    "aria-valuenow": value && !Number.isNaN(utils.toFloat(value)) ? utils.toFloat(utils.toFixedDecimalPlaces(utils.toFloat(value), decimalPlaces)) : void 0,
+                    className: clsx.clsx(
+                      withBaseName("input"),
+                      withBaseName(`inputTextAlign${core.capitalize(textAlign)}`),
+                      inputClassName
+                    ),
+                    disabled: isDisabled,
+                    onBlur: handleInputBlur,
+                    onChange: handleInputChange,
+                    onFocus: !isDisabled ? handleInputFocus : void 0,
+                    onKeyDown: handleInputKeyDown,
+                    placeholder,
+                    readOnly: isReadOnly,
+                    ref: forkedInputRef,
+                    required: isRequired,
+                    role: "spinbutton",
+                    tabIndex: isDisabled ? -1 : 0,
+                    value,
+                    ...restInputProps
+                  }
+                ),
+                !isDisabled && validationStatus && /* @__PURE__ */ jsxRuntime.jsx(core.StatusAdornment, { status: validationStatus }),
+                endAdornment && /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("endAdornmentContainer"), children: endAdornment }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("activationIndicator") })
+              ]
+            }
+          ),
+          !hideButtons && !isReadOnly && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: withBaseName("buttonContainer"), children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              core.Button,
+              {
+                className: clsx.clsx(
+                  withBaseName("stepperButton"),
+                  withBaseName("stepperButtonIncrement")
+                ),
+                ...incrementButtonProps,
+                children: /* @__PURE__ */ jsxRuntime.jsx(IncreaseIcon, { "aria-hidden": true })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              core.Button,
+              {
+                className: clsx.clsx(
+                  withBaseName("stepperButton"),
+                  withBaseName("stepperButtonDecrement")
+                ),
+                ...decrementButtonProps,
+                children: /* @__PURE__ */ jsxRuntime.jsx(DecreaseIcon, { "aria-hidden": true })
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+);
+
+exports.StepperInput = StepperInput;
+//# sourceMappingURL=StepperInput.js.map