@spark-ui/components 11.1.0 → 11.1.1

package/dist/skeleton/index.d.ts

@@ -0,0 +1,67 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { PropsWithChildren, ComponentPropsWithRef } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+
+declare const skeletonStyles: (props?: ({
+    isAnimated?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SkeletonStyleProps = ExcludeNull<VariantProps<typeof skeletonStyles>>;
+
+interface SkeletonProps extends ComponentPropsWithRef<'div'>, SkeletonStyleProps {
+    /**
+     * Displays an animated light effect.
+     * @default true
+     */
+    isAnimated?: boolean;
+    /**
+     * Adds an accessible fallback label.
+     */
+    label?: string;
+}
+declare const Skeleton$1: {
+    ({ isAnimated, label, className, children, ref: forwardedRef, ...rest }: PropsWithChildren<SkeletonProps>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const skeletonItemStyles: (props?: ({
+    shape?: "circle" | "line" | "rectangle" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SkeletonItemStyleProps = ExcludeNull<VariantProps<typeof skeletonItemStyles>>;
+
+interface SkeletonItemProps extends ComponentPropsWithRef<'div'>, SkeletonItemStyleProps {
+}
+type SkeletonRectangleProps = Omit<SkeletonItemProps, 'shape'> & {
+    width?: string | number;
+    height?: string | number;
+};
+type SkeletonCircleProps = Omit<SkeletonItemProps, 'shape'> & {
+    size: string | number;
+};
+type SkeletonLineProps = Omit<SkeletonItemProps, 'shape'> & {
+    lines?: number;
+    /**
+     * Sets the gaps between group items.
+     */
+    gap?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
+};
+declare const SkeletonRectangle: {
+    ({ width, height, ...rest }: SkeletonRectangleProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+declare const SkeletonCircle: {
+    ({ size, ...rest }: SkeletonCircleProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+declare const SkeletonLine: {
+    ({ lines, gap: gapProp, className, ...rest }: SkeletonLineProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Skeleton: typeof Skeleton$1 & {
+    Circle: typeof SkeletonCircle;
+    Line: typeof SkeletonLine;
+    Rectangle: typeof SkeletonRectangle;
+};
+
+export { Skeleton, type SkeletonProps };

package/dist/skeleton/index.js

@@ -0,0 +1,206 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/skeleton/index.ts
+var skeleton_exports = {};
+__export(skeleton_exports, {
+  Skeleton: () => Skeleton2
+});
+module.exports = __toCommonJS(skeleton_exports);
+
+// src/slot/Slot.tsx
+var import_radix_ui = require("radix-ui");
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var Slottable = import_radix_ui.Slot.Slottable;
+var Slot = ({ ref, ...props }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Slot.Root, { ref, ...props });
+};
+
+// src/visually-hidden/VisuallyHidden.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var VisuallyHidden = ({ asChild = false, ref, ...props }) => {
+  const Component = asChild ? Slot : "span";
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    Component,
+    {
+      ...props,
+      ref,
+      style: {
+        // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
+        position: "absolute",
+        border: 0,
+        width: 1,
+        height: 1,
+        padding: 0,
+        margin: -1,
+        overflow: "hidden",
+        clip: "rect(0, 0, 0, 0)",
+        whiteSpace: "nowrap",
+        wordWrap: "normal",
+        ...props.style
+      }
+    }
+  );
+};
+VisuallyHidden.displayName = "VisuallyHidden";
+
+// src/skeleton/Skeleton.styles.ts
+var import_class_variance_authority = require("class-variance-authority");
+var skeletonStyles = (0, import_class_variance_authority.cva)([], {
+  variants: {
+    isAnimated: {
+      true: [
+        "[mask-image:linear-gradient(90deg,#000_40%,rgba(0,0,0,.3)_60%,#000_100%)]",
+        "[mask-size:200%_100%]",
+        "animate-standalone-shimmer motion-reduce:animate-none!"
+      ],
+      false: []
+    }
+  },
+  defaultVariants: {
+    isAnimated: true
+  }
+});
+
+// src/skeleton/Skeleton.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var Skeleton = ({
+  isAnimated = true,
+  label,
+  className,
+  children,
+  ref: forwardedRef,
+  ...rest
+}) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+  "div",
+  {
+    ref: forwardedRef,
+    "data-spark-component": "skeleton",
+    role: "presentation",
+    className: skeletonStyles({ isAnimated, className }),
+    ...rest,
+    children: [
+      children,
+      label && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(VisuallyHidden, { children: label })
+    ]
+  }
+);
+Skeleton.displayName = "Skeleton";
+
+// src/skeleton/SkeletonItem.styles.ts
+var import_class_variance_authority2 = require("class-variance-authority");
+var skeletonItemStyles = (0, import_class_variance_authority2.cva)(["bg-neutral/dim-4", "min-h-lg min-w-lg"], {
+  variants: {
+    shape: {
+      line: ["w-full [&:last-child:not(:first-child)]:w-5/6", "rounded-lg"],
+      rectangle: ["rounded-sm"],
+      circle: ["flex-none", "rounded-full"]
+    }
+  },
+  defaultVariants: {
+    shape: "rectangle"
+  }
+});
+var skeletonLineStyles = (0, import_class_variance_authority2.cva)(["flex flex-col", "w-full"], {
+  variants: {
+    gap: {
+      sm: "gap-sm",
+      md: "gap-md",
+      lg: "gap-lg",
+      xl: "gap-xl",
+      "2xl": "gap-2xl",
+      "3xl": "gap-3xl"
+    }
+  },
+  defaultVariants: {
+    gap: "md"
+  }
+});
+
+// src/skeleton/SkeletonItem.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var getSizeValue = (size) => {
+  if (typeof size === "number") return `${size}px`;
+  return size;
+};
+var SkeletonItem = ({ shape, className, ref: forwardedRef, ...rest }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "div",
+    {
+      ref: forwardedRef,
+      "aria-hidden": "true",
+      className: skeletonItemStyles({ shape, className }),
+      ...rest
+    }
+  );
+};
+var SkeletonRectangle = ({ width = "100%", height, ...rest }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    SkeletonItem,
+    {
+      style: {
+        "--skeleton-rect-width": getSizeValue(width),
+        "--skeleton-rect-height": getSizeValue(height)
+      },
+      className: "h-(--skeleton-rect-height) w-(--skeleton-rect-width)",
+      ...rest,
+      shape: "rectangle",
+      "data-shape": "rectangle"
+    }
+  );
+};
+var SkeletonCircle = ({ size, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  SkeletonItem,
+  {
+    style: { "--skeleton-circle-size": getSizeValue(size) },
+    className: "size-(--skeleton-circle-size)",
+    ...rest,
+    shape: "circle",
+    "data-shape": "circle"
+  }
+);
+var SkeletonLine = ({
+  lines = 1,
+  gap: gapProp,
+  className,
+  ...rest
+}) => {
+  const gap = gapProp || "md";
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: skeletonLineStyles({ gap, className }), "aria-hidden": "true", children: [...new Array(lines)].map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SkeletonItem, { ...rest, shape: "line", "data-shape": "line" }, `line_${index}`)) });
+};
+SkeletonRectangle.displayName = "Skeleton.Rectangle";
+SkeletonCircle.displayName = "Skeleton.Circle";
+SkeletonLine.displayName = "Skeleton.Line";
+
+// src/skeleton/index.ts
+var Skeleton2 = Object.assign(Skeleton, {
+  Circle: SkeletonCircle,
+  Line: SkeletonLine,
+  Rectangle: SkeletonRectangle
+});
+Skeleton2.displayName = "Skeleton";
+SkeletonLine.displayName = "Skeleton.Line";
+SkeletonCircle.displayName = "Skeleton.Circle";
+SkeletonRectangle.displayName = "Skeleton.Rectangle";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Skeleton
+});
+//# sourceMappingURL=index.js.map

package/dist/skeleton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/skeleton/index.ts","../../src/slot/Slot.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/skeleton/Skeleton.styles.ts","../../src/skeleton/Skeleton.tsx","../../src/skeleton/SkeletonItem.styles.ts","../../src/skeleton/SkeletonItem.tsx"],"sourcesContent":["import { Skeleton as Root } from './Skeleton'\nimport {\n  SkeletonCircle as Circle,\n  SkeletonLine as Line,\n  SkeletonRectangle as Rectangle,\n} from './SkeletonItem'\n\nexport const Skeleton: typeof Root & {\n  Circle: typeof Circle\n  Line: typeof Line\n  Rectangle: typeof Rectangle\n} = Object.assign(Root, {\n  Circle,\n  Line,\n  Rectangle,\n})\n\nSkeleton.displayName = 'Skeleton'\nLine.displayName = 'Skeleton.Line'\nCircle.displayName = 'Skeleton.Circle'\nRectangle.displayName = 'Skeleton.Rectangle'\n\nexport type { SkeletonProps } from './Skeleton'\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n  cloneElement,\n  HTMLAttributes,\n  isValidElement,\n  PropsWithChildren,\n  ReactNode,\n  Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n  return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n  asChild: boolean | undefined,\n  children: ReactNode,\n  callback: (children: ReactNode) => ReactNode\n) => {\n  if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n  return isValidElement(children)\n    ? cloneElement(\n        children,\n        undefined,\n        callback((children.props as { children: ReactNode }).children)\n      )\n    : null\n}\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n  const Component = asChild ? Slot : 'span'\n\n  return (\n    <Component\n      {...props}\n      ref={ref}\n      style={{\n        // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n        position: 'absolute',\n        border: 0,\n        width: 1,\n        height: 1,\n        padding: 0,\n        margin: -1,\n        overflow: 'hidden',\n        clip: 'rect(0, 0, 0, 0)',\n        whiteSpace: 'nowrap',\n        wordWrap: 'normal',\n        ...props.style,\n      }}\n    />\n  )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const skeletonStyles = cva([], {\n  variants: {\n    isAnimated: {\n      true: [\n        '[mask-image:linear-gradient(90deg,#000_40%,rgba(0,0,0,.3)_60%,#000_100%)]',\n        '[mask-size:200%_100%]',\n        'animate-standalone-shimmer motion-reduce:animate-none!',\n      ],\n      false: [],\n    },\n  },\n  defaultVariants: {\n    isAnimated: true,\n  },\n})\n\nexport type SkeletonStyleProps = ExcludeNull<VariantProps<typeof skeletonStyles>>\n","import { ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { type SkeletonStyleProps, skeletonStyles } from './Skeleton.styles'\n\nexport interface SkeletonProps extends ComponentPropsWithRef<'div'>, SkeletonStyleProps {\n  /**\n   * Displays an animated light effect.\n   * @default true\n   */\n  isAnimated?: boolean\n  /**\n   * Adds an accessible fallback label.\n   */\n  label?: string\n}\n\nexport const Skeleton = ({\n  isAnimated = true,\n  label,\n  className,\n  children,\n  ref: forwardedRef,\n  ...rest\n}: PropsWithChildren<SkeletonProps>) => (\n  <div\n    ref={forwardedRef}\n    data-spark-component=\"skeleton\"\n    role=\"presentation\"\n    className={skeletonStyles({ isAnimated, className })}\n    {...rest}\n  >\n    {children}\n\n    {label && <VisuallyHidden>{label}</VisuallyHidden>}\n  </div>\n)\n\nSkeleton.displayName = 'Skeleton'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const skeletonItemStyles = cva(['bg-neutral/dim-4', 'min-h-lg min-w-lg'], {\n  variants: {\n    shape: {\n      line: ['w-full [&:last-child:not(:first-child)]:w-5/6', 'rounded-lg'],\n      rectangle: ['rounded-sm'],\n      circle: ['flex-none', 'rounded-full'],\n    },\n  },\n  defaultVariants: {\n    shape: 'rectangle',\n  },\n})\n\nexport const skeletonLineStyles = cva(['flex flex-col', 'w-full'], {\n  variants: {\n    gap: {\n      sm: 'gap-sm',\n      md: 'gap-md',\n      lg: 'gap-lg',\n      xl: 'gap-xl',\n      '2xl': 'gap-2xl',\n      '3xl': 'gap-3xl',\n    },\n  },\n  defaultVariants: {\n    gap: 'md',\n  },\n})\n\nexport type SkeletonItemStyleProps = ExcludeNull<VariantProps<typeof skeletonItemStyles>>\n","import { ComponentPropsWithRef, CSSProperties } from 'react'\n\nimport {\n  type SkeletonItemStyleProps,\n  skeletonItemStyles,\n  skeletonLineStyles,\n} from './SkeletonItem.styles'\n\ninterface SkeletonItemProps extends ComponentPropsWithRef<'div'>, SkeletonItemStyleProps {}\n\nexport type SkeletonRectangleProps = Omit<SkeletonItemProps, 'shape'> & {\n  width?: string | number\n  height?: string | number\n}\nexport type SkeletonCircleProps = Omit<SkeletonItemProps, 'shape'> & { size: string | number }\nexport type SkeletonLineProps = Omit<SkeletonItemProps, 'shape'> & {\n  lines?: number\n  /**\n   * Sets the gaps between group items.\n   */\n  gap?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl'\n}\n\nconst getSizeValue = (size?: number | string): string | undefined => {\n  if (typeof size === 'number') return `${size}px`\n\n  return size\n}\n\nconst SkeletonItem = ({ shape, className, ref: forwardedRef, ...rest }: SkeletonItemProps) => {\n  return (\n    <div\n      ref={forwardedRef}\n      aria-hidden=\"true\"\n      className={skeletonItemStyles({ shape, className })}\n      {...rest}\n    />\n  )\n}\n\nexport const SkeletonRectangle = ({ width = '100%', height, ...rest }: SkeletonRectangleProps) => {\n  return (\n    <SkeletonItem\n      style={\n        {\n          '--skeleton-rect-width': getSizeValue(width),\n          '--skeleton-rect-height': getSizeValue(height),\n        } as CSSProperties\n      }\n      className=\"h-(--skeleton-rect-height) w-(--skeleton-rect-width)\"\n      {...rest}\n      shape=\"rectangle\"\n      data-shape=\"rectangle\"\n    />\n  )\n}\n\nexport const SkeletonCircle = ({ size, ...rest }: SkeletonCircleProps) => (\n  <SkeletonItem\n    style={{ '--skeleton-circle-size': getSizeValue(size) } as CSSProperties}\n    className=\"size-(--skeleton-circle-size)\"\n    {...rest}\n    shape=\"circle\"\n    data-shape=\"circle\"\n  />\n)\n\nexport const SkeletonLine = ({\n  lines = 1,\n  gap: gapProp,\n  className,\n  ...rest\n}: SkeletonLineProps) => {\n  const gap = gapProp || 'md'\n\n  return (\n    <div className={skeletonLineStyles({ gap, className })} aria-hidden=\"true\">\n      {[...new Array(lines)].map((_, index) => (\n        <SkeletonItem key={`line_${index}`} {...rest} shape=\"line\" data-shape=\"line\" />\n      ))}\n    </div>\n  )\n}\n\nSkeletonRectangle.displayName = 'Skeleton.Rectangle'\nSkeletonCircle.displayName = 'Skeleton.Circle'\nSkeletonLine.displayName = 'Skeleton.Line'\n"],"mappings":"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","names":["Skeleton","RadixSlot","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","Skeleton"]}

package/dist/slider/index.d.ts

@@ -0,0 +1,97 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Slider as Slider$2 } from 'radix-ui';
+import { PropsWithChildren, Ref } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+
+declare const rangeVariants: (props?: ({
+    intent?: "main" | "alert" | "support" | "accent" | "basic" | "info" | "neutral" | "success" | "error" | null | undefined;
+    shape?: "rounded" | "square" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>;
+
+interface SliderProps extends Omit<Slider$2.SliderProps, 'dir' | 'orientation' | 'inverted' | 'minStepsBetweenThumbs'>, PropsWithChildren<SliderRangeVariantsProps> {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * The value of the slider when initially rendered. Use when you do not need to control the state of the slider.
+     */
+    defaultValue?: number[];
+    /**
+     * The controlled value of the slider. Must be used in conjunction with `onValueChange`.
+     */
+    value?: number[];
+    /**
+     * Event handler called when the value changes.
+     */
+    onValueChange?: (value: number[]) => void;
+    /**
+     * Event handler called when the value changes at the end of an interaction. Useful when you only need to capture a final value e.g. to update a backend service.
+     */
+    onValueCommit?: (value: number[]) => void;
+    /**
+     * The name of the slider. Submitted with its owning form as part of a name/value pair.
+     */
+    name?: string;
+    /**
+     * When `true`, prevents the user from interacting with the slider.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * The minimum value for the range.
+     * @default 0
+     */
+    min?: number;
+    /**
+     * The maximum value for the range.
+     * @default 100
+     */
+    max?: number;
+    /**
+     * The stepping interval.
+     * @default 1
+     */
+    step?: number;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const Slider$1: {
+    ({ asChild, intent, shape, children, className, ref, ...rest }: SliderProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface SliderThumbProps extends Slider$2.SliderThumbProps {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    ref?: Ref<HTMLSpanElement>;
+}
+declare const SliderThumb: {
+    ({ asChild, className, onPointerDown, onKeyDown, onBlur, ref: forwardedRef, ...rest }: SliderThumbProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface SliderTrackProps extends Slider$2.SliderTrackProps, Slider$2.SliderRangeProps {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    ref?: Ref<HTMLDivElement>;
+}
+declare const SliderTrack: {
+    ({ asChild, className, ref, ...rest }: SliderTrackProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Slider: typeof Slider$1 & {
+    Thumb: typeof SliderThumb;
+    Track: typeof SliderTrack;
+};
+
+export { Slider, type SliderProps, type SliderThumbProps, type SliderTrackProps };

package/dist/slider/index.js

@@ -0,0 +1,220 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/slider/index.ts
+var slider_exports = {};
+__export(slider_exports, {
+  Slider: () => Slider2
+});
+module.exports = __toCommonJS(slider_exports);
+
+// src/slider/Slider.tsx
+var import_radix_ui = require("radix-ui");
+
+// src/slider/Slider.styles.ts
+var import_class_variance_authority = require("class-variance-authority");
+var rootStyles = (0, import_class_variance_authority.cva)([
+  "flex relative h-sz-24 items-center",
+  "touch-none select-none",
+  "data-disabled:cursor-not-allowed data-disabled:opacity-dim-3"
+]);
+
+// src/slider/SliderContext.tsx
+var import_react = require("react");
+var SliderContext = (0, import_react.createContext)({});
+var useSliderContext = () => (0, import_react.useContext)(SliderContext);
+
+// src/slider/Slider.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Slider = ({
+  asChild = false,
+  intent = "basic",
+  shape = "square",
+  children,
+  className,
+  ref,
+  ...rest
+}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SliderContext.Provider, { value: { intent, shape }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  import_radix_ui.Slider.Root,
+  {
+    ref,
+    "data-spark-component": "slider",
+    asChild,
+    className: rootStyles({ className }),
+    dir: "ltr",
+    orientation: "horizontal",
+    inverted: false,
+    minStepsBetweenThumbs: 0,
+    ...rest,
+    children
+  }
+) });
+Slider.displayName = "Slider";
+
+// src/slider/SliderThumb.tsx
+var import_radix_ui2 = require("radix-ui");
+var import_react2 = require("react");
+
+// src/slider/SliderThumb.styles.ts
+var import_class_variance_authority2 = require("class-variance-authority");
+var thumbVariants = (0, import_class_variance_authority2.cva)(
+  [
+    "block h-sz-24 w-sz-24 rounded-full cursor-pointer",
+    "outline-hidden",
+    "focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-focus",
+    "data-[interaction=pointerdown]:focus-visible:ring-0!",
+    "data-disabled:hover:ring-0 data-disabled:hover:after:w-0 data-disabled:hover:after:h-0 data-disabled:cursor-not-allowed",
+    "after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2 after:z-hide",
+    "after:w-0 after:h-0 after:rounded-full after:border-solid after:border-sm after:transition-all duration-300",
+    "hover:after:w-sz-32 hover:after:h-sz-32"
+  ],
+  {
+    variants: {
+      intent: {
+        main: ["bg-main", "after:bg-main-container after:border-main"],
+        support: ["bg-support", "after:bg-support-container after:border-support"],
+        accent: ["bg-accent", "after:bg-accent-container after:border-accent"],
+        basic: ["bg-basic", "after:bg-basic-container after:border-basic"],
+        info: ["bg-info", "after:bg-info-container after:border-info"],
+        neutral: ["bg-neutral", "after:bg-neutral-container after:border-neutral"],
+        success: ["bg-success", "after:bg-success-container after:border-success"],
+        alert: ["bg-alert", "after:bg-alert-container after:border-alert"],
+        error: ["bg-error", "after:bg-error-container after:border-error"]
+      }
+    },
+    defaultVariants: {
+      intent: "basic"
+    }
+  }
+);
+
+// src/slider/SliderThumb.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var SliderThumb = ({
+  asChild = false,
+  className,
+  onPointerDown,
+  onKeyDown,
+  onBlur,
+  ref: forwardedRef,
+  ...rest
+}) => {
+  const { intent } = useSliderContext();
+  const innerRef = (0, import_react2.useRef)(null);
+  const ref = forwardedRef || innerRef;
+  const setInteractionType = (e) => {
+    if (typeof ref === "function" || !ref.current) return;
+    ref.current.dataset.interaction = e.type;
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_radix_ui2.Slider.Thumb,
+    {
+      "data-spark-component": "slider-thumb",
+      ref,
+      asChild,
+      onPointerDown: (e) => {
+        setInteractionType(e);
+        onPointerDown?.(e);
+      },
+      onKeyDown: (e) => {
+        setInteractionType(e);
+        onKeyDown?.(e);
+      },
+      onBlur: (e) => {
+        setInteractionType(e);
+        onBlur?.(e);
+      },
+      className: thumbVariants({ intent, className }),
+      ...rest
+    }
+  );
+};
+SliderThumb.displayName = "Slider.Thumb";
+
+// src/slider/SliderTrack.tsx
+var import_radix_ui3 = require("radix-ui");
+
+// src/slider/SliderTrack.styles.ts
+var import_class_variance_authority3 = require("class-variance-authority");
+var trackVariants = (0, import_class_variance_authority3.cva)(["relative grow h-sz-4 bg-on-background/dim-4"], {
+  variants: {
+    shape: {
+      rounded: "rounded-sm",
+      square: "rounded-0"
+    }
+  },
+  defaultVariants: {
+    shape: "square"
+  }
+});
+var rangeVariants = (0, import_class_variance_authority3.cva)(["absolute h-full"], {
+  variants: {
+    intent: {
+      main: ["bg-main"],
+      support: ["bg-support"],
+      accent: ["bg-accent"],
+      basic: ["bg-basic"],
+      info: ["bg-info"],
+      neutral: ["bg-neutral"],
+      success: ["bg-success"],
+      alert: ["bg-alert"],
+      error: ["bg-error"]
+    },
+    shape: {
+      rounded: "rounded-sm",
+      square: "rounded-0"
+    }
+  },
+  defaultVariants: {
+    intent: "basic",
+    shape: "square"
+  }
+});
+
+// src/slider/SliderTrack.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var SliderTrack = ({ asChild = false, className, ref, ...rest }) => {
+  const { intent, shape } = useSliderContext();
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_radix_ui3.Slider.Track,
+    {
+      "data-spark-component": "slider-track",
+      ref,
+      asChild,
+      className: trackVariants({ shape }),
+      ...rest,
+      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_radix_ui3.Slider.Range, { className: rangeVariants({ intent, shape, className }) })
+    }
+  );
+};
+SliderTrack.displayName = "Slider.Track";
+
+// src/slider/index.ts
+var Slider2 = Object.assign(Slider, {
+  Thumb: SliderThumb,
+  Track: SliderTrack
+});
+Slider2.displayName = "Slider";
+SliderThumb.displayName = "Slider.Thumb";
+SliderTrack.displayName = "Slider.Track";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Slider
+});
+//# sourceMappingURL=index.js.map

package/dist/slider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/slider/index.ts","../../src/slider/Slider.tsx","../../src/slider/Slider.styles.ts","../../src/slider/SliderContext.tsx","../../src/slider/SliderThumb.tsx","../../src/slider/SliderThumb.styles.ts","../../src/slider/SliderTrack.tsx","../../src/slider/SliderTrack.styles.ts"],"sourcesContent":["import { Slider as Root, type SliderProps } from './Slider'\nimport { SliderThumb as Thumb, type SliderThumbProps } from './SliderThumb'\nimport { SliderTrack as Track, type SliderTrackProps } from './SliderTrack'\n\nexport const Slider: typeof Root & {\n  Thumb: typeof Thumb\n  Track: typeof Track\n} = Object.assign(Root, {\n  Thumb,\n  Track,\n})\n\nSlider.displayName = 'Slider'\nThumb.displayName = 'Slider.Thumb'\nTrack.displayName = 'Slider.Track'\n\nexport type { SliderProps, SliderThumbProps, SliderTrackProps }\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { type PropsWithChildren, Ref } from 'react'\n\nimport { rootStyles } from './Slider.styles'\nimport { SliderContext } from './SliderContext'\nimport type { SliderRangeVariantsProps } from './SliderTrack.styles'\n\nexport interface SliderProps\n  extends Omit<\n      RadixSlider.SliderProps,\n      'dir' | 'orientation' | 'inverted' | 'minStepsBetweenThumbs'\n    >,\n    PropsWithChildren<SliderRangeVariantsProps> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * The value of the slider when initially rendered. Use when you do not need to control the state of the slider.\n   */\n  defaultValue?: number[]\n  /**\n   * The controlled value of the slider. Must be used in conjunction with `onValueChange`.\n   */\n  value?: number[]\n  /**\n   * Event handler called when the value changes.\n   */\n  onValueChange?: (value: number[]) => void\n  /**\n   * Event handler called when the value changes at the end of an interaction. Useful when you only need to capture a final value e.g. to update a backend service.\n   */\n  onValueCommit?: (value: number[]) => void\n  /**\n   * The name of the slider. Submitted with its owning form as part of a name/value pair.\n   */\n  name?: string\n  /**\n   * When `true`, prevents the user from interacting with the slider.\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * The minimum value for the range.\n   * @default 0\n   */\n  min?: number\n  /**\n   * The maximum value for the range.\n   * @default 100\n   */\n  max?: number\n  /**\n   * The stepping interval.\n   * @default 1\n   */\n  step?: number\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const Slider = ({\n  asChild = false,\n  intent = 'basic',\n  shape = 'square',\n  children,\n  className,\n  ref,\n  ...rest\n}: SliderProps) => (\n  <SliderContext.Provider value={{ intent, shape }}>\n    <RadixSlider.Root\n      ref={ref}\n      data-spark-component=\"slider\"\n      asChild={asChild}\n      className={rootStyles({ className })}\n      dir=\"ltr\"\n      orientation=\"horizontal\"\n      inverted={false}\n      minStepsBetweenThumbs={0}\n      {...rest}\n    >\n      {children}\n    </RadixSlider.Root>\n  </SliderContext.Provider>\n)\n\nSlider.displayName = 'Slider'\n","import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'flex relative h-sz-24 items-center',\n  'touch-none select-none',\n  'data-disabled:cursor-not-allowed data-disabled:opacity-dim-3',\n])\n","import { createContext, useContext } from 'react'\n\nimport type { SliderProps } from './Slider'\n\nexport type SliderContextInterface = Pick<SliderProps, 'intent' | 'shape'>\n\nexport const SliderContext = createContext<SliderContextInterface>({} as SliderContextInterface)\n\nexport const useSliderContext = () => useContext(SliderContext)\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { type FocusEvent, type KeyboardEvent, type PointerEvent, Ref, useRef } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { thumbVariants } from './SliderThumb.styles'\n\nexport interface SliderThumbProps extends RadixSlider.SliderThumbProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const SliderThumb = ({\n  asChild = false,\n  className,\n  onPointerDown,\n  onKeyDown,\n  onBlur,\n  ref: forwardedRef,\n  ...rest\n}: SliderThumbProps) => {\n  const { intent } = useSliderContext()\n\n  const innerRef = useRef(null)\n  const ref = forwardedRef || innerRef\n\n  const setInteractionType = (e: KeyboardEvent | FocusEvent | PointerEvent) => {\n    /**\n     * Radix Slider implementation uses `.focus()` and thus prevent us to handle\n     * distinctively focus/focus-visible styles. So we use a `data-interaction` attribute to stay\n     * aware of the type of event, and adapt styles if needed.\n     */\n    if (typeof ref === 'function' || !ref.current) return\n    ref.current.dataset.interaction = e.type\n  }\n\n  return (\n    <RadixSlider.Thumb\n      data-spark-component=\"slider-thumb\"\n      ref={ref}\n      asChild={asChild}\n      onPointerDown={(e: PointerEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onPointerDown?.(e)\n      }}\n      onKeyDown={(e: KeyboardEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onKeyDown?.(e)\n      }}\n      onBlur={(e: FocusEvent<HTMLSpanElement>) => {\n        setInteractionType(e)\n        onBlur?.(e)\n      }}\n      className={thumbVariants({ intent, className })}\n      {...rest}\n    />\n  )\n}\n\nSliderThumb.displayName = 'Slider.Thumb'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const thumbVariants = cva(\n  [\n    'block h-sz-24 w-sz-24 rounded-full cursor-pointer',\n    'outline-hidden',\n    'focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-focus',\n    'data-[interaction=pointerdown]:focus-visible:ring-0!',\n    'data-disabled:hover:ring-0 data-disabled:hover:after:w-0 data-disabled:hover:after:h-0 data-disabled:cursor-not-allowed',\n    'after:absolute after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2 after:z-hide',\n    'after:w-0 after:h-0 after:rounded-full after:border-solid after:border-sm after:transition-all duration-300',\n    'hover:after:w-sz-32 hover:after:h-sz-32',\n  ],\n  {\n    variants: {\n      intent: {\n        main: ['bg-main', 'after:bg-main-container after:border-main'],\n        support: ['bg-support', 'after:bg-support-container after:border-support'],\n        accent: ['bg-accent', 'after:bg-accent-container after:border-accent'],\n        basic: ['bg-basic', 'after:bg-basic-container after:border-basic'],\n        info: ['bg-info', 'after:bg-info-container after:border-info'],\n        neutral: ['bg-neutral', 'after:bg-neutral-container after:border-neutral'],\n        success: ['bg-success', 'after:bg-success-container after:border-success'],\n        alert: ['bg-alert', 'after:bg-alert-container after:border-alert'],\n        error: ['bg-error', 'after:bg-error-container after:border-error'],\n      },\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>\n","import { Slider as RadixSlider } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { useSliderContext } from './SliderContext'\nimport { rangeVariants, trackVariants } from './SliderTrack.styles'\n\nexport interface SliderTrackProps\n  extends RadixSlider.SliderTrackProps,\n    RadixSlider.SliderRangeProps {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   * @default false\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const SliderTrack = ({ asChild = false, className, ref, ...rest }: SliderTrackProps) => {\n  const { intent, shape } = useSliderContext()\n\n  return (\n    <RadixSlider.Track\n      data-spark-component=\"slider-track\"\n      ref={ref}\n      asChild={asChild}\n      className={trackVariants({ shape })}\n      {...rest}\n    >\n      <RadixSlider.Range className={rangeVariants({ intent, shape, className })} />\n    </RadixSlider.Track>\n  )\n}\n\nSliderTrack.displayName = 'Slider.Track'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const trackVariants = cva(['relative grow h-sz-4 bg-on-background/dim-4'], {\n  variants: {\n    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    shape: 'square',\n  },\n})\n\nexport const rangeVariants = cva(['absolute h-full'], {\n  variants: {\n    intent: {\n      main: ['bg-main'],\n      support: ['bg-support'],\n      accent: ['bg-accent'],\n      basic: ['bg-basic'],\n      info: ['bg-info'],\n      neutral: ['bg-neutral'],\n      success: ['bg-success'],\n      alert: ['bg-alert'],\n      error: ['bg-error'],\n    },\n    shape: {\n      rounded: 'rounded-sm',\n      square: 'rounded-0',\n    },\n  },\n  defaultVariants: {\n    intent: 'basic',\n    shape: 'square',\n  },\n})\n\nexport type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>\n"],"mappings":"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","names":["Slider","RadixSlider","import_radix_ui","import_react","import_class_variance_authority","import_jsx_runtime","RadixSlider","import_radix_ui","import_class_variance_authority","import_jsx_runtime","RadixSlider","Slider"]}

package/dist/slot/index.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Slot as Slot$1 } from 'radix-ui';
+import { PropsWithChildren, HTMLAttributes, Ref, ReactNode } from 'react';
+
+declare const Slottable: typeof Slot$1.Slottable;
+type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {
+    ref?: Ref<HTMLElement>;
+};
+declare const Slot: ({ ref, ...props }: SlotProps) => react_jsx_runtime.JSX.Element;
+/**
+ * When using Radix `Slot` component, it will consider its first child to merge its props with.
+ * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.
+ */
+declare const wrapPolymorphicSlot: (asChild: boolean | undefined, children: ReactNode, callback: (children: ReactNode) => ReactNode) => ReactNode;
+
+export { Slot, type SlotProps, Slottable, wrapPolymorphicSlot };