@chayns-ui/core 0.3.2 → 0.4.1

package/dist/components/segmented-control/SegmentedControl.js

@@ -0,0 +1,146 @@
+import { SegmentedControlContext, useSegmentedControlContext } from "./SegmentedControlContext.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef, useId, useLayoutEffect, useRef, useState } from "react";
+//#region src/components/segmented-control/SegmentedControl.tsx
+function getOrderedSegments(segments) {
+	return [...segments.entries()].filter(([, element]) => !element.disabled).sort(([, first], [, second]) => {
+		return first.compareDocumentPosition(second) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
+	});
+}
+var Segment = forwardRef(function Segment({ children, className, disabled, value, ...buttonProps }, ref) {
+	const control = useSegmentedControlContext();
+	const localRef = useRef(null);
+	const isSelected = control.value === value;
+	const resolvedClassName = [
+		"chayns-segmented-control__segment",
+		isSelected ? "chayns-segmented-control__segment--selected" : "",
+		className
+	].filter(Boolean).join(" ");
+	useLayoutEffect(() => {
+		if (localRef.current === null) return;
+		return control.registerSegment(value, localRef.current);
+	}, [control, value]);
+	function setRef(element) {
+		localRef.current = element;
+		if (typeof ref === "function") ref(element);
+		else if (ref !== null) ref.current = element;
+	}
+	function handleKeyDown(event) {
+		if ([
+			"ArrowDown",
+			"ArrowLeft",
+			"ArrowRight",
+			"ArrowUp",
+			"End",
+			"Home"
+		].includes(event.key)) {
+			event.preventDefault();
+			control.moveFocus(value, event.key);
+		}
+	}
+	return /* @__PURE__ */ jsx("button", {
+		...buttonProps,
+		"aria-checked": isSelected,
+		className: resolvedClassName,
+		disabled,
+		onClick: () => control.selectValue(value),
+		onKeyDown: handleKeyDown,
+		ref: setRef,
+		role: "radio",
+		tabIndex: isSelected ? 0 : -1,
+		type: "button",
+		children
+	});
+});
+var SegmentedControlRoot = forwardRef(function SegmentedControlRoot({ children, className, defaultValue, label, onValueChange, value, ...rootProps }, ref) {
+	const labelId = useId();
+	const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);
+	const segments = useRef(/* @__PURE__ */ new Map());
+	const segmentsElement = useRef(null);
+	const [indicator, setIndicator] = useState({
+		offset: 0,
+		width: 0
+	});
+	const selectedValue = value ?? uncontrolledValue ?? "";
+	const resolvedClassName = ["chayns-segmented-control", className].filter(Boolean).join(" ");
+	function selectValue(nextValue) {
+		if (value === void 0) setUncontrolledValue(nextValue);
+		onValueChange?.(nextValue);
+	}
+	function registerSegment(segmentValue, element) {
+		segments.current.set(segmentValue, element);
+		return () => {
+			segments.current.delete(segmentValue);
+		};
+	}
+	function moveFocus(currentValue, key) {
+		const enabledSegments = getOrderedSegments(segments.current);
+		const currentIndex = enabledSegments.findIndex(([segmentValue]) => segmentValue === currentValue);
+		if (currentIndex === -1 || enabledSegments.length === 0) return;
+		let targetIndex = currentIndex;
+		if (key === "Home") targetIndex = 0;
+		else if (key === "End") targetIndex = enabledSegments.length - 1;
+		else if (key === "ArrowLeft" || key === "ArrowUp") targetIndex = (currentIndex - 1 + enabledSegments.length) % enabledSegments.length;
+		else if (key === "ArrowRight" || key === "ArrowDown") targetIndex = (currentIndex + 1) % enabledSegments.length;
+		const nextSegment = enabledSegments[targetIndex];
+		if (nextSegment === void 0) return;
+		const [nextValue, nextElement] = nextSegment;
+		selectValue(nextValue);
+		nextElement.focus();
+	}
+	useLayoutEffect(() => {
+		const container = segmentsElement.current;
+		const selectedSegment = segments.current.get(selectedValue);
+		if (container === null || selectedSegment === void 0) return;
+		const observedContainer = container;
+		const observedSegment = selectedSegment;
+		function updateIndicator() {
+			const paddingInlineStart = Number.parseFloat(window.getComputedStyle(observedContainer).paddingInlineStart);
+			setIndicator({
+				offset: observedSegment.offsetLeft - (Number.isNaN(paddingInlineStart) ? 0 : paddingInlineStart),
+				width: observedSegment.offsetWidth
+			});
+		}
+		updateIndicator();
+		if (typeof ResizeObserver === "undefined") return;
+		const observer = new ResizeObserver(updateIndicator);
+		observer.observe(observedContainer);
+		return () => observer.disconnect();
+	}, [selectedValue]);
+	return /* @__PURE__ */ jsx(SegmentedControlContext.Provider, {
+		value: {
+			moveFocus,
+			registerSegment,
+			selectValue,
+			value: selectedValue
+		},
+		children: /* @__PURE__ */ jsxs("div", {
+			...rootProps,
+			"aria-labelledby": labelId,
+			className: resolvedClassName,
+			ref,
+			role: "radiogroup",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "chayns-segmented-control__label",
+				id: labelId,
+				children: label
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "chayns-segmented-control__segments",
+				ref: segmentsElement,
+				children: [/* @__PURE__ */ jsx("span", {
+					"aria-hidden": "true",
+					className: "chayns-segmented-control__indicator",
+					style: {
+						transform: `translateX(${indicator.offset}px)`,
+						width: indicator.width
+					}
+				}), children]
+			})]
+		})
+	});
+});
+var SegmentedControl = Object.assign(SegmentedControlRoot, { Segment });
+//#endregion
+export { SegmentedControl as default };
+
+//# sourceMappingURL=SegmentedControl.js.map

package/dist/components/segmented-control/SegmentedControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedControl.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import { forwardRef, useId, useLayoutEffect, useRef, useState } from 'react';\nimport type { KeyboardEvent } from 'react';\n\nimport { SegmentedControlContext, useSegmentedControlContext } from './SegmentedControlContext.js';\nimport type { SegmentedControlProps, SegmentProps } from './SegmentedControl.types.js';\n\nfunction getOrderedSegments(segments: Map<string, HTMLButtonElement>) {\n  return [...segments.entries()]\n    .filter(([, element]) => !element.disabled)\n    .sort(([, first], [, second]) => {\n      const position = first.compareDocumentPosition(second);\n      return position & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;\n    });\n}\n\nconst Segment = forwardRef<HTMLButtonElement, SegmentProps>(function Segment(\n  { children, className, disabled, value, ...buttonProps },\n  ref,\n) {\n  const control = useSegmentedControlContext();\n  const localRef = useRef<HTMLButtonElement>(null);\n  const isSelected = control.value === value;\n  const resolvedClassName = [\n    'chayns-segmented-control__segment',\n    isSelected ? 'chayns-segmented-control__segment--selected' : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  useLayoutEffect(() => {\n    if (localRef.current === null) {\n      return undefined;\n    }\n\n    return control.registerSegment(value, localRef.current);\n  }, [control, value]);\n\n  function setRef(element: HTMLButtonElement | null) {\n    localRef.current = element;\n\n    if (typeof ref === 'function') {\n      ref(element);\n    } else if (ref !== null) {\n      ref.current = element;\n    }\n  }\n\n  function handleKeyDown(event: KeyboardEvent<HTMLButtonElement>) {\n    const keys = ['ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'End', 'Home'];\n\n    if (keys.includes(event.key)) {\n      event.preventDefault();\n      control.moveFocus(value, event.key);\n    }\n  }\n\n  return (\n    <button\n      {...buttonProps}\n      aria-checked={isSelected}\n      className={resolvedClassName}\n      disabled={disabled}\n      onClick={() => control.selectValue(value)}\n      onKeyDown={handleKeyDown}\n      ref={setRef}\n      role=\"radio\"\n      tabIndex={isSelected ? 0 : -1}\n      type=\"button\"\n    >\n      {children}\n    </button>\n  );\n});\n\nconst SegmentedControlRoot = forwardRef<HTMLDivElement, SegmentedControlProps>(\n  function SegmentedControlRoot(\n    { children, className, defaultValue, label, onValueChange, value, ...rootProps },\n    ref,\n  ) {\n    const labelId = useId();\n    const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);\n    const segments = useRef(new Map<string, HTMLButtonElement>());\n    const segmentsElement = useRef<HTMLDivElement>(null);\n    const [indicator, setIndicator] = useState({ offset: 0, width: 0 });\n    const selectedValue = value ?? uncontrolledValue ?? '';\n    const resolvedClassName = ['chayns-segmented-control', className].filter(Boolean).join(' ');\n\n    function selectValue(nextValue: string) {\n      if (value === undefined) {\n        setUncontrolledValue(nextValue);\n      }\n\n      onValueChange?.(nextValue);\n    }\n\n    function registerSegment(segmentValue: string, element: HTMLButtonElement) {\n      segments.current.set(segmentValue, element);\n\n      return () => {\n        segments.current.delete(segmentValue);\n      };\n    }\n\n    function moveFocus(currentValue: string, key: string) {\n      const enabledSegments = getOrderedSegments(segments.current);\n      const currentIndex = enabledSegments.findIndex(\n        ([segmentValue]) => segmentValue === currentValue,\n      );\n\n      if (currentIndex === -1 || enabledSegments.length === 0) {\n        return;\n      }\n\n      let targetIndex = currentIndex;\n\n      if (key === 'Home') {\n        targetIndex = 0;\n      } else if (key === 'End') {\n        targetIndex = enabledSegments.length - 1;\n      } else if (key === 'ArrowLeft' || key === 'ArrowUp') {\n        targetIndex = (currentIndex - 1 + enabledSegments.length) % enabledSegments.length;\n      } else if (key === 'ArrowRight' || key === 'ArrowDown') {\n        targetIndex = (currentIndex + 1) % enabledSegments.length;\n      }\n\n      const nextSegment = enabledSegments[targetIndex];\n\n      if (nextSegment === undefined) {\n        return;\n      }\n\n      const [nextValue, nextElement] = nextSegment;\n      selectValue(nextValue);\n      nextElement.focus();\n    }\n\n    useLayoutEffect(() => {\n      const container = segmentsElement.current;\n      const selectedSegment = segments.current.get(selectedValue);\n\n      if (container === null || selectedSegment === undefined) {\n        return undefined;\n      }\n\n      const observedContainer = container;\n      const observedSegment = selectedSegment;\n\n      function updateIndicator() {\n        const paddingInlineStart = Number.parseFloat(\n          window.getComputedStyle(observedContainer).paddingInlineStart,\n        );\n\n        setIndicator({\n          offset:\n            observedSegment.offsetLeft -\n            (Number.isNaN(paddingInlineStart) ? 0 : paddingInlineStart),\n          width: observedSegment.offsetWidth,\n        });\n      }\n\n      updateIndicator();\n\n      if (typeof ResizeObserver === 'undefined') {\n        return undefined;\n      }\n\n      const observer = new ResizeObserver(updateIndicator);\n      observer.observe(observedContainer);\n\n      return () => observer.disconnect();\n    }, [selectedValue]);\n\n    return (\n      <SegmentedControlContext.Provider\n        value={{ moveFocus, registerSegment, selectValue, value: selectedValue }}\n      >\n        <div\n          {...rootProps}\n          aria-labelledby={labelId}\n          className={resolvedClassName}\n          ref={ref}\n          role=\"radiogroup\"\n        >\n          <span className=\"chayns-segmented-control__label\" id={labelId}>\n            {label}\n          </span>\n          <div className=\"chayns-segmented-control__segments\" ref={segmentsElement}>\n            <span\n              aria-hidden=\"true\"\n              className=\"chayns-segmented-control__indicator\"\n              style={{ transform: `translateX(${indicator.offset}px)`, width: indicator.width }}\n            />\n            {children}\n          </div>\n        </div>\n      </SegmentedControlContext.Provider>\n    );\n  },\n);\n\nconst SegmentedControl = Object.assign(SegmentedControlRoot, { Segment });\n\nexport default SegmentedControl;\n"],"mappings":";;;;AAMA,SAAS,mBAAmB,UAA0C;CACpE,OAAO,CAAC,GAAG,SAAS,QAAQ,CAAC,CAAC,CAC3B,QAAQ,GAAG,aAAa,CAAC,QAAQ,QAAQ,CAAC,CAC1C,MAAM,GAAG,QAAQ,GAAG,YAAY;EAE/B,OADiB,MAAM,wBAAwB,MACxC,IAAW,KAAK,8BAA8B,KAAK;CAC5D,CAAC;AACL;AAEA,IAAM,UAAU,WAA4C,SAAS,QACnE,EAAE,UAAU,WAAW,UAAU,OAAO,GAAG,eAC3C,KACA;CACA,MAAM,UAAU,2BAA2B;CAC3C,MAAM,WAAW,OAA0B,IAAI;CAC/C,MAAM,aAAa,QAAQ,UAAU;CACrC,MAAM,oBAAoB;EACxB;EACA,aAAa,gDAAgD;EAC7D;CACF,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CAEX,sBAAsB;EACpB,IAAI,SAAS,YAAY,MACvB;EAGF,OAAO,QAAQ,gBAAgB,OAAO,SAAS,OAAO;CACxD,GAAG,CAAC,SAAS,KAAK,CAAC;CAEnB,SAAS,OAAO,SAAmC;EACjD,SAAS,UAAU;EAEnB,IAAI,OAAO,QAAQ,YACjB,IAAI,OAAO;OACN,IAAI,QAAQ,MACjB,IAAI,UAAU;CAElB;CAEA,SAAS,cAAc,OAAyC;EAG9D,IAAI;GAFU;GAAa;GAAa;GAAc;GAAW;GAAO;EAEpE,CAAA,CAAK,SAAS,MAAM,GAAG,GAAG;GAC5B,MAAM,eAAe;GACrB,QAAQ,UAAU,OAAO,MAAM,GAAG;EACpC;CACF;CAEA,OACE,oBAAC,UAAD;EACE,GAAI;EACJ,gBAAc;EACd,WAAW;EACD;EACV,eAAe,QAAQ,YAAY,KAAK;EACxC,WAAW;EACX,KAAK;EACL,MAAK;EACL,UAAU,aAAa,IAAI;EAC3B,MAAK;EAEJ;CACK,CAAA;AAEZ,CAAC;AAED,IAAM,uBAAuB,WAC3B,SAAS,qBACP,EAAE,UAAU,WAAW,cAAc,OAAO,eAAe,OAAO,GAAG,aACrE,KACA;CACA,MAAM,UAAU,MAAM;CACtB,MAAM,CAAC,mBAAmB,wBAAwB,SAAS,YAAY;CACvE,MAAM,WAAW,uBAAO,IAAI,IAA+B,CAAC;CAC5D,MAAM,kBAAkB,OAAuB,IAAI;CACnD,MAAM,CAAC,WAAW,gBAAgB,SAAS;EAAE,QAAQ;EAAG,OAAO;CAAE,CAAC;CAClE,MAAM,gBAAgB,SAAS,qBAAqB;CACpD,MAAM,oBAAoB,CAAC,4BAA4B,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAE1F,SAAS,YAAY,WAAmB;EACtC,IAAI,UAAU,KAAA,GACZ,qBAAqB,SAAS;EAGhC,gBAAgB,SAAS;CAC3B;CAEA,SAAS,gBAAgB,cAAsB,SAA4B;EACzE,SAAS,QAAQ,IAAI,cAAc,OAAO;EAE1C,aAAa;GACX,SAAS,QAAQ,OAAO,YAAY;EACtC;CACF;CAEA,SAAS,UAAU,cAAsB,KAAa;EACpD,MAAM,kBAAkB,mBAAmB,SAAS,OAAO;EAC3D,MAAM,eAAe,gBAAgB,WAClC,CAAC,kBAAkB,iBAAiB,YACvC;EAEA,IAAI,iBAAiB,MAAM,gBAAgB,WAAW,GACpD;EAGF,IAAI,cAAc;EAElB,IAAI,QAAQ,QACV,cAAc;OACT,IAAI,QAAQ,OACjB,cAAc,gBAAgB,SAAS;OAClC,IAAI,QAAQ,eAAe,QAAQ,WACxC,eAAe,eAAe,IAAI,gBAAgB,UAAU,gBAAgB;OACvE,IAAI,QAAQ,gBAAgB,QAAQ,aACzC,eAAe,eAAe,KAAK,gBAAgB;EAGrD,MAAM,cAAc,gBAAgB;EAEpC,IAAI,gBAAgB,KAAA,GAClB;EAGF,MAAM,CAAC,WAAW,eAAe;EACjC,YAAY,SAAS;EACrB,YAAY,MAAM;CACpB;CAEA,sBAAsB;EACpB,MAAM,YAAY,gBAAgB;EAClC,MAAM,kBAAkB,SAAS,QAAQ,IAAI,aAAa;EAE1D,IAAI,cAAc,QAAQ,oBAAoB,KAAA,GAC5C;EAGF,MAAM,oBAAoB;EAC1B,MAAM,kBAAkB;EAExB,SAAS,kBAAkB;GACzB,MAAM,qBAAqB,OAAO,WAChC,OAAO,iBAAiB,iBAAiB,CAAC,CAAC,kBAC7C;GAEA,aAAa;IACX,QACE,gBAAgB,cACf,OAAO,MAAM,kBAAkB,IAAI,IAAI;IAC1C,OAAO,gBAAgB;GACzB,CAAC;EACH;EAEA,gBAAgB;EAEhB,IAAI,OAAO,mBAAmB,aAC5B;EAGF,MAAM,WAAW,IAAI,eAAe,eAAe;EACnD,SAAS,QAAQ,iBAAiB;EAElC,aAAa,SAAS,WAAW;CACnC,GAAG,CAAC,aAAa,CAAC;CAElB,OACE,oBAAC,wBAAwB,UAAzB;EACE,OAAO;GAAE;GAAW;GAAiB;GAAa,OAAO;EAAc;EAEvE,UAAA,qBAAC,OAAD;GACE,GAAI;GACJ,mBAAiB;GACjB,WAAW;GACN;GACL,MAAK;GALP,UAAA,CAOE,oBAAC,QAAD;IAAM,WAAU;IAAkC,IAAI;IACnD,UAAA;GACG,CAAA,GACN,qBAAC,OAAD;IAAK,WAAU;IAAqC,KAAK;IAAzD,UAAA,CACE,oBAAC,QAAD;KACE,eAAY;KACZ,WAAU;KACV,OAAO;MAAE,WAAW,cAAc,UAAU,OAAO;MAAM,OAAO,UAAU;KAAM;IACjF,CAAA,GACA,QACE;GACF,CAAA,CAAA;;CAC2B,CAAA;AAEtC,CACF;AAEA,IAAM,mBAAmB,OAAO,OAAO,sBAAsB,EAAE,QAAQ,CAAC"}

package/dist/components/segmented-control/SegmentedControl.types.d.ts

@@ -0,0 +1,41 @@
+import type { ComponentPropsWithRef, ReactNode } from 'react';
+export interface ControlledSelection {
+    /** Controlled selected segment value. */
+    value: string;
+    /** Receives the next value after activation. */
+    onValueChange: (value: string) => void;
+    defaultValue?: never;
+}
+export interface UncontrolledSelection {
+    /** Initial selected segment value. */
+    defaultValue: string;
+    /** Controlled value is not accepted for uncontrolled use. */
+    value?: never;
+    /** Receives the next value after activation. */
+    onValueChange?: (value: string) => void;
+}
+/** Props for a labelled, single-selection segmented radiogroup. */
+export type SegmentedControlProps = Omit<ComponentPropsWithRef<'div'>, 'aria-labelledby' | 'children' | 'role'> & (ControlledSelection | UncontrolledSelection) & {
+    /** Visible, localized group label. */
+    label: Exclude<ReactNode, boolean | null | undefined>;
+    /** SegmentedControl.Segment children. */
+    children: ReactNode;
+    /** SegmentedControl owns the radiogroup semantics and label relationship. */
+    role?: never;
+    'aria-labelledby'?: never;
+};
+/** Props for a visible-label native button segment. */
+export interface SegmentProps extends Omit<ComponentPropsWithRef<'button'>, 'aria-checked' | 'children' | 'onClick' | 'onKeyDown' | 'role' | 'tabIndex' | 'type'> {
+    /** Stable value that identifies this segment in its control. */
+    value: string;
+    /** Visible, localized button label. */
+    children: Exclude<ReactNode, boolean | null | undefined>;
+    /** SegmentedControl owns the native button semantics and interactions. */
+    type?: never;
+    role?: never;
+    'aria-checked'?: never;
+    tabIndex?: never;
+    onClick?: never;
+    onKeyDown?: never;
+}
+//# sourceMappingURL=SegmentedControl.types.d.ts.map

package/dist/components/segmented-control/SegmentedControl.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedControl.types.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/SegmentedControl.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,WAAW,mBAAmB;IAClC,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB;AAED,MAAM,WAAW,qBAAqB;IACpC,sCAAsC;IACtC,YAAY,EAAE,MAAM,CAAC;IACrB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,gDAAgD;IAChD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,mEAAmE;AACnE,MAAM,MAAM,qBAAqB,GAAG,IAAI,CACtC,qBAAqB,CAAC,KAAK,CAAC,EAC5B,iBAAiB,GAAG,UAAU,GAAG,MAAM,CACxC,GACC,CAAC,mBAAmB,GAAG,qBAAqB,CAAC,GAAG;IAC9C,sCAAsC;IACtC,KAAK,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACtD,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;IACpB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CAAC;AAEJ,uDAAuD;AACvD,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,qBAAqB,CAAC,QAAQ,CAAC,EAC/B,cAAc,GAAG,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CACrF;IACC,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,uCAAuC;IACvC,QAAQ,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACzD,0EAA0E;IAC1E,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC;CACnB"}

package/dist/components/segmented-control/SegmentedControlContext.d.ts

@@ -0,0 +1,11 @@
+interface SegmentedControlContextValue {
+    moveFocus: (currentValue: string, key: string) => void;
+    registerSegment: (value: string, element: HTMLButtonElement) => () => void;
+    selectValue: (value: string) => void;
+    value: string;
+}
+declare const SegmentedControlContext: import("react").Context<SegmentedControlContextValue | null>;
+declare function useSegmentedControlContext(): SegmentedControlContextValue;
+export { SegmentedControlContext, useSegmentedControlContext };
+export type { SegmentedControlContextValue };
+//# sourceMappingURL=SegmentedControlContext.d.ts.map

package/dist/components/segmented-control/SegmentedControlContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedControlContext.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/SegmentedControlContext.ts"],"names":[],"mappings":"AAEA,UAAU,4BAA4B;IACpC,SAAS,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACvD,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,iBAAiB,KAAK,MAAM,IAAI,CAAC;IAC3E,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,uBAAuB,8DAA2D,CAAC;AAEzF,iBAAS,0BAA0B,iCAQlC;AAED,OAAO,EAAE,uBAAuB,EAAE,0BAA0B,EAAE,CAAC;AAC/D,YAAY,EAAE,4BAA4B,EAAE,CAAC"}

package/dist/components/segmented-control/SegmentedControlContext.js

@@ -0,0 +1,12 @@
+import { createContext, useContext } from "react";
+//#region src/components/segmented-control/SegmentedControlContext.ts
+var SegmentedControlContext = createContext(null);
+function useSegmentedControlContext() {
+	const context = useContext(SegmentedControlContext);
+	if (context === null) throw new Error("SegmentedControl.Segment must be rendered within SegmentedControl.");
+	return context;
+}
+//#endregion
+export { SegmentedControlContext, useSegmentedControlContext };
+
+//# sourceMappingURL=SegmentedControlContext.js.map

package/dist/components/segmented-control/SegmentedControlContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedControlContext.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\ninterface SegmentedControlContextValue {\n  moveFocus: (currentValue: string, key: string) => void;\n  registerSegment: (value: string, element: HTMLButtonElement) => () => void;\n  selectValue: (value: string) => void;\n  value: string;\n}\n\nconst SegmentedControlContext = createContext<SegmentedControlContextValue | null>(null);\n\nfunction useSegmentedControlContext() {\n  const context = useContext(SegmentedControlContext);\n\n  if (context === null) {\n    throw new Error('SegmentedControl.Segment must be rendered within SegmentedControl.');\n  }\n\n  return context;\n}\n\nexport { SegmentedControlContext, useSegmentedControlContext };\nexport type { SegmentedControlContextValue };\n"],"mappings":";;AASA,IAAM,0BAA0B,cAAmD,IAAI;AAEvF,SAAS,6BAA6B;CACpC,MAAM,UAAU,WAAW,uBAAuB;CAElD,IAAI,YAAY,MACd,MAAM,IAAI,MAAM,oEAAoE;CAGtF,OAAO;AACT"}

package/dist/components/switch/Switch.d.ts

@@ -0,0 +1,4 @@
+import type { SwitchProps } from './Switch.types.js';
+declare function Switch({ children, className, ...inputProps }: SwitchProps): import("react").JSX.Element;
+export default Switch;
+//# sourceMappingURL=Switch.d.ts.map

package/dist/components/switch/Switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,iBAAS,MAAM,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,UAAU,EAAE,EAAE,WAAW,+BAYlE;AAED,eAAe,MAAM,CAAC"}

package/dist/components/switch/Switch.js

@@ -0,0 +1,28 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/switch/Switch.tsx
+function Switch({ children, className, ...inputProps }) {
+	const inputClassName = ["chayns-switch__input", className].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsxs("label", {
+		className: "chayns-switch",
+		children: [
+			/* @__PURE__ */ jsx("span", {
+				className: "chayns-switch__label",
+				children
+			}),
+			/* @__PURE__ */ jsx("input", {
+				...inputProps,
+				className: inputClassName,
+				type: "checkbox"
+			}),
+			/* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				className: "chayns-switch__control",
+				children: /* @__PURE__ */ jsx("span", { className: "chayns-switch__knob" })
+			})
+		]
+	});
+}
+//#endregion
+export { Switch as default };
+
+//# sourceMappingURL=Switch.js.map

package/dist/components/switch/Switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","names":[],"sources":["../../../src/components/switch/Switch.tsx"],"sourcesContent":["import type { SwitchProps } from './Switch.types.js';\n\nfunction Switch({ children, className, ...inputProps }: SwitchProps) {\n  const inputClassName = ['chayns-switch__input', className].filter(Boolean).join(' ');\n\n  return (\n    <label className=\"chayns-switch\">\n      <span className=\"chayns-switch__label\">{children}</span>\n      <input {...inputProps} className={inputClassName} type=\"checkbox\" />\n      <span aria-hidden=\"true\" className=\"chayns-switch__control\">\n        <span className=\"chayns-switch__knob\" />\n      </span>\n    </label>\n  );\n}\n\nexport default Switch;\n"],"mappings":";;AAEA,SAAS,OAAO,EAAE,UAAU,WAAW,GAAG,cAA2B;CACnE,MAAM,iBAAiB,CAAC,wBAAwB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEnF,OACE,qBAAC,SAAD;EAAO,WAAU;EAAjB,UAAA;GACE,oBAAC,QAAD;IAAM,WAAU;IAAwB;GAAe,CAAA;GACvD,oBAAC,SAAD;IAAO,GAAI;IAAY,WAAW;IAAgB,MAAK;GAAY,CAAA;GACnE,oBAAC,QAAD;IAAM,eAAY;IAAO,WAAU;IACjC,UAAA,oBAAC,QAAD,EAAM,WAAU,sBAAuB,CAAA;GACnC,CAAA;EACD;;AAEX"}

package/dist/components/switch/Switch.types.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentPropsWithRef, ReactNode } from 'react';
+/** Props for a visible-label native checkbox used as an immediate setting. */
+export interface SwitchProps extends Omit<ComponentPropsWithRef<'input'>, 'children' | 'type'> {
+    /** Visible, localized label associated with the native checkbox. */
+    children: Exclude<ReactNode, boolean | null | undefined>;
+    /** Switch owns its native input type. */
+    type?: never;
+}
+//# sourceMappingURL=Switch.types.d.ts.map

package/dist/components/switch/Switch.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.types.d.ts","sourceRoot":"","sources":["../../../src/components/switch/Switch.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,8EAA8E;AAC9E,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IAC5F,oEAAoE;IACpE,QAAQ,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IAEzD,yCAAyC;IACzC,IAAI,CAAC,EAAE,KAAK,CAAC;CACd"}

package/dist/components/text-area/TextArea.d.ts

@@ -0,0 +1,4 @@
+import type { TextAreaProps } from './TextArea.types.js';
+declare function TextArea({ className, counter, error, helpText, id, placeholder, ...textareaProps }: TextAreaProps): import("react").JSX.Element;
+export default TextArea;
+//# sourceMappingURL=TextArea.d.ts.map

package/dist/components/text-area/TextArea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/TextArea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEzD,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,OAAO,EACP,KAAK,EACL,QAAQ,EACR,EAAE,EACF,WAAW,EACX,GAAG,aAAa,EACjB,EAAE,aAAa,+BAuCf;AAED,eAAe,QAAQ,CAAC"}

package/dist/components/text-area/TextArea.js

@@ -0,0 +1,45 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useId } from "react";
+//#region src/components/text-area/TextArea.tsx
+function TextArea({ className, counter, error, helpText, id, placeholder, ...textareaProps }) {
+	const generatedId = useId();
+	const textareaId = id ?? generatedId;
+	const hasError = error !== void 0;
+	const helpId = helpText !== void 0 ? `${textareaId}-help` : void 0;
+	const errorId = hasError ? `${textareaId}-error` : void 0;
+	const describedBy = [helpId, errorId].filter(Boolean).join(" ") || void 0;
+	const textareaClassName = ["chayns-text-area__input", className].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsxs("div", {
+		className: `chayns-text-area${hasError ? " chayns-text-area--error" : ""}`,
+		children: [
+			/* @__PURE__ */ jsx("textarea", {
+				...textareaProps,
+				"aria-describedby": describedBy,
+				"aria-invalid": hasError || void 0,
+				className: textareaClassName,
+				id: textareaId,
+				placeholder: placeholder === void 0 ? void 0 : " "
+			}),
+			placeholder !== void 0 ? /* @__PURE__ */ jsx("label", {
+				className: "chayns-text-area__label",
+				htmlFor: textareaId,
+				children: placeholder
+			}) : null,
+			helpText !== void 0 || hasError || counter !== void 0 ? /* @__PURE__ */ jsxs("div", {
+				className: "chayns-text-area__help",
+				children: [/* @__PURE__ */ jsxs("div", { children: [helpText !== void 0 ? /* @__PURE__ */ jsx("div", {
+					id: helpId,
+					children: helpText
+				}) : null, hasError ? /* @__PURE__ */ jsx("div", {
+					className: "chayns-text-area__error",
+					id: errorId,
+					children: error
+				}) : null] }), counter !== void 0 ? /* @__PURE__ */ jsx("div", { children: counter }) : null]
+			}) : null
+		]
+	});
+}
+//#endregion
+export { TextArea as default };
+
+//# sourceMappingURL=TextArea.js.map

package/dist/components/text-area/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","names":[],"sources":["../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import { useId } from 'react';\n\nimport type { TextAreaProps } from './TextArea.types.js';\n\nfunction TextArea({\n  className,\n  counter,\n  error,\n  helpText,\n  id,\n  placeholder,\n  ...textareaProps\n}: TextAreaProps) {\n  const generatedId = useId();\n  const textareaId = id ?? generatedId;\n  const hasError = error !== undefined;\n  const helpId = helpText !== undefined ? `${textareaId}-help` : undefined;\n  const errorId = hasError ? `${textareaId}-error` : undefined;\n  const describedBy = [helpId, errorId].filter(Boolean).join(' ') || undefined;\n  const textareaClassName = ['chayns-text-area__input', className].filter(Boolean).join(' ');\n\n  return (\n    <div className={`chayns-text-area${hasError ? ' chayns-text-area--error' : ''}`}>\n      <textarea\n        {...textareaProps}\n        aria-describedby={describedBy}\n        aria-invalid={hasError || undefined}\n        className={textareaClassName}\n        id={textareaId}\n        placeholder={placeholder === undefined ? undefined : ' '}\n      />\n      {placeholder !== undefined ? (\n        <label className=\"chayns-text-area__label\" htmlFor={textareaId}>\n          {placeholder}\n        </label>\n      ) : null}\n      {helpText !== undefined || hasError || counter !== undefined ? (\n        <div className=\"chayns-text-area__help\">\n          <div>\n            {helpText !== undefined ? <div id={helpId}>{helpText}</div> : null}\n            {hasError ? (\n              <div className=\"chayns-text-area__error\" id={errorId}>\n                {error}\n              </div>\n            ) : null}\n          </div>\n          {counter !== undefined ? <div>{counter}</div> : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nexport default TextArea;\n"],"mappings":";;;AAIA,SAAS,SAAS,EAChB,WACA,SACA,OACA,UACA,IACA,aACA,GAAG,iBACa;CAChB,MAAM,cAAc,MAAM;CAC1B,MAAM,aAAa,MAAM;CACzB,MAAM,WAAW,UAAU,KAAA;CAC3B,MAAM,SAAS,aAAa,KAAA,IAAY,GAAG,WAAW,SAAS,KAAA;CAC/D,MAAM,UAAU,WAAW,GAAG,WAAW,UAAU,KAAA;CACnD,MAAM,cAAc,CAAC,QAAQ,OAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA;CACnE,MAAM,oBAAoB,CAAC,2BAA2B,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEzF,OACE,qBAAC,OAAD;EAAK,WAAW,mBAAmB,WAAW,6BAA6B;EAA3E,UAAA;GACE,oBAAC,YAAD;IACE,GAAI;IACJ,oBAAkB;IAClB,gBAAc,YAAY,KAAA;IAC1B,WAAW;IACX,IAAI;IACJ,aAAa,gBAAgB,KAAA,IAAY,KAAA,IAAY;GACtD,CAAA;GACA,gBAAgB,KAAA,IACf,oBAAC,SAAD;IAAO,WAAU;IAA0B,SAAS;IACjD,UAAA;GACI,CAAA,IACL;GACH,aAAa,KAAA,KAAa,YAAY,YAAY,KAAA,IACjD,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,qBAAC,OAAD,EAAA,UAAA,CACG,aAAa,KAAA,IAAY,oBAAC,OAAD;KAAK,IAAI;KAAS,UAAA;IAAc,CAAA,IAAI,MAC7D,WACC,oBAAC,OAAD;KAAK,WAAU;KAA0B,IAAI;KAC1C,UAAA;IACE,CAAA,IACH,IACD,EAAA,CAAA,GACJ,YAAY,KAAA,IAAY,oBAAC,OAAD,EAAA,UAAM,QAAa,CAAA,IAAI,IAC7C;GACH,CAAA,IAAA;EACD;;AAET"}

package/dist/components/text-area/TextArea.types.d.ts

@@ -0,0 +1,15 @@
+import type { ComponentPropsWithRef, ReactNode } from 'react';
+/** Props for a native multi-line textarea with optional help and error content. */
+export interface TextAreaProps extends Omit<ComponentPropsWithRef<'textarea'>, 'aria-describedby' | 'aria-invalid' | 'children'> {
+    /** Supporting content linked to the textarea. */
+    helpText?: ReactNode;
+    /** Validation content linked to the textarea and reflected through aria-invalid. */
+    error?: ReactNode;
+    /** Visible, consumer-provided counter content. */
+    counter?: ReactNode;
+    /** Description IDs are generated from the documented help/error slots. */
+    'aria-describedby'?: never;
+    /** Invalid state is derived exclusively from the documented error slot. */
+    'aria-invalid'?: never;
+}
+//# sourceMappingURL=TextArea.types.d.ts.map

package/dist/components/text-area/TextArea.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.types.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/TextArea.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,mFAAmF;AACnF,MAAM,WAAW,aAAc,SAAQ,IAAI,CACzC,qBAAqB,CAAC,UAAU,CAAC,EACjC,kBAAkB,GAAG,cAAc,GAAG,UAAU,CACjD;IACC,iDAAiD;IACjD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oFAAoF;IACpF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kDAAkD;IAClD,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB,0EAA0E;IAC1E,kBAAkB,CAAC,EAAE,KAAK,CAAC;IAE3B,2EAA2E;IAC3E,cAAc,CAAC,EAAE,KAAK,CAAC;CACxB"}

package/dist/components/text-field/TextField.d.ts

@@ -0,0 +1,4 @@
+import type { TextFieldProps } from './TextField.types.js';
+declare function TextField({ className, counter, error, helpText, id, placeholder, ...inputProps }: TextFieldProps): import("react").JSX.Element;
+export default TextField;
+//# sourceMappingURL=TextField.d.ts.map

package/dist/components/text-field/TextField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/components/text-field/TextField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAE3D,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAO,EACP,KAAK,EACL,QAAQ,EACR,EAAE,EACF,WAAW,EACX,GAAG,UAAU,EACd,EAAE,cAAc,+BAuChB;AAED,eAAe,SAAS,CAAC"}

package/dist/components/text-field/TextField.js

@@ -0,0 +1,45 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useId } from "react";
+//#region src/components/text-field/TextField.tsx
+function TextField({ className, counter, error, helpText, id, placeholder, ...inputProps }) {
+	const generatedId = useId();
+	const inputId = id ?? generatedId;
+	const hasError = error !== void 0;
+	const helpId = helpText !== void 0 ? `${inputId}-help` : void 0;
+	const errorId = hasError ? `${inputId}-error` : void 0;
+	const describedBy = [helpId, errorId].filter(Boolean).join(" ") || void 0;
+	const inputClassName = ["chayns-text-field__input", className].filter(Boolean).join(" ");
+	return /* @__PURE__ */ jsxs("div", {
+		className: `chayns-text-field${hasError ? " chayns-text-field--error" : ""}`,
+		children: [
+			/* @__PURE__ */ jsx("input", {
+				...inputProps,
+				"aria-describedby": describedBy,
+				"aria-invalid": hasError || void 0,
+				className: inputClassName,
+				id: inputId,
+				placeholder: placeholder === void 0 ? void 0 : " "
+			}),
+			placeholder !== void 0 ? /* @__PURE__ */ jsx("label", {
+				className: "chayns-text-field__label",
+				htmlFor: inputId,
+				children: placeholder
+			}) : null,
+			helpText !== void 0 || hasError || counter !== void 0 ? /* @__PURE__ */ jsxs("div", {
+				className: "chayns-text-field__help",
+				children: [/* @__PURE__ */ jsxs("div", { children: [helpText !== void 0 ? /* @__PURE__ */ jsx("div", {
+					id: helpId,
+					children: helpText
+				}) : null, hasError ? /* @__PURE__ */ jsx("div", {
+					className: "chayns-text-field__error",
+					id: errorId,
+					children: error
+				}) : null] }), counter !== void 0 ? /* @__PURE__ */ jsx("div", { children: counter }) : null]
+			}) : null
+		]
+	});
+}
+//#endregion
+export { TextField as default };
+
+//# sourceMappingURL=TextField.js.map

package/dist/components/text-field/TextField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.js","names":[],"sources":["../../../src/components/text-field/TextField.tsx"],"sourcesContent":["import { useId } from 'react';\n\nimport type { TextFieldProps } from './TextField.types.js';\n\nfunction TextField({\n  className,\n  counter,\n  error,\n  helpText,\n  id,\n  placeholder,\n  ...inputProps\n}: TextFieldProps) {\n  const generatedId = useId();\n  const inputId = id ?? generatedId;\n  const hasError = error !== undefined;\n  const helpId = helpText !== undefined ? `${inputId}-help` : undefined;\n  const errorId = hasError ? `${inputId}-error` : undefined;\n  const describedBy = [helpId, errorId].filter(Boolean).join(' ') || undefined;\n  const inputClassName = ['chayns-text-field__input', className].filter(Boolean).join(' ');\n\n  return (\n    <div className={`chayns-text-field${hasError ? ' chayns-text-field--error' : ''}`}>\n      <input\n        {...inputProps}\n        aria-describedby={describedBy}\n        aria-invalid={hasError || undefined}\n        className={inputClassName}\n        id={inputId}\n        placeholder={placeholder === undefined ? undefined : ' '}\n      />\n      {placeholder !== undefined ? (\n        <label className=\"chayns-text-field__label\" htmlFor={inputId}>\n          {placeholder}\n        </label>\n      ) : null}\n      {helpText !== undefined || hasError || counter !== undefined ? (\n        <div className=\"chayns-text-field__help\">\n          <div>\n            {helpText !== undefined ? <div id={helpId}>{helpText}</div> : null}\n            {hasError ? (\n              <div className=\"chayns-text-field__error\" id={errorId}>\n                {error}\n              </div>\n            ) : null}\n          </div>\n          {counter !== undefined ? <div>{counter}</div> : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nexport default TextField;\n"],"mappings":";;;AAIA,SAAS,UAAU,EACjB,WACA,SACA,OACA,UACA,IACA,aACA,GAAG,cACc;CACjB,MAAM,cAAc,MAAM;CAC1B,MAAM,UAAU,MAAM;CACtB,MAAM,WAAW,UAAU,KAAA;CAC3B,MAAM,SAAS,aAAa,KAAA,IAAY,GAAG,QAAQ,SAAS,KAAA;CAC5D,MAAM,UAAU,WAAW,GAAG,QAAQ,UAAU,KAAA;CAChD,MAAM,cAAc,CAAC,QAAQ,OAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA;CACnE,MAAM,iBAAiB,CAAC,4BAA4B,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAEvF,OACE,qBAAC,OAAD;EAAK,WAAW,oBAAoB,WAAW,8BAA8B;EAA7E,UAAA;GACE,oBAAC,SAAD;IACE,GAAI;IACJ,oBAAkB;IAClB,gBAAc,YAAY,KAAA;IAC1B,WAAW;IACX,IAAI;IACJ,aAAa,gBAAgB,KAAA,IAAY,KAAA,IAAY;GACtD,CAAA;GACA,gBAAgB,KAAA,IACf,oBAAC,SAAD;IAAO,WAAU;IAA2B,SAAS;IAClD,UAAA;GACI,CAAA,IACL;GACH,aAAa,KAAA,KAAa,YAAY,YAAY,KAAA,IACjD,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,qBAAC,OAAD,EAAA,UAAA,CACG,aAAa,KAAA,IAAY,oBAAC,OAAD;KAAK,IAAI;KAAS,UAAA;IAAc,CAAA,IAAI,MAC7D,WACC,oBAAC,OAAD;KAAK,WAAU;KAA2B,IAAI;KAC3C,UAAA;IACE,CAAA,IACH,IACD,EAAA,CAAA,GACJ,YAAY,KAAA,IAAY,oBAAC,OAAD,EAAA,UAAM,QAAa,CAAA,IAAI,IAC7C;GACH,CAAA,IAAA;EACD;;AAET"}

package/dist/components/text-field/TextField.types.d.ts

@@ -0,0 +1,15 @@
+import type { ComponentPropsWithRef, ReactNode } from 'react';
+/** Props for a native single-line input with optional help and error content. */
+export interface TextFieldProps extends Omit<ComponentPropsWithRef<'input'>, 'aria-describedby' | 'aria-invalid' | 'children'> {
+    /** Supporting content linked to the input. */
+    helpText?: ReactNode;
+    /** Validation content linked to the input and reflected through aria-invalid. */
+    error?: ReactNode;
+    /** Visible, consumer-provided counter content. */
+    counter?: ReactNode;
+    /** Description IDs are generated from the documented help/error slots. */
+    'aria-describedby'?: never;
+    /** Invalid state is derived exclusively from the documented error slot. */
+    'aria-invalid'?: never;
+}
+//# sourceMappingURL=TextField.types.d.ts.map

package/dist/components/text-field/TextField.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.types.d.ts","sourceRoot":"","sources":["../../../src/components/text-field/TextField.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,iFAAiF;AACjF,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,qBAAqB,CAAC,OAAO,CAAC,EAC9B,kBAAkB,GAAG,cAAc,GAAG,UAAU,CACjD;IACC,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,iFAAiF;IACjF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kDAAkD;IAClD,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB,0EAA0E;IAC1E,kBAAkB,CAAC,EAAE,KAAK,CAAC;IAE3B,2EAA2E;IAC3E,cAAc,CAAC,EAAE,KAAK,CAAC;CACxB"}

package/dist/index.d.ts

@@ -2,6 +2,20 @@ export { default as Button } from './components/button/Button.js';
 export { default as IconButton } from './components/icon-button/IconButton.js';
 export type { ButtonContent, ButtonIcon, ButtonProps, ButtonVariant, } from './components/button/Button.types.js';
 export type { IconButtonProps } from './components/icon-button/IconButton.types.js';
+export { default as TextField } from './components/text-field/TextField.js';
+export type { TextFieldProps } from './components/text-field/TextField.types.js';
+export { default as TextArea } from './components/text-area/TextArea.js';
+export type { TextAreaProps } from './components/text-area/TextArea.types.js';
+export { default as Checkbox } from './components/checkbox/Checkbox.js';
+export type { CheckboxProps } from './components/checkbox/Checkbox.types.js';
+export { default as Switch } from './components/switch/Switch.js';
+export type { SwitchProps } from './components/switch/Switch.types.js';
+export { default as RadioGroup } from './components/radio-group/RadioGroup.js';
+export type { RadioGroupProps, RadioProps } from './components/radio-group/RadioGroup.types.js';
+export { default as SegmentedControl } from './components/segmented-control/SegmentedControl.js';
+export type { SegmentedControlProps, SegmentProps, } from './components/segmented-control/SegmentedControl.types.js';
+export { default as MessageBox } from './components/message-box/MessageBox.js';
+export type { MessageBoxProps, MessageBoxTone } from './components/message-box/MessageBox.types.js';
 export { default as Popup } from './components/popup/Popup.js';
 export { default as PopupList } from './components/popup/PopupList.js';
 export type { PopupListItem, PopupListProps, PopupProps } from './components/popup/Popup.types.js';
@@ -14,8 +28,7 @@ export { default as AvatarGroup } from './components/avatar-group/AvatarGroup.js
 export type { AvatarProps } from './components/avatar/Avatar.types.js';
 export type { AvatarGroupProps } from './components/avatar-group/AvatarGroup.types.js';
 export { default as List } from './components/list/List.js';
-export { default as ListItem } from './components/list-item/ListItem.js';
-export type { ListProps, ListItemProps } from './components/list/List.types.js';
+export type { ListItemActionProps, ListItemPartProps, ListItemProps, ListItemStatusProps, ListProps, } from './components/list/List.types.js';
 export { default as Accordion } from './components/accordion/Accordion.js';
 export { default as AccordionGroup } from './components/accordion-group/AccordionGroup.js';
 export type { AccordionProps, AccordionGroupProps, } from './components/accordion/Accordion.types.js';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wCAAwC,CAAC;AAC/E,YAAY,EACV,aAAa,EACb,UAAU,EACV,WAAW,EACX,aAAa,GACd,MAAM,qCAAqC,CAAC;AAC7C,YAAY,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAEpF,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACvE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAEnG,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0CAA0C,CAAC;AAClF,YAAY,EAAE,gBAAgB,EAAE,MAAM,gDAAgD,CAAC;AAEvF,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,2BAA2B,CAAC;AAC5D,YAAY,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAEjE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0CAA0C,CAAC;AAClF,YAAY,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AACvE,YAAY,EAAE,gBAAgB,EAAE,MAAM,gDAAgD,CAAC;AAEvF,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AACzE,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAEhF,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,gDAAgD,CAAC;AAC3F,YAAY,EACV,cAAc,EACd,mBAAmB,GACpB,MAAM,2CAA2C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wCAAwC,CAAC;AAC/E,YAAY,EACV,aAAa,EACb,UAAU,EACV,WAAW,EACX,aAAa,GACd,MAAM,qCAAqC,CAAC;AAC7C,YAAY,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAEpF,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,sCAAsC,CAAC;AAC5E,YAAY,EAAE,cAAc,EAAE,MAAM,4CAA4C,CAAC;AAEjF,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AACzE,YAAY,EAAE,aAAa,EAAE,MAAM,0CAA0C,CAAC;AAE9E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AACxE,YAAY,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAE7E,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAClE,YAAY,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAEvE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wCAAwC,CAAC;AAC/E,YAAY,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,8CAA8C,CAAC;AAEhG,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oDAAoD,CAAC;AACjG,YAAY,EACV,qBAAqB,EACrB,YAAY,GACb,MAAM,0DAA0D,CAAC;AAElE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wCAAwC,CAAC;AAC/E,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,8CAA8C,CAAC;AAEpG,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACvE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAEnG,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0CAA0C,CAAC;AAClF,YAAY,EAAE,gBAAgB,EAAE,MAAM,gDAAgD,CAAC;AAEvF,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,2BAA2B,CAAC;AAC5D,YAAY,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAEjE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0CAA0C,CAAC;AAClF,YAAY,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AACvE,YAAY,EAAE,gBAAgB,EAAE,MAAM,gDAAgD,CAAC;AAEvF,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,2BAA2B,CAAC;AAC5D,YAAY,EACV,mBAAmB,EACnB,iBAAiB,EACjB,aAAa,EACb,mBAAmB,EACnB,SAAS,GACV,MAAM,iCAAiC,CAAC;AAEzC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,gDAAgD,CAAC;AAC3F,YAAY,EACV,cAAc,EACd,mBAAmB,GACpB,MAAM,2CAA2C,CAAC"}

package/dist/index.js

@@ -1,13 +1,19 @@
 import Button from "./components/button/Button.js";
 import IconButton from "./components/icon-button/IconButton.js";
-import Popup from "./components/popup/Popup.js";
+import TextField from "./components/text-field/TextField.js";
+import TextArea from "./components/text-area/TextArea.js";
+import Checkbox from "./components/checkbox/Checkbox.js";
+import Switch from "./components/switch/Switch.js";
+import RadioGroup from "./components/radio-group/RadioGroup.js";
+import SegmentedControl from "./components/segmented-control/SegmentedControl.js";
+import MessageBox from "./components/message-box/MessageBox.js";
+import Popup_default from "./components/popup/Popup.js";
 import PopupList from "./components/popup/PopupList.js";
 import SplitButton from "./components/split-button/SplitButton.js";
 import Card from "./components/card/Card.js";
 import Avatar from "./components/avatar/Avatar.js";
 import AvatarGroup from "./components/avatar-group/AvatarGroup.js";
 import List from "./components/list/List.js";
-import ListItem from "./components/list-item/ListItem.js";
 import Accordion from "./components/accordion/Accordion.js";
 import AccordionGroup from "./components/accordion-group/AccordionGroup.js";
-export { Accordion, AccordionGroup, Avatar, AvatarGroup, Button, Card, IconButton, List, ListItem, Popup, PopupList, SplitButton };
+export { Accordion, AccordionGroup, Avatar, AvatarGroup, Button, Card, Checkbox, IconButton, List, MessageBox, Popup_default as Popup, PopupList, RadioGroup, SegmentedControl, SplitButton, Switch, TextArea, TextField };