@salt-ds/lab 1.0.0-alpha.61 → 1.0.0-alpha.62

package/dist-es/date-picker/DatePickerSingleInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePickerSingleInput.js","sources":["../src/date-picker/DatePickerSingleInput.tsx"],"sourcesContent":["import { Button, makePrefixer, useControlled } from \"@salt-ds/core\";\nimport {\n  DateDetailError,\n  type DateFrameworkType,\n  type SaltDateAdapter,\n} from \"@salt-ds/date-adapters\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n  type KeyboardEvent,\n  type SyntheticEvent,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n} from \"react\";\nimport type { SingleDateSelection } from \"../calendar\";\nimport {\n  DateInputSingle,\n  type DateInputSingleDetails,\n  type DateInputSingleProps,\n} from \"../date-input\";\nimport { useLocalization } from \"../localization-provider\";\nimport { useDatePickerContext } from \"./DatePickerContext\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerSingleInput\");\n\n/**\n * Props for the DatePickerSingleInput component.\n */\nexport interface DatePickerSingleInputProps<TDate extends DateFrameworkType>\n  extends DateInputSingleProps<TDate> {\n  /**\n   * Function to validate the entered date\n   * @param date - The selected date\n   * @param details - The details of date selection, either a valid date or error\n   * @returns updated DateInputSingleDetails details\n   */\n  validate?: (\n    date: SingleDateSelection<TDate>,\n    details: DateInputSingleDetails,\n  ) => DateInputSingleDetails;\n}\n\nfunction defaultSingleValidation<TDate extends DateFrameworkType>(\n  dateAdapter: SaltDateAdapter<TDate>,\n  date: TDate,\n  details: DateInputSingleDetails,\n  minDate: TDate | undefined,\n  maxDate: TDate | undefined,\n): DateInputSingleDetails {\n  if (!date) {\n    details.errors = details.errors ?? [];\n    details.errors?.push({\n      type: DateDetailError.UNSET,\n      message: \"no date defined\",\n    });\n  } else {\n    if (\n      minDate &&\n      dateAdapter.isValid(date) &&\n      dateAdapter.compare(date, minDate) < 0\n    ) {\n      details.errors = details.errors ?? [];\n      details.errors?.push({\n        type: \"min-date\",\n        message: \"is before min date\",\n      });\n    } else if (\n      maxDate &&\n      dateAdapter.isValid(date) &&\n      dateAdapter.compare(date, maxDate) > 0\n    ) {\n      details.errors = details.errors ?? [];\n      details.errors?.push({\n        type: \"max-date\",\n        message: \"is after max date\",\n      });\n    }\n  }\n  return details;\n}\n\nexport const DatePickerSingleInput = forwardRef<\n  HTMLDivElement,\n  DatePickerSingleInputProps<any>\n>(\n  <TDate extends DateFrameworkType>(\n    props: DatePickerSingleInputProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const { dateAdapter } = useLocalization<TDate>();\n\n    const {\n      className,\n      onFocus,\n      onBlur,\n      value: valueProp,\n      validate,\n      defaultValue,\n      onDateValueChange,\n      onKeyDown,\n      ...rest\n    } = props;\n\n    const {\n      state: { selectedDate, disabled, readOnly, cancelled, minDate, maxDate },\n      helpers: { select },\n    } = useDatePickerContext<TDate>({ selectionVariant: \"single\" });\n    const {\n      state: { open },\n      helpers: { setOpen },\n    } = useDatePickerOverlay();\n\n    const previousValue = useRef<typeof valueProp>();\n\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValue,\n      name: \"DatePickerSingleInput\",\n      state: \"value\",\n    });\n\n    const handleCalendarButton = useCallback(() => {\n      setOpen(!open);\n    }, [open, setOpen]);\n\n    const handleDateChange = useCallback(\n      (\n        event: SyntheticEvent,\n        date: SingleDateSelection<TDate>,\n        details: DateInputSingleDetails,\n      ) => {\n        const validatedDetails = validate\n          ? validate(date, details)\n          : defaultSingleValidation<TDate>(\n              dateAdapter,\n              date,\n              details,\n              minDate,\n              maxDate,\n            );\n        select(event, date, validatedDetails);\n      },\n      [select, validate],\n    );\n\n    const handleDateValueChange = useCallback(\n      (event: SyntheticEvent | null, newDateValue: string) => {\n        setValue(newDateValue);\n        onDateValueChange?.(event, newDateValue);\n      },\n      [onDateValueChange],\n    );\n\n    const handleOnKeyDown = useCallback(\n      (event: KeyboardEvent<HTMLInputElement>) => {\n        if (event.key === \"ArrowDown\") {\n          setOpen(true);\n          onKeyDown?.(event);\n        }\n      },\n      [onKeyDown],\n    );\n\n    // biome-ignore lint/correctness/useExhaustiveDependencies: should run when open changes and not selected date or value\n    useEffect(() => {\n      if (open) {\n        previousValue.current = value;\n      }\n    }, [open]);\n\n    // biome-ignore lint/correctness/useExhaustiveDependencies: avoid excessive re-rendering\n    useEffect(() => {\n      if (cancelled) {\n        setValue(previousValue?.current);\n      }\n    }, [cancelled]);\n\n    return (\n      <DateInputSingle\n        value={value ?? \"\"}\n        className={clsx(withBaseName(), className)}\n        date={selectedDate ?? null}\n        readOnly={readOnly}\n        ref={ref}\n        onDateChange={handleDateChange}\n        onDateValueChange={handleDateValueChange}\n        endAdornment={\n          !readOnly && (\n            <Button\n              appearance=\"transparent\"\n              sentiment=\"neutral\"\n              onClick={handleCalendarButton}\n              disabled={disabled}\n              aria-label=\"Open Calendar\"\n            >\n              <CalendarIcon />\n            </Button>\n          )\n        }\n        onKeyDown={handleOnKeyDown}\n        {...rest}\n      />\n    );\n  },\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DatePickerSingleInput.js","sources":["../src/date-picker/DatePickerSingleInput.tsx"],"sourcesContent":["import { Button, makePrefixer, useControlled } from \"@salt-ds/core\";\nimport {\n  DateDetailError,\n  type DateFrameworkType,\n  type SaltDateAdapter,\n} from \"@salt-ds/date-adapters\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n  type KeyboardEvent,\n  type SyntheticEvent,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n} from \"react\";\nimport type { SingleDateSelection } from \"../calendar\";\nimport {\n  DateInputSingle,\n  type DateInputSingleDetails,\n  type DateInputSingleProps,\n} from \"../date-input\";\nimport { useLocalization } from \"../localization-provider\";\nimport { useDatePickerContext } from \"./DatePickerContext\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerSingleInput\");\n\n/**\n * Props for the DatePickerSingleInput component.\n */\nexport interface DatePickerSingleInputProps<TDate extends DateFrameworkType>\n  extends DateInputSingleProps<TDate> {\n  /**\n   * Function to validate the entered date\n   * @param date - The selected date\n   * @param details - The details of date selection, either a valid date or error\n   * @returns updated DateInputSingleDetails details\n   */\n  validate?: (\n    date: SingleDateSelection<TDate>,\n    details: DateInputSingleDetails,\n  ) => DateInputSingleDetails;\n}\n\nfunction defaultSingleValidation<TDate extends DateFrameworkType>(\n  dateAdapter: SaltDateAdapter<TDate>,\n  date: TDate,\n  details: DateInputSingleDetails,\n  minDate: TDate | undefined,\n  maxDate: TDate | undefined,\n): DateInputSingleDetails {\n  if (!date) {\n    details.errors = details.errors ?? [];\n    details.errors?.push({\n      type: DateDetailError.UNSET,\n      message: \"no date defined\",\n    });\n  } else {\n    if (\n      minDate &&\n      dateAdapter.isValid(date) &&\n      dateAdapter.compare(date, minDate) < 0\n    ) {\n      details.errors = details.errors ?? [];\n      details.errors?.push({\n        type: \"min-date\",\n        message: \"is before min date\",\n      });\n    } else if (\n      maxDate &&\n      dateAdapter.isValid(date) &&\n      dateAdapter.compare(date, maxDate) > 0\n    ) {\n      details.errors = details.errors ?? [];\n      details.errors?.push({\n        type: \"max-date\",\n        message: \"is after max date\",\n      });\n    }\n  }\n  return details;\n}\n\nexport const DatePickerSingleInput = forwardRef<\n  HTMLDivElement,\n  DatePickerSingleInputProps<any>\n>(\n  <TDate extends DateFrameworkType>(\n    props: DatePickerSingleInputProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const { dateAdapter } = useLocalization<TDate>();\n\n    const {\n      className,\n      onFocus,\n      onBlur,\n      value: valueProp,\n      validate,\n      defaultValue,\n      onDateValueChange,\n      onKeyDown,\n      ...rest\n    } = props;\n\n    const {\n      state: { selectedDate, disabled, readOnly, cancelled, minDate, maxDate },\n      helpers: { select },\n    } = useDatePickerContext<TDate>({ selectionVariant: \"single\" });\n    const {\n      state: { open },\n      helpers: { setOpen },\n    } = useDatePickerOverlay();\n\n    const previousValue = useRef<typeof valueProp>();\n\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValue,\n      name: \"DatePickerSingleInput\",\n      state: \"value\",\n    });\n\n    const handleCalendarButton = useCallback(() => {\n      setOpen(!open);\n    }, [open, setOpen]);\n\n    const handleDateChange = useCallback(\n      (\n        event: SyntheticEvent,\n        date: SingleDateSelection<TDate>,\n        details: DateInputSingleDetails,\n      ) => {\n        const validatedDetails = validate\n          ? validate(date, details)\n          : defaultSingleValidation<TDate>(\n              dateAdapter,\n              date,\n              details,\n              minDate,\n              maxDate,\n            );\n        select(event, date, validatedDetails);\n      },\n      [select, validate],\n    );\n\n    const handleDateValueChange = useCallback(\n      (event: SyntheticEvent | null, newDateValue: string) => {\n        setValue(newDateValue);\n        onDateValueChange?.(event, newDateValue);\n      },\n      [onDateValueChange],\n    );\n\n    const handleOnKeyDown = useCallback(\n      (event: KeyboardEvent<HTMLInputElement>) => {\n        if (event.key === \"ArrowDown\") {\n          setOpen(true);\n          onKeyDown?.(event);\n        }\n      },\n      [onKeyDown],\n    );\n\n    // biome-ignore lint/correctness/useExhaustiveDependencies: should run when open changes and not selected date or value\n    useEffect(() => {\n      if (open) {\n        previousValue.current = value;\n      }\n    }, [open]);\n\n    // biome-ignore lint/correctness/useExhaustiveDependencies: avoid excessive re-rendering\n    useEffect(() => {\n      if (cancelled) {\n        setValue(previousValue?.current);\n      }\n    }, [cancelled]);\n\n    return (\n      <DateInputSingle\n        value={value ?? \"\"}\n        className={clsx(withBaseName(), className)}\n        date={selectedDate ?? null}\n        readOnly={readOnly}\n        disabled={disabled}\n        ref={ref}\n        onDateChange={handleDateChange}\n        onDateValueChange={handleDateValueChange}\n        endAdornment={\n          !readOnly && (\n            <Button\n              appearance=\"transparent\"\n              sentiment=\"neutral\"\n              onClick={handleCalendarButton}\n              disabled={disabled}\n              aria-label=\"Open Calendar\"\n            >\n              <CalendarIcon />\n            </Button>\n          )\n        }\n        onKeyDown={handleOnKeyDown}\n        {...rest}\n      />\n    );\n  },\n);\n"],"names":[],"mappings":"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"}

package/dist-es/index.js

@@ -118,6 +118,9 @@ export { DropdownPlaceholder, NO_DATA, addAll, allExceptOverflowIndicator, byDes
 export { isResponsiveAttribute, liftResponsivePropsToFormField } from './responsive/utils.js';
 export { SearchInput } from './search-input/SearchInput.js';
 export { Slider } from './slider/Slider.js';
+export { Splitter } from './splitter/Splitter.js';
+export { SplitPanel } from './splitter/SplitPanel.js';
+export { SplitHandle } from './splitter/SplitHandle.js';
 export { StaticList } from './static-list/StaticList.js';
 export { StaticListItem } from './static-list/StaticListItem.js';
 export { StaticListItemContent } from './static-list/StaticListItemContent.js';

package/dist-es/index.js.map

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

package/dist-es/splitter/SplitHandle.css.js

@@ -0,0 +1,4 @@
+var css_248z = ".saltSplitHandle {\n  --splitHandle-size: var(--salt-size-thickness-400, calc(var(--salt-size-border) * 4));\n  --splitHandle-borderWidth: var(--salt-size-thickness-100, var(--salt-size-border));\n  --splitHandle-borderColor: var(--salt-separable-secondary-borderColor);\n  --splitHandle-borderStyle: var(--salt-separable-borderStyle);\n  --splitHandle-dot-background: var(--salt-separable-foreground);\n  --splitHandle-dot-background-hover: var(--salt-separable-foreground-hover);\n  --splitHandle-dot-background-active: var(--salt-separable-foreground-active);\n\n  position: relative;\n\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  gap: 2px;\n\n  box-sizing: content-box;\n\n  background: var(--splitHandle-background);\n}\n\n.saltSplitHandle-bordered,\n.saltSplitHandle-variant-primary {\n  --splitHandle-background: var(--salt-container-primary-background);\n  --splitHandle-background-hover: var(--salt-separable-background-hover);\n  --splitHandle-background-active: var(--salt-separable-background-active);\n}\n\n.saltSplitHandle-variant-secondary {\n  --splitHandle-background: var(--salt-container-secondary-background);\n  --splitHandle-background-hover: var(--salt-separable-background-hover);\n  --splitHandle-background-active: var(--salt-separable-background-active);\n}\n\n.saltSplitHandle-variant-tertiary {\n  --splitHandle-background: var(--salt-container-tertiary-background);\n  --splitHandle-background-hover: var(--salt-separable-background-hover);\n  --splitHandle-background-active: var(--salt-separable-background-active);\n}\n\n.saltSplitHandle-variant-transparent {\n  --splitHandle-background: var(--salt-separable-background);\n  --splitHandle-background-hover: var(--salt-separable-background-hover);\n  --splitHandle-background-active: var(--salt-separable-background-active);\n}\n\n.saltSplitHandle[data-resize-handle-state=\"hover\"] {\n  background: var(--splitHandle-background-hover);\n}\n\n.saltSplitHandle[data-resize-handle-state=\"drag\"] {\n  --splitHandle-background: var(--splitHandle-background-active);\n}\n\n.saltSplitHandle[data-panel-group-direction=\"horizontal\"] {\n  flex-direction: column;\n  width: var(--splitHandle-size);\n}\n\n.saltSplitHandle[data-panel-group-direction=\"vertical\"] {\n  flex-direction: row;\n  height: var(--splitHandle-size);\n}\n\n.saltSplitHandle[data-panel-group-direction=\"horizontal\"]::after {\n  content: \"\";\n  position: absolute;\n  left: -10px;\n  right: -10px;\n  top: 0;\n  bottom: 0;\n}\n\n.saltSplitHandle[data-panel-group-direction=\"vertical\"]::after {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: -10px;\n  bottom: -10px;\n}\n\n.saltSplitHandle: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.saltSplitHandle-border-top {\n  border-top-width: var(--splitHandle-borderWidth);\n  border-top-color: var(--splitHandle-borderColor);\n  border-top-style: var(--splitHandle-borderStyle);\n\n  border-bottom-width: var(--splitHandle-borderWidth);\n  border-bottom-color: transparent;\n  border-bottom-style: var(--splitHandle-borderStyle);\n}\n\n.saltSplitHandle-border-bottom {\n  border-top-width: var(--splitHandle-borderWidth);\n  border-top-color: transparent;\n  border-top-style: var(--splitHandle-borderStyle);\n\n  border-bottom-width: var(--splitHandle-borderWidth);\n  border-bottom-color: var(--splitHandle-borderColor);\n  border-bottom-style: var(--splitHandle-borderStyle);\n}\n\n.saltSplitHandle-border-top-bottom {\n  border-top-width: var(--splitHandle-borderWidth);\n  border-top-color: var(--splitHandle-borderColor);\n  border-top-style: var(--splitHandle-borderStyle);\n\n  border-bottom-width: var(--splitHandle-borderWidth);\n  border-bottom-color: var(--splitHandle-borderColor);\n  border-bottom-style: var(--splitHandle-borderStyle);\n}\n\n.saltSplitHandle-border-left {\n  border-left-width: var(--splitHandle-borderWidth);\n  border-left-color: var(--splitHandle-borderColor);\n  border-left-style: var(--splitHandle-borderStyle);\n\n  border-right-width: var(--splitHandle-borderWidth);\n  border-right-color: transparent;\n  border-right-style: var(--splitHandle-borderStyle);\n}\n\n.saltSplitHandle-border-right {\n  border-left-width: var(--splitHandle-borderWidth);\n  border-left-color: transparent;\n  border-left-style: var(--splitHandle-borderStyle);\n\n  border-right-width: var(--splitHandle-borderWidth);\n  border-right-color: var(--splitHandle-borderColor);\n  border-right-style: var(--splitHandle-borderStyle);\n}\n\n.saltSplitHandle-border-left-right {\n  border-left-width: var(--splitHandle-borderWidth);\n  border-left-color: var(--splitHandle-borderColor);\n  border-left-style: var(--splitHandle-borderStyle);\n\n  border-right-width: var(--splitHandle-borderWidth);\n  border-right-color: var(--splitHandle-borderColor);\n  border-right-style: var(--splitHandle-borderStyle);\n}\n\n/* two handles touching horizontally */\n.saltSplitHandle[data-panel-group-direction=\"horizontal\"] + div[data-panel-size=\"0.0\"] + .saltSplitHandle[data-panel-group-direction=\"horizontal\"] {\n  margin-left: -1px;\n}\n\n/* two handles touching vertically */\n.saltSplitHandle[data-panel-group-direction=\"vertical\"] + div[data-panel-size=\"0.0\"] + .saltSplitHandle[data-panel-group-direction=\"vertical\"] {\n  margin-top: -1px;\n}\n\n/* handle touching the side of a container */\n@supports selector(:has(*)) {\n  .saltSplitPanel:first-of-type[data-panel-size=\"0.0\"] + .saltSplitHandle-bordered[data-panel-group-direction=\"horizontal\"] {\n    margin-left: -1px;\n  }\n\n  .saltSplitPanel:first-of-type[data-panel-size=\"0.0\"] + .saltSplitHandle-bordered[data-panel-group-direction=\"vertical\"] {\n    margin-top: -1px;\n  }\n\n  .saltSplitHandle-bordered[data-panel-group-direction=\"horizontal\"]:has(+ .saltSplitPanel:last-of-type[data-panel-size=\"0.0\"]) {\n    margin-right: -1px;\n  }\n\n  .saltSplitHandle-bordered[data-panel-group-direction=\"vertical\"]:has(+ .saltSplitPanel:last-of-type[data-panel-size=\"0.0\"]) {\n    margin-bottom: -1px;\n  }\n}\n\n.saltSplitHandle-dot {\n  background: var(--splitHandle-dot-background);\n}\n\n.saltSplitHandle[data-resize-handle-state=\"hover\"] > .saltSplitHandle-dot {\n  background: var(--splitHandle-dot-background-hover);\n}\n\n.saltSplitHandle[data-resize-handle-state=\"drag\"] > .saltSplitHandle-dot {\n  background: var(--splitHandle-dot-background-active);\n}\n\n.saltSplitHandle[data-panel-group-direction=\"horizontal\"] > .saltSplitHandle-dot {\n  width: 2px;\n  height: 1px;\n}\n\n.saltSplitHandle[data-panel-group-direction=\"vertical\"] > .saltSplitHandle-dot {\n  height: 2px;\n  width: 1px;\n}\n";
+
+export { css_248z as default };
+//# sourceMappingURL=SplitHandle.css.js.map

package/dist-es/splitter/SplitHandle.css.js.map

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

package/dist-es/splitter/SplitHandle.js

@@ -0,0 +1,58 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { makePrefixer } from '@salt-ds/core';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import clsx from 'clsx';
+import { useContext } from 'react';
+import { PanelResizeHandle } from 'react-resizable-panels';
+import css_248z from './SplitHandle.css.js';
+import { AppearanceContext, OrientationContext } from './Splitter.js';
+import { computeVariant, computeAccent } from './utils.js';
+
+const withBaseName = makePrefixer("saltSplitHandle");
+function SplitHandle({
+  variant: variantProp,
+  border: borderProp,
+  hitAreaMargins = {
+    coarse: 9,
+    fine: 9
+  },
+  className,
+  ...props
+}) {
+  const targetWindow = useWindow();
+  const appearance = useContext(AppearanceContext);
+  const orientation = useContext(OrientationContext);
+  const variant = variantProp ?? computeVariant(appearance);
+  const border = borderProp ?? computeAccent(appearance, orientation);
+  useComponentCssInjection({
+    testId: "salt-split-handle",
+    css: css_248z,
+    window: targetWindow
+  });
+  return /* @__PURE__ */ jsxs(
+    PanelResizeHandle,
+    {
+      hitAreaMargins,
+      "data-variant": variant,
+      "data-border": border,
+      className: clsx(
+        withBaseName(),
+        withBaseName(appearance),
+        withBaseName("border", border),
+        withBaseName("variant", variant),
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: withBaseName("dot") }),
+        /* @__PURE__ */ jsx("span", { className: withBaseName("dot") }),
+        /* @__PURE__ */ jsx("span", { className: withBaseName("dot") }),
+        /* @__PURE__ */ jsx("span", { className: withBaseName("dot") })
+      ]
+    }
+  );
+}
+
+export { SplitHandle };
+//# sourceMappingURL=SplitHandle.js.map

package/dist-es/splitter/SplitHandle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitHandle.js","sources":["../src/splitter/SplitHandle.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 { useContext } from \"react\";\nimport {\n  PanelResizeHandle,\n  type PanelResizeHandleProps,\n} from \"react-resizable-panels\";\n\nimport splitHandleCSS from \"./SplitHandle.css\";\nimport { AppearanceContext, OrientationContext } from \"./Splitter\";\nimport { computeAccent, computeVariant } from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltSplitHandle\");\n\nexport type SplitHandleVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"tertiary\"\n  | \"transparent\";\n\nexport type SplitHandleBorder =\n  | \"top\"\n  | \"bottom\"\n  | \"right\"\n  | \"left\"\n  | \"top-bottom\"\n  | \"left-right\"\n  | \"none\";\n\nexport interface SplitHandleProps extends PanelResizeHandleProps {\n  /**\n   * Styling variant\n   * @default \"primary\"\n   */\n  variant?: SplitHandleVariant;\n  /**\n   * Change which sides get a border displayed\n   *\n   * Default is based on the orientation and appearance\n   * set on the parent Stepper components, ex.\n   * bordered + vertical = left-right\n   * bordered + horizontal = top-bottom\n   * transparent = none\n   */\n  border?: SplitHandleBorder;\n}\n\nexport function SplitHandle({\n  variant: variantProp,\n  border: borderProp,\n  hitAreaMargins = {\n    coarse: 9,\n    fine: 9,\n  },\n  className,\n  ...props\n}: SplitHandleProps) {\n  const targetWindow = useWindow();\n  const appearance = useContext(AppearanceContext);\n  const orientation = useContext(OrientationContext);\n\n  const variant = variantProp ?? computeVariant(appearance);\n  const border = borderProp ?? computeAccent(appearance, orientation);\n\n  useComponentCssInjection({\n    testId: \"salt-split-handle\",\n    css: splitHandleCSS,\n    window: targetWindow,\n  });\n\n  return (\n    <PanelResizeHandle\n      hitAreaMargins={hitAreaMargins}\n      data-variant={variant}\n      data-border={border}\n      className={clsx(\n        withBaseName(),\n        withBaseName(appearance),\n        withBaseName(\"border\", border),\n        withBaseName(\"variant\", variant),\n        className,\n      )}\n      {...props}\n    >\n      <span className={withBaseName(\"dot\")} />\n      <span className={withBaseName(\"dot\")} />\n      <span className={withBaseName(\"dot\")} />\n      <span className={withBaseName(\"dot\")} />\n    </PanelResizeHandle>\n  );\n}\n"],"names":["splitHandleCSS"],"mappings":";;;;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA;AAmC5C,SAAS,WAAY,CAAA;AAAA,EAC1B,OAAS,EAAA,WAAA;AAAA,EACT,MAAQ,EAAA,UAAA;AAAA,EACR,cAAiB,GAAA;AAAA,IACf,MAAQ,EAAA,CAAA;AAAA,IACR,IAAM,EAAA;AAAA,GACR;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAqB,EAAA;AACnB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAM,MAAA,UAAA,GAAa,WAAW,iBAAiB,CAAA;AAC/C,EAAM,MAAA,WAAA,GAAc,WAAW,kBAAkB,CAAA;AAEjD,EAAM,MAAA,OAAA,GAAU,WAAe,IAAA,cAAA,CAAe,UAAU,CAAA;AACxD,EAAA,MAAM,MAAS,GAAA,UAAA,IAAc,aAAc,CAAA,UAAA,EAAY,WAAW,CAAA;AAElE,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAA,IAAA;AAAA,IAAC,iBAAA;AAAA,IAAA;AAAA,MACC,cAAA;AAAA,MACA,cAAc,EAAA,OAAA;AAAA,MACd,aAAa,EAAA,MAAA;AAAA,MACb,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,UAAU,CAAA;AAAA,QACvB,YAAA,CAAa,UAAU,MAAM,CAAA;AAAA,QAC7B,YAAA,CAAa,WAAW,OAAO,CAAA;AAAA,QAC/B;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,KAAK,CAAG,EAAA,CAAA;AAAA,wBACrC,GAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,YAAA,CAAa,KAAK,CAAG,EAAA,CAAA;AAAA,wBACrC,GAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,YAAA,CAAa,KAAK,CAAG,EAAA,CAAA;AAAA,wBACrC,GAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,YAAA,CAAa,KAAK,CAAG,EAAA;AAAA;AAAA;AAAA,GACxC;AAEJ;;;;"}

package/dist-es/splitter/SplitPanel.css.js

@@ -0,0 +1,4 @@
+var css_248z = ".saltSplitPanel {\n  box-sizing: border-box;\n\n  background: var(--splitPanel-background);\n}\n\n.saltSplitPanel[data-panel-size=\"0.0\"] {\n  visibility: hidden;\n}\n\n.saltSplitPanel-primary {\n  --splitPanel-background: var(--salt-container-primary-background);\n}\n\n.saltSplitPanel-secondary {\n  --splitPanel-background: var(--salt-container-secondary-background);\n}\n\n.saltSplitPanel-tertiary {\n  --splitPanel-background: var(--salt-container-tertiary-background);\n}\n\n@supports selector(:has(*)) {\n  .saltSplitPanel:has(.saltSplitPanel) {\n    background: unset;\n  }\n}\n";
+
+export { css_248z as default };
+//# sourceMappingURL=SplitPanel.css.js.map

package/dist-es/splitter/SplitPanel.css.js.map

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

package/dist-es/splitter/SplitPanel.js

@@ -0,0 +1,35 @@
+import { jsx } from 'react/jsx-runtime';
+import { makePrefixer, useId } from '@salt-ds/core';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { Panel } from 'react-resizable-panels';
+import css_248z from './SplitPanel.css.js';
+
+const withBaseName = makePrefixer("saltSplitPanel");
+const SplitPanel = forwardRef(
+  function SplitPanel2({ id: idProp, variant = "primary", minSize = 10, className, ...props }, ref) {
+    const id = useId(idProp);
+    const targetWindow = useWindow();
+    useComponentCssInjection({
+      testId: "salt-split-panel",
+      css: css_248z,
+      window: targetWindow
+    });
+    return /* @__PURE__ */ jsx(
+      Panel,
+      {
+        id,
+        minSize,
+        "data-variant": variant,
+        className: clsx(withBaseName(), withBaseName(variant), className),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+
+export { SplitPanel };
+//# sourceMappingURL=SplitPanel.js.map

package/dist-es/splitter/SplitPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitPanel.js","sources":["../src/splitter/SplitPanel.tsx"],"sourcesContent":["import { makePrefixer, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport clsx from \"clsx\";\nimport { forwardRef } from \"react\";\nimport {\n  type ImperativePanelHandle,\n  Panel,\n  type PanelProps,\n} from \"react-resizable-panels\";\n\nimport splitPanelCSS from \"./SplitPanel.css\";\n\nexport type SplitPanelVariant = \"primary\" | \"secondary\" | \"tertiary\";\n\nexport interface SplitPanelProps extends PanelProps {\n  /**\n   * Styling variant\n   * @default \"primary\"\n   */\n  variant?: SplitPanelVariant;\n}\n\nconst withBaseName = makePrefixer(\"saltSplitPanel\");\n\nexport const SplitPanel = forwardRef<ImperativePanelHandle, SplitPanelProps>(\n  function SplitPanel(\n    { id: idProp, variant = \"primary\", minSize = 10, className, ...props },\n    ref,\n  ) {\n    const id = useId(idProp);\n    const targetWindow = useWindow();\n\n    useComponentCssInjection({\n      testId: \"salt-split-panel\",\n      css: splitPanelCSS,\n      window: targetWindow,\n    });\n\n    return (\n      <Panel\n        id={id}\n        minSize={minSize}\n        data-variant={variant}\n        className={clsx(withBaseName(), withBaseName(variant), className)}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n"],"names":["SplitPanel","splitPanelCSS"],"mappings":";;;;;;;;;AAuBA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA;AAE3C,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,SAASA,WAAAA,CACP,EAAE,EAAA,EAAI,MAAQ,EAAA,OAAA,GAAU,SAAW,EAAA,OAAA,GAAU,EAAI,EAAA,SAAA,EAAW,GAAG,KAAA,IAC/D,GACA,EAAA;AACA,IAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA;AACvB,IAAA,MAAM,eAAe,SAAU,EAAA;AAE/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,OAAA;AAAA,QACA,cAAc,EAAA,OAAA;AAAA,QACd,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,OAAO,GAAG,SAAS,CAAA;AAAA,QAChE,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA;AAGN;;;;"}

package/dist-es/splitter/Splitter.js

@@ -0,0 +1,27 @@
+import { jsx } from 'react/jsx-runtime';
+import { createContext, useContext } from 'react';
+import { PanelGroup } from 'react-resizable-panels';
+
+const OrientationContext = createContext("vertical");
+const AppearanceContext = createContext("bordered");
+function Splitter({
+  orientation,
+  appearance: appearanceProp,
+  ...props
+}) {
+  const appearanceContext = useContext(AppearanceContext);
+  const appearance = appearanceProp ?? appearanceContext;
+  const direction = orientation === "horizontal" ? "vertical" : "horizontal";
+  return /* @__PURE__ */ jsx(OrientationContext.Provider, { value: orientation, children: /* @__PURE__ */ jsx(AppearanceContext.Provider, { value: appearance, children: /* @__PURE__ */ jsx(
+    PanelGroup,
+    {
+      "data-orientation": orientation,
+      "data-appearance": appearance,
+      direction,
+      ...props
+    }
+  ) }) });
+}
+
+export { AppearanceContext, OrientationContext, Splitter };
+//# sourceMappingURL=Splitter.js.map

package/dist-es/splitter/Splitter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Splitter.js","sources":["../src/splitter/Splitter.tsx"],"sourcesContent":["import { type ReactNode, createContext, useContext } from \"react\";\nimport { PanelGroup, type PanelGroupProps } from \"react-resizable-panels\";\n\nexport type SplitterAppearance = \"bordered\" | \"transparent\";\nexport type SplitterOrientation = \"horizontal\" | \"vertical\";\n\nexport const OrientationContext =\n  createContext<SplitterOrientation>(\"vertical\");\nexport const AppearanceContext = createContext<SplitterAppearance>(\"bordered\");\n\nexport interface SplitterProps extends Omit<PanelGroupProps, \"direction\"> {\n  /**\n   * The orientation of the splitter.\n   * Replaces `PanelGroupProps[\"direction\"]`\n   */\n  orientation: SplitterOrientation;\n  /**\n   * The appearance of the splitter.\n   * If set to \"transparent\", the splitter handle will\n   * be transparent, hence the background will be visible.\n   * @default \"bordered\"\n   */\n  appearance?: SplitterAppearance;\n  children: ReactNode;\n}\n\nexport function Splitter({\n  orientation,\n  appearance: appearanceProp,\n  ...props\n}: SplitterProps) {\n  const appearanceContext = useContext(AppearanceContext);\n  const appearance = appearanceProp ?? appearanceContext;\n\n  const direction = orientation === \"horizontal\" ? \"vertical\" : \"horizontal\";\n\n  return (\n    <OrientationContext.Provider value={orientation}>\n      <AppearanceContext.Provider value={appearance}>\n        <PanelGroup\n          data-orientation={orientation}\n          data-appearance={appearance}\n          direction={direction}\n          {...props}\n        />\n      </AppearanceContext.Provider>\n    </OrientationContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;AAMa,MAAA,kBAAA,GACX,cAAmC,UAAU;AAClC,MAAA,iBAAA,GAAoB,cAAkC,UAAU;AAkBtE,SAAS,QAAS,CAAA;AAAA,EACvB,WAAA;AAAA,EACA,UAAY,EAAA,cAAA;AAAA,EACZ,GAAG;AACL,CAAkB,EAAA;AAChB,EAAM,MAAA,iBAAA,GAAoB,WAAW,iBAAiB,CAAA;AACtD,EAAA,MAAM,aAAa,cAAkB,IAAA,iBAAA;AAErC,EAAM,MAAA,SAAA,GAAY,WAAgB,KAAA,YAAA,GAAe,UAAa,GAAA,YAAA;AAE9D,EACE,uBAAA,GAAA,CAAC,kBAAmB,CAAA,QAAA,EAAnB,EAA4B,KAAA,EAAO,WAClC,EAAA,QAAA,kBAAA,GAAA,CAAC,iBAAkB,CAAA,QAAA,EAAlB,EAA2B,KAAA,EAAO,UACjC,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,kBAAkB,EAAA,WAAA;AAAA,MAClB,iBAAiB,EAAA,UAAA;AAAA,MACjB,SAAA;AAAA,MACC,GAAG;AAAA;AAAA,KAER,CACF,EAAA,CAAA;AAEJ;;;;"}

package/dist-es/splitter/utils.js

@@ -0,0 +1,15 @@
+function computeAccent(appearance, orientation) {
+  if (appearance === "transparent") {
+    return "none";
+  }
+  if (orientation === "horizontal") {
+    return "top-bottom";
+  }
+  return "left-right";
+}
+function computeVariant(appearance) {
+  return appearance === "bordered" ? "primary" : "transparent";
+}
+
+export { computeAccent, computeVariant };
+//# sourceMappingURL=utils.js.map

package/dist-es/splitter/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../src/splitter/utils.ts"],"sourcesContent":["import type { SplitHandleBorder } from \"./SplitHandle\";\nimport type { SplitterAppearance, SplitterOrientation } from \"./Splitter\";\n\nexport function computeAccent(\n  appearance: SplitterAppearance,\n  orientation: SplitterOrientation,\n): SplitHandleBorder {\n  if (appearance === \"transparent\") {\n    return \"none\";\n  }\n\n  if (orientation === \"horizontal\") {\n    return \"top-bottom\";\n  }\n\n  return \"left-right\";\n}\n\nexport function computeVariant(\n  appearance: SplitterAppearance,\n): \"primary\" | \"transparent\" {\n  return appearance === \"bordered\" ? \"primary\" : \"transparent\";\n}\n"],"names":[],"mappings":"AAGgB,SAAA,aAAA,CACd,YACA,WACmB,EAAA;AACnB,EAAA,IAAI,eAAe,aAAe,EAAA;AAChC,IAAO,OAAA,MAAA;AAAA;AAGT,EAAA,IAAI,gBAAgB,YAAc,EAAA;AAChC,IAAO,OAAA,YAAA;AAAA;AAGT,EAAO,OAAA,YAAA;AACT;AAEO,SAAS,eACd,UAC2B,EAAA;AAC3B,EAAO,OAAA,UAAA,KAAe,aAAa,SAAY,GAAA,aAAA;AACjD;;;;"}

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

@@ -1,106 +1,152 @@
-import { resetSteps, flattenSteps, autoStageSteps, assignSteps } from './utils.js';
+import { autoStageSteps, resetSteps, flattenSteps, assignStepStatus, assignStepsStage } from './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 = resetSteps(state.steps);
-    const flatSteps = 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";
+  switch (action.type) {
+    case "next": {
+      if (((_a = state.activeStep) == null ? void 0 : _a.status) === "error") {
+        return state;
+      }
+      const activeStepIndex = state.activeStepIndex + 1;
+      const lastStepIndex = state.flatSteps.length - 1;
+      if (activeStepIndex > lastStepIndex) {
+        const steps2 = assignStepsStage(state.steps, "completed");
+        const flatSteps2 = flattenSteps(steps2);
+        return {
+          steps: steps2,
+          flatSteps: flatSteps2,
+          activeStepIndex: lastStepIndex + 1,
+          activeStep: null,
+          previousStep: flatSteps2[lastStepIndex],
+          nextStep: null,
+          started: true,
+          ended: true
+        };
       }
+      const activeStepId = state.flatSteps[activeStepIndex].id;
+      const steps = autoStageSteps(resetSteps(state.steps), { activeStepId });
+      const flatSteps = flattenSteps(steps);
       return {
-        steps: autoStageSteps(steps),
+        steps,
         flatSteps,
-        activeStepIndex: activeStepIndex2,
-        activeStep: activeStep2,
-        previousStep: previousStep2,
-        nextStep: nextStep2,
+        activeStepIndex,
+        activeStep: flatSteps[activeStepIndex],
+        previousStep: flatSteps[activeStepIndex - 1],
+        nextStep: flatSteps[activeStepIndex + 1] ?? null,
         started: true,
         ended: false
       };
     }
-    const activeStepIndex = flatSteps.length;
-    const previousStep = flatSteps.at(-1);
-    const activeStep = null;
-    const nextStep = null;
-    return {
-      steps: 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 = resetSteps(state.steps);
-    const flatSteps = 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";
+    case "previous": {
+      if (((_b = state.activeStep) == null ? void 0 : _b.status) === "error") {
+        return state;
       }
+      const activeStepIndex = state.activeStepIndex - 1;
+      if (activeStepIndex < 0) {
+        const steps2 = assignStepsStage(state.steps, "pending");
+        const flatSteps2 = flattenSteps(steps2);
+        return {
+          steps: steps2,
+          flatSteps: flatSteps2,
+          activeStepIndex: -1,
+          activeStep: null,
+          previousStep: null,
+          nextStep: flatSteps2[0],
+          started: false,
+          ended: false
+        };
+      }
+      const activeStepId = state.flatSteps[activeStepIndex].id;
+      const steps = autoStageSteps(resetSteps(state.steps), { activeStepId });
+      const flatSteps = flattenSteps(steps);
       return {
-        steps: autoStageSteps(steps),
+        steps,
         flatSteps,
-        activeStepIndex: activeStepIndex2,
-        activeStep: activeStep2,
-        previousStep: previousStep2,
-        nextStep: nextStep2,
+        activeStepIndex,
+        activeStep: flatSteps[activeStepIndex],
+        previousStep: flatSteps[activeStepIndex - 1] ?? null,
+        nextStep: flatSteps[activeStepIndex + 1],
         started: true,
         ended: false
       };
     }
-    const activeStepIndex = -1;
-    const activeStep = null;
-    const previousStep = null;
-    const nextStep = flatSteps.at(0);
-    return {
-      steps: 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 };
+    case "status/error": {
+      const { activeStep, activeStepIndex } = state;
+      if (!activeStep) {
+        return state;
+      }
+      const activeStepId = activeStep.id;
+      const steps = assignStepStatus(state.steps, activeStepId, "error");
+      const flatSteps = flattenSteps(steps);
+      return {
+        ...state,
+        steps,
+        flatSteps,
+        activeStepIndex,
+        activeStep: flatSteps[activeStepIndex],
+        previousStep: flatSteps[activeStepIndex - 1] ?? null,
+        nextStep: flatSteps[activeStepIndex + 1]
+      };
     }
-  }
-  if (action.type === "warning") {
-    if (state.activeStep) {
-      state.activeStep.status = "warning";
-      return { ...state };
+    case "status/warning": {
+      const { activeStep, activeStepIndex } = state;
+      if (!activeStep) {
+        return state;
+      }
+      const activeStepId = activeStep.id;
+      const steps = assignStepStatus(state.steps, activeStepId, "warning");
+      const flatSteps = flattenSteps(steps);
+      return {
+        ...state,
+        steps,
+        flatSteps,
+        activeStepIndex,
+        activeStep: flatSteps[activeStepIndex],
+        previousStep: flatSteps[activeStepIndex - 1] ?? null,
+        nextStep: flatSteps[activeStepIndex + 1]
+      };
     }
-  }
-  if (action.type === "clear") {
-    if (state.activeStep) {
-      state.activeStep.status = void 0;
-      return { ...state };
+    case "status/clear": {
+      const { activeStep, activeStepIndex } = state;
+      if (!activeStep) {
+        return state;
+      }
+      const activeStepId = activeStep.id;
+      const steps = assignStepStatus(state.steps, activeStepId, void 0);
+      const flatSteps = flattenSteps(steps);
+      return {
+        ...state,
+        steps,
+        flatSteps,
+        activeStepIndex,
+        activeStep: flatSteps[activeStepIndex],
+        previousStep: flatSteps[activeStepIndex - 1] ?? null,
+        nextStep: flatSteps[activeStepIndex + 1]
+      };
+    }
+    case "reset": {
+      const firstStepId = state.flatSteps[0].id;
+      const steps = autoStageSteps(
+        resetSteps(state.steps, { resetStatus: true }),
+        { activeStepId: firstStepId }
+      );
+      const flatSteps = flattenSteps(steps);
+      return {
+        steps,
+        flatSteps,
+        activeStepIndex: 0,
+        activeStep: flatSteps[0],
+        previousStep: null,
+        nextStep: flatSteps[1],
+        started: true,
+        ended: false
+      };
+    }
+    default: {
+      const exhaustiveCheck = action;
+      throw new Error(`Unhandled action: ${exhaustiveCheck}`);
     }
   }
-  return state;
 }
 
 export { stepReducer as default };

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

@@ -1 +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":["activeStepIndex","activeStep","previousStep","nextStep"],"mappings":"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"}
+{"version":3,"file":"stepReducer.js","sources":["../src/stepped-tracker/stepReducer.ts"],"sourcesContent":["import type { StepReducerAction, StepReducerState } from \"./stepReducer.types\";\nimport {\n  assignStepStatus,\n  assignStepsStage,\n  autoStageSteps,\n  flattenSteps,\n  resetSteps,\n} from \"./utils\";\n\nexport default function stepReducer(\n  state: StepReducerState,\n  action: StepReducerAction,\n): StepReducerState {\n  switch (action.type) {\n    case \"next\": {\n      if (state.activeStep?.status === \"error\") {\n        return state;\n      }\n\n      const activeStepIndex = state.activeStepIndex + 1;\n      const lastStepIndex = state.flatSteps.length - 1;\n\n      if (activeStepIndex > lastStepIndex) {\n        const steps = assignStepsStage(state.steps, \"completed\");\n        const flatSteps = flattenSteps(steps);\n\n        return {\n          steps,\n          flatSteps,\n          activeStepIndex: lastStepIndex + 1,\n          activeStep: null,\n          previousStep: flatSteps[lastStepIndex],\n          nextStep: null,\n          started: true,\n          ended: true,\n        };\n      }\n\n      const activeStepId = state.flatSteps[activeStepIndex].id;\n      const steps = autoStageSteps(resetSteps(state.steps), { activeStepId });\n      const flatSteps = flattenSteps(steps);\n\n      return {\n        steps,\n        flatSteps,\n        activeStepIndex,\n        activeStep: flatSteps[activeStepIndex],\n        previousStep: flatSteps[activeStepIndex - 1],\n        nextStep: flatSteps[activeStepIndex + 1] ?? null,\n        started: true,\n        ended: false,\n      };\n    }\n\n    case \"previous\": {\n      if (state.activeStep?.status === \"error\") {\n        return state;\n      }\n\n      const activeStepIndex = state.activeStepIndex - 1;\n\n      if (activeStepIndex < 0) {\n        const steps = assignStepsStage(state.steps, \"pending\");\n        const flatSteps = flattenSteps(steps);\n\n        return {\n          steps,\n          flatSteps,\n          activeStepIndex: -1,\n          activeStep: null,\n          previousStep: null,\n          nextStep: flatSteps[0],\n          started: false,\n          ended: false,\n        };\n      }\n\n      const activeStepId = state.flatSteps[activeStepIndex].id;\n      const steps = autoStageSteps(resetSteps(state.steps), { activeStepId });\n      const flatSteps = flattenSteps(steps);\n\n      return {\n        steps,\n        flatSteps,\n        activeStepIndex,\n        activeStep: flatSteps[activeStepIndex],\n        previousStep: flatSteps[activeStepIndex - 1] ?? null,\n        nextStep: flatSteps[activeStepIndex + 1],\n        started: true,\n        ended: false,\n      };\n    }\n\n    case \"status/error\": {\n      const { activeStep, activeStepIndex } = state;\n\n      if (!activeStep) {\n        return state;\n      }\n\n      const activeStepId = activeStep.id;\n\n      const steps = assignStepStatus(state.steps, activeStepId, \"error\");\n      const flatSteps = flattenSteps(steps);\n\n      return {\n        ...state,\n        steps,\n        flatSteps,\n        activeStepIndex,\n        activeStep: flatSteps[activeStepIndex],\n        previousStep: flatSteps[activeStepIndex - 1] ?? null,\n        nextStep: flatSteps[activeStepIndex + 1],\n      };\n    }\n\n    case \"status/warning\": {\n      const { activeStep, activeStepIndex } = state;\n\n      if (!activeStep) {\n        return state;\n      }\n\n      const activeStepId = activeStep.id;\n\n      const steps = assignStepStatus(state.steps, activeStepId, \"warning\");\n      const flatSteps = flattenSteps(steps);\n\n      return {\n        ...state,\n        steps,\n        flatSteps,\n        activeStepIndex,\n        activeStep: flatSteps[activeStepIndex],\n        previousStep: flatSteps[activeStepIndex - 1] ?? null,\n        nextStep: flatSteps[activeStepIndex + 1],\n      };\n    }\n\n    case \"status/clear\": {\n      const { activeStep, activeStepIndex } = state;\n\n      if (!activeStep) {\n        return state;\n      }\n\n      const activeStepId = activeStep.id;\n\n      const steps = assignStepStatus(state.steps, activeStepId, undefined);\n      const flatSteps = flattenSteps(steps);\n\n      return {\n        ...state,\n        steps,\n        flatSteps,\n        activeStepIndex,\n        activeStep: flatSteps[activeStepIndex],\n        previousStep: flatSteps[activeStepIndex - 1] ?? null,\n        nextStep: flatSteps[activeStepIndex + 1],\n      };\n    }\n\n    case \"reset\": {\n      const firstStepId = state.flatSteps[0].id;\n\n      const steps = autoStageSteps(\n        resetSteps(state.steps, { resetStatus: true }),\n        { activeStepId: firstStepId },\n      );\n      const flatSteps = flattenSteps(steps);\n\n      return {\n        steps,\n        flatSteps,\n        activeStepIndex: 0,\n        activeStep: flatSteps[0],\n        previousStep: null,\n        nextStep: flatSteps[1],\n        started: true,\n        ended: false,\n      };\n    }\n\n    default: {\n      const exhaustiveCheck: never = action;\n      throw new Error(`Unhandled action: ${exhaustiveCheck}`);\n    }\n  }\n}\n"],"names":["steps","flatSteps"],"mappings":"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"}

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

@@ -1,13 +1,15 @@
-import { useMemo, useReducer } from 'react';
+import { useCallback, useReducer } from 'react';
 import stepReducer from './stepReducer.js';
 import { initStepReducerState } from './utils.js';
 
 function useStepReducer(initialSteps, options) {
-  const state = useMemo(
-    () => initStepReducerState(initialSteps, options),
-    [initialSteps, options]
+  const initializer = useCallback(
+    (initialSteps2) => {
+      return initStepReducerState(initialSteps2, options);
+    },
+    [options]
   );
-  return useReducer(stepReducer, state);
+  return useReducer(stepReducer, initialSteps, initializer);
 }
 
 export { useStepReducer };

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

@@ -1 +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":[],"mappings":";;;;AAQgB,SAAA,cAAA,CACd,cACA,OACA,EAAA;AACA,EAAA,MAAM,KAAQ,GAAA,OAAA;AAAA,IACZ,MAAM,oBAAqB,CAAA,YAAA,EAAc,OAAO,CAAA;AAAA,IAChD,CAAC,cAAc,OAAO;AAAA,GACxB;AAEA,EAAO,OAAA,UAAA,CAAW,aAAa,KAAK,CAAA;AACtC;;;;"}
+{"version":3,"file":"useStepReducer.js","sources":["../src/stepped-tracker/useStepReducer.ts"],"sourcesContent":["import { useCallback, useReducer } from \"react\";\n\nimport stepReducer from \"./stepReducer\";\n\nimport type { StepRecord } from \"./Step.types\";\nimport type { StepReducerOptions } from \"./stepReducer.types\";\nimport { initStepReducerState } from \"./utils\";\n\nexport function useStepReducer(\n  initialSteps: StepRecord[],\n  options?: StepReducerOptions,\n) {\n  const initializer = useCallback(\n    (initialSteps: StepRecord[]) => {\n      return initStepReducerState(initialSteps, options);\n    },\n    [options],\n  );\n\n  return useReducer(stepReducer, initialSteps, initializer);\n}\n"],"names":["initialSteps"],"mappings":";;;;AAQgB,SAAA,cAAA,CACd,cACA,OACA,EAAA;AACA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAACA,aAA+B,KAAA;AAC9B,MAAO,OAAA,oBAAA,CAAqBA,eAAc,OAAO,CAAA;AAAA,KACnD;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAO,OAAA,UAAA,CAAW,WAAa,EAAA,YAAA,EAAc,WAAW,CAAA;AAC1D;;;;"}