@leabankab/component-library 8.7.0 → 8.8.0

package/dist/components/form/slider.d.ts

@@ -1,9 +1,15 @@
 import { Slider as BaseSlider } from '@base-ui/react/slider';
 import { ReactNode } from 'react';
+import { ColorRoles } from '../color-roles';
 /**
  * Requires an accessible name so the slider is never nameless. Provide a
  * visible `label`, or an `aria-label` when the design has none.
  */
+/**
+ * `"primary"` for a light surface; `"contrast"` for a dark one
+ * (`bg.contrast`, `bg.contrast-accent`, the website `Calculator`'s panel).
+ */
+export type SliderColor = ColorRoles<"primary" | "contrast">;
 type SliderAccessibleName = {
     label: ReactNode;
     "aria-label"?: never;
@@ -16,6 +22,13 @@ export type SliderProps = Omit<BaseSlider.Root.Props<number>, "children" | "orie
     helperText?: ReactNode;
     /** Puts the slider and its helper text into the error state. */
     error?: boolean;
+    /**
+     * `"primary"`: purple on a light surface. `"contrast"`: white text, a
+     * white fill and thumb, for a dark surface such as the website's
+     * `Calculator`.
+     * @default "primary"
+     */
+    color?: SliderColor;
 };
 /**
  * A single-value slider built on Base UI's accessible `Slider` primitive.
@@ -28,7 +41,7 @@ export type SliderProps = Omit<BaseSlider.Root.Props<number>, "children" | "orie
  * `name` is set.
  *
  * Pass `format` and `locale` to control how the value, `min` and `max` are
- * written and announced.
+ * written and announced. On a dark surface, pass `color="contrast"`.
  *
  * ```tsx
  * <Slider
@@ -43,5 +56,5 @@ export type SliderProps = Omit<BaseSlider.Root.Props<number>, "children" | "orie
  * />
  * ```
  */
-export declare function Slider({ label, "aria-label": ariaLabel, helperText, error, min, max, format, locale, className, ...rest }: SliderProps): import("react").JSX.Element;
+export declare function Slider({ label, "aria-label": ariaLabel, helperText, error, color, min, max, format, locale, className, ...rest }: SliderProps): import("react").JSX.Element;
 export {};