@charcoal-ui/react 6.0.0-rc.6 → 6.0.0-rc.8

package/dist/components/Radio/RadioGroup/index2.cjs

@@ -0,0 +1,49 @@
+"use client";
+const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
+const require_useClassNames = require('../../../_lib/useClassNames.cjs');
+const require_RadioGroupContext = require('../RadioGroupContext.cjs');
+require('./index.cjs');
+let react = require("react");
+react = require_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/Radio/RadioGroup/index.tsx
+const RadioGroup = (0, react.forwardRef)(function RadioGroupInner({ value, label, name, onChange, disabled, readonly, invalid, children, "aria-orientation": ariaOrientation = "vertical", ...props }, ref) {
+	const classNames = require_useClassNames.useClassNames("charcoal-radio-group", props.className);
+	const handleChange = (0, react.useCallback)((next) => {
+		onChange(next);
+	}, [onChange]);
+	const contextValue = (0, react.useMemo)(() => ({
+		name,
+		selected: value,
+		disabled: disabled ?? false,
+		readonly: readonly ?? false,
+		invalid: invalid ?? false,
+		onChange: handleChange
+	}), [
+		disabled,
+		handleChange,
+		invalid,
+		name,
+		readonly,
+		value
+	]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_RadioGroupContext.RadioGroupContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			role: "radiogroup",
+			"aria-disabled": disabled,
+			"aria-invalid": invalid,
+			"aria-label": label,
+			"aria-labelledby": props["aria-labelledby"],
+			"aria-orientation": ariaOrientation,
+			className: classNames,
+			ref,
+			children
+		})
+	});
+});
+
+//#endregion
+exports.RadioGroup = RadioGroup;
+//# sourceMappingURL=index2.cjs.map

package/dist/components/Radio/RadioGroup/index2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.cjs","names":["forwardRef","useCallback","useMemo","JSX","React","useClassNames","RadioGroupContext","RadioGroupProps","PropsWithChildren","className","value","Value","label","name","onChange","next","disabled","readonly","invalid","ref","Ref","HTMLDivElement","ComponentProps","RadioGroup","RadioGroupInner","children","ariaOrientation","props","classNames","handleChange","contextValue","selected","Element"],"sources":["../../../../src/components/Radio/RadioGroup/index.tsx"],"sourcesContent":["import './index.css'\n\nimport { forwardRef, useCallback, useMemo, type JSX } from 'react'\nimport * as React from 'react'\nimport { useClassNames } from '../../../_lib/useClassNames'\nimport { RadioGroupContext } from '../RadioGroupContext'\n\nexport type RadioGroupProps<Value extends string = string> =\n  React.PropsWithChildren<{\n    className?: string\n    value?: Value\n    /**\n     * aria-label of RadioGroup\n     */\n    label?: string\n    name: string\n    onChange(next: Value): void\n    disabled?: boolean\n    readonly?: boolean\n    invalid?: boolean\n    ref?: React.Ref<HTMLDivElement>\n    'aria-labelledby'?: React.ComponentProps<'div'>['aria-labelledby']\n    'aria-orientation'?: React.ComponentProps<'div'>['aria-orientation']\n  }>\n\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps<string>>(\n  function RadioGroupInner(\n    {\n      value,\n      label,\n      name,\n      onChange,\n      disabled,\n      readonly,\n      invalid,\n      children,\n      'aria-orientation': ariaOrientation = 'vertical',\n      ...props\n    },\n    ref,\n  ) {\n    const classNames = useClassNames('charcoal-radio-group', props.className)\n\n    const handleChange = useCallback(\n      (next: string) => {\n        onChange(next)\n      },\n      [onChange],\n    )\n\n    const contextValue = useMemo(\n      () => ({\n        name,\n        selected: value,\n        disabled: disabled ?? false,\n        readonly: readonly ?? false,\n        invalid: invalid ?? false,\n        onChange: handleChange,\n      }),\n      [disabled, handleChange, invalid, name, readonly, value],\n    )\n\n    return (\n      <RadioGroupContext.Provider value={contextValue}>\n        <div\n          role=\"radiogroup\"\n          aria-disabled={disabled}\n          aria-invalid={invalid}\n          aria-label={label}\n          aria-labelledby={props['aria-labelledby']}\n          aria-orientation={ariaOrientation}\n          className={classNames}\n          ref={ref}\n        >\n          {children}\n        </div>\n      </RadioGroupContext.Provider>\n    )\n  },\n) as <Value extends string>(props: RadioGroupProps<Value>) => JSX.Element\n"],"mappings":";;;;;;;;;;AAyBA,MAAauB,mCACX,SAASC,gBACP,EACEd,OACAE,OACAC,MACAC,UACAE,UACAC,UACAC,SACAO,UACA,oBAAoBC,kBAAkB,YACtC,GAAGC,SAELR,KACA;CACA,MAAMS,aAAavB,oCAAc,wBAAwBsB,MAAMlB,UAAU;CAEzE,MAAMoB,uCACHd,SAAiB;EAChBD,SAASC,KAAK;IAEhB,CAACD,SACH,CAAC;CAED,MAAMgB,yCACG;EACLjB;EACAkB,UAAUrB;EACVM,UAAUA,YAAY;EACtBC,UAAUA,YAAY;EACtBC,SAASA,WAAW;EACpBJ,UAAUe;EACX,GACD;EAACb;EAAUa;EAAcX;EAASL;EAAMI;EAAUP;EACpD,CAAC;CAED,OACE,2CAAC,4CAAkB,UAAnB;EAA4B,OAAOoB;YACjC,2CAAC,OAAD;GACE,MAAK;GACL,iBAAed;GACf,gBAAcE;GACd,cAAYN;GACZ,mBAAiBe,MAAM;GACvB,oBAAkBD;GAClB,WAAWE;GACNT;GAEJM;GACE;EACsB;EAGlC"}

package/dist/components/Radio/RadioGroup/index2.js

@@ -0,0 +1,47 @@
+"use client";
+import { useClassNames } from "../../../_lib/useClassNames.js";
+import { RadioGroupContext } from "../RadioGroupContext.js";
+/* empty css      */
+import { forwardRef, useCallback, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/Radio/RadioGroup/index.tsx
+const RadioGroup = forwardRef(function RadioGroupInner({ value, label, name, onChange, disabled, readonly, invalid, children, "aria-orientation": ariaOrientation = "vertical", ...props }, ref) {
+	const classNames = useClassNames("charcoal-radio-group", props.className);
+	const handleChange = useCallback((next) => {
+		onChange(next);
+	}, [onChange]);
+	const contextValue = useMemo(() => ({
+		name,
+		selected: value,
+		disabled: disabled ?? false,
+		readonly: readonly ?? false,
+		invalid: invalid ?? false,
+		onChange: handleChange
+	}), [
+		disabled,
+		handleChange,
+		invalid,
+		name,
+		readonly,
+		value
+	]);
+	return /* @__PURE__ */ jsx(RadioGroupContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsx("div", {
+			role: "radiogroup",
+			"aria-disabled": disabled,
+			"aria-invalid": invalid,
+			"aria-label": label,
+			"aria-labelledby": props["aria-labelledby"],
+			"aria-orientation": ariaOrientation,
+			className: classNames,
+			ref,
+			children
+		})
+	});
+});
+
+//#endregion
+export { RadioGroup };
+//# sourceMappingURL=index2.js.map

package/dist/components/Radio/RadioGroup/index2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.js","names":["forwardRef","useCallback","useMemo","JSX","React","useClassNames","RadioGroupContext","RadioGroupProps","PropsWithChildren","className","value","Value","label","name","onChange","next","disabled","readonly","invalid","ref","Ref","HTMLDivElement","ComponentProps","RadioGroup","RadioGroupInner","children","ariaOrientation","props","classNames","handleChange","contextValue","selected","Element"],"sources":["../../../../src/components/Radio/RadioGroup/index.tsx"],"sourcesContent":["import './index.css'\n\nimport { forwardRef, useCallback, useMemo, type JSX } from 'react'\nimport * as React from 'react'\nimport { useClassNames } from '../../../_lib/useClassNames'\nimport { RadioGroupContext } from '../RadioGroupContext'\n\nexport type RadioGroupProps<Value extends string = string> =\n  React.PropsWithChildren<{\n    className?: string\n    value?: Value\n    /**\n     * aria-label of RadioGroup\n     */\n    label?: string\n    name: string\n    onChange(next: Value): void\n    disabled?: boolean\n    readonly?: boolean\n    invalid?: boolean\n    ref?: React.Ref<HTMLDivElement>\n    'aria-labelledby'?: React.ComponentProps<'div'>['aria-labelledby']\n    'aria-orientation'?: React.ComponentProps<'div'>['aria-orientation']\n  }>\n\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps<string>>(\n  function RadioGroupInner(\n    {\n      value,\n      label,\n      name,\n      onChange,\n      disabled,\n      readonly,\n      invalid,\n      children,\n      'aria-orientation': ariaOrientation = 'vertical',\n      ...props\n    },\n    ref,\n  ) {\n    const classNames = useClassNames('charcoal-radio-group', props.className)\n\n    const handleChange = useCallback(\n      (next: string) => {\n        onChange(next)\n      },\n      [onChange],\n    )\n\n    const contextValue = useMemo(\n      () => ({\n        name,\n        selected: value,\n        disabled: disabled ?? false,\n        readonly: readonly ?? false,\n        invalid: invalid ?? false,\n        onChange: handleChange,\n      }),\n      [disabled, handleChange, invalid, name, readonly, value],\n    )\n\n    return (\n      <RadioGroupContext.Provider value={contextValue}>\n        <div\n          role=\"radiogroup\"\n          aria-disabled={disabled}\n          aria-invalid={invalid}\n          aria-label={label}\n          aria-labelledby={props['aria-labelledby']}\n          aria-orientation={ariaOrientation}\n          className={classNames}\n          ref={ref}\n        >\n          {children}\n        </div>\n      </RadioGroupContext.Provider>\n    )\n  },\n) as <Value extends string>(props: RadioGroupProps<Value>) => JSX.Element\n"],"mappings":";;;;;;;;AAyBA,MAAauB,aAAavB,WACxB,SAASwB,gBACP,EACEd,OACAE,OACAC,MACAC,UACAE,UACAC,UACAC,SACAO,UACA,oBAAoBC,kBAAkB,YACtC,GAAGC,SAELR,KACA;CACA,MAAMS,aAAavB,cAAc,wBAAwBsB,MAAMlB,UAAU;CAEzE,MAAMoB,eAAe5B,aAClBc,SAAiB;EAChBD,SAASC,KAAK;IAEhB,CAACD,SACH,CAAC;CAED,MAAMgB,eAAe5B,eACZ;EACLW;EACAkB,UAAUrB;EACVM,UAAUA,YAAY;EACtBC,UAAUA,YAAY;EACtBC,SAASA,WAAW;EACpBJ,UAAUe;EACX,GACD;EAACb;EAAUa;EAAcX;EAASL;EAAMI;EAAUP;EACpD,CAAC;CAED,OACE,oBAAC,kBAAkB,UAAnB;EAA4B,OAAOoB;YACjC,oBAAC,OAAD;GACE,MAAK;GACL,iBAAed;GACf,gBAAcE;GACd,cAAYN;GACZ,mBAAiBe,MAAM;GACvB,oBAAkBD;GAClB,WAAWE;GACNT;GAEJM;GACE;EACsB;EAGlC"}

package/dist/components/Radio/RadioGroupContext.cjs

@@ -0,0 +1,20 @@
+"use client";
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+let react = require("react");
+react = require_runtime.__toESM(react, 1);
+
+//#region src/components/Radio/RadioGroupContext.ts
+const RadioGroupContext = react.createContext({
+	name: void 0,
+	selected: void 0,
+	disabled: false,
+	readonly: false,
+	invalid: false,
+	onChange() {
+		throw new Error("Cannot find onChange() handler. Perhaps you forgot to wrap with <RadioGroup> ?");
+	}
+});
+
+//#endregion
+exports.RadioGroupContext = RadioGroupContext;
+//# sourceMappingURL=RadioGroupContext.cjs.map

package/dist/components/Radio/RadioGroupContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroupContext.cjs","names":["React","RadioGroupContext","name","selected","disabled","readonly","invalid","onChange","next","createContext","undefined","Error"],"sources":["../../../src/components/Radio/RadioGroupContext.ts"],"sourcesContent":["import * as React from 'react'\n\nexport interface RadioGroupContext {\n  name: string\n  selected?: string\n  disabled: boolean\n  readonly: boolean\n  invalid: boolean\n  onChange: (next: string) => void\n}\n\nexport const RadioGroupContext = React.createContext<RadioGroupContext>({\n  name: undefined as never,\n  selected: undefined,\n  disabled: false,\n  readonly: false,\n  invalid: false,\n  onChange() {\n    throw new Error(\n      'Cannot find onChange() handler. Perhaps you forgot to wrap with <RadioGroup> ?',\n    )\n  },\n})\n"],"mappings":";;;;;;AAWA,MAAaC,oBAAoBD,MAAMS,cAAiC;CACtEP,MAAMQ;CACNP,UAAUO;CACVN,UAAU;CACVC,UAAU;CACVC,SAAS;CACTC,WAAW;EACT,MAAM,IAAII,MACR,iFACD;;CAEJ,CAAC"}

package/dist/components/Radio/RadioGroupContext.js

@@ -0,0 +1,18 @@
+"use client";
+import * as React$1 from "react";
+
+//#region src/components/Radio/RadioGroupContext.ts
+const RadioGroupContext = React$1.createContext({
+	name: void 0,
+	selected: void 0,
+	disabled: false,
+	readonly: false,
+	invalid: false,
+	onChange() {
+		throw new Error("Cannot find onChange() handler. Perhaps you forgot to wrap with <RadioGroup> ?");
+	}
+});
+
+//#endregion
+export { RadioGroupContext };
+//# sourceMappingURL=RadioGroupContext.js.map

package/dist/components/Radio/RadioGroupContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroupContext.js","names":["React","RadioGroupContext","name","selected","disabled","readonly","invalid","onChange","next","createContext","undefined","Error"],"sources":["../../../src/components/Radio/RadioGroupContext.ts"],"sourcesContent":["import * as React from 'react'\n\nexport interface RadioGroupContext {\n  name: string\n  selected?: string\n  disabled: boolean\n  readonly: boolean\n  invalid: boolean\n  onChange: (next: string) => void\n}\n\nexport const RadioGroupContext = React.createContext<RadioGroupContext>({\n  name: undefined as never,\n  selected: undefined,\n  disabled: false,\n  readonly: false,\n  invalid: false,\n  onChange() {\n    throw new Error(\n      'Cannot find onChange() handler. Perhaps you forgot to wrap with <RadioGroup> ?',\n    )\n  },\n})\n"],"mappings":";;;;AAWA,MAAaC,oBAAoBD,QAAMS,cAAiC;CACtEP,MAAMQ;CACNP,UAAUO;CACVN,UAAU;CACVC,UAAU;CACVC,SAAS;CACTC,WAAW;EACT,MAAM,IAAII,MACR,iFACD;;CAEJ,CAAC"}

package/dist/components/Radio/RadioInput/index2.cjs

@@ -0,0 +1,27 @@
+"use client";
+const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
+const require_useClassNames = require('../../../_lib/useClassNames.cjs');
+require('./index.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/Radio/RadioInput/index.tsx
+const RadioInput = (0, react.forwardRef)(function RadioInput({ onChange, invalid, className, ...props }, ref) {
+	const handleChange = (0, react.useCallback)((e) => {
+		const el = e.currentTarget;
+		onChange?.(el.value);
+	}, [onChange]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+		className: require_useClassNames.useClassNames("charcoal-radio-input", className),
+		ref,
+		type: "radio",
+		onChange: handleChange,
+		"aria-invalid": invalid,
+		...props
+	});
+});
+var RadioInput_default = (0, react.memo)(RadioInput);
+
+//#endregion
+exports.default = RadioInput_default;
+//# sourceMappingURL=index2.cjs.map

package/dist/components/Radio/RadioInput/index2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.cjs","names":["forwardRef","memo","useCallback","useClassNames","CharcoalRadioInputProps","invalid","onChange","value","InputProps","React","HTMLProps","HTMLInputElement","RadioInputProps","Omit","RadioInput","className","props","ref","handleChange","e","ChangeEvent","el","currentTarget","classNames"],"sources":["../../../../src/components/Radio/RadioInput/index.tsx"],"sourcesContent":["import './index.css'\n\nimport { forwardRef, memo, useCallback } from 'react'\nimport { useClassNames } from '../../../_lib/useClassNames'\n\ntype CharcoalRadioInputProps = {\n  invalid?: boolean\n  onChange?: (value: string) => void\n}\n\ntype InputProps = React.HTMLProps<HTMLInputElement>\n\nexport type RadioInputProps = CharcoalRadioInputProps &\n  Omit<InputProps, keyof CharcoalRadioInputProps | 'ref'>\n\nconst RadioInput = forwardRef<HTMLInputElement, RadioInputProps>(\n  function RadioInput({ onChange, invalid, className, ...props }, ref) {\n    const handleChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        const el = e.currentTarget\n        onChange?.(el.value)\n      },\n      [onChange],\n    )\n\n    const classNames = useClassNames('charcoal-radio-input', className)\n\n    return (\n      // eslint-disable-next-line jsx-a11y/role-supports-aria-props\n      <input\n        className={classNames}\n        ref={ref}\n        type=\"radio\"\n        onChange={handleChange}\n        aria-invalid={invalid}\n        {...props}\n      />\n    )\n  },\n)\n\nexport default memo(RadioInput)\n"],"mappings":";;;;;;;;AAeA,MAAMc,mCACJ,SAASA,WAAW,EAAER,UAAUD,SAASU,WAAW,GAAGC,SAASC,KAAK;CACnE,MAAMC,uCACHC,MAA2C;EAC1C,MAAME,KAAKF,EAAEG;EACbhB,WAAWe,GAAGd,MAAM;IAEtB,CAACD,SACH,CAAC;CAID,OAEE,2CAAC,SAAD;EACE,WALeH,oCAAc,wBAAwBY,UAKhC;EAChBE;EACL,MAAK;EACL,UAAUC;EACV,gBAAcb;EACd,GAAIW;EAAM;EAIjB;AAED,yCAAoBF,WAAW"}

package/dist/components/Radio/RadioInput/index2.js

@@ -0,0 +1,26 @@
+"use client";
+import { useClassNames } from "../../../_lib/useClassNames.js";
+/* empty css      */
+import { forwardRef, memo, useCallback } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/Radio/RadioInput/index.tsx
+const RadioInput = forwardRef(function RadioInput({ onChange, invalid, className, ...props }, ref) {
+	const handleChange = useCallback((e) => {
+		const el = e.currentTarget;
+		onChange?.(el.value);
+	}, [onChange]);
+	return /* @__PURE__ */ jsx("input", {
+		className: useClassNames("charcoal-radio-input", className),
+		ref,
+		type: "radio",
+		onChange: handleChange,
+		"aria-invalid": invalid,
+		...props
+	});
+});
+var RadioInput_default = memo(RadioInput);
+
+//#endregion
+export { RadioInput_default as default };
+//# sourceMappingURL=index2.js.map

package/dist/components/Radio/RadioInput/index2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.js","names":["forwardRef","memo","useCallback","useClassNames","CharcoalRadioInputProps","invalid","onChange","value","InputProps","React","HTMLProps","HTMLInputElement","RadioInputProps","Omit","RadioInput","className","props","ref","handleChange","e","ChangeEvent","el","currentTarget","classNames"],"sources":["../../../../src/components/Radio/RadioInput/index.tsx"],"sourcesContent":["import './index.css'\n\nimport { forwardRef, memo, useCallback } from 'react'\nimport { useClassNames } from '../../../_lib/useClassNames'\n\ntype CharcoalRadioInputProps = {\n  invalid?: boolean\n  onChange?: (value: string) => void\n}\n\ntype InputProps = React.HTMLProps<HTMLInputElement>\n\nexport type RadioInputProps = CharcoalRadioInputProps &\n  Omit<InputProps, keyof CharcoalRadioInputProps | 'ref'>\n\nconst RadioInput = forwardRef<HTMLInputElement, RadioInputProps>(\n  function RadioInput({ onChange, invalid, className, ...props }, ref) {\n    const handleChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        const el = e.currentTarget\n        onChange?.(el.value)\n      },\n      [onChange],\n    )\n\n    const classNames = useClassNames('charcoal-radio-input', className)\n\n    return (\n      // eslint-disable-next-line jsx-a11y/role-supports-aria-props\n      <input\n        className={classNames}\n        ref={ref}\n        type=\"radio\"\n        onChange={handleChange}\n        aria-invalid={invalid}\n        {...props}\n      />\n    )\n  },\n)\n\nexport default memo(RadioInput)\n"],"mappings":";;;;;;;AAeA,MAAMc,aAAad,WACjB,SAASc,WAAW,EAAER,UAAUD,SAASU,WAAW,GAAGC,SAASC,KAAK;CACnE,MAAMC,eAAehB,aAClBiB,MAA2C;EAC1C,MAAME,KAAKF,EAAEG;EACbhB,WAAWe,GAAGd,MAAM;IAEtB,CAACD,SACH,CAAC;CAID,OAEE,oBAAC,SAAD;EACE,WALeH,cAAc,wBAAwBY,UAKhC;EAChBE;EACL,MAAK;EACL,UAAUC;EACV,gBAAcb;EACd,GAAIW;EAAM;EAIjB;AAED,yBAAef,KAAKa,WAAW"}

package/dist/components/Radio/index2.cjs

@@ -0,0 +1,42 @@
+"use client";
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+const require_useClassNames = require('../../_lib/useClassNames.cjs');
+require('./index.cjs');
+const require_RadioGroupContext = require('./RadioGroupContext.cjs');
+const require_index$1 = require('./RadioInput/index2.cjs');
+let react = require("react");
+react = require_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let warning = require("warning");
+warning = require_runtime.__toESM(warning);
+
+//#region src/components/Radio/index.tsx
+const Radio = (0, react.forwardRef)(function RadioInner({ value, disabled = false, children, ...props }, ref) {
+	const { name, selected, disabled: isParentDisabled, readonly, invalid, onChange } = (0, react.useContext)(require_RadioGroupContext.RadioGroupContext);
+	const classNames = require_useClassNames.useClassNames("charcoal-radio__label", props.className);
+	(0, warning.default)(name !== void 0, `"name" is not Provided for <Radio>. Perhaps you forgot to wrap with <RadioGroup> ?`);
+	const isSelected = value === selected;
+	const isDisabled = disabled || isParentDisabled;
+	const isReadonly = readonly && !isSelected;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+		"aria-disabled": isDisabled || isReadonly,
+		className: classNames,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index$1.default, {
+			name,
+			value,
+			checked: isSelected,
+			"aria-invalid": invalid,
+			onChange,
+			disabled: isDisabled || isReadonly,
+			ref
+		}), children != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "charcoal-radio__label_div",
+			children
+		})]
+	});
+});
+var Radio_default = (0, react.memo)(Radio);
+
+//#endregion
+exports.default = Radio_default;
+//# sourceMappingURL=index2.cjs.map

package/dist/components/Radio/index2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.cjs","names":["memo","forwardRef","useContext","React","warning","useClassNames","RadioGroupContext","RadioInput","RadioProps","PropsWithChildren","value","disabled","className","Radio","HTMLInputElement","RadioInner","children","props","ref","name","selected","isParentDisabled","readonly","invalid","onChange","classNames","undefined","isSelected","isDisabled","isReadonly"],"sources":["../../../src/components/Radio/index.tsx"],"sourcesContent":["import './index.css'\n\nimport { memo, forwardRef, useContext } from 'react'\nimport * as React from 'react'\nimport warning from 'warning'\nimport { useClassNames } from '../../_lib/useClassNames'\n\nimport { RadioGroupContext } from './RadioGroupContext'\nimport RadioInput from './RadioInput'\n\nexport type RadioProps = React.PropsWithChildren<{\n  value: string\n  disabled?: boolean\n  className?: string\n}>\n\nconst Radio = forwardRef<HTMLInputElement, RadioProps>(function RadioInner(\n  { value, disabled = false, children, ...props },\n  ref,\n) {\n  const {\n    name,\n    selected,\n    disabled: isParentDisabled,\n    readonly,\n    invalid,\n    onChange,\n  } = useContext(RadioGroupContext)\n\n  const classNames = useClassNames('charcoal-radio__label', props.className)\n\n  warning(\n    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n    name !== undefined,\n    `\"name\" is not Provided for <Radio>. Perhaps you forgot to wrap with <RadioGroup> ?`,\n  )\n\n  const isSelected = value === selected\n  const isDisabled = disabled || isParentDisabled\n  const isReadonly = readonly && !isSelected\n\n  return (\n    <label aria-disabled={isDisabled || isReadonly} className={classNames}>\n      <RadioInput\n        name={name}\n        value={value}\n        checked={isSelected}\n        aria-invalid={invalid}\n        onChange={onChange}\n        disabled={isDisabled || isReadonly}\n        ref={ref}\n      />\n      {children != null && (\n        <div className=\"charcoal-radio__label_div\">{children}</div>\n      )}\n    </label>\n  )\n})\n\nexport default memo(Radio)\n"],"mappings":";;;;;;;;;;;;;AAgBA,MAAMa,8BAAiD,SAASE,WAC9D,EAAEL,OAAOC,WAAW,OAAOK,UAAU,GAAGC,SACxCC,KACA;CACA,MAAM,EACJC,MACAC,UACAT,UAAUU,kBACVC,UACAC,SACAC,mCACalB,4CAAkB;CAEjC,MAAMmB,aAAapB,oCAAc,yBAAyBY,MAAML,UAAU;CAE1ER,qBAEEe,SAASO,QACT,qFACD;CAED,MAAMC,aAAajB,UAAUU;CAC7B,MAAMQ,aAAajB,YAAYU;CAC/B,MAAMQ,aAAaP,YAAY,CAACK;CAEhC,OACE,4CAAC,SAAD;EAAO,iBAAeC,cAAcC;EAAY,WAAWJ;YAA3D,CACE,2CAAC,yBAAD;GACQN;GACCT;GACP,SAASiB;GACT,gBAAcJ;GACJC;GACV,UAAUI,cAAcC;GACnBX;GAAI,GAEVF,YAAY,QACX,2CAAC,OAAD;GAAK,WAAU;GAA6BA;GAC7C,EACK;;EAEV;AAEF,oCAAoBH,MAAM"}

package/dist/components/Radio/index2.js

@@ -0,0 +1,39 @@
+"use client";
+import { useClassNames } from "../../_lib/useClassNames.js";
+/* empty css      */
+import { RadioGroupContext } from "./RadioGroupContext.js";
+import RadioInput_default from "./RadioInput/index2.js";
+import { forwardRef, memo, useContext } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import warning from "warning";
+
+//#region src/components/Radio/index.tsx
+const Radio = forwardRef(function RadioInner({ value, disabled = false, children, ...props }, ref) {
+	const { name, selected, disabled: isParentDisabled, readonly, invalid, onChange } = useContext(RadioGroupContext);
+	const classNames = useClassNames("charcoal-radio__label", props.className);
+	warning(name !== void 0, `"name" is not Provided for <Radio>. Perhaps you forgot to wrap with <RadioGroup> ?`);
+	const isSelected = value === selected;
+	const isDisabled = disabled || isParentDisabled;
+	const isReadonly = readonly && !isSelected;
+	return /* @__PURE__ */ jsxs("label", {
+		"aria-disabled": isDisabled || isReadonly,
+		className: classNames,
+		children: [/* @__PURE__ */ jsx(RadioInput_default, {
+			name,
+			value,
+			checked: isSelected,
+			"aria-invalid": invalid,
+			onChange,
+			disabled: isDisabled || isReadonly,
+			ref
+		}), children != null && /* @__PURE__ */ jsx("div", {
+			className: "charcoal-radio__label_div",
+			children
+		})]
+	});
+});
+var Radio_default = memo(Radio);
+
+//#endregion
+export { Radio_default as default };
+//# sourceMappingURL=index2.js.map

package/dist/components/Radio/index2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.js","names":["memo","forwardRef","useContext","React","warning","useClassNames","RadioGroupContext","RadioInput","RadioProps","PropsWithChildren","value","disabled","className","Radio","HTMLInputElement","RadioInner","children","props","ref","name","selected","isParentDisabled","readonly","invalid","onChange","classNames","undefined","isSelected","isDisabled","isReadonly"],"sources":["../../../src/components/Radio/index.tsx"],"sourcesContent":["import './index.css'\n\nimport { memo, forwardRef, useContext } from 'react'\nimport * as React from 'react'\nimport warning from 'warning'\nimport { useClassNames } from '../../_lib/useClassNames'\n\nimport { RadioGroupContext } from './RadioGroupContext'\nimport RadioInput from './RadioInput'\n\nexport type RadioProps = React.PropsWithChildren<{\n  value: string\n  disabled?: boolean\n  className?: string\n}>\n\nconst Radio = forwardRef<HTMLInputElement, RadioProps>(function RadioInner(\n  { value, disabled = false, children, ...props },\n  ref,\n) {\n  const {\n    name,\n    selected,\n    disabled: isParentDisabled,\n    readonly,\n    invalid,\n    onChange,\n  } = useContext(RadioGroupContext)\n\n  const classNames = useClassNames('charcoal-radio__label', props.className)\n\n  warning(\n    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n    name !== undefined,\n    `\"name\" is not Provided for <Radio>. Perhaps you forgot to wrap with <RadioGroup> ?`,\n  )\n\n  const isSelected = value === selected\n  const isDisabled = disabled || isParentDisabled\n  const isReadonly = readonly && !isSelected\n\n  return (\n    <label aria-disabled={isDisabled || isReadonly} className={classNames}>\n      <RadioInput\n        name={name}\n        value={value}\n        checked={isSelected}\n        aria-invalid={invalid}\n        onChange={onChange}\n        disabled={isDisabled || isReadonly}\n        ref={ref}\n      />\n      {children != null && (\n        <div className=\"charcoal-radio__label_div\">{children}</div>\n      )}\n    </label>\n  )\n})\n\nexport default memo(Radio)\n"],"mappings":";;;;;;;;;;AAgBA,MAAMa,QAAQZ,WAAyC,SAASc,WAC9D,EAAEL,OAAOC,WAAW,OAAOK,UAAU,GAAGC,SACxCC,KACA;CACA,MAAM,EACJC,MACAC,UACAT,UAAUU,kBACVC,UACAC,SACAC,aACEtB,WAAWI,kBAAkB;CAEjC,MAAMmB,aAAapB,cAAc,yBAAyBY,MAAML,UAAU;CAE1ER,QAEEe,SAASO,QACT,qFACD;CAED,MAAMC,aAAajB,UAAUU;CAC7B,MAAMQ,aAAajB,YAAYU;CAC/B,MAAMQ,aAAaP,YAAY,CAACK;CAEhC,OACE,qBAAC,SAAD;EAAO,iBAAeC,cAAcC;EAAY,WAAWJ;YAA3D,CACE,oBAAC,oBAAD;GACQN;GACCT;GACP,SAASiB;GACT,gBAAcJ;GACJC;GACV,UAAUI,cAAcC;GACnBX;GAAI,GAEVF,YAAY,QACX,oBAAC,OAAD;GAAK,WAAU;GAA6BA;GAC7C,EACK;;EAEV;AAEF,oBAAehB,KAAKa,MAAM"}

package/dist/components/SegmentedControl/RadioGroupContext.cjs

@@ -0,0 +1,24 @@
+"use client";
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+let react = require("react");
+react = require_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/SegmentedControl/RadioGroupContext.tsx
+const RadioContext = (0, react.createContext)(null);
+const RadioProvider = ({ value, children }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RadioContext.Provider, {
+		value,
+		children
+	});
+};
+const useRadioContext = () => {
+	const state = (0, react.useContext)(RadioContext);
+	if (state === null) throw new Error("`<RadioProvider>` is not likely mounted.");
+	return state;
+};
+
+//#endregion
+exports.RadioProvider = RadioProvider;
+exports.useRadioContext = useRadioContext;
+//# sourceMappingURL=RadioGroupContext.cjs.map

package/dist/components/SegmentedControl/RadioGroupContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroupContext.cjs","names":["createContext","useContext","React","RadioGroupState","RadioContext","RadioProviderProps","PropsWithChildren","value","RadioProvider","FC","children","useRadioContext","state","Error"],"sources":["../../../src/components/SegmentedControl/RadioGroupContext.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport * as React from 'react'\nimport { RadioGroupState } from 'react-stately/useRadioGroupState'\n\nconst RadioContext = createContext<RadioGroupState | null>(null)\n\ntype RadioProviderProps = React.PropsWithChildren<{\n  value: RadioGroupState\n}>\nexport const RadioProvider: React.FC<RadioProviderProps> = ({\n  value,\n  children,\n}) => {\n  return <RadioContext.Provider value={value}>{children}</RadioContext.Provider>\n}\nexport const useRadioContext = () => {\n  const state = useContext(RadioContext)\n\n  if (state === null)\n    throw new Error('`<RadioProvider>` is not likely mounted.')\n\n  return state\n}\n"],"mappings":";;;;;;;AAIA,MAAMI,wCAAqD,KAAK;AAKhE,MAAaI,iBAA+C,EAC1DD,OACAG,eACI;CACJ,OAAO,2CAAC,aAAa,UAAd;EAA8BH;EAAQG;EAAiC;;AAEhF,MAAaC,wBAAwB;CACnC,MAAMC,8BAAmBR,aAAa;CAEtC,IAAIQ,UAAU,MACZ,MAAM,IAAIC,MAAM,2CAA2C;CAE7D,OAAOD"}

package/dist/components/SegmentedControl/RadioGroupContext.js

@@ -0,0 +1,21 @@
+"use client";
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/SegmentedControl/RadioGroupContext.tsx
+const RadioContext = createContext(null);
+const RadioProvider = ({ value, children }) => {
+	return /* @__PURE__ */ jsx(RadioContext.Provider, {
+		value,
+		children
+	});
+};
+const useRadioContext = () => {
+	const state = useContext(RadioContext);
+	if (state === null) throw new Error("`<RadioProvider>` is not likely mounted.");
+	return state;
+};
+
+//#endregion
+export { RadioProvider, useRadioContext };
+//# sourceMappingURL=RadioGroupContext.js.map

package/dist/components/SegmentedControl/RadioGroupContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroupContext.js","names":["createContext","useContext","React","RadioGroupState","RadioContext","RadioProviderProps","PropsWithChildren","value","RadioProvider","FC","children","useRadioContext","state","Error"],"sources":["../../../src/components/SegmentedControl/RadioGroupContext.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport * as React from 'react'\nimport { RadioGroupState } from 'react-stately/useRadioGroupState'\n\nconst RadioContext = createContext<RadioGroupState | null>(null)\n\ntype RadioProviderProps = React.PropsWithChildren<{\n  value: RadioGroupState\n}>\nexport const RadioProvider: React.FC<RadioProviderProps> = ({\n  value,\n  children,\n}) => {\n  return <RadioContext.Provider value={value}>{children}</RadioContext.Provider>\n}\nexport const useRadioContext = () => {\n  const state = useContext(RadioContext)\n\n  if (state === null)\n    throw new Error('`<RadioProvider>` is not likely mounted.')\n\n  return state\n}\n"],"mappings":";;;;;AAIA,MAAMI,eAAeJ,cAAsC,KAAK;AAKhE,MAAaQ,iBAA+C,EAC1DD,OACAG,eACI;CACJ,OAAO,oBAAC,aAAa,UAAd;EAA8BH;EAAQG;EAAiC;;AAEhF,MAAaC,wBAAwB;CACnC,MAAMC,QAAQX,WAAWG,aAAa;CAEtC,IAAIQ,UAAU,MACZ,MAAM,IAAIC,MAAM,2CAA2C;CAE7D,OAAOD"}

package/dist/components/SegmentedControl/index2.cjs

@@ -0,0 +1,72 @@
+"use client";
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+const require_useClassNames = require('../../_lib/useClassNames.cjs');
+const require_RadioGroupContext = require('./RadioGroupContext.cjs');
+require('./index.cjs');
+let react = require("react");
+react = require_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let react_aria_useRadioGroup = require("react-aria/useRadioGroup");
+let react_stately_useRadioGroupState = require("react-stately/useRadioGroupState");
+
+//#region src/components/SegmentedControl/index.tsx
+const SegmentedControl = (0, react.forwardRef)(function SegmentedControlInner(props, ref) {
+	const className = require_useClassNames.useClassNames("charcoal-segmented-control", props.className);
+	const ariaRadioGroupProps = (0, react.useMemo)(() => ({
+		...props,
+		isDisabled: props.disabled,
+		isReadOnly: props.readonly,
+		isRequired: props.required,
+		"aria-label": props.name
+	}), [props]);
+	const state = (0, react_stately_useRadioGroupState.useRadioGroupState)(ariaRadioGroupProps);
+	const { radioGroupProps } = (0, react_aria_useRadioGroup.useRadioGroup)(ariaRadioGroupProps, state);
+	const segmentedControlItems = (0, react.useMemo)(() => {
+		return props.data.map((d) => typeof d === "string" ? {
+			value: d,
+			label: d
+		} : d);
+	}, [props.data]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		ref,
+		...radioGroupProps,
+		className,
+		"data-uniform-segment-width": props.uniformSegmentWidth,
+		"data-full-width": props.fullWidth,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_RadioGroupContext.RadioProvider, {
+			value: state,
+			children: segmentedControlItems.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Segmented, {
+				value: item.value,
+				disabled: item.disabled,
+				uniformSegmentWidth: props.uniformSegmentWidth,
+				children: item.label
+			}, item.value))
+		})
+	});
+});
+var SegmentedControl_default = (0, react.memo)(SegmentedControl);
+const Segmented = (props) => {
+	const state = require_RadioGroupContext.useRadioContext();
+	const ref = (0, react.useRef)(null);
+	const { inputProps, isDisabled, isSelected } = (0, react_aria_useRadioGroup.useRadio)((0, react.useMemo)(() => ({
+		value: props.value,
+		isDisabled: props.disabled,
+		children: props.children
+	}), [props]), state, ref);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+		className: "charcoal-segmented-control-radio__label",
+		"aria-disabled": isDisabled || state.isReadOnly,
+		"data-checked": isSelected,
+		"data-uniform-segment-width": props.uniformSegmentWidth,
+		"data-full-width": props.fullWidth,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+			className: "charcoal-segmented-control-radio__input",
+			...inputProps,
+			ref
+		}), props.children]
+	});
+};
+
+//#endregion
+exports.default = SegmentedControl_default;
+//# sourceMappingURL=index2.cjs.map

package/dist/components/SegmentedControl/index2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.cjs","names":["ReactNode","forwardRef","memo","useMemo","useRef","React","RadioProvider","useRadioContext","useClassNames","AriaRadioGroupProps","AriaRadioProps","useRadio","useRadioGroup","useRadioGroupState","SegmentedControlItem","label","value","disabled","SegmentedControlProps","id","name","readonly","required","className","uniformSegmentWidth","fullWidth","defaultValue","data","onChange","SegmentedControl","HTMLDivElement","SegmentedControlInner","props","ref","ariaRadioGroupProps","isDisabled","isReadOnly","isRequired","state","radioGroupProps","segmentedControlItems","map","d","item","RadioProps","children","Segmented","HTMLInputElement","ariaRadioProps","inputProps","isSelected"],"sources":["../../../src/components/SegmentedControl/index.tsx"],"sourcesContent":["import { ReactNode, forwardRef, memo, useMemo, useRef } from 'react'\nimport * as React from 'react'\nimport { RadioProvider, useRadioContext } from './RadioGroupContext'\nimport { useClassNames } from '../../_lib/useClassNames'\nimport './index.css'\nimport {\n  AriaRadioGroupProps,\n  AriaRadioProps,\n  useRadio,\n  useRadioGroup,\n} from 'react-aria/useRadioGroup'\n\nimport { useRadioGroupState } from 'react-stately/useRadioGroupState'\n\ntype SegmentedControlItem = {\n  label: React.ReactNode\n  value: string\n  disabled?: boolean\n}\n\nexport type SegmentedControlProps = {\n  readonly id?: string\n  readonly name?: string\n  readonly disabled?: boolean\n  readonly readonly?: boolean\n  readonly required?: boolean\n  readonly className?: string\n  readonly uniformSegmentWidth?: boolean\n  readonly fullWidth?: boolean\n\n  readonly value?: string\n  readonly defaultValue?: string\n\n  readonly data: string[] | SegmentedControlItem[]\n\n  readonly onChange?: (value: string) => void\n}\n\nconst SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>(\n  function SegmentedControlInner(props, ref) {\n    const className = useClassNames(\n      'charcoal-segmented-control',\n      props.className,\n    )\n\n    const ariaRadioGroupProps = useMemo<AriaRadioGroupProps>(\n      () => ({\n        ...props,\n        isDisabled: props.disabled,\n        isReadOnly: props.readonly,\n        isRequired: props.required,\n        'aria-label': props.name,\n      }),\n      [props],\n    )\n    const state = useRadioGroupState(ariaRadioGroupProps)\n    const { radioGroupProps } = useRadioGroup(ariaRadioGroupProps, state)\n    const segmentedControlItems = useMemo<SegmentedControlItem[]>(() => {\n      return props.data.map((d) =>\n        typeof d === 'string' ? { value: d, label: d } : d,\n      )\n    }, [props.data])\n\n    return (\n      <div\n        ref={ref}\n        {...radioGroupProps}\n        className={className}\n        data-uniform-segment-width={props.uniformSegmentWidth}\n        data-full-width={props.fullWidth}\n      >\n        <RadioProvider value={state}>\n          {segmentedControlItems.map((item) => (\n            <Segmented\n              key={item.value}\n              value={item.value}\n              disabled={item.disabled}\n              uniformSegmentWidth={props.uniformSegmentWidth}\n            >\n              {item.label}\n            </Segmented>\n          ))}\n        </RadioProvider>\n      </div>\n    )\n  },\n)\n\nexport default memo(SegmentedControl)\n\ntype RadioProps = {\n  value: string\n  disabled?: boolean\n  children?: ReactNode\n  uniformSegmentWidth?: boolean\n  fullWidth?: boolean\n}\n\nconst Segmented = (props: RadioProps) => {\n  const state = useRadioContext()\n  const ref = useRef<HTMLInputElement>(null)\n  const ariaRadioProps = useMemo<AriaRadioProps>(\n    () => ({\n      value: props.value,\n      isDisabled: props.disabled,\n      children: props.children,\n    }),\n    [props],\n  )\n\n  const { inputProps, isDisabled, isSelected } = useRadio(\n    ariaRadioProps,\n    state,\n    ref,\n  )\n\n  return (\n    <label\n      className=\"charcoal-segmented-control-radio__label\"\n      aria-disabled={isDisabled || state.isReadOnly}\n      data-checked={isSelected}\n      data-uniform-segment-width={props.uniformSegmentWidth}\n      data-full-width={props.fullWidth}\n    >\n      <input\n        className=\"charcoal-segmented-control-radio__input\"\n        {...inputProps}\n        ref={ref}\n      />\n      {props.children}\n    </label>\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAsCA,MAAM6B,yCACJ,SAASE,sBAAsBC,OAAOC,KAAK;CACzC,MAAMV,YAAYf,oCAChB,8BACAwB,MAAMT,UACP;CAED,MAAMW,gDACG;EACL,GAAGF;EACHG,YAAYH,MAAMf;EAClBmB,YAAYJ,MAAMX;EAClBgB,YAAYL,MAAMV;EAClB,cAAcU,MAAMZ;EACrB,GACD,CAACY,MACH,CAAC;CACD,MAAMM,iEAA2BJ,oBAAoB;CACrD,MAAM,EAAEK,gEAAkCL,qBAAqBI,MAAM;CACrE,MAAME,iDAA8D;EAClE,OAAOR,MAAML,KAAKc,KAAKC,MACrB,OAAOA,MAAM,WAAW;GAAE1B,OAAO0B;GAAG3B,OAAO2B;GAAG,GAAGA,EAClD;IACA,CAACV,MAAML,KAAK,CAAC;CAEhB,OACE,2CAAC,OAAD;EACOM;EACL,GAAIM;EACOhB;EACX,8BAA4BS,MAAMR;EAClC,mBAAiBQ,MAAMP;YAEvB,2CAAC,yCAAD;GAAe,OAAOa;aACnBE,sBAAsBC,KAAKE,SAC1B,2CAAC,WAAD;IAEE,OAAOA,KAAK3B;IACZ,UAAU2B,KAAK1B;IACf,qBAAqBe,MAAMR;cAE1BmB,KAAK5B;IAET,EAPQ4B,KAAK3B,MAOb,CAAC;GACW;EACX;EAGX;AAED,+CAAoBa,iBAAiB;AAUrC,MAAMiB,aAAad,UAAsB;CACvC,MAAMM,QAAQ/B,2CAAiB;CAC/B,MAAM0B,wBAA+B,KAAK;CAU1C,MAAM,EAAEgB,YAAYd,YAAYe,gFARvB;EACLlC,OAAOgB,MAAMhB;EACbmB,YAAYH,MAAMf;EAClB4B,UAAUb,MAAMa;EACjB,GACD,CAACb,MACH,CAGgB,EACdM,OACAL,IACD;CAED,OACE,4CAAC,SAAD;EACE,WAAU;EACV,iBAAeE,cAAcG,MAAMF;EACnC,gBAAcc;EACd,8BAA4BlB,MAAMR;EAClC,mBAAiBQ,MAAMP;YALzB,CAOE,2CAAC,SAAD;GACE,WAAU;GACV,GAAIwB;GACChB;GAAI,GAEVD,MAAMa,SACD"}

package/dist/components/SegmentedControl/index2.js

@@ -0,0 +1,70 @@
+"use client";
+import { useClassNames } from "../../_lib/useClassNames.js";
+import { RadioProvider, useRadioContext } from "./RadioGroupContext.js";
+/* empty css      */
+import { forwardRef, memo, useMemo, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRadio, useRadioGroup } from "react-aria/useRadioGroup";
+import { useRadioGroupState } from "react-stately/useRadioGroupState";
+
+//#region src/components/SegmentedControl/index.tsx
+const SegmentedControl = forwardRef(function SegmentedControlInner(props, ref) {
+	const className = useClassNames("charcoal-segmented-control", props.className);
+	const ariaRadioGroupProps = useMemo(() => ({
+		...props,
+		isDisabled: props.disabled,
+		isReadOnly: props.readonly,
+		isRequired: props.required,
+		"aria-label": props.name
+	}), [props]);
+	const state = useRadioGroupState(ariaRadioGroupProps);
+	const { radioGroupProps } = useRadioGroup(ariaRadioGroupProps, state);
+	const segmentedControlItems = useMemo(() => {
+		return props.data.map((d) => typeof d === "string" ? {
+			value: d,
+			label: d
+		} : d);
+	}, [props.data]);
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		...radioGroupProps,
+		className,
+		"data-uniform-segment-width": props.uniformSegmentWidth,
+		"data-full-width": props.fullWidth,
+		children: /* @__PURE__ */ jsx(RadioProvider, {
+			value: state,
+			children: segmentedControlItems.map((item) => /* @__PURE__ */ jsx(Segmented, {
+				value: item.value,
+				disabled: item.disabled,
+				uniformSegmentWidth: props.uniformSegmentWidth,
+				children: item.label
+			}, item.value))
+		})
+	});
+});
+var SegmentedControl_default = memo(SegmentedControl);
+const Segmented = (props) => {
+	const state = useRadioContext();
+	const ref = useRef(null);
+	const { inputProps, isDisabled, isSelected } = useRadio(useMemo(() => ({
+		value: props.value,
+		isDisabled: props.disabled,
+		children: props.children
+	}), [props]), state, ref);
+	return /* @__PURE__ */ jsxs("label", {
+		className: "charcoal-segmented-control-radio__label",
+		"aria-disabled": isDisabled || state.isReadOnly,
+		"data-checked": isSelected,
+		"data-uniform-segment-width": props.uniformSegmentWidth,
+		"data-full-width": props.fullWidth,
+		children: [/* @__PURE__ */ jsx("input", {
+			className: "charcoal-segmented-control-radio__input",
+			...inputProps,
+			ref
+		}), props.children]
+	});
+};
+
+//#endregion
+export { SegmentedControl_default as default };
+//# sourceMappingURL=index2.js.map

package/dist/components/SegmentedControl/index2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.js","names":["ReactNode","forwardRef","memo","useMemo","useRef","React","RadioProvider","useRadioContext","useClassNames","AriaRadioGroupProps","AriaRadioProps","useRadio","useRadioGroup","useRadioGroupState","SegmentedControlItem","label","value","disabled","SegmentedControlProps","id","name","readonly","required","className","uniformSegmentWidth","fullWidth","defaultValue","data","onChange","SegmentedControl","HTMLDivElement","SegmentedControlInner","props","ref","ariaRadioGroupProps","isDisabled","isReadOnly","isRequired","state","radioGroupProps","segmentedControlItems","map","d","item","RadioProps","children","Segmented","HTMLInputElement","ariaRadioProps","inputProps","isSelected"],"sources":["../../../src/components/SegmentedControl/index.tsx"],"sourcesContent":["import { ReactNode, forwardRef, memo, useMemo, useRef } from 'react'\nimport * as React from 'react'\nimport { RadioProvider, useRadioContext } from './RadioGroupContext'\nimport { useClassNames } from '../../_lib/useClassNames'\nimport './index.css'\nimport {\n  AriaRadioGroupProps,\n  AriaRadioProps,\n  useRadio,\n  useRadioGroup,\n} from 'react-aria/useRadioGroup'\n\nimport { useRadioGroupState } from 'react-stately/useRadioGroupState'\n\ntype SegmentedControlItem = {\n  label: React.ReactNode\n  value: string\n  disabled?: boolean\n}\n\nexport type SegmentedControlProps = {\n  readonly id?: string\n  readonly name?: string\n  readonly disabled?: boolean\n  readonly readonly?: boolean\n  readonly required?: boolean\n  readonly className?: string\n  readonly uniformSegmentWidth?: boolean\n  readonly fullWidth?: boolean\n\n  readonly value?: string\n  readonly defaultValue?: string\n\n  readonly data: string[] | SegmentedControlItem[]\n\n  readonly onChange?: (value: string) => void\n}\n\nconst SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>(\n  function SegmentedControlInner(props, ref) {\n    const className = useClassNames(\n      'charcoal-segmented-control',\n      props.className,\n    )\n\n    const ariaRadioGroupProps = useMemo<AriaRadioGroupProps>(\n      () => ({\n        ...props,\n        isDisabled: props.disabled,\n        isReadOnly: props.readonly,\n        isRequired: props.required,\n        'aria-label': props.name,\n      }),\n      [props],\n    )\n    const state = useRadioGroupState(ariaRadioGroupProps)\n    const { radioGroupProps } = useRadioGroup(ariaRadioGroupProps, state)\n    const segmentedControlItems = useMemo<SegmentedControlItem[]>(() => {\n      return props.data.map((d) =>\n        typeof d === 'string' ? { value: d, label: d } : d,\n      )\n    }, [props.data])\n\n    return (\n      <div\n        ref={ref}\n        {...radioGroupProps}\n        className={className}\n        data-uniform-segment-width={props.uniformSegmentWidth}\n        data-full-width={props.fullWidth}\n      >\n        <RadioProvider value={state}>\n          {segmentedControlItems.map((item) => (\n            <Segmented\n              key={item.value}\n              value={item.value}\n              disabled={item.disabled}\n              uniformSegmentWidth={props.uniformSegmentWidth}\n            >\n              {item.label}\n            </Segmented>\n          ))}\n        </RadioProvider>\n      </div>\n    )\n  },\n)\n\nexport default memo(SegmentedControl)\n\ntype RadioProps = {\n  value: string\n  disabled?: boolean\n  children?: ReactNode\n  uniformSegmentWidth?: boolean\n  fullWidth?: boolean\n}\n\nconst Segmented = (props: RadioProps) => {\n  const state = useRadioContext()\n  const ref = useRef<HTMLInputElement>(null)\n  const ariaRadioProps = useMemo<AriaRadioProps>(\n    () => ({\n      value: props.value,\n      isDisabled: props.disabled,\n      children: props.children,\n    }),\n    [props],\n  )\n\n  const { inputProps, isDisabled, isSelected } = useRadio(\n    ariaRadioProps,\n    state,\n    ref,\n  )\n\n  return (\n    <label\n      className=\"charcoal-segmented-control-radio__label\"\n      aria-disabled={isDisabled || state.isReadOnly}\n      data-checked={isSelected}\n      data-uniform-segment-width={props.uniformSegmentWidth}\n      data-full-width={props.fullWidth}\n    >\n      <input\n        className=\"charcoal-segmented-control-radio__input\"\n        {...inputProps}\n        ref={ref}\n      />\n      {props.children}\n    </label>\n  )\n}\n"],"mappings":";;;;;;;;;;AAsCA,MAAM6B,mBAAmB5B,WACvB,SAAS8B,sBAAsBC,OAAOC,KAAK;CACzC,MAAMV,YAAYf,cAChB,8BACAwB,MAAMT,UACP;CAED,MAAMW,sBAAsB/B,eACnB;EACL,GAAG6B;EACHG,YAAYH,MAAMf;EAClBmB,YAAYJ,MAAMX;EAClBgB,YAAYL,MAAMV;EAClB,cAAcU,MAAMZ;EACrB,GACD,CAACY,MACH,CAAC;CACD,MAAMM,QAAQzB,mBAAmBqB,oBAAoB;CACrD,MAAM,EAAEK,oBAAoB3B,cAAcsB,qBAAqBI,MAAM;CACrE,MAAME,wBAAwBrC,cAAsC;EAClE,OAAO6B,MAAML,KAAKc,KAAKC,MACrB,OAAOA,MAAM,WAAW;GAAE1B,OAAO0B;GAAG3B,OAAO2B;GAAG,GAAGA,EAClD;IACA,CAACV,MAAML,KAAK,CAAC;CAEhB,OACE,oBAAC,OAAD;EACOM;EACL,GAAIM;EACOhB;EACX,8BAA4BS,MAAMR;EAClC,mBAAiBQ,MAAMP;YAEvB,oBAAC,eAAD;GAAe,OAAOa;aACnBE,sBAAsBC,KAAKE,SAC1B,oBAAC,WAAD;IAEE,OAAOA,KAAK3B;IACZ,UAAU2B,KAAK1B;IACf,qBAAqBe,MAAMR;cAE1BmB,KAAK5B;IAET,EAPQ4B,KAAK3B,MAOb,CAAC;GACW;EACX;EAGX;AAED,+BAAed,KAAK2B,iBAAiB;AAUrC,MAAMiB,aAAad,UAAsB;CACvC,MAAMM,QAAQ/B,iBAAiB;CAC/B,MAAM0B,MAAM7B,OAAyB,KAAK;CAU1C,MAAM,EAAE6C,YAAYd,YAAYe,eAAevC,SATxBR,eACd;EACLa,OAAOgB,MAAMhB;EACbmB,YAAYH,MAAMf;EAClB4B,UAAUb,MAAMa;EACjB,GACD,CAACb,MACH,CAGgB,EACdM,OACAL,IACD;CAED,OACE,qBAAC,SAAD;EACE,WAAU;EACV,iBAAeE,cAAcG,MAAMF;EACnC,gBAAcc;EACd,8BAA4BlB,MAAMR;EAClC,mBAAiBQ,MAAMP;YALzB,CAOE,oBAAC,SAAD;GACE,WAAU;GACV,GAAIwB;GACChB;GAAI,GAEVD,MAAMa,SACD"}

package/dist/components/Switch/SwitchInput/index2.cjs

@@ -0,0 +1,25 @@
+"use client";
+const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
+const require_useClassNames = require('../../../_lib/useClassNames.cjs');
+require('./index.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/Switch/SwitchInput/index.tsx
+const SwitchInput = (0, react.forwardRef)(function SwitchInput({ onChange, className, ...props }, ref) {
+	const handleChange = (0, react.useCallback)((e) => {
+		const el = e.currentTarget;
+		onChange?.(el.checked);
+	}, [onChange]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+		ref,
+		className: require_useClassNames.useClassNames("charcoal-switch-input", className),
+		type: "checkbox",
+		onChange: handleChange,
+		...props
+	});
+});
+
+//#endregion
+exports.default = SwitchInput;
+//# sourceMappingURL=index2.cjs.map

package/dist/components/Switch/SwitchInput/index2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index2.cjs","names":["forwardRef","useCallback","useClassNames","CharcoalSwitchProps","onChange","checked","InputProps","React","HTMLProps","HTMLInputElement","SwitchInputProps","Omit","SwitchInput","className","props","ref","handleChange","e","ChangeEvent","el","currentTarget","classNames"],"sources":["../../../../src/components/Switch/SwitchInput/index.tsx"],"sourcesContent":["import './index.css'\n\nimport { forwardRef, useCallback } from 'react'\nimport { useClassNames } from '../../../_lib/useClassNames'\n\nexport type CharcoalSwitchProps = {\n  onChange?: (checked: boolean) => void\n}\n\ntype InputProps = React.HTMLProps<HTMLInputElement>\n\nexport type SwitchInputProps = CharcoalSwitchProps &\n  Omit<InputProps, keyof CharcoalSwitchProps | 'ref'>\n\nconst SwitchInput = forwardRef<\n  HTMLInputElement,\n  Omit<SwitchInputProps, 'children'>\n>(function SwitchInput({ onChange, className, ...props }, ref) {\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const el = e.currentTarget\n      onChange?.(el.checked)\n    },\n    [onChange],\n  )\n\n  const classNames = useClassNames('charcoal-switch-input', className)\n  return (\n    <input\n      ref={ref}\n      className={classNames}\n      type=\"checkbox\"\n      onChange={handleChange}\n      {...props}\n    />\n  )\n})\n\nexport default SwitchInput\n"],"mappings":";;;;;;;;AAcA,MAAMY,oCAGJ,SAASA,YAAY,EAAER,UAAUS,WAAW,GAAGC,SAASC,KAAK;CAC7D,MAAMC,uCACHC,MAA2C;EAC1C,MAAME,KAAKF,EAAEG;EACbhB,WAAWe,GAAGd,QAAQ;IAExB,CAACD,SACH,CAAC;CAGD,OACE,2CAAC,SAAD;EACOW;EACL,WAJeb,oCAAc,yBAAyBW,UAIjC;EACrB,MAAK;EACL,UAAUG;EACV,GAAIF;EACJ;EAEJ"}

package/dist/components/Switch/SwitchInput/index2.js

@@ -0,0 +1,24 @@
+"use client";
+import { useClassNames } from "../../../_lib/useClassNames.js";
+/* empty css      */
+import { forwardRef, useCallback } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/Switch/SwitchInput/index.tsx
+const SwitchInput = forwardRef(function SwitchInput({ onChange, className, ...props }, ref) {
+	const handleChange = useCallback((e) => {
+		const el = e.currentTarget;
+		onChange?.(el.checked);
+	}, [onChange]);
+	return /* @__PURE__ */ jsx("input", {
+		ref,
+		className: useClassNames("charcoal-switch-input", className),
+		type: "checkbox",
+		onChange: handleChange,
+		...props
+	});
+});
+
+//#endregion
+export { SwitchInput as default };
+//# sourceMappingURL=index2.js.map