@cerberus-design/react 1.6.0-next-682fbb6 → 1.7.0-next-5cce1d3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,17 @@
1
1
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
2
- const require_slider = require("./slider.cjs");
3
2
  const require_primitives = require("./primitives.cjs");
3
+ const require_slider = require("./slider.cjs");
4
4
  exports.Slider = require_slider.Slider;
5
+ exports.SliderControl = require_primitives.SliderControl;
6
+ exports.SliderDraggingIndicator = require_primitives.SliderDraggingIndicator;
7
+ exports.SliderHiddenInput = require_primitives.SliderHiddenInput;
8
+ exports.SliderLabel = require_primitives.SliderLabel;
9
+ exports.SliderMarker = require_primitives.SliderMarker;
10
+ exports.SliderMarkerGroup = require_primitives.SliderMarkerGroup;
11
+ exports.SliderMarkerIndicator = require_primitives.SliderMarkerIndicator;
12
+ exports.SliderProvider = require_primitives.SliderProvider;
13
+ exports.SliderRange = require_primitives.SliderRange;
5
14
  exports.SliderRoot = require_primitives.SliderRoot;
15
+ exports.SliderThumb = require_primitives.SliderThumb;
16
+ exports.SliderTrack = require_primitives.SliderTrack;
17
+ exports.SliderValueText = require_primitives.SliderValueText;
@@ -1,3 +1,3 @@
1
+ import { SliderControl, SliderDraggingIndicator, SliderHiddenInput, SliderLabel, SliderMarker, SliderMarkerGroup, SliderMarkerIndicator, SliderProvider, SliderRange, SliderRoot, SliderThumb, SliderTrack, SliderValueText } from "./primitives.js";
1
2
  import { Slider } from "./slider.js";
2
- import { SliderRoot } from "./primitives.js";
3
- export { Slider, SliderRoot };
3
+ export { Slider, SliderControl, SliderDraggingIndicator, SliderHiddenInput, SliderLabel, SliderMarker, SliderMarkerGroup, SliderMarkerIndicator, SliderProvider, SliderRange, SliderRoot, SliderThumb, SliderTrack, SliderValueText };
@@ -0,0 +1,39 @@
1
+ "use client";
2
+ const require_for = require("../for/for.cjs");
3
+ const require_primitives = require("./primitives.cjs");
4
+ let react_jsx_runtime = require("react/jsx-runtime");
5
+ //#region src/components/slider/marks.tsx
6
+ /**
7
+ * ## SliderMarks
8
+ *
9
+ * An abstraction over the `SliderMarkerGroup` and `SliderMarker` slots which provides a simple way to render slider marks without needing to manually manage the `SliderMarkerGroup` and `SliderMarker` slots.
10
+ *
11
+ * | Prop | Type | Description |
12
+ * | --- | --- | --- |
13
+ * | `direction` | `'horizontal' | 'vertical'` | The direction of the slider. |
14
+ * | `marks` | `Array<number>` | The value of the slider as an array of numbers representing the mark values. |
15
+ */
16
+ function SliderMarks(props) {
17
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives.SliderMarkerGroup, {
18
+ direction: props.direction,
19
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_for.For, {
20
+ each: props.marks,
21
+ children: (mark, idx) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Mark, {
22
+ direction: props.direction,
23
+ mark
24
+ }, idx)
25
+ })
26
+ });
27
+ }
28
+ function Mark(props) {
29
+ const { mark } = props;
30
+ const value = typeof mark === "number" ? mark : mark.value;
31
+ const label = typeof mark === "number" ? mark : mark.label ?? mark.value;
32
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_primitives.SliderMarker, {
33
+ direction: props.direction,
34
+ value,
35
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives.SliderMarkerIndicator, {}), label]
36
+ });
37
+ }
38
+ //#endregion
39
+ exports.SliderMarks = SliderMarks;
@@ -0,0 +1,21 @@
1
+ import { ReactNode } from 'react';
2
+ import { SliderProps } from './slider';
3
+ export type SliderMarksProps = {
4
+ direction?: SliderProps['orientation'];
5
+ marks: Array<Marker>;
6
+ };
7
+ export type Marker = number | {
8
+ value: number;
9
+ label: ReactNode;
10
+ };
11
+ /**
12
+ * ## SliderMarks
13
+ *
14
+ * An abstraction over the `SliderMarkerGroup` and `SliderMarker` slots which provides a simple way to render slider marks without needing to manually manage the `SliderMarkerGroup` and `SliderMarker` slots.
15
+ *
16
+ * | Prop | Type | Description |
17
+ * | --- | --- | --- |
18
+ * | `direction` | `'horizontal' | 'vertical'` | The direction of the slider. |
19
+ * | `marks` | `Array<number>` | The value of the slider as an array of numbers representing the mark values. |
20
+ */
21
+ export declare function SliderMarks(props: SliderMarksProps): import("react").JSX.Element;
@@ -0,0 +1,21 @@
1
+ import { ReactNode } from 'react';
2
+ import { SliderProps } from './slider';
3
+ export type SliderMarksProps = {
4
+ direction?: SliderProps['orientation'];
5
+ marks: Array<Marker>;
6
+ };
7
+ export type Marker = number | {
8
+ value: number;
9
+ label: ReactNode;
10
+ };
11
+ /**
12
+ * ## SliderMarks
13
+ *
14
+ * An abstraction over the `SliderMarkerGroup` and `SliderMarker` slots which provides a simple way to render slider marks without needing to manually manage the `SliderMarkerGroup` and `SliderMarker` slots.
15
+ *
16
+ * | Prop | Type | Description |
17
+ * | --- | --- | --- |
18
+ * | `direction` | `'horizontal' | 'vertical'` | The direction of the slider. |
19
+ * | `marks` | `Array<number>` | The value of the slider as an array of numbers representing the mark values. |
20
+ */
21
+ export declare function SliderMarks(props: SliderMarksProps): import("react").JSX.Element;
@@ -0,0 +1,39 @@
1
+ "use client";
2
+ import { For } from "../for/for.js";
3
+ import { SliderMarker, SliderMarkerGroup, SliderMarkerIndicator } from "./primitives.js";
4
+ import { jsx, jsxs } from "react/jsx-runtime";
5
+ //#region src/components/slider/marks.tsx
6
+ /**
7
+ * ## SliderMarks
8
+ *
9
+ * An abstraction over the `SliderMarkerGroup` and `SliderMarker` slots which provides a simple way to render slider marks without needing to manually manage the `SliderMarkerGroup` and `SliderMarker` slots.
10
+ *
11
+ * | Prop | Type | Description |
12
+ * | --- | --- | --- |
13
+ * | `direction` | `'horizontal' | 'vertical'` | The direction of the slider. |
14
+ * | `marks` | `Array<number>` | The value of the slider as an array of numbers representing the mark values. |
15
+ */
16
+ function SliderMarks(props) {
17
+ return /* @__PURE__ */ jsx(SliderMarkerGroup, {
18
+ direction: props.direction,
19
+ children: /* @__PURE__ */ jsx(For, {
20
+ each: props.marks,
21
+ children: (mark, idx) => /* @__PURE__ */ jsx(Mark, {
22
+ direction: props.direction,
23
+ mark
24
+ }, idx)
25
+ })
26
+ });
27
+ }
28
+ function Mark(props) {
29
+ const { mark } = props;
30
+ const value = typeof mark === "number" ? mark : mark.value;
31
+ const label = typeof mark === "number" ? mark : mark.label ?? mark.value;
32
+ return /* @__PURE__ */ jsxs(SliderMarker, {
33
+ direction: props.direction,
34
+ value,
35
+ children: [/* @__PURE__ */ jsx(SliderMarkerIndicator, {}), label]
36
+ });
37
+ }
38
+ //#endregion
39
+ export { SliderMarks };
@@ -6,7 +6,31 @@ let _ark_ui_react_slider = require("@ark-ui/react/slider");
6
6
  * This module contains the primitives of the Slider component.
7
7
  * @module 'slider/primitives'
8
8
  */
9
- var { withSlotRecipe } = require_index.createCerberusPrimitive(styled_system_recipes.slider);
9
+ var { withSlotRecipe, withNoRecipe } = require_index.createCerberusPrimitive(styled_system_recipes.slider);
10
+ var SliderProvider = withSlotRecipe(_ark_ui_react_slider.Slider.RootProvider, "root");
10
11
  var SliderRoot = withSlotRecipe(_ark_ui_react_slider.Slider.Root, "root");
12
+ var SliderLabel = withSlotRecipe(_ark_ui_react_slider.Slider.Label, "label");
13
+ var SliderValueText = withSlotRecipe(_ark_ui_react_slider.Slider.ValueText, "valueText");
14
+ var SliderControl = withSlotRecipe(_ark_ui_react_slider.Slider.Control, "control");
15
+ var SliderTrack = withSlotRecipe(_ark_ui_react_slider.Slider.Track, "track");
16
+ var SliderRange = withSlotRecipe(_ark_ui_react_slider.Slider.Range, "range");
17
+ var SliderThumb = withSlotRecipe(_ark_ui_react_slider.Slider.Thumb, "thumb");
18
+ var SliderDraggingIndicator = withSlotRecipe(_ark_ui_react_slider.Slider.DraggingIndicator, "draggingIndicator");
19
+ var SliderMarkerGroup = withSlotRecipe(_ark_ui_react_slider.Slider.MarkerGroup, "markerGroup");
20
+ var SliderMarker = withSlotRecipe(_ark_ui_react_slider.Slider.Marker, "marker");
21
+ var SliderMarkerIndicator = withSlotRecipe("div", "markerIndicator");
22
+ var SliderHiddenInput = withNoRecipe(_ark_ui_react_slider.Slider.HiddenInput);
11
23
  //#endregion
24
+ exports.SliderControl = SliderControl;
25
+ exports.SliderDraggingIndicator = SliderDraggingIndicator;
26
+ exports.SliderHiddenInput = SliderHiddenInput;
27
+ exports.SliderLabel = SliderLabel;
28
+ exports.SliderMarker = SliderMarker;
29
+ exports.SliderMarkerGroup = SliderMarkerGroup;
30
+ exports.SliderMarkerIndicator = SliderMarkerIndicator;
31
+ exports.SliderProvider = SliderProvider;
32
+ exports.SliderRange = SliderRange;
12
33
  exports.SliderRoot = SliderRoot;
34
+ exports.SliderThumb = SliderThumb;
35
+ exports.SliderTrack = SliderTrack;
36
+ exports.SliderValueText = SliderValueText;
@@ -1,6 +1,30 @@
1
1
  import { Slider } from '@ark-ui/react/slider';
2
2
  import { SliderVariantProps } from 'styled-system/recipes';
3
- import { CerberusPrimitiveProps } from '../../system/index';
4
- import { ForwardRefExoticComponent, RefAttributes } from 'react';
3
+ import { CerberusProps, CerberusPrimitiveProps } from '../../system/index';
4
+ import { ForwardRefExoticComponent, RefAttributes, DetailedHTMLProps, HTMLAttributes } from 'react';
5
+ export type SliderProviderProps = CerberusPrimitiveProps<Slider.RootProviderProps & SliderVariantProps>;
6
+ export declare const SliderProvider: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.RootProviderProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
5
7
  export type SliderRootProps = CerberusPrimitiveProps<Slider.RootProps & SliderVariantProps>;
6
8
  export declare const SliderRoot: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.RootProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
9
+ export type SliderLabelProps = CerberusPrimitiveProps<Slider.LabelProps>;
10
+ export declare const SliderLabel: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.LabelProps & RefAttributes<HTMLLabelElement>>, "ref"> & RefAttributes<HTMLElement>>;
11
+ export type SliderValueTextProps = CerberusPrimitiveProps<Slider.ValueTextProps>;
12
+ export declare const SliderValueText: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.ValueTextProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
13
+ export type SliderControlProps = CerberusPrimitiveProps<Slider.ControlProps>;
14
+ export declare const SliderControl: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.ControlProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
15
+ export type SliderTrackProps = CerberusPrimitiveProps<Slider.TrackProps>;
16
+ export declare const SliderTrack: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.TrackProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
17
+ export type SliderRangeProps = CerberusPrimitiveProps<Slider.RangeProps>;
18
+ export declare const SliderRange: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.RangeProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
19
+ export type SliderThumbProps = CerberusPrimitiveProps<Slider.ThumbProps>;
20
+ export declare const SliderThumb: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.ThumbProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
21
+ export type SliderDraggingIndicatorProps = CerberusPrimitiveProps<Slider.DraggingIndicatorProps>;
22
+ export declare const SliderDraggingIndicator: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.DraggingIndicatorProps & RefAttributes<HTMLSpanElement>>, "ref"> & RefAttributes<HTMLElement>>;
23
+ export type SliderMarkerGroupProps = CerberusPrimitiveProps<Slider.MarkerGroupProps>;
24
+ export declare const SliderMarkerGroup: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.MarkerGroupProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
25
+ export type SliderMarkerProps = CerberusPrimitiveProps<Slider.MarkerProps>;
26
+ export declare const SliderMarker: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.MarkerProps & RefAttributes<HTMLSpanElement>>, "ref"> & RefAttributes<HTMLElement>>;
27
+ export type SliderMarkerIndicatorProps = CerberusProps<'div'>;
28
+ export declare const SliderMarkerIndicator: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps< DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
29
+ export type SliderHiddenInputProps = CerberusPrimitiveProps<Slider.HiddenInputProps>;
30
+ export declare const SliderHiddenInput: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.HiddenInputProps & RefAttributes<HTMLInputElement>>, "ref"> & RefAttributes<HTMLElement>>;
@@ -1,6 +1,30 @@
1
1
  import { Slider } from '@ark-ui/react/slider';
2
2
  import { SliderVariantProps } from 'styled-system/recipes';
3
- import { CerberusPrimitiveProps } from '../../system/index';
4
- import { ForwardRefExoticComponent, RefAttributes } from 'react';
3
+ import { CerberusProps, CerberusPrimitiveProps } from '../../system/index';
4
+ import { ForwardRefExoticComponent, RefAttributes, DetailedHTMLProps, HTMLAttributes } from 'react';
5
+ export type SliderProviderProps = CerberusPrimitiveProps<Slider.RootProviderProps & SliderVariantProps>;
6
+ export declare const SliderProvider: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.RootProviderProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
5
7
  export type SliderRootProps = CerberusPrimitiveProps<Slider.RootProps & SliderVariantProps>;
6
8
  export declare const SliderRoot: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.RootProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
9
+ export type SliderLabelProps = CerberusPrimitiveProps<Slider.LabelProps>;
10
+ export declare const SliderLabel: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.LabelProps & RefAttributes<HTMLLabelElement>>, "ref"> & RefAttributes<HTMLElement>>;
11
+ export type SliderValueTextProps = CerberusPrimitiveProps<Slider.ValueTextProps>;
12
+ export declare const SliderValueText: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.ValueTextProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
13
+ export type SliderControlProps = CerberusPrimitiveProps<Slider.ControlProps>;
14
+ export declare const SliderControl: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.ControlProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
15
+ export type SliderTrackProps = CerberusPrimitiveProps<Slider.TrackProps>;
16
+ export declare const SliderTrack: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.TrackProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
17
+ export type SliderRangeProps = CerberusPrimitiveProps<Slider.RangeProps>;
18
+ export declare const SliderRange: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.RangeProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
19
+ export type SliderThumbProps = CerberusPrimitiveProps<Slider.ThumbProps>;
20
+ export declare const SliderThumb: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.ThumbProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
21
+ export type SliderDraggingIndicatorProps = CerberusPrimitiveProps<Slider.DraggingIndicatorProps>;
22
+ export declare const SliderDraggingIndicator: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.DraggingIndicatorProps & RefAttributes<HTMLSpanElement>>, "ref"> & RefAttributes<HTMLElement>>;
23
+ export type SliderMarkerGroupProps = CerberusPrimitiveProps<Slider.MarkerGroupProps>;
24
+ export declare const SliderMarkerGroup: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.MarkerGroupProps & RefAttributes<HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
25
+ export type SliderMarkerProps = CerberusPrimitiveProps<Slider.MarkerProps>;
26
+ export declare const SliderMarker: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.MarkerProps & RefAttributes<HTMLSpanElement>>, "ref"> & RefAttributes<HTMLElement>>;
27
+ export type SliderMarkerIndicatorProps = CerberusProps<'div'>;
28
+ export declare const SliderMarkerIndicator: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps< DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, "ref"> & RefAttributes<HTMLElement>>;
29
+ export type SliderHiddenInputProps = CerberusPrimitiveProps<Slider.HiddenInputProps>;
30
+ export declare const SliderHiddenInput: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps<Slider.HiddenInputProps & RefAttributes<HTMLInputElement>>, "ref"> & RefAttributes<HTMLElement>>;
@@ -6,7 +6,19 @@ import { Slider } from "@ark-ui/react/slider";
6
6
  * This module contains the primitives of the Slider component.
7
7
  * @module 'slider/primitives'
8
8
  */
9
- var { withSlotRecipe } = createCerberusPrimitive(slider);
9
+ var { withSlotRecipe, withNoRecipe } = createCerberusPrimitive(slider);
10
+ var SliderProvider = withSlotRecipe(Slider.RootProvider, "root");
10
11
  var SliderRoot = withSlotRecipe(Slider.Root, "root");
12
+ var SliderLabel = withSlotRecipe(Slider.Label, "label");
13
+ var SliderValueText = withSlotRecipe(Slider.ValueText, "valueText");
14
+ var SliderControl = withSlotRecipe(Slider.Control, "control");
15
+ var SliderTrack = withSlotRecipe(Slider.Track, "track");
16
+ var SliderRange = withSlotRecipe(Slider.Range, "range");
17
+ var SliderThumb = withSlotRecipe(Slider.Thumb, "thumb");
18
+ var SliderDraggingIndicator = withSlotRecipe(Slider.DraggingIndicator, "draggingIndicator");
19
+ var SliderMarkerGroup = withSlotRecipe(Slider.MarkerGroup, "markerGroup");
20
+ var SliderMarker = withSlotRecipe(Slider.Marker, "marker");
21
+ var SliderMarkerIndicator = withSlotRecipe("div", "markerIndicator");
22
+ var SliderHiddenInput = withNoRecipe(Slider.HiddenInput);
11
23
  //#endregion
12
- export { SliderRoot };
24
+ export { SliderControl, SliderDraggingIndicator, SliderHiddenInput, SliderLabel, SliderMarker, SliderMarkerGroup, SliderMarkerIndicator, SliderProvider, SliderRange, SliderRoot, SliderThumb, SliderTrack, SliderValueText };
@@ -1,7 +1,70 @@
1
+ const require_show = require("../show/show.cjs");
2
+ const require_primitives = require("./primitives.cjs");
3
+ const require_marks = require("./marks.cjs");
4
+ const require_thumbs = require("./thumbs.cjs");
1
5
  let react_jsx_runtime = require("react/jsx-runtime");
6
+ let styled_system_jsx = require("styled-system/jsx");
2
7
  //#region src/components/slider/slider.tsx
3
- function Slider() {
4
- return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { role: "slider" });
8
+ /**
9
+ * ## Slider Component
10
+ * Slider component that wraps the slider primitives. This provides an abstraction to streamline basic slider usage.
11
+ *
12
+ * For more advanced use cases, use the slider
13
+ * primitives directly via the `Slider.[Slot]` component's parts.
14
+ *
15
+ * @see {@link https://cerberus.digitalu.design/docs/components/slider}
16
+ */
17
+ function Slider(props) {
18
+ const { showIndicator, ...rootProps } = props;
19
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_primitives.SliderRoot, {
20
+ ...rootProps,
21
+ direction: props.orientation,
22
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_show.Show, {
23
+ when: props.children,
24
+ children: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(styled_system_jsx.HStack, {
25
+ justify: "space-between",
26
+ w: "full",
27
+ children: props.children
28
+ })
29
+ }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_primitives.SliderControl, {
30
+ direction: props.orientation,
31
+ children: [
32
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives.SliderTrack, {
33
+ direction: props.orientation,
34
+ usage: props.usage,
35
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives.SliderRange, { usage: props.usage })
36
+ }),
37
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_thumbs.SliderThumbs, {
38
+ direction: props.orientation,
39
+ showIndicator,
40
+ usage: props.usage,
41
+ value: props.defaultValue ?? props.value
42
+ }),
43
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_show.Show, {
44
+ when: props.marks?.length,
45
+ children: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_marks.SliderMarks, {
46
+ direction: props.orientation,
47
+ marks: props.marks ?? []
48
+ })
49
+ })
50
+ ]
51
+ })]
52
+ });
5
53
  }
54
+ Slider.Provider = require_primitives.SliderProvider;
55
+ Slider.Root = require_primitives.SliderRoot;
56
+ Slider.Label = require_primitives.SliderLabel;
57
+ Slider.ValueText = require_primitives.SliderValueText;
58
+ Slider.Control = require_primitives.SliderControl;
59
+ Slider.Track = require_primitives.SliderTrack;
60
+ Slider.Range = require_primitives.SliderRange;
61
+ Slider.Thumb = require_primitives.SliderThumb;
62
+ Slider.Thumbs = require_thumbs.SliderThumbs;
63
+ Slider.DraggingIndicator = require_primitives.SliderDraggingIndicator;
64
+ Slider.MarkerGroup = require_primitives.SliderMarkerGroup;
65
+ Slider.Marker = require_primitives.SliderMarker;
66
+ Slider.MarkerIndicator = require_primitives.SliderMarkerIndicator;
67
+ Slider.Marks = require_marks.SliderMarks;
68
+ Slider.HiddenInput = require_primitives.SliderHiddenInput;
6
69
  //#endregion
7
70
  exports.Slider = Slider;
@@ -1 +1,34 @@
1
- export declare function Slider(): import("react").JSX.Element;
1
+ import { Marker, SliderMarks } from './marks';
2
+ import { SliderRootProps } from './primitives';
3
+ import { SliderThumbs } from './thumbs';
4
+ export type SliderProps = SliderRootProps & {
5
+ marks?: Array<Marker>;
6
+ showIndicator?: boolean;
7
+ };
8
+ /**
9
+ * ## Slider Component
10
+ * Slider component that wraps the slider primitives. This provides an abstraction to streamline basic slider usage.
11
+ *
12
+ * For more advanced use cases, use the slider
13
+ * primitives directly via the `Slider.[Slot]` component's parts.
14
+ *
15
+ * @see {@link https://cerberus.digitalu.design/docs/components/slider}
16
+ */
17
+ export declare function Slider(props: SliderProps): import("react").JSX.Element;
18
+ export declare namespace Slider {
19
+ var Provider: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderRootProviderProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
20
+ var Root: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderRootProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
21
+ var Label: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderLabelProps & import("react").RefAttributes<HTMLLabelElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
22
+ var ValueText: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderValueTextProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
23
+ var Control: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderControlProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
24
+ var Track: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderTrackProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
25
+ var Range: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderRangeProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
26
+ var Thumb: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderThumbProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
27
+ var Thumbs: typeof SliderThumbs;
28
+ var DraggingIndicator: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderDraggingIndicatorProps & import("react").RefAttributes<HTMLSpanElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
29
+ var MarkerGroup: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderMarkerGroupProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
30
+ var Marker: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderMarkerProps & import("react").RefAttributes<HTMLSpanElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
31
+ var MarkerIndicator: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
32
+ var Marks: typeof SliderMarks;
33
+ var HiddenInput: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderHiddenInputProps & import("react").RefAttributes<HTMLInputElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
34
+ }
@@ -1 +1,34 @@
1
- export declare function Slider(): import("react").JSX.Element;
1
+ import { Marker, SliderMarks } from './marks';
2
+ import { SliderRootProps } from './primitives';
3
+ import { SliderThumbs } from './thumbs';
4
+ export type SliderProps = SliderRootProps & {
5
+ marks?: Array<Marker>;
6
+ showIndicator?: boolean;
7
+ };
8
+ /**
9
+ * ## Slider Component
10
+ * Slider component that wraps the slider primitives. This provides an abstraction to streamline basic slider usage.
11
+ *
12
+ * For more advanced use cases, use the slider
13
+ * primitives directly via the `Slider.[Slot]` component's parts.
14
+ *
15
+ * @see {@link https://cerberus.digitalu.design/docs/components/slider}
16
+ */
17
+ export declare function Slider(props: SliderProps): import("react").JSX.Element;
18
+ export declare namespace Slider {
19
+ var Provider: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderRootProviderProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
20
+ var Root: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderRootProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
21
+ var Label: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderLabelProps & import("react").RefAttributes<HTMLLabelElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
22
+ var ValueText: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderValueTextProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
23
+ var Control: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderControlProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
24
+ var Track: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderTrackProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
25
+ var Range: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderRangeProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
26
+ var Thumb: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderThumbProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
27
+ var Thumbs: typeof SliderThumbs;
28
+ var DraggingIndicator: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderDraggingIndicatorProps & import("react").RefAttributes<HTMLSpanElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
29
+ var MarkerGroup: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderMarkerGroupProps & import("react").RefAttributes<HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
30
+ var Marker: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderMarkerProps & import("react").RefAttributes<HTMLSpanElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
31
+ var MarkerIndicator: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
32
+ var Marks: typeof SliderMarks;
33
+ var HiddenInput: import("react").ForwardRefExoticComponent<Omit<import("../..").CerberusPrimitiveProps<import("@ark-ui/react").SliderHiddenInputProps & import("react").RefAttributes<HTMLInputElement>>, "ref"> & import("react").RefAttributes<HTMLElement>>;
34
+ }
@@ -1,7 +1,70 @@
1
- import { jsx } from "react/jsx-runtime";
1
+ import { Show } from "../show/show.js";
2
+ import { SliderControl, SliderDraggingIndicator, SliderHiddenInput, SliderLabel, SliderMarker, SliderMarkerGroup, SliderMarkerIndicator, SliderProvider, SliderRange, SliderRoot, SliderThumb, SliderTrack, SliderValueText } from "./primitives.js";
3
+ import { SliderMarks } from "./marks.js";
4
+ import { SliderThumbs } from "./thumbs.js";
5
+ import { jsx, jsxs } from "react/jsx-runtime";
6
+ import { HStack } from "styled-system/jsx";
2
7
  //#region src/components/slider/slider.tsx
3
- function Slider() {
4
- return /* @__PURE__ */ jsx("div", { role: "slider" });
8
+ /**
9
+ * ## Slider Component
10
+ * Slider component that wraps the slider primitives. This provides an abstraction to streamline basic slider usage.
11
+ *
12
+ * For more advanced use cases, use the slider
13
+ * primitives directly via the `Slider.[Slot]` component's parts.
14
+ *
15
+ * @see {@link https://cerberus.digitalu.design/docs/components/slider}
16
+ */
17
+ function Slider(props) {
18
+ const { showIndicator, ...rootProps } = props;
19
+ return /* @__PURE__ */ jsxs(SliderRoot, {
20
+ ...rootProps,
21
+ direction: props.orientation,
22
+ children: [/* @__PURE__ */ jsx(Show, {
23
+ when: props.children,
24
+ children: () => /* @__PURE__ */ jsx(HStack, {
25
+ justify: "space-between",
26
+ w: "full",
27
+ children: props.children
28
+ })
29
+ }), /* @__PURE__ */ jsxs(SliderControl, {
30
+ direction: props.orientation,
31
+ children: [
32
+ /* @__PURE__ */ jsx(SliderTrack, {
33
+ direction: props.orientation,
34
+ usage: props.usage,
35
+ children: /* @__PURE__ */ jsx(SliderRange, { usage: props.usage })
36
+ }),
37
+ /* @__PURE__ */ jsx(SliderThumbs, {
38
+ direction: props.orientation,
39
+ showIndicator,
40
+ usage: props.usage,
41
+ value: props.defaultValue ?? props.value
42
+ }),
43
+ /* @__PURE__ */ jsx(Show, {
44
+ when: props.marks?.length,
45
+ children: () => /* @__PURE__ */ jsx(SliderMarks, {
46
+ direction: props.orientation,
47
+ marks: props.marks ?? []
48
+ })
49
+ })
50
+ ]
51
+ })]
52
+ });
5
53
  }
54
+ Slider.Provider = SliderProvider;
55
+ Slider.Root = SliderRoot;
56
+ Slider.Label = SliderLabel;
57
+ Slider.ValueText = SliderValueText;
58
+ Slider.Control = SliderControl;
59
+ Slider.Track = SliderTrack;
60
+ Slider.Range = SliderRange;
61
+ Slider.Thumb = SliderThumb;
62
+ Slider.Thumbs = SliderThumbs;
63
+ Slider.DraggingIndicator = SliderDraggingIndicator;
64
+ Slider.MarkerGroup = SliderMarkerGroup;
65
+ Slider.Marker = SliderMarker;
66
+ Slider.MarkerIndicator = SliderMarkerIndicator;
67
+ Slider.Marks = SliderMarks;
68
+ Slider.HiddenInput = SliderHiddenInput;
6
69
  //#endregion
7
70
  export { Slider };
@@ -0,0 +1,22 @@
1
+ "use client";
2
+ const require_show = require("../show/show.cjs");
3
+ const require_for = require("../for/for.cjs");
4
+ const require_primitives = require("./primitives.cjs");
5
+ let react_jsx_runtime = require("react/jsx-runtime");
6
+ //#region src/components/slider/thumbs.tsx
7
+ function SliderThumbs(props) {
8
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_for.For, {
9
+ each: props.value,
10
+ children: (num, idx) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_primitives.SliderThumb, {
11
+ index: idx,
12
+ direction: props.direction,
13
+ usage: props.usage,
14
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives.SliderHiddenInput, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_show.Show, {
15
+ when: props.showIndicator,
16
+ children: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives.SliderDraggingIndicator, { direction: props.direction })
17
+ })]
18
+ }, `thumb:${num}`)
19
+ });
20
+ }
21
+ //#endregion
22
+ exports.SliderThumbs = SliderThumbs;
@@ -0,0 +1,9 @@
1
+ import { SliderProps } from './slider';
2
+ type SliderThumbsProps = {
3
+ value: SliderProps['value'] | SliderProps['defaultValue'];
4
+ direction?: SliderProps['orientation'];
5
+ usage?: SliderProps['usage'];
6
+ showIndicator?: SliderProps['showIndicator'];
7
+ };
8
+ export declare function SliderThumbs(props: SliderThumbsProps): import("react").JSX.Element;
9
+ export {};
@@ -0,0 +1,9 @@
1
+ import { SliderProps } from './slider';
2
+ type SliderThumbsProps = {
3
+ value: SliderProps['value'] | SliderProps['defaultValue'];
4
+ direction?: SliderProps['orientation'];
5
+ usage?: SliderProps['usage'];
6
+ showIndicator?: SliderProps['showIndicator'];
7
+ };
8
+ export declare function SliderThumbs(props: SliderThumbsProps): import("react").JSX.Element;
9
+ export {};
@@ -0,0 +1,22 @@
1
+ "use client";
2
+ import { Show } from "../show/show.js";
3
+ import { For } from "../for/for.js";
4
+ import { SliderDraggingIndicator, SliderHiddenInput, SliderThumb } from "./primitives.js";
5
+ import { jsx, jsxs } from "react/jsx-runtime";
6
+ //#region src/components/slider/thumbs.tsx
7
+ function SliderThumbs(props) {
8
+ return /* @__PURE__ */ jsx(For, {
9
+ each: props.value,
10
+ children: (num, idx) => /* @__PURE__ */ jsxs(SliderThumb, {
11
+ index: idx,
12
+ direction: props.direction,
13
+ usage: props.usage,
14
+ children: [/* @__PURE__ */ jsx(SliderHiddenInput, {}), /* @__PURE__ */ jsx(Show, {
15
+ when: props.showIndicator,
16
+ children: () => /* @__PURE__ */ jsx(SliderDraggingIndicator, { direction: props.direction })
17
+ })]
18
+ }, `thumb:${num}`)
19
+ });
20
+ }
21
+ //#endregion
22
+ export { SliderThumbs };
package/dist/index.cjs CHANGED
@@ -110,8 +110,8 @@ const require_parts$22 = require("./components/select/parts.cjs");
110
110
  const require_select = require("./components/select/select.cjs");
111
111
  const require_option = require("./components/select/option.cjs");
112
112
  const require_option_group = require("./components/select/option-group.cjs");
113
- const require_slider = require("./components/slider/slider.cjs");
114
113
  const require_primitives$29 = require("./components/slider/primitives.cjs");
114
+ const require_slider = require("./components/slider/slider.cjs");
115
115
  const require_button$2 = require("./components/split-button/button.cjs");
116
116
  const require_primitives$30 = require("./components/switch/primitives.cjs");
117
117
  const require_parts$23 = require("./components/switch/parts.cjs");
@@ -691,6 +691,15 @@ Object.defineProperty(exports, "SignaturePadRootProvider", {
691
691
  }
692
692
  });
693
693
  exports.Slider = require_slider.Slider;
694
+ exports.SliderControl = require_primitives$29.SliderControl;
695
+ exports.SliderDraggingIndicator = require_primitives$29.SliderDraggingIndicator;
696
+ exports.SliderHiddenInput = require_primitives$29.SliderHiddenInput;
697
+ exports.SliderLabel = require_primitives$29.SliderLabel;
698
+ exports.SliderMarker = require_primitives$29.SliderMarker;
699
+ exports.SliderMarkerGroup = require_primitives$29.SliderMarkerGroup;
700
+ exports.SliderMarkerIndicator = require_primitives$29.SliderMarkerIndicator;
701
+ exports.SliderProvider = require_primitives$29.SliderProvider;
702
+ exports.SliderRange = require_primitives$29.SliderRange;
694
703
  exports.SliderRoot = require_primitives$29.SliderRoot;
695
704
  Object.defineProperty(exports, "SliderRootProvider", {
696
705
  enumerable: true,
@@ -698,6 +707,9 @@ Object.defineProperty(exports, "SliderRootProvider", {
698
707
  return _ark_ui_react.SliderRootProvider;
699
708
  }
700
709
  });
710
+ exports.SliderThumb = require_primitives$29.SliderThumb;
711
+ exports.SliderTrack = require_primitives$29.SliderTrack;
712
+ exports.SliderValueText = require_primitives$29.SliderValueText;
701
713
  exports.Spinner = require_spinner.Spinner;
702
714
  exports.SplitButton = require_button$2.SplitButton;
703
715
  Object.defineProperty(exports, "SplitterRootProvider", {
package/dist/index.js CHANGED
@@ -111,8 +111,8 @@ import { SelectParts } from "./components/select/parts.js";
111
111
  import { Select } from "./components/select/select.js";
112
112
  import { Option } from "./components/select/option.js";
113
113
  import { OptionGroup, OptionGroupLabel } from "./components/select/option-group.js";
114
+ import { SliderControl, SliderDraggingIndicator, SliderHiddenInput, SliderLabel, SliderMarker, SliderMarkerGroup, SliderMarkerIndicator, SliderProvider, SliderRange, SliderRoot, SliderThumb, SliderTrack, SliderValueText } from "./components/slider/primitives.js";
114
115
  import { Slider } from "./components/slider/slider.js";
115
- import { SliderRoot } from "./components/slider/primitives.js";
116
116
  import { SplitButton } from "./components/split-button/button.js";
117
117
  import { SwitchControl, SwitchHiddenInput, SwitchLabel, SwitchRoot, SwitchThumb } from "./components/switch/primitives.js";
118
118
  import { SwitchParts } from "./components/switch/parts.js";
@@ -135,4 +135,4 @@ import { MODE_KEY, THEME_KEY, useTheme } from "./hooks/useTheme.js";
135
135
  import { ThemeProvider, useThemeContext } from "./context/theme.js";
136
136
  import { useRootColors } from "./hooks/useRootColors.js";
137
137
  import { AccordionRootProvider, AngleSliderRootProvider, AvatarRootProvider, CarouselRootProvider, CheckboxRootProvider, ClientOnly, ClipboardRootProvider, ColorPickerRootProvider, ComboboxRootProvider, DatePickerRootProvider, DialogRootProvider, DownloadTrigger, EditableRootProvider, EnvironmentProvider, FieldRootProvider, FieldsetRootProvider, FileUploadRootProvider, FloatingPanelRootProvider, FocusTrap, Format, Frame, Highlight, HoverCardRootProvider, ImageCropperRootProvider, JsonTreeView, ListboxRootProvider, LocaleProvider, MenuRootProvider, NumberInputRootProvider, PasswordInputRootProvider, PinInputRootProvider, PopoverRootProvider, Presence, QrCodeRootProvider, RadioGroupRootProvider, RatingGroupRootProvider, ScrollAreaRootProvider, SegmentGroupRootProvider, SelectRootProvider, SignaturePadRootProvider, SliderRootProvider, SplitterRootProvider, StepsRootProvider, SwitchRootProvider, TabsRootProvider, TagsInputRootProvider, TimerRootProvider, Toaster, ToggleContext, ToggleGroupRootProvider, TooltipRootProvider, TreeViewNodeProvider, TreeViewRootProvider, createListCollection, createToaster, useAccordion, useAngleSlider, useAsyncList, useAvatar, useCarousel, useCheckbox, useClipboard, useCollapsible, useCollapsibleContext, useColorPicker, useCombobox, useComboboxContext, useDatePicker, useDialog, useEditable, useEnvironmentContext, useField, useFieldset, useFileUpload, useFilter, useFloatingPanel, useHoverCard, useImageCropper, useJsonTreeView, useListCollection, useListbox, useLocaleContext, useMarquee, useMenu, useNumberInput, usePagination, usePaginationContext, usePasswordInput, usePinInput, usePopover, useQrCode, useRadioGroup, useRatingGroup, useScrollArea, useSegmentGroup, useSelect, useSignaturePad, useSlider, useSplitter, useSteps, useSwitch, useTabs, useTagsInput, useTimer, useToggle, useToggleContext, useToggleGroup, useToggleGroupContext, useTooltip, useTour, useTourContext, useTreeView, useTreeViewNodeContext } from "./index.client.js";
138
- export { Accordion, AccordionItem, AccordionItemContent, AccordionItemGroup, AccordionItemIndicator, AccordionItemTrigger, AccordionParts, AccordionRoot, AccordionRootProvider, Admonition, AdmonitionContent, AdmonitionDescription, AdmonitionHeading, AdmonitionIndicator, AdmonitionParts, AdmonitionRoot, AngleSliderRootProvider, Avatar, AvatarFallback, AvatarImage, AvatarParts, AvatarRoot, AvatarRootProvider, Button, ButtonGroup, ButtonIcon, ButtonParts, CTAModal, CalendarDate, Caption, Carousel, CarouselControl, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup, CarouselNextTrigger, CarouselParts, CarouselPrevTrigger, CarouselRoot, CarouselRootProvider, CerberusProvider, Checkbox, CheckboxControl, CheckboxGroup, CheckboxHiddenInput, CheckboxIndicator, CheckboxLabel, CheckboxParts, CheckboxRoot, CheckboxRootProvider, CircularProgress, CircularProgressCircle, CircularProgressCircleRange, CircularProgressCircleTrack, CircularProgressInfoGroup, CircularProgressLabel, CircularProgressRoot, CircularProgressValueText, ClientOnly, Clipboard, ClipboardContext, ClipboardControl, ClipboardIndicator, ClipboardInput, ClipboardLabel, ClipboardRoot, ClipboardRootProvider, ClipboardTrigger, Collapsible, CollapsibleContent, CollapsibleIndicator, CollapsibleRoot, CollapsibleRootProvider, CollapsibleTrigger, ColorPickerRootProvider, ComboItemGroup, ComboItemText, ComboItemWithIndicator, Combobox, ComboboxClearTrigger, ComboboxContent, ComboboxContext, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxItemGroup, ComboboxItemGroupLabel, ComboboxItemIndicator, ComboboxItemText, ComboboxLabel, ComboboxParts, ComboboxPositioner, ComboboxRoot, ComboboxRootProvider, ComboboxStartIcon, ComboboxTrigger, CompactText, ConfirmModal, DateFormatter, DatePicker, DatePickerCalendar, DatePickerClearTrigger, DatePickerContent, DatePickerContext, DatePickerControl, DatePickerInput, DatePickerInputEl, DatePickerLabel, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerParts, DatePickerPositioner, DatePickerPrevTrigger, DatePickerRangeText, DatePickerRoot, DatePickerRootProvider, DatePickerTable, DatePickerTableBody, DatePickerTableCell, DatePickerTableCellTrigger, DatePickerTableHead, DatePickerTableHeader, DatePickerTableRow, DatePickerTrigger, DatePickerView, DatePickerViewControl, DatePickerViewTrigger, DatePickerYearSelect, Dialog, DialogBackdrop, DialogCloseIconTrigger, DialogCloseTrigger, DialogContent, DialogContext, DialogDescription, DialogHeading, DialogParts, DialogPositioner, DialogProvider, DialogRoot, DialogRootProvider, DialogTrigger, DownloadTrigger, EditableRootProvider, EnvironmentProvider, FeatureFlag, FeatureFlags, Field, FieldErrorText, FieldHelperText, FieldInput, FieldInputRoot, FieldLabel, FieldParts, FieldRequiredIndicator, FieldRoot, FieldRootProvider, FieldStartIndicator, FieldStatusIndicator, FieldTextarea, Fieldset, FieldsetErrorText, FieldsetHelperText, FieldsetLegend, FieldsetParts, FieldsetRoot, FieldsetRootProvider, FileStatus, FileUploadClearTrigger, FileUploadContent, FileUploadContext, FileUploadDescription, FileUploadDropzone, FileUploadHeading, FileUploadHiddenInput, FileUploadIcon, FileUploadItem, FileUploadItemDeleteTrigger, FileUploadItemGroup, FileUploadItemName, FileUploadItemPreview, FileUploadItemPreviewImage, FileUploadItemSizeText, FileUploadLabel, FileUploadParts, FileUploadRoot, FileUploadRootProvider, FileUploadTrigger, FileUploader, FloatingPanelRootProvider, FocusTrap, For, Format, Frame, Group, Highlight, HoverCardRootProvider, IconButton, IconButtonRoot, ImageCropperRootProvider, ImgPreview, Input, ItemList, JsonTreeView, ListboxRootProvider, LocaleProvider, MODE_KEY, Marquee, MarqueeContent, MarqueeEdge, MarqueeItem, MarqueeRoot, MarqueeRootProvider, MarqueeViewport, Menu, MenuContent, MenuContentEl, MenuGroupLabel, MenuIndicator, MenuItem, MenuItemEl, MenuItemGroup, MenuItemGroupEl, MenuItemGroupLabelEl, MenuPositioner, MenuRoot, MenuRootProvider, MenuSeparator, MenuSeparatorEl, MenuTrigger, MenuTriggerEl, MenuTriggerItem, NavMenu, NextTrigger, NotificationActionTrigger, NotificationCenter, NotificationCloseTrigger, NotificationDescription, NotificationHeading, NotificationParts, NotificationProvider, NotificationRoot, NumberInput, NumberInputControl, NumberInputDecrementTrigger, NumberInputIncrementTrigger, NumberInputInput, NumberInputLabel, NumberInputParts, NumberInputRoot, NumberInputRootProvider, NumberInputScrubber, Option, OptionGroup, OptionGroupLabel, Pagination, PaginationContext, PaginationEllipsis, PaginationItem, PaginationNextTrigger, PaginationParts, PaginationPrevTrigger, PaginationRoot, PaginationRootProvider, PasswordInputRootProvider, PinInput, PinInputControl, PinInputHiddenInput, PinInputInput, PinInputLabel, PinInputParts, PinInputRoot, PinInputRootProvider, Popover, PopoverAnchor, PopoverArrow, PopoverArrowTip, PopoverBody, PopoverCloseTrigger, PopoverContent, PopoverDescription, PopoverFooter, PopoverHeader, PopoverParts, PopoverPositioner, PopoverRoot, PopoverRootProvider, PopoverTitle, PopoverTrigger, Portal, Presence, PrevTrigger, ProgressBar, ProgressBarBar, ProgressBarRoot, PromptModal, QrCodeRootProvider, Radio, RadioGroup, RadioGroupIndicator, RadioGroupItem, RadioGroupItemControl, RadioGroupItemHiddenInput, RadioGroupItemText, RadioGroupLabel, RadioGroupRoot, RadioGroupRootProvider, RadioParts, RangePickerInput, Rating, RatingContext, RatingControl, RatingGroupRootProvider, RatingHiddenInput, RatingItem, RatingItemContext, RatingLabel, RatingParts, RatingRoot, ScrollAreaRootProvider, SegmentGroupRootProvider, Select, SelectClearTrigger, SelectContent, SelectControl, SelectHiddenSelect, SelectIndicator, SelectItem, SelectItemGroup, SelectItemGroupLabel, SelectItemIndicator, SelectItemText, SelectLabel, SelectParts, SelectPositioner, SelectRoot, SelectRootProvider, SelectTrigger, SelectValueText, Show, SignaturePadRootProvider, Slider, SliderRoot, SliderRootProvider, Spinner, SplitButton, SplitterRootProvider, StepsRootProvider, Switch, SwitchControl, SwitchHiddenInput, SwitchLabel, SwitchParts, SwitchRoot, SwitchRootProvider, SwitchThumb, THEME_KEY, Table, TableEl, TableParts, TableRoot, TableTrigger, Tabs, TabsContent, TabsIndicator, TabsList, TabsParts, TabsRoot, TabsRootProvider, TabsTrigger, Tag, TagRoot, TagsInputRootProvider, Tbody, Td, Text, Textarea, Tfoot, Th, Thead, Theme, ThemeProvider, TimerRootProvider, Toaster, ToggleContext, ToggleGroupRootProvider, ToggleIndicator, ToggleParts, ToggleRoot, Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipParts, TooltipPositioner, TooltipRoot, TooltipRootProvider, TooltipTrigger, Tr, TreeViewNodeProvider, TreeViewRootProvider, cerberus, createCTAModalActions, createCerberusPrimitive, createErrorMessages, createListCollection, createSelectCollection, createToaster, defineIcons, formatNotifyCount, getLocalStorage, getLocalTimeZone, makeSystemConfig, parseDate, processStatus, setLocalStorage, splitProps, toaster, today, useAccordion, useAngleSlider, useAsyncList, useAvatar, useAvatarContext, useCTAModal, useCarousel, useCerberusContext, useCheckbox, useClipboard, useCollapsible, useCollapsibleContext, useColorPicker, useCombobox, useComboboxContext, useConfirmModal, useDatePicker, useDialog, useEditable, useEnvironmentContext, useFeatureFlags, useField, useFieldset, useFileUpload, useFilter, useFloatingPanel, useHoverCard, useImageCropper, useJsonTreeView, useListCollection, useListbox, useLocaleContext, useMarquee, useMenu, useNavMenuContext, useNumberInput, usePagination, usePaginationContext, usePasswordInput, usePinInput, usePopover, usePromptModal, useQrCode, useRadioGroup, useRatingGroup, useRootColors, useScrollArea, useSegmentGroup, useSelect, useSignaturePad, useSlider, useSplitter, useStatefulCollection, useSteps, useSwitch, useTabs, useTagsInput, useTheme, useThemeContext, useTimer, useToggle, useToggleContext, useToggleGroup, useToggleGroupContext, useTooltip, useTour, useTourContext, useTreeView, useTreeViewNodeContext };
138
+ export { Accordion, AccordionItem, AccordionItemContent, AccordionItemGroup, AccordionItemIndicator, AccordionItemTrigger, AccordionParts, AccordionRoot, AccordionRootProvider, Admonition, AdmonitionContent, AdmonitionDescription, AdmonitionHeading, AdmonitionIndicator, AdmonitionParts, AdmonitionRoot, AngleSliderRootProvider, Avatar, AvatarFallback, AvatarImage, AvatarParts, AvatarRoot, AvatarRootProvider, Button, ButtonGroup, ButtonIcon, ButtonParts, CTAModal, CalendarDate, Caption, Carousel, CarouselControl, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup, CarouselNextTrigger, CarouselParts, CarouselPrevTrigger, CarouselRoot, CarouselRootProvider, CerberusProvider, Checkbox, CheckboxControl, CheckboxGroup, CheckboxHiddenInput, CheckboxIndicator, CheckboxLabel, CheckboxParts, CheckboxRoot, CheckboxRootProvider, CircularProgress, CircularProgressCircle, CircularProgressCircleRange, CircularProgressCircleTrack, CircularProgressInfoGroup, CircularProgressLabel, CircularProgressRoot, CircularProgressValueText, ClientOnly, Clipboard, ClipboardContext, ClipboardControl, ClipboardIndicator, ClipboardInput, ClipboardLabel, ClipboardRoot, ClipboardRootProvider, ClipboardTrigger, Collapsible, CollapsibleContent, CollapsibleIndicator, CollapsibleRoot, CollapsibleRootProvider, CollapsibleTrigger, ColorPickerRootProvider, ComboItemGroup, ComboItemText, ComboItemWithIndicator, Combobox, ComboboxClearTrigger, ComboboxContent, ComboboxContext, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxItemGroup, ComboboxItemGroupLabel, ComboboxItemIndicator, ComboboxItemText, ComboboxLabel, ComboboxParts, ComboboxPositioner, ComboboxRoot, ComboboxRootProvider, ComboboxStartIcon, ComboboxTrigger, CompactText, ConfirmModal, DateFormatter, DatePicker, DatePickerCalendar, DatePickerClearTrigger, DatePickerContent, DatePickerContext, DatePickerControl, DatePickerInput, DatePickerInputEl, DatePickerLabel, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerParts, DatePickerPositioner, DatePickerPrevTrigger, DatePickerRangeText, DatePickerRoot, DatePickerRootProvider, DatePickerTable, DatePickerTableBody, DatePickerTableCell, DatePickerTableCellTrigger, DatePickerTableHead, DatePickerTableHeader, DatePickerTableRow, DatePickerTrigger, DatePickerView, DatePickerViewControl, DatePickerViewTrigger, DatePickerYearSelect, Dialog, DialogBackdrop, DialogCloseIconTrigger, DialogCloseTrigger, DialogContent, DialogContext, DialogDescription, DialogHeading, DialogParts, DialogPositioner, DialogProvider, DialogRoot, DialogRootProvider, DialogTrigger, DownloadTrigger, EditableRootProvider, EnvironmentProvider, FeatureFlag, FeatureFlags, Field, FieldErrorText, FieldHelperText, FieldInput, FieldInputRoot, FieldLabel, FieldParts, FieldRequiredIndicator, FieldRoot, FieldRootProvider, FieldStartIndicator, FieldStatusIndicator, FieldTextarea, Fieldset, FieldsetErrorText, FieldsetHelperText, FieldsetLegend, FieldsetParts, FieldsetRoot, FieldsetRootProvider, FileStatus, FileUploadClearTrigger, FileUploadContent, FileUploadContext, FileUploadDescription, FileUploadDropzone, FileUploadHeading, FileUploadHiddenInput, FileUploadIcon, FileUploadItem, FileUploadItemDeleteTrigger, FileUploadItemGroup, FileUploadItemName, FileUploadItemPreview, FileUploadItemPreviewImage, FileUploadItemSizeText, FileUploadLabel, FileUploadParts, FileUploadRoot, FileUploadRootProvider, FileUploadTrigger, FileUploader, FloatingPanelRootProvider, FocusTrap, For, Format, Frame, Group, Highlight, HoverCardRootProvider, IconButton, IconButtonRoot, ImageCropperRootProvider, ImgPreview, Input, ItemList, JsonTreeView, ListboxRootProvider, LocaleProvider, MODE_KEY, Marquee, MarqueeContent, MarqueeEdge, MarqueeItem, MarqueeRoot, MarqueeRootProvider, MarqueeViewport, Menu, MenuContent, MenuContentEl, MenuGroupLabel, MenuIndicator, MenuItem, MenuItemEl, MenuItemGroup, MenuItemGroupEl, MenuItemGroupLabelEl, MenuPositioner, MenuRoot, MenuRootProvider, MenuSeparator, MenuSeparatorEl, MenuTrigger, MenuTriggerEl, MenuTriggerItem, NavMenu, NextTrigger, NotificationActionTrigger, NotificationCenter, NotificationCloseTrigger, NotificationDescription, NotificationHeading, NotificationParts, NotificationProvider, NotificationRoot, NumberInput, NumberInputControl, NumberInputDecrementTrigger, NumberInputIncrementTrigger, NumberInputInput, NumberInputLabel, NumberInputParts, NumberInputRoot, NumberInputRootProvider, NumberInputScrubber, Option, OptionGroup, OptionGroupLabel, Pagination, PaginationContext, PaginationEllipsis, PaginationItem, PaginationNextTrigger, PaginationParts, PaginationPrevTrigger, PaginationRoot, PaginationRootProvider, PasswordInputRootProvider, PinInput, PinInputControl, PinInputHiddenInput, PinInputInput, PinInputLabel, PinInputParts, PinInputRoot, PinInputRootProvider, Popover, PopoverAnchor, PopoverArrow, PopoverArrowTip, PopoverBody, PopoverCloseTrigger, PopoverContent, PopoverDescription, PopoverFooter, PopoverHeader, PopoverParts, PopoverPositioner, PopoverRoot, PopoverRootProvider, PopoverTitle, PopoverTrigger, Portal, Presence, PrevTrigger, ProgressBar, ProgressBarBar, ProgressBarRoot, PromptModal, QrCodeRootProvider, Radio, RadioGroup, RadioGroupIndicator, RadioGroupItem, RadioGroupItemControl, RadioGroupItemHiddenInput, RadioGroupItemText, RadioGroupLabel, RadioGroupRoot, RadioGroupRootProvider, RadioParts, RangePickerInput, Rating, RatingContext, RatingControl, RatingGroupRootProvider, RatingHiddenInput, RatingItem, RatingItemContext, RatingLabel, RatingParts, RatingRoot, ScrollAreaRootProvider, SegmentGroupRootProvider, Select, SelectClearTrigger, SelectContent, SelectControl, SelectHiddenSelect, SelectIndicator, SelectItem, SelectItemGroup, SelectItemGroupLabel, SelectItemIndicator, SelectItemText, SelectLabel, SelectParts, SelectPositioner, SelectRoot, SelectRootProvider, SelectTrigger, SelectValueText, Show, SignaturePadRootProvider, Slider, SliderControl, SliderDraggingIndicator, SliderHiddenInput, SliderLabel, SliderMarker, SliderMarkerGroup, SliderMarkerIndicator, SliderProvider, SliderRange, SliderRoot, SliderRootProvider, SliderThumb, SliderTrack, SliderValueText, Spinner, SplitButton, SplitterRootProvider, StepsRootProvider, Switch, SwitchControl, SwitchHiddenInput, SwitchLabel, SwitchParts, SwitchRoot, SwitchRootProvider, SwitchThumb, THEME_KEY, Table, TableEl, TableParts, TableRoot, TableTrigger, Tabs, TabsContent, TabsIndicator, TabsList, TabsParts, TabsRoot, TabsRootProvider, TabsTrigger, Tag, TagRoot, TagsInputRootProvider, Tbody, Td, Text, Textarea, Tfoot, Th, Thead, Theme, ThemeProvider, TimerRootProvider, Toaster, ToggleContext, ToggleGroupRootProvider, ToggleIndicator, ToggleParts, ToggleRoot, Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipParts, TooltipPositioner, TooltipRoot, TooltipRootProvider, TooltipTrigger, Tr, TreeViewNodeProvider, TreeViewRootProvider, cerberus, createCTAModalActions, createCerberusPrimitive, createErrorMessages, createListCollection, createSelectCollection, createToaster, defineIcons, formatNotifyCount, getLocalStorage, getLocalTimeZone, makeSystemConfig, parseDate, processStatus, setLocalStorage, splitProps, toaster, today, useAccordion, useAngleSlider, useAsyncList, useAvatar, useAvatarContext, useCTAModal, useCarousel, useCerberusContext, useCheckbox, useClipboard, useCollapsible, useCollapsibleContext, useColorPicker, useCombobox, useComboboxContext, useConfirmModal, useDatePicker, useDialog, useEditable, useEnvironmentContext, useFeatureFlags, useField, useFieldset, useFileUpload, useFilter, useFloatingPanel, useHoverCard, useImageCropper, useJsonTreeView, useListCollection, useListbox, useLocaleContext, useMarquee, useMenu, useNavMenuContext, useNumberInput, usePagination, usePaginationContext, usePasswordInput, usePinInput, usePopover, usePromptModal, useQrCode, useRadioGroup, useRatingGroup, useRootColors, useScrollArea, useSegmentGroup, useSelect, useSignaturePad, useSlider, useSplitter, useStatefulCollection, useSteps, useSwitch, useTabs, useTagsInput, useTheme, useThemeContext, useTimer, useToggle, useToggleContext, useToggleGroup, useToggleGroupContext, useTooltip, useTour, useTourContext, useTreeView, useTreeViewNodeContext };
@@ -268,6 +268,21 @@
268
268
  "orientation]___[value:vertical]___[recipe:radioGroup",
269
269
  "size]___[value:md]___[recipe:radioGroup"
270
270
  ],
271
+ "slider": [
272
+ "palette]___[value:action]___[recipe:slider",
273
+ "size]___[value:lg]___[recipe:slider",
274
+ "direction]___[value:horizontal]___[recipe:slider",
275
+ "usage]___[value:gradient]___[recipe:slider",
276
+ "palette]___[value:info]___[recipe:slider",
277
+ "palette]___[value:success]___[recipe:slider",
278
+ "palette]___[value:warning]___[recipe:slider",
279
+ "palette]___[value:danger]___[recipe:slider",
280
+ "size]___[value:sm]___[recipe:slider",
281
+ "size]___[value:md]___[recipe:slider",
282
+ "usage]___[value:filled]___[recipe:slider",
283
+ "usage]___[value:outlined]___[recipe:slider",
284
+ "direction]___[value:vertical]___[recipe:slider"
285
+ ],
271
286
  "buttonGroup": [
272
287
  "layout]___[value:attached]___[recipe:buttonGroup",
273
288
  "shape]___[value:sharp]___[recipe:buttonGroup",
@@ -357,7 +372,6 @@
357
372
  "size]___[value:sm]___[recipe:select",
358
373
  "size]___[value:lg]___[recipe:select"
359
374
  ],
360
- "slider": [],
361
375
  "switchRecipe": [
362
376
  "size]___[value:sm]___[recipe:switchRecipe",
363
377
  "size]___[value:lg]___[recipe:switchRecipe"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cerberus-design/react",
3
- "version": "1.6.0-next-682fbb6",
3
+ "version": "1.7.0-next-5cce1d3",
4
4
  "description": "The Cerberus Design React component library.",
5
5
  "keywords": [
6
6
  "css",
@@ -46,8 +46,8 @@
46
46
  "react-dom": "^19.2.7",
47
47
  "vite": "^8.0.16",
48
48
  "vite-plugin-dts": "^5.0.2",
49
- "@cerberus/panda-preset": "1.6.0-next-682fbb6",
50
- "styled-system": "0.0.0"
49
+ "styled-system": "0.0.0",
50
+ "@cerberus/panda-preset": "1.7.0-next-5cce1d3"
51
51
  },
52
52
  "peerDependencies": {
53
53
  "@pandacss/dev": "*",