@proyecto-viviana/solidaria-components 0.3.2 → 0.4.0

package/dist/StepList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepList.js","names":["JSX","createContext","createMemo","splitProps","useContext","For","createStepListState","StepListState","StepListStateProps","Key","createStepList","AriaStepListProps","ClassNameOrFunction","StyleOrFunction","useRenderProps","filterDOMProps","StepListItemRenderProps","isSelected","isCompleted","isDisabled","isSelectable","stepNumber","stepStateText","StepListRenderProps","StepListProps","key","label","items","T","selectedKey","defaultSelectedKey","onSelectionChange","lastCompletedStep","defaultLastCompletedStep","onLastCompletedStepChange","isReadOnly","disabledKeys","Iterable","children","item","state","Element","class","style","StepProps","CSSProperties","StepListStateContext","StepListContext","useStepListState","ctx","Error","StepList","props","local","ariaProps","domRest","stateProps","stepListProps","aria-label","aria-labelledby","renderValues","renderProps","defaultClassName","domProps","Record","global","_$createComponent","Provider","value","_el$","_$getNextElement","_tmpl$","_$spread","_$mergeProps","data-disabled","undefined","_$insert","each","index","_$runHydrationEvents","Step","selectable","handleClick","e","MouseEvent","preventDefault","setSelectedKey","handleKeyDown","KeyboardEvent","_el$2","_tmpl$2","_el$3","firstChild","data-selected","data-completed","data-selectable","_$addEventListener","$$click","_$effect","_p$","_v$","_v$2","_v$3","_v$4","_$setAttribute","t","a","o","_$delegateEvents"],"sources":["../src/StepList.tsx"],"sourcesContent":["/**\n * StepList component for solidaria-components\n *\n * A pre-wired headless step list component that combines state + aria hooks.\n * Renders an ordered list of steps with completion tracking.\n */\n\nimport { type JSX, createContext, createMemo, splitProps, useContext, For } from \"solid-js\";\nimport {\n  createStepListState,\n  type StepListState,\n  type StepListStateProps,\n  type Key,\n} from \"@proyecto-viviana/solid-stately\";\nimport { createStepList, type AriaStepListProps } from \"@proyecto-viviana/solidaria\";\nimport {\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  useRenderProps,\n  filterDOMProps,\n} from \"./utils\";\n\nexport interface StepListItemRenderProps {\n  /** Whether this step is currently selected. */\n  isSelected: boolean;\n  /** Whether this step is completed. */\n  isCompleted: boolean;\n  /** Whether this step is disabled. */\n  isDisabled: boolean;\n  /** Whether this step can be selected. */\n  isSelectable: boolean;\n  /** The 1-based step number. */\n  stepNumber: number;\n  /** Accessible text describing the step state. */\n  stepStateText: string;\n}\n\nexport interface StepListRenderProps {\n  /** Whether the step list is disabled. */\n  isDisabled: boolean;\n}\n\nexport interface StepListProps<T extends { key: Key; label: string }> extends AriaStepListProps {\n  /** The step items. */\n  items: T[];\n  /** The currently selected step key (controlled). */\n  selectedKey?: Key;\n  /** The default selected step key (uncontrolled). */\n  defaultSelectedKey?: Key;\n  /** Called when the selected step changes. */\n  onSelectionChange?: (key: Key) => void;\n  /** The last completed step key (controlled). */\n  lastCompletedStep?: Key;\n  /** The default last completed step key (uncontrolled). */\n  defaultLastCompletedStep?: Key;\n  /** Called when last completed step changes. */\n  onLastCompletedStepChange?: (key: Key | null) => void;\n  /** Whether all steps are disabled. */\n  isDisabled?: boolean;\n  /** Whether all steps are read-only. */\n  isReadOnly?: boolean;\n  /** Keys of individually disabled steps. */\n  disabledKeys?: Iterable<Key>;\n  /** Render function for each step item. */\n  children: (item: T, state: StepListItemRenderProps) => JSX.Element;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<StepListRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<StepListRenderProps>;\n}\n\nexport interface StepProps {\n  /** The step item. */\n  item: { key: Key; label: string };\n  /** The 1-based step number. */\n  stepNumber: number;\n  /** The children to render inside the step. */\n  children?: JSX.Element;\n  /** The CSS className for the element. */\n  class?: string;\n  /** The inline style for the element. */\n  style?: JSX.CSSProperties;\n}\n\nexport const StepListStateContext = createContext<StepListState | null>(null);\nexport const StepListContext = createContext<{} | null>(null);\n\nexport function useStepListState(): StepListState {\n  const ctx = useContext(StepListStateContext);\n  if (!ctx) throw new Error(\"useStepListState must be used within a StepList\");\n  return ctx;\n}\n\n/**\n * StepList displays a sequence of steps with completion tracking and selection.\n */\nexport function StepList<T extends { key: Key; label: string }>(\n  props: StepListProps<T>,\n): JSX.Element {\n  const [local, ariaProps, domRest] = splitProps(\n    props,\n    [\n      \"items\",\n      \"selectedKey\",\n      \"defaultSelectedKey\",\n      \"onSelectionChange\",\n      \"lastCompletedStep\",\n      \"defaultLastCompletedStep\",\n      \"onLastCompletedStepChange\",\n      \"isDisabled\",\n      \"isReadOnly\",\n      \"disabledKeys\",\n      \"children\",\n      \"class\",\n      \"style\",\n    ],\n    [\"aria-label\", \"aria-labelledby\"],\n  );\n\n  const stateProps = createMemo<StepListStateProps>(() => ({\n    items: local.items,\n    selectedKey: local.selectedKey,\n    defaultSelectedKey: local.defaultSelectedKey,\n    onSelectionChange: local.onSelectionChange,\n    lastCompletedStep: local.lastCompletedStep,\n    defaultLastCompletedStep: local.defaultLastCompletedStep,\n    onLastCompletedStepChange: local.onLastCompletedStepChange,\n    isDisabled: local.isDisabled,\n    isReadOnly: local.isReadOnly,\n    disabledKeys: local.disabledKeys,\n  }));\n\n  const state = createStepListState(stateProps());\n\n  // Create ARIA props\n  const { stepListProps } = createStepList(\n    {\n      get \"aria-label\"() {\n        return ariaProps[\"aria-label\"];\n      },\n      get \"aria-labelledby\"() {\n        return ariaProps[\"aria-labelledby\"];\n      },\n    },\n    state,\n  );\n\n  const renderValues = createMemo<StepListRenderProps>(() => ({\n    isDisabled: state.isDisabled(),\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-StepList\",\n    },\n    renderValues,\n  );\n\n  const domProps = createMemo(() =>\n    filterDOMProps(domRest as Record<string, unknown>, { global: true }),\n  );\n\n  return (\n    <StepListStateContext.Provider value={state}>\n      <ol\n        {...stepListProps}\n        {...domProps()}\n        class={renderProps.class()}\n        style={renderProps.style()}\n        data-disabled={state.isDisabled() || undefined}\n      >\n        <For each={local.items}>\n          {(item, index) => {\n            const stepNumber = () => index() + 1;\n\n            // Build render props as a static snapshot for the initial render.\n            const renderProps: StepListItemRenderProps = {\n              get isSelected() {\n                return state.selectedKey() === item.key;\n              },\n              get isCompleted() {\n                return state.isCompleted(item.key);\n              },\n              get isDisabled() {\n                return state.isDisabled() || !state.isSelectable(item.key);\n              },\n              get isSelectable() {\n                return state.isSelectable(item.key);\n              },\n              get stepNumber() {\n                return stepNumber();\n              },\n              get stepStateText() {\n                if (state.selectedKey() === item.key) return \"Current\";\n                if (state.isCompleted(item.key)) return \"Completed\";\n                return \"Not completed\";\n              },\n            };\n\n            return local.children(item, renderProps);\n          }}\n        </For>\n      </ol>\n    </StepListStateContext.Provider>\n  );\n}\n\n/**\n * Step represents an individual step within a StepList.\n * Renders as an `<li>` wrapping an `<a>` with accessible step props.\n */\nexport function Step(props: StepProps): JSX.Element {\n  const [local, domProps] = splitProps(props, [\"item\", \"stepNumber\", \"children\", \"class\", \"style\"]);\n\n  const state = useStepListState();\n\n  const isSelected = () => state.selectedKey() === local.item.key;\n  const isCompleted = () => state.isCompleted(local.item.key);\n  const selectable = () => state.isSelectable(local.item.key);\n\n  const handleClick = (e: MouseEvent) => {\n    e.preventDefault();\n    if (selectable()) {\n      state.setSelectedKey(local.item.key);\n    }\n  };\n\n  const handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === \"ArrowUp\" || e.key === \"ArrowDown\") {\n      e.preventDefault();\n      return;\n    }\n    if (e.key === \"Enter\" || e.key === \" \") {\n      e.preventDefault();\n      if (selectable()) {\n        state.setSelectedKey(local.item.key);\n      }\n    }\n  };\n\n  const stepStateText = () => {\n    if (isSelected()) return \"Current\";\n    if (isCompleted()) return \"Completed\";\n    return \"Not completed\";\n  };\n\n  return (\n    <li\n      {...domProps}\n      class={local.class}\n      style={local.style}\n      data-selected={isSelected() || undefined}\n      data-completed={isCompleted() || undefined}\n      data-disabled={!selectable() || undefined}\n      data-selectable={selectable() || undefined}\n    >\n      <a\n        role=\"link\"\n        aria-current={isSelected() ? \"step\" : undefined}\n        aria-disabled={!selectable() ? true : undefined}\n        tabIndex={selectable() ? 0 : undefined}\n        onClick={handleClick}\n        on:keydown={handleKeyDown}\n        aria-label={`Step ${local.stepNumber}: ${local.item.label}, ${stepStateText()}`}\n      >\n        {local.children}\n      </a>\n    </li>\n  );\n}\n"],"mappings":"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"}

package/dist/StepList.jsx

@@ -0,0 +1,141 @@
+import { filterDOMProps, useRenderProps } from "./utils.jsx";
+import { For, createContext, createMemo, splitProps, useContext } from "solid-js";
+import { createStepList } from "@proyecto-viviana/solidaria";
+import { createStepListState } from "@proyecto-viviana/solid-stately";
+//#region src/StepList.tsx
+/**
+* StepList component for solidaria-components
+*
+* A pre-wired headless step list component that combines state + aria hooks.
+* Renders an ordered list of steps with completion tracking.
+*/
+const StepListStateContext = createContext(null);
+const StepListContext = createContext(null);
+function useStepListState() {
+	const ctx = useContext(StepListStateContext);
+	if (!ctx) throw new Error("useStepListState must be used within a StepList");
+	return ctx;
+}
+/**
+* StepList displays a sequence of steps with completion tracking and selection.
+*/
+function StepList(props) {
+	const [local, ariaProps, domRest] = splitProps(props, [
+		"items",
+		"selectedKey",
+		"defaultSelectedKey",
+		"onSelectionChange",
+		"lastCompletedStep",
+		"defaultLastCompletedStep",
+		"onLastCompletedStepChange",
+		"isDisabled",
+		"isReadOnly",
+		"disabledKeys",
+		"children",
+		"class",
+		"style"
+	], ["aria-label", "aria-labelledby"]);
+	const state = createStepListState(createMemo(() => ({
+		items: local.items,
+		selectedKey: local.selectedKey,
+		defaultSelectedKey: local.defaultSelectedKey,
+		onSelectionChange: local.onSelectionChange,
+		lastCompletedStep: local.lastCompletedStep,
+		defaultLastCompletedStep: local.defaultLastCompletedStep,
+		onLastCompletedStepChange: local.onLastCompletedStepChange,
+		isDisabled: local.isDisabled,
+		isReadOnly: local.isReadOnly,
+		disabledKeys: local.disabledKeys
+	}))());
+	const { stepListProps } = createStepList({
+		get "aria-label"() {
+			return ariaProps["aria-label"];
+		},
+		get "aria-labelledby"() {
+			return ariaProps["aria-labelledby"];
+		}
+	}, state);
+	const renderValues = createMemo(() => ({ isDisabled: state.isDisabled() }));
+	const renderProps = useRenderProps({
+		class: local.class,
+		style: local.style,
+		defaultClassName: "solidaria-StepList"
+	}, renderValues);
+	const domProps = createMemo(() => filterDOMProps(domRest, { global: true }));
+	return <StepListStateContext.Provider value={state}>
+      <ol {...stepListProps} {...domProps()} class={renderProps.class()} style={renderProps.style()} data-disabled={state.isDisabled() || void 0}>
+        <For each={local.items}>
+          {(item, index) => {
+		const stepNumber = () => index() + 1;
+		return local.children(item, {
+			get isSelected() {
+				return state.selectedKey() === item.key;
+			},
+			get isCompleted() {
+				return state.isCompleted(item.key);
+			},
+			get isDisabled() {
+				return state.isDisabled() || !state.isSelectable(item.key);
+			},
+			get isSelectable() {
+				return state.isSelectable(item.key);
+			},
+			get stepNumber() {
+				return stepNumber();
+			},
+			get stepStateText() {
+				if (state.selectedKey() === item.key) return "Current";
+				if (state.isCompleted(item.key)) return "Completed";
+				return "Not completed";
+			}
+		});
+	}}
+        </For>
+      </ol>
+    </StepListStateContext.Provider>;
+}
+/**
+* Step represents an individual step within a StepList.
+* Renders as an `<li>` wrapping an `<a>` with accessible step props.
+*/
+function Step(props) {
+	const [local, domProps] = splitProps(props, [
+		"item",
+		"stepNumber",
+		"children",
+		"class",
+		"style"
+	]);
+	const state = useStepListState();
+	const isSelected = () => state.selectedKey() === local.item.key;
+	const isCompleted = () => state.isCompleted(local.item.key);
+	const selectable = () => state.isSelectable(local.item.key);
+	const handleClick = (e) => {
+		e.preventDefault();
+		if (selectable()) state.setSelectedKey(local.item.key);
+	};
+	const handleKeyDown = (e) => {
+		if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+			e.preventDefault();
+			return;
+		}
+		if (e.key === "Enter" || e.key === " ") {
+			e.preventDefault();
+			if (selectable()) state.setSelectedKey(local.item.key);
+		}
+	};
+	const stepStateText = () => {
+		if (isSelected()) return "Current";
+		if (isCompleted()) return "Completed";
+		return "Not completed";
+	};
+	return <li {...domProps} class={local.class} style={local.style} data-selected={isSelected() || void 0} data-completed={isCompleted() || void 0} data-disabled={!selectable() || void 0} data-selectable={selectable() || void 0}>
+      <a role="link" aria-current={isSelected() ? "step" : void 0} aria-disabled={!selectable() ? true : void 0} tabIndex={selectable() ? 0 : void 0} onClick={handleClick} on:keydown={handleKeyDown} aria-label={`Step ${local.stepNumber}: ${local.item.label}, ${stepStateText()}`}>
+        {local.children}
+      </a>
+    </li>;
+}
+//#endregion
+export { Step, StepList, StepListContext, StepListStateContext, useStepListState };
+
+//# sourceMappingURL=StepList.jsx.map

package/dist/StepList.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepList.jsx","names":[],"sources":["../src/StepList.tsx"],"sourcesContent":["/**\n * StepList component for solidaria-components\n *\n * A pre-wired headless step list component that combines state + aria hooks.\n * Renders an ordered list of steps with completion tracking.\n */\n\nimport { type JSX, createContext, createMemo, splitProps, useContext, For } from \"solid-js\";\nimport {\n  createStepListState,\n  type StepListState,\n  type StepListStateProps,\n  type Key,\n} from \"@proyecto-viviana/solid-stately\";\nimport { createStepList, type AriaStepListProps } from \"@proyecto-viviana/solidaria\";\nimport {\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  useRenderProps,\n  filterDOMProps,\n} from \"./utils\";\n\nexport interface StepListItemRenderProps {\n  /** Whether this step is currently selected. */\n  isSelected: boolean;\n  /** Whether this step is completed. */\n  isCompleted: boolean;\n  /** Whether this step is disabled. */\n  isDisabled: boolean;\n  /** Whether this step can be selected. */\n  isSelectable: boolean;\n  /** The 1-based step number. */\n  stepNumber: number;\n  /** Accessible text describing the step state. */\n  stepStateText: string;\n}\n\nexport interface StepListRenderProps {\n  /** Whether the step list is disabled. */\n  isDisabled: boolean;\n}\n\nexport interface StepListProps<T extends { key: Key; label: string }> extends AriaStepListProps {\n  /** The step items. */\n  items: T[];\n  /** The currently selected step key (controlled). */\n  selectedKey?: Key;\n  /** The default selected step key (uncontrolled). */\n  defaultSelectedKey?: Key;\n  /** Called when the selected step changes. */\n  onSelectionChange?: (key: Key) => void;\n  /** The last completed step key (controlled). */\n  lastCompletedStep?: Key;\n  /** The default last completed step key (uncontrolled). */\n  defaultLastCompletedStep?: Key;\n  /** Called when last completed step changes. */\n  onLastCompletedStepChange?: (key: Key | null) => void;\n  /** Whether all steps are disabled. */\n  isDisabled?: boolean;\n  /** Whether all steps are read-only. */\n  isReadOnly?: boolean;\n  /** Keys of individually disabled steps. */\n  disabledKeys?: Iterable<Key>;\n  /** Render function for each step item. */\n  children: (item: T, state: StepListItemRenderProps) => JSX.Element;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<StepListRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<StepListRenderProps>;\n}\n\nexport interface StepProps {\n  /** The step item. */\n  item: { key: Key; label: string };\n  /** The 1-based step number. */\n  stepNumber: number;\n  /** The children to render inside the step. */\n  children?: JSX.Element;\n  /** The CSS className for the element. */\n  class?: string;\n  /** The inline style for the element. */\n  style?: JSX.CSSProperties;\n}\n\nexport const StepListStateContext = createContext<StepListState | null>(null);\nexport const StepListContext = createContext<{} | null>(null);\n\nexport function useStepListState(): StepListState {\n  const ctx = useContext(StepListStateContext);\n  if (!ctx) throw new Error(\"useStepListState must be used within a StepList\");\n  return ctx;\n}\n\n/**\n * StepList displays a sequence of steps with completion tracking and selection.\n */\nexport function StepList<T extends { key: Key; label: string }>(\n  props: StepListProps<T>,\n): JSX.Element {\n  const [local, ariaProps, domRest] = splitProps(\n    props,\n    [\n      \"items\",\n      \"selectedKey\",\n      \"defaultSelectedKey\",\n      \"onSelectionChange\",\n      \"lastCompletedStep\",\n      \"defaultLastCompletedStep\",\n      \"onLastCompletedStepChange\",\n      \"isDisabled\",\n      \"isReadOnly\",\n      \"disabledKeys\",\n      \"children\",\n      \"class\",\n      \"style\",\n    ],\n    [\"aria-label\", \"aria-labelledby\"],\n  );\n\n  const stateProps = createMemo<StepListStateProps>(() => ({\n    items: local.items,\n    selectedKey: local.selectedKey,\n    defaultSelectedKey: local.defaultSelectedKey,\n    onSelectionChange: local.onSelectionChange,\n    lastCompletedStep: local.lastCompletedStep,\n    defaultLastCompletedStep: local.defaultLastCompletedStep,\n    onLastCompletedStepChange: local.onLastCompletedStepChange,\n    isDisabled: local.isDisabled,\n    isReadOnly: local.isReadOnly,\n    disabledKeys: local.disabledKeys,\n  }));\n\n  const state = createStepListState(stateProps());\n\n  // Create ARIA props\n  const { stepListProps } = createStepList(\n    {\n      get \"aria-label\"() {\n        return ariaProps[\"aria-label\"];\n      },\n      get \"aria-labelledby\"() {\n        return ariaProps[\"aria-labelledby\"];\n      },\n    },\n    state,\n  );\n\n  const renderValues = createMemo<StepListRenderProps>(() => ({\n    isDisabled: state.isDisabled(),\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-StepList\",\n    },\n    renderValues,\n  );\n\n  const domProps = createMemo(() =>\n    filterDOMProps(domRest as Record<string, unknown>, { global: true }),\n  );\n\n  return (\n    <StepListStateContext.Provider value={state}>\n      <ol\n        {...stepListProps}\n        {...domProps()}\n        class={renderProps.class()}\n        style={renderProps.style()}\n        data-disabled={state.isDisabled() || undefined}\n      >\n        <For each={local.items}>\n          {(item, index) => {\n            const stepNumber = () => index() + 1;\n\n            // Build render props as a static snapshot for the initial render.\n            const renderProps: StepListItemRenderProps = {\n              get isSelected() {\n                return state.selectedKey() === item.key;\n              },\n              get isCompleted() {\n                return state.isCompleted(item.key);\n              },\n              get isDisabled() {\n                return state.isDisabled() || !state.isSelectable(item.key);\n              },\n              get isSelectable() {\n                return state.isSelectable(item.key);\n              },\n              get stepNumber() {\n                return stepNumber();\n              },\n              get stepStateText() {\n                if (state.selectedKey() === item.key) return \"Current\";\n                if (state.isCompleted(item.key)) return \"Completed\";\n                return \"Not completed\";\n              },\n            };\n\n            return local.children(item, renderProps);\n          }}\n        </For>\n      </ol>\n    </StepListStateContext.Provider>\n  );\n}\n\n/**\n * Step represents an individual step within a StepList.\n * Renders as an `<li>` wrapping an `<a>` with accessible step props.\n */\nexport function Step(props: StepProps): JSX.Element {\n  const [local, domProps] = splitProps(props, [\"item\", \"stepNumber\", \"children\", \"class\", \"style\"]);\n\n  const state = useStepListState();\n\n  const isSelected = () => state.selectedKey() === local.item.key;\n  const isCompleted = () => state.isCompleted(local.item.key);\n  const selectable = () => state.isSelectable(local.item.key);\n\n  const handleClick = (e: MouseEvent) => {\n    e.preventDefault();\n    if (selectable()) {\n      state.setSelectedKey(local.item.key);\n    }\n  };\n\n  const handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === \"ArrowUp\" || e.key === \"ArrowDown\") {\n      e.preventDefault();\n      return;\n    }\n    if (e.key === \"Enter\" || e.key === \" \") {\n      e.preventDefault();\n      if (selectable()) {\n        state.setSelectedKey(local.item.key);\n      }\n    }\n  };\n\n  const stepStateText = () => {\n    if (isSelected()) return \"Current\";\n    if (isCompleted()) return \"Completed\";\n    return \"Not completed\";\n  };\n\n  return (\n    <li\n      {...domProps}\n      class={local.class}\n      style={local.style}\n      data-selected={isSelected() || undefined}\n      data-completed={isCompleted() || undefined}\n      data-disabled={!selectable() || undefined}\n      data-selectable={selectable() || undefined}\n    >\n      <a\n        role=\"link\"\n        aria-current={isSelected() ? \"step\" : undefined}\n        aria-disabled={!selectable() ? true : undefined}\n        tabIndex={selectable() ? 0 : undefined}\n        onClick={handleClick}\n        on:keydown={handleKeyDown}\n        aria-label={`Step ${local.stepNumber}: ${local.item.label}, ${stepStateText()}`}\n      >\n        {local.children}\n      </a>\n    </li>\n  );\n}\n"],"mappings":"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"}

package/dist/Switch.d.ts

@@ -6,7 +6,7 @@
  *
  * Named "ToggleSwitch" to avoid conflict with SolidJS's built-in Switch component.
  */
-import { type JSX } from "solid-js";
+import { type JSX, type Context } from "solid-js";
 import { type AriaSwitchProps } from "@proyecto-viviana/solidaria";
 import { type ToggleState } from "@proyecto-viviana/solid-stately";
 import { type RenderChildren, type ClassNameOrFunction, type StyleOrFunction, type SlotProps } from "./utils";
@@ -42,7 +42,7 @@ export interface ToggleSwitchProps extends Omit<AriaSwitchProps, "children">, Sl
     /** An error message for the switch. */
     errorMessage?: JSX.Element;
 }
-export declare const ToggleSwitchContext: import("solid-js").Context<ToggleSwitchProps | null>;
+export declare const ToggleSwitchContext: Context<ToggleSwitchProps | null>;
 /**
  * A switch allows a user to turn a setting on or off.
  *
@@ -66,4 +66,67 @@ export declare const ToggleSwitchContext: import("solid-js").Context<ToggleSwitc
  * ```
  */
 export declare function ToggleSwitch(props: ToggleSwitchProps): JSX.Element;
+export interface SwitchFieldRenderProps {
+    /** Whether the switch is selected. */
+    isSelected: boolean;
+    /** Whether the switch is disabled. */
+    isDisabled: boolean;
+    /** Whether the switch is read only. */
+    isReadOnly: boolean;
+    /** Whether the switch is invalid. */
+    isInvalid: boolean;
+    /** Whether the switch is required. */
+    isRequired: boolean;
+    /** State of the switch. */
+    state: ToggleState;
+}
+export interface SwitchButtonRenderProps extends ToggleSwitchRenderProps {
+    /** Whether the switch is required. */
+    isRequired: boolean;
+}
+export interface SwitchFieldProps extends Omit<AriaSwitchProps, "children">, SlotProps {
+    /** The children of the component (typically a `SwitchButton`). A function may receive render props. */
+    children?: RenderChildren<SwitchFieldRenderProps>;
+    /** The CSS className for the element. */
+    class?: ClassNameOrFunction<SwitchFieldRenderProps>;
+    /** The inline style for the element. */
+    style?: StyleOrFunction<SwitchFieldRenderProps>;
+}
+export interface SwitchButtonProps extends SlotProps {
+    /** The children of the component. A function may be provided to receive render props. */
+    children?: RenderChildren<SwitchButtonRenderProps>;
+    /** The CSS className for the element. */
+    class?: ClassNameOrFunction<SwitchButtonRenderProps>;
+    /** The inline style for the element. */
+    style?: StyleOrFunction<SwitchButtonRenderProps>;
+    /** Handler called when hover starts. */
+    onHoverStart?: () => void;
+    /** Handler called when hover ends. */
+    onHoverEnd?: () => void;
+    /** Handler called when hover state changes. */
+    onHoverChange?: (isHovered: boolean) => void;
+}
+export interface SwitchFieldContextValue extends SwitchFieldProps {
+    slots?: Record<string, SwitchFieldProps>;
+}
+export declare const SwitchFieldContext: Context<SwitchFieldContextValue | null>;
+/**
+ * A switch button is the clickable area of a switch, including the indicator and label.
+ * Must be rendered inside a `SwitchField` (or the legacy `ToggleSwitch`).
+ */
+export declare function SwitchButton(props: SwitchButtonProps): JSX.Element;
+/**
+ * A switch allows a user to turn a setting on or off, with support for validation and help text.
+ * Wraps a `SwitchButton` and provides description/error wiring through
+ * TextContext slots — render help text with `<Text slot="description">`.
+ *
+ * @example
+ * ```tsx
+ * <SwitchField>
+ *   <SwitchButton>Enable sync</SwitchButton>
+ *   <Text slot="description">Sync across devices</Text>
+ * </SwitchField>
+ * ```
+ */
+export declare function SwitchField(props: SwitchFieldProps): JSX.Element;
 //# sourceMappingURL=Switch.d.ts.map

package/dist/Switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../src/Switch.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,KAAK,GAAG,EAQT,MAAM,UAAU,CAAC;AAClB,OAAO,EAIL,KAAK,eAAe,EACrB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAqB,KAAK,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAEtF,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,SAAS,EAGf,MAAM,SAAS,CAAC;AAEjB,MAAM,WAAW,uBAAuB;IACtC,sCAAsC;IACtC,UAAU,EAAE,OAAO,CAAC;IACpB,4DAA4D;IAC5D,SAAS,EAAE,OAAO,CAAC;IACnB,0DAA0D;IAC1D,SAAS,EAAE,OAAO,CAAC;IACnB,qEAAqE;IACrE,SAAS,EAAE,OAAO,CAAC;IACnB,8CAA8C;IAC9C,cAAc,EAAE,OAAO,CAAC;IACxB,sCAAsC;IACtC,UAAU,EAAE,OAAO,CAAC;IACpB,uCAAuC;IACvC,UAAU,EAAE,OAAO,CAAC;IACpB,qCAAqC;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,2BAA2B;IAC3B,KAAK,EAAE,WAAW,CAAC;CACpB;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,EAAE,SAAS;IACrF,yFAAyF;IACzF,QAAQ,CAAC,EAAE,cAAc,CAAC,uBAAuB,CAAC,CAAC;IACnD,yCAAyC;IACzC,KAAK,CAAC,EAAE,mBAAmB,CAAC,uBAAuB,CAAC,CAAC;IACrD,wCAAwC;IACxC,KAAK,CAAC,EAAE,eAAe,CAAC,uBAAuB,CAAC,CAAC;IACjD,oCAAoC;IACpC,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC1B,uCAAuC;IACvC,YAAY,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,mBAAmB,sDAAgD,CAAC;AAEjF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,GAAG,CAAC,OAAO,CAqKlE"}
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../src/Switch.tsx"],"names":[],"mappings":"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"}