@spark-ui/components 10.14.4 → 10.15.1

package/dist/{InputGroup-aoaZxCLk.d.mts → Input-N8AWWSmt.d.mts}

@@ -25,4 +25,17 @@ declare const InputGroup: {
     displayName: string;
 };
 
-export { type InputGroupProps as I, InputGroup as a };
+type InputPrimitiveProps = ComponentPropsWithoutRef<'input'>;
+interface InputProps extends InputPrimitiveProps {
+    asChild?: boolean;
+    onValueChange?: (value: string) => void;
+    ref?: Ref<HTMLInputElement>;
+}
+declare const Input: {
+    ({ className, asChild, onValueChange, onChange, onKeyDown, disabled: disabledProp, readOnly: readOnlyProp, ref, ...others }: InputProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    id: string;
+};
+
+export { type InputGroupProps as I, type InputProps as a, InputGroup as b, Input as c };

package/dist/{InputGroup-aoaZxCLk.d.ts → Input-N8AWWSmt.d.ts}

@@ -25,4 +25,17 @@ declare const InputGroup: {
     displayName: string;
 };
 
-export { type InputGroupProps as I, InputGroup as a };
+type InputPrimitiveProps = ComponentPropsWithoutRef<'input'>;
+interface InputProps extends InputPrimitiveProps {
+    asChild?: boolean;
+    onValueChange?: (value: string) => void;
+    ref?: Ref<HTMLInputElement>;
+}
+declare const Input: {
+    ({ className, asChild, onValueChange, onChange, onKeyDown, disabled: disabledProp, readOnly: readOnlyProp, ref, ...others }: InputProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    id: string;
+};
+
+export { type InputGroupProps as I, type InputProps as a, InputGroup as b, Input as c };

package/dist/docgen.json

@@ -34000,25 +34000,6 @@
           "name": "boolean"
         }
       },
-      "design": {
-        "defaultValue": null,
-        "description": "",
-        "name": "design",
-        "declarations": [],
-        "required": false,
-        "type": {
-          "name": "enum",
-          "raw": "\"tinted\" | \"outline\"",
-          "value": [
-            {
-              "value": "\"tinted\""
-            },
-            {
-              "value": "\"outline\""
-            }
-          ]
-        }
-      },
       "size": {
         "defaultValue": null,
         "description": "",
@@ -34049,29 +34030,11 @@
         "required": false,
         "type": {
           "name": "enum",
-          "raw": "\"main\" | \"alert\" | \"support\" | \"accent\" | \"success\" | \"danger\" | \"info\" | \"neutral\" | \"basic\"",
+          "raw": "\"success\" | \"neutral\" | \"basic\"",
           "value": [
-            {
-              "value": "\"main\""
-            },
-            {
-              "value": "\"alert\""
-            },
-            {
-              "value": "\"support\""
-            },
-            {
-              "value": "\"accent\""
-            },
             {
               "value": "\"success\""
             },
-            {
-              "value": "\"danger\""
-            },
-            {
-              "value": "\"info\""
-            },
             {
               "value": "\"neutral\""
             },
@@ -43841,7 +43804,7 @@
         "defaultValue": {
           "value": true
         },
-        "description": "If `false`, the textarea won't be resizable.",
+        "description": "",
         "name": "isResizable",
         "parent": {
           "fileName": "src/textarea/Textarea.tsx",
@@ -43857,6 +43820,44 @@
         "type": {
           "name": "boolean"
         }
+      },
+      "ref": {
+        "defaultValue": null,
+        "description": "",
+        "name": "ref",
+        "parent": {
+          "fileName": "src/textarea/Textarea.tsx",
+          "name": "TextareaProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/textarea/Textarea.tsx",
+            "name": "TextareaProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "Ref<HTMLTextAreaElement>"
+        }
+      },
+      "onValueChange": {
+        "defaultValue": null,
+        "description": "",
+        "name": "onValueChange",
+        "parent": {
+          "fileName": "src/input/Input.tsx",
+          "name": "InputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/input/Input.tsx",
+            "name": "InputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "(value: string) => void"
+        }
       }
     }
   },

package/dist/input/index.d.mts

@@ -1,12 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ComponentPropsWithoutRef, Ref } from 'react';
-import { a as InputGroup$1 } from '../InputGroup-aoaZxCLk.mjs';
-export { I as InputGroupProps } from '../InputGroup-aoaZxCLk.mjs';
+import { b as InputGroup$1 } from '../Input-N8AWWSmt.mjs';
+export { c as Input, I as InputGroupProps, a as InputProps } from '../Input-N8AWWSmt.mjs';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
 import { b as InputLeadingIcon, c as InputTrailingIcon } from '../InputTrailingIcon-BBp7sE6D.mjs';
 export { I as InputLeadingIconProps, a as InputTrailingIconProps } from '../InputTrailingIcon-BBp7sE6D.mjs';
-export { a as Input, I as InputProps } from '../Input-g0LpWuv0.mjs';
 import '../icon/index.mjs';
 
 interface InputClearButtonProps extends ComponentPropsWithoutRef<'button'> {

package/dist/input/index.d.ts

@@ -1,12 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ComponentPropsWithoutRef, Ref } from 'react';
-import { a as InputGroup$1 } from '../InputGroup-aoaZxCLk.js';
-export { I as InputGroupProps } from '../InputGroup-aoaZxCLk.js';
+import { b as InputGroup$1 } from '../Input-N8AWWSmt.js';
+export { c as Input, I as InputGroupProps, a as InputProps } from '../Input-N8AWWSmt.js';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
 import { b as InputLeadingIcon, c as InputTrailingIcon } from '../InputTrailingIcon-ZZx8PoJy.js';
 export { I as InputLeadingIconProps, a as InputTrailingIconProps } from '../InputTrailingIcon-ZZx8PoJy.js';
-export { a as Input, I as InputProps } from '../Input-g0LpWuv0.js';
 import '../icon/index.js';
 
 interface InputClearButtonProps extends ComponentPropsWithoutRef<'button'> {

package/dist/progress-tracker/index.d.mts

@@ -5,13 +5,12 @@ import { VariantProps } from 'class-variance-authority';
 
 declare const stepIndicatorVariant: (props?: ({
     size?: "sm" | "md" | "lg" | null | undefined;
-    intent?: "main" | "basic" | "support" | "neutral" | "info" | "accent" | "danger" | "alert" | "success" | null | undefined;
-    design?: "outline" | "tinted" | null | undefined;
+    intent?: "basic" | "neutral" | "success" | null | undefined;
     state?: "complete" | "incomplete" | "active" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type StepIndicatorVariantProps = VariantProps<typeof stepIndicatorVariant>;
 
-interface ProgressTrackerProps extends ComponentPropsWithRef<'div'>, Pick<StepIndicatorVariantProps, 'size' | 'intent' | 'design'> {
+interface ProgressTrackerProps extends ComponentPropsWithRef<'div'>, Pick<StepIndicatorVariantProps, 'size' | 'intent'> {
     /**
      * The orientation of the progress tracker
      * @default 'horizontal"
@@ -33,7 +32,7 @@ interface ProgressTrackerProps extends ComponentPropsWithRef<'div'>, Pick<StepIn
     readOnly?: boolean;
 }
 declare const ProgressTracker$1: {
-    ({ stepIndex, onStepClick, readOnly, intent, size, design, orientation, children, className, ref, ...rest }: PropsWithChildren<ProgressTrackerProps>): react_jsx_runtime.JSX.Element;
+    ({ stepIndex, onStepClick, readOnly, intent, size, orientation, children, className, ref, ...rest }: PropsWithChildren<ProgressTrackerProps>): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 

package/dist/progress-tracker/index.d.ts

@@ -5,13 +5,12 @@ import { VariantProps } from 'class-variance-authority';
 
 declare const stepIndicatorVariant: (props?: ({
     size?: "sm" | "md" | "lg" | null | undefined;
-    intent?: "main" | "basic" | "support" | "neutral" | "info" | "accent" | "danger" | "alert" | "success" | null | undefined;
-    design?: "outline" | "tinted" | null | undefined;
+    intent?: "basic" | "neutral" | "success" | null | undefined;
     state?: "complete" | "incomplete" | "active" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type StepIndicatorVariantProps = VariantProps<typeof stepIndicatorVariant>;
 
-interface ProgressTrackerProps extends ComponentPropsWithRef<'div'>, Pick<StepIndicatorVariantProps, 'size' | 'intent' | 'design'> {
+interface ProgressTrackerProps extends ComponentPropsWithRef<'div'>, Pick<StepIndicatorVariantProps, 'size' | 'intent'> {
     /**
      * The orientation of the progress tracker
      * @default 'horizontal"
@@ -33,7 +32,7 @@ interface ProgressTrackerProps extends ComponentPropsWithRef<'div'>, Pick<StepIn
     readOnly?: boolean;
 }
 declare const ProgressTracker$1: {
-    ({ stepIndex, onStepClick, readOnly, intent, size, design, orientation, children, className, ref, ...rest }: PropsWithChildren<ProgressTrackerProps>): react_jsx_runtime.JSX.Element;
+    ({ stepIndex, onStepClick, readOnly, intent, size, orientation, children, className, ref, ...rest }: PropsWithChildren<ProgressTrackerProps>): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 

package/dist/progress-tracker/index.js

@@ -56,7 +56,6 @@ var ProgressTracker = ({
   readOnly = false,
   intent = "basic",
   size = "lg",
-  design = "outline",
   orientation = "horizontal",
   children,
   className,
@@ -68,7 +67,7 @@ var ProgressTracker = ({
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     ProgressTrackerContext.Provider,
     {
-      value: { stepIndex, onStepClick, steps, setSteps, size, intent, design, readOnly },
+      value: { stepIndex, onStepClick, steps, setSteps, size, intent, readOnly },
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         Component,
         {
@@ -155,13 +154,7 @@ var stepItemVariant = (0, import_class_variance_authority3.cva)(
       },
       intent: {
         basic: "",
-        support: "",
-        main: "",
         neutral: "",
-        info: "",
-        accent: "",
-        danger: "",
-        alert: "",
         success: ""
       },
       disabled: {
@@ -323,304 +316,6 @@ Icon.displayName = "Icon";
 
 // src/progress-tracker/ProgressTrackerStepIndicator.styles.ts
 var import_class_variance_authority5 = require("class-variance-authority");
-
-// src/progress-tracker/stepIndicatorVariants/outline.ts
-var outlineVariants = [
-  {
-    design: "outline",
-    intent: "basic",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-basic-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-basic-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "basic",
-    state: "active",
-    class: "text-on-basic bg-basic"
-  },
-  {
-    design: "outline",
-    intent: "support",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-support-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-support-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "support",
-    state: "active",
-    class: "text-on-support bg-support"
-  },
-  {
-    design: "outline",
-    intent: "main",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-main-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-main-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "main",
-    state: "active",
-    class: "text-on-main bg-main"
-  },
-  {
-    design: "outline",
-    intent: "neutral",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-neutral-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-neutral-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "neutral",
-    state: "active",
-    class: "text-on-neutral bg-neutral"
-  },
-  {
-    design: "outline",
-    intent: "info",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-info-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-info-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "info",
-    state: "active",
-    class: "text-on-info bg-info"
-  },
-  {
-    design: "outline",
-    intent: "accent",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-accent-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-accent-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "accent",
-    state: "active",
-    class: "text-on-accent bg-accent"
-  },
-  {
-    design: "outline",
-    intent: "danger",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-error-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-error-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "danger",
-    state: "active",
-    class: "text-on-error bg-error"
-  },
-  {
-    design: "outline",
-    intent: "alert",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-alert-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-alert-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "alert",
-    state: "active",
-    class: "text-on-alert bg-alert"
-  },
-  {
-    design: "outline",
-    intent: "success",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-success-container bg-transparent",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-success-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-transparent"
-    ]
-  },
-  {
-    design: "outline",
-    intent: "success",
-    state: "active",
-    class: "text-on-success bg-success"
-  }
-];
-
-// src/progress-tracker/stepIndicatorVariants/tinted.ts
-var tintedVariants = [
-  {
-    design: "tinted",
-    intent: "basic",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-basic-container bg-basic-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-basic-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-basic-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "basic",
-    state: "active",
-    class: "text-on-basic bg-basic"
-  },
-  {
-    design: "tinted",
-    intent: "support",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-support-container bg-support-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-support-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-support-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "support",
-    state: "active",
-    class: "text-on-support bg-support"
-  },
-  {
-    design: "tinted",
-    intent: "main",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-main-container bg-main-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-main-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-main-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "main",
-    state: "active",
-    class: "text-on-main bg-main"
-  },
-  {
-    design: "tinted",
-    intent: "neutral",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-neutral-container bg-neutral-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-neutral-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-neutral-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "neutral",
-    state: "active",
-    class: "text-on-neutral bg-neutral"
-  },
-  {
-    design: "tinted",
-    intent: "info",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-info-container bg-info-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-info-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-info-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "info",
-    state: "active",
-    class: "text-on-info bg-info"
-  },
-  {
-    design: "tinted",
-    intent: "accent",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-accent-container bg-accent-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-accent-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-accent-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "accent",
-    state: "active",
-    class: "text-on-accent bg-accent"
-  },
-  {
-    design: "tinted",
-    intent: "danger",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-error-container bg-error-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-error-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-error-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "danger",
-    state: "active",
-    class: "text-on-error bg-error"
-  },
-  {
-    design: "tinted",
-    intent: "alert",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-alert-container bg-alert-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-alert-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-alert-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "alert",
-    state: "active",
-    class: "text-on-alert bg-alert"
-  },
-  {
-    design: "tinted",
-    intent: "success",
-    state: ["complete", "incomplete"],
-    class: [
-      "text-on-success-container bg-success-container",
-      "group-hover/btn:group-data-[interactive=true]/btn:bg-success-container-hovered",
-      "group-hover/btn:group-data-[interactive=false]/btn:bg-success-container"
-    ]
-  },
-  {
-    design: "tinted",
-    intent: "success",
-    state: "active",
-    class: "text-on-success bg-success"
-  }
-];
-
-// src/progress-tracker/ProgressTrackerStepIndicator.styles.ts
 var stepIndicatorVariant = (0, import_class_variance_authority5.cva)(
   [
     "relative flex shrink-0 justify-center items-center",
@@ -649,19 +344,9 @@ var stepIndicatorVariant = (0, import_class_variance_authority5.cva)(
       },
       intent: {
         basic: "",
-        support: "",
-        main: "",
         neutral: "",
-        info: "",
-        accent: "",
-        danger: "",
-        alert: "",
         success: ""
       },
-      design: {
-        outline: "border-sm",
-        tinted: ""
-      },
       state: {
         complete: "",
         incomplete: "",
@@ -672,14 +357,58 @@ var stepIndicatorVariant = (0, import_class_variance_authority5.cva)(
      * Known type issue with CVA compoundVariants and VS Code/Intellisense:
      * https://github.com/joe-bell/cva/discussions/195#discussioncomment-6750163
      * */
-    /* eslint-disable-next-line @typescript-eslint/ban-ts-comment */
     /* @ts-ignore */
-    compoundVariants: [...outlineVariants, ...tintedVariants],
+    compoundVariants: [
+      // Basic
+      {
+        intent: "basic",
+        state: ["complete", "incomplete"],
+        class: [
+          "text-on-basic-container bg-basic-container",
+          "group-hover/btn:group-data-[interactive=true]/btn:bg-basic-container-hovered",
+          "group-hover/btn:group-data-[interactive=false]/btn:bg-basic-container"
+        ]
+      },
+      {
+        intent: "basic",
+        state: "active",
+        class: "text-on-basic bg-basic"
+      },
+      // Neutral
+      {
+        intent: "neutral",
+        state: ["complete", "incomplete"],
+        class: [
+          "text-on-neutral-container bg-neutral-container",
+          "group-hover/btn:group-data-[interactive=true]/btn:bg-neutral-container-hovered",
+          "group-hover/btn:group-data-[interactive=false]/btn:bg-neutral-container"
+        ]
+      },
+      {
+        intent: "neutral",
+        state: "active",
+        class: "text-on-neutral bg-neutral"
+      },
+      // Success
+      {
+        intent: "success",
+        state: ["complete", "incomplete"],
+        class: [
+          "text-on-success-container bg-success-container",
+          "group-hover/btn:group-data-[interactive=true]/btn:bg-success-container-hovered",
+          "group-hover/btn:group-data-[interactive=false]/btn:bg-success-container"
+        ]
+      },
+      {
+        intent: "success",
+        state: "active",
+        class: "text-on-success bg-success"
+      }
+    ],
     defaultVariants: {
       size: "lg",
       state: "incomplete",
-      intent: "basic",
-      design: "outline"
+      intent: "basic"
     }
   }
 );
@@ -692,19 +421,12 @@ var ProgressTrackerStepIndicator = ({
   incomplete,
   className
 }) => {
-  const { size, intent, design } = useProgressTrackerContext();
+  const { size, intent } = useProgressTrackerContext();
   const { index, state } = useProgressTrackerStepContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-    "span",
-    {
-      className: stepIndicatorVariant({ size, intent, design, state, className }),
-      "aria-hidden": "true",
-      children: size !== "sm" && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
-        state === "complete" && (complete === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CompleteIndicator, {}) : complete),
-        state !== "complete" && (incomplete === void 0 ? `${index + 1}` : incomplete)
-      ] })
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: stepIndicatorVariant({ size, intent, state, className }), "aria-hidden": "true", children: size !== "sm" && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+    state === "complete" && (complete === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CompleteIndicator, {}) : complete),
+    state !== "complete" && (incomplete === void 0 ? `${index + 1}` : incomplete)
+  ] }) });
 };
 ProgressTrackerStepIndicator.displayName = "ProgressTracker.StepIndicator";