@pixpilot/formily-shadcn 0.44.2 → 0.45.0

package/dist/components/Checkbox.d.cts

@@ -1,4 +1,4 @@
-import * as react1 from "react";
+import * as react0 from "react";
 import * as _radix_ui_react_checkbox0 from "@radix-ui/react-checkbox";
 
 //#region src/components/Checkbox.d.ts
@@ -6,6 +6,6 @@ import * as _radix_ui_react_checkbox0 from "@radix-ui/react-checkbox";
  * Formily-connected Checkbox component
  * Maps Formily field checked state to shadcn Checkbox
  */
-declare const Checkbox: react1.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_checkbox0.CheckboxProps & react1.RefAttributes<HTMLButtonElement>>, "ref"> & react1.RefAttributes<unknown>>;
+declare const Checkbox: react0.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_checkbox0.CheckboxProps & react0.RefAttributes<HTMLButtonElement>>, "ref"> & react0.RefAttributes<unknown>>;
 //#endregion
 export { Checkbox };

package/dist/components/DatePicker.d.cts

@@ -1,11 +1,11 @@
-import * as react0 from "react";
+import * as react2 from "react";
 import { DatePickerProps } from "@pixpilot/shadcn-ui";
 
 //#region src/components/DatePicker.d.ts
-declare const DatePicker: react0.ForwardRefExoticComponent<Partial<{
+declare const DatePicker: react2.ForwardRefExoticComponent<Partial<{
   value?: Date;
   onChange?: (date: Date | undefined) => void;
   placeholder?: string;
-} & Omit<DatePickerProps, "onSelect" | "selected" | "mode">> & react0.RefAttributes<unknown>>;
+} & Omit<DatePickerProps, "onSelect" | "selected" | "mode">> & react2.RefAttributes<unknown>>;
 //#endregion
 export { DatePicker };

package/dist/components/IconPicker.d.cts

@@ -1,4 +1,4 @@
-import * as react11 from "react";
+import * as react7 from "react";
 import { IconPickerProps, IconProviderProps } from "@pixpilot/shadcn-ui";
 
 //#region src/components/IconPicker.d.ts
@@ -8,8 +8,8 @@ import { IconPickerProps, IconProviderProps } from "@pixpilot/shadcn-ui";
  * Automatically connects to Formily field state
  * Supports both static and async icon providers
  */
-declare const IconPicker: react11.ForwardRefExoticComponent<Partial<Omit<IconPickerProps, "providers"> & {
+declare const IconPicker: react7.ForwardRefExoticComponent<Partial<Omit<IconPickerProps, "providers"> & {
   providers?: IconProviderProps[];
-}> & react11.RefAttributes<unknown>>;
+}> & react7.RefAttributes<unknown>>;
 //#endregion
 export { IconPicker };

package/dist/components/Input.d.cts

@@ -1,4 +1,4 @@
-import * as react7 from "react";
+import * as react9 from "react";
 
 //#region src/components/Input.d.ts
 
@@ -6,12 +6,12 @@ import * as react7 from "react";
  * Formily-connected Input component
  * Automatically connects shadcn Input to Formily field state
  */
-declare const Input: react7.ForwardRefExoticComponent<Omit<Partial<react7.ClassAttributes<HTMLInputElement> & react7.InputHTMLAttributes<HTMLInputElement> & {
+declare const Input: react9.ForwardRefExoticComponent<Omit<Partial<react9.ClassAttributes<HTMLInputElement> & react9.InputHTMLAttributes<HTMLInputElement> & {
   prefix?: React.ReactNode;
   suffix?: React.ReactNode;
   groupClassName?: string;
   prefixClassName?: string;
   suffixClassName?: string;
-}>, "ref"> & react7.RefAttributes<unknown>>;
+}>, "ref"> & react9.RefAttributes<unknown>>;
 //#endregion
 export { Input };

package/dist/components/Rating.d.cts

@@ -1,13 +1,13 @@
-import * as react25 from "react";
-import * as _pixpilot_shadcn_ui1 from "@pixpilot/shadcn-ui";
+import * as react13 from "react";
+import * as _pixpilot_shadcn_ui0 from "@pixpilot/shadcn-ui";
 
 //#region src/components/Rating.d.ts
 /**
  * Formily-connected Rating component
  * Automatically connects shadcn-ui Rating to Formily field state
  */
-declare const Rating: react25.ForwardRefExoticComponent<Partial<_pixpilot_shadcn_ui1.RatingProps & {
-  children?: react25.ReactNode | undefined;
-}> & react25.RefAttributes<unknown>>;
+declare const Rating: react13.ForwardRefExoticComponent<Partial<_pixpilot_shadcn_ui0.RatingProps & {
+  children?: react13.ReactNode | undefined;
+}> & react13.RefAttributes<unknown>>;
 //#endregion
 export { Rating };

package/dist/components/Select.cjs

@@ -1,4 +1,5 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_resolve_field_options = require('../utils/resolve-field-options.cjs');
 let __formily_react = require("@formily/react");
 __formily_react = require_rolldown_runtime.__toESM(__formily_react);
 let __pixpilot_shadcn_ui = require("@pixpilot/shadcn-ui");
@@ -7,15 +8,17 @@ let react_jsx_runtime = require("react/jsx-runtime");
 react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/components/Select.tsx
-function isOptionArray(value) {
-	return Array.isArray(value) && value.every((item) => typeof item === "object" && item !== null && "value" in item && "label" in item);
-}
 const SelectComponent = ({ mapOption, options,...props }) => {
-	const field = (0, __formily_react.useField)();
-	let selectOptions;
-	if (isOptionArray(field?.componentProps?.options)) selectOptions = field.componentProps.options;
-	else if (isOptionArray(options)) selectOptions = options;
-	const transformedOptions = selectOptions?.map((option) => mapOption ? mapOption(option) : option);
+	const transformedOptions = require_resolve_field_options.resolveFieldOptions({
+		field: (0, __formily_react.useField)(),
+		options
+	})?.map((option) => {
+		const normalizedOption = {
+			value: option.value,
+			label: typeof option.label === "string" ? option.label : String(option.value)
+		};
+		return mapOption ? mapOption(normalizedOption) : normalizedOption;
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn_ui.Select, {
 		...props,
 		options: transformedOptions

package/dist/components/Select.js

@@ -1,17 +1,20 @@
+import { resolveFieldOptions } from "../utils/resolve-field-options.js";
 import { connect, mapProps, useField } from "@formily/react";
 import { Select } from "@pixpilot/shadcn-ui";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/Select.tsx
-function isOptionArray(value) {
-	return Array.isArray(value) && value.every((item) => typeof item === "object" && item !== null && "value" in item && "label" in item);
-}
 const SelectComponent = ({ mapOption, options,...props }) => {
-	const field = useField();
-	let selectOptions;
-	if (isOptionArray(field?.componentProps?.options)) selectOptions = field.componentProps.options;
-	else if (isOptionArray(options)) selectOptions = options;
-	const transformedOptions = selectOptions?.map((option) => mapOption ? mapOption(option) : option);
+	const transformedOptions = resolveFieldOptions({
+		field: useField(),
+		options
+	})?.map((option) => {
+		const normalizedOption = {
+			value: option.value,
+			label: typeof option.label === "string" ? option.label : String(option.value)
+		};
+		return mapOption ? mapOption(normalizedOption) : normalizedOption;
+	});
 	return /* @__PURE__ */ jsx(Select, {
 		...props,
 		options: transformedOptions

package/dist/components/Separator.d.cts

@@ -1,4 +1,4 @@
-import * as react13 from "react";
+import * as react16 from "react";
 import * as _radix_ui_react_separator0 from "@radix-ui/react-separator";
 
 //#region src/components/Separator.d.ts
@@ -6,6 +6,6 @@ import * as _radix_ui_react_separator0 from "@radix-ui/react-separator";
  * Formily-connected Separator component
  * A visual divider for content sections
  */
-declare const Separator: react13.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_separator0.SeparatorProps & react13.RefAttributes<HTMLDivElement>>, "ref"> & react13.RefAttributes<unknown>>;
+declare const Separator: react16.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_separator0.SeparatorProps & react16.RefAttributes<HTMLDivElement>>, "ref"> & react16.RefAttributes<unknown>>;
 //#endregion
 export { Separator };

package/dist/components/Switch.d.cts

@@ -1,4 +1,4 @@
-import * as react16 from "react";
+import * as react19 from "react";
 import * as _radix_ui_react_switch0 from "@radix-ui/react-switch";
 
 //#region src/components/Switch.d.ts
@@ -6,6 +6,6 @@ import * as _radix_ui_react_switch0 from "@radix-ui/react-switch";
  * Formily-connected Switch component
  * Toggle switch for boolean values
  */
-declare const Switch: react16.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_switch0.SwitchProps & react16.RefAttributes<HTMLButtonElement>>, "ref"> & react16.RefAttributes<unknown>>;
+declare const Switch: react19.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_switch0.SwitchProps & react19.RefAttributes<HTMLButtonElement>>, "ref"> & react19.RefAttributes<unknown>>;
 //#endregion
 export { Switch };

package/dist/components/Switch.d.ts

@@ -1,4 +1,4 @@
-import * as react21 from "react";
+import * as react19 from "react";
 import * as _radix_ui_react_switch0 from "@radix-ui/react-switch";
 
 //#region src/components/Switch.d.ts
@@ -6,6 +6,6 @@ import * as _radix_ui_react_switch0 from "@radix-ui/react-switch";
  * Formily-connected Switch component
  * Toggle switch for boolean values
  */
-declare const Switch: react21.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_switch0.SwitchProps & react21.RefAttributes<HTMLButtonElement>>, "ref"> & react21.RefAttributes<unknown>>;
+declare const Switch: react19.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_switch0.SwitchProps & react19.RefAttributes<HTMLButtonElement>>, "ref"> & react19.RefAttributes<unknown>>;
 //#endregion
 export { Switch };

package/dist/components/TagsInputInline.d.cts

@@ -1,5 +1,5 @@
-import * as react19 from "react";
-import * as _pixpilot_shadcn_ui0 from "@pixpilot/shadcn-ui";
+import * as react22 from "react";
+import * as _pixpilot_shadcn_ui1 from "@pixpilot/shadcn-ui";
 
 //#region src/components/TagsInputInline.d.ts
 
@@ -10,6 +10,6 @@ import * as _pixpilot_shadcn_ui0 from "@pixpilot/shadcn-ui";
  * Based on DiceUI's tags-input for inline tag editing with keyboard navigation
  * and validation support.
  */
-declare const TagsInputInLine: react19.ForwardRefExoticComponent<Partial<_pixpilot_shadcn_ui0.TagsInputProps> & react19.RefAttributes<unknown>>;
+declare const TagsInputInLine: react22.ForwardRefExoticComponent<Partial<_pixpilot_shadcn_ui1.TagsInputProps> & react22.RefAttributes<unknown>>;
 //#endregion
 export { TagsInputInLine };

package/dist/components/TagsInputInline.d.ts

@@ -1,4 +1,4 @@
-import * as react19 from "react";
+import * as react22 from "react";
 import * as _pixpilot_shadcn_ui1 from "@pixpilot/shadcn-ui";
 
 //#region src/components/TagsInputInline.d.ts
@@ -10,6 +10,6 @@ import * as _pixpilot_shadcn_ui1 from "@pixpilot/shadcn-ui";
  * Based on DiceUI's tags-input for inline tag editing with keyboard navigation
  * and validation support.
  */
-declare const TagsInputInLine: react19.ForwardRefExoticComponent<Partial<_pixpilot_shadcn_ui1.TagsInputProps> & react19.RefAttributes<unknown>>;
+declare const TagsInputInLine: react22.ForwardRefExoticComponent<Partial<_pixpilot_shadcn_ui1.TagsInputProps> & react22.RefAttributes<unknown>>;
 //#endregion
 export { TagsInputInLine };

package/dist/components/Textarea.d.cts

@@ -1,9 +1,9 @@
-import * as react21 from "react";
+import * as react24 from "react";
 
 //#region src/components/Textarea.d.ts
 /**
  * Formily-connected Textarea component
  */
-declare const Textarea: react21.ForwardRefExoticComponent<Omit<Partial<react21.ClassAttributes<HTMLTextAreaElement> & react21.TextareaHTMLAttributes<HTMLTextAreaElement>>, "ref"> & react21.RefAttributes<unknown>>;
+declare const Textarea: react24.ForwardRefExoticComponent<Omit<Partial<react24.ClassAttributes<HTMLTextAreaElement> & react24.TextareaHTMLAttributes<HTMLTextAreaElement>>, "ref"> & react24.RefAttributes<unknown>>;
 //#endregion
 export { Textarea };

package/dist/components/ToggleGroup.cjs

@@ -0,0 +1,118 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_resolve_field_options = require('../utils/resolve-field-options.cjs');
+let __formily_react = require("@formily/react");
+__formily_react = require_rolldown_runtime.__toESM(__formily_react);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let __pixpilot_shadcn_ui = require("@pixpilot/shadcn-ui");
+__pixpilot_shadcn_ui = require_rolldown_runtime.__toESM(__pixpilot_shadcn_ui);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/ToggleGroup.tsx
+function toVariant(input) {
+	return input === "outline" || input === "default" ? input : void 0;
+}
+function toSize(input) {
+	return input === "sm" || input === "lg" || input === "default" ? input : void 0;
+}
+function isToggleGroupValue(value) {
+	return typeof value === "string" || typeof value === "number";
+}
+function coerceOptions(options) {
+	if (!Array.isArray(options)) return [];
+	return options.map((option) => {
+		const { value, label, disabled } = option;
+		if (!isToggleGroupValue(value)) return null;
+		return {
+			value,
+			label,
+			disabled: Boolean(disabled)
+		};
+	}).filter((v) => v !== null);
+}
+function ToggleGroupBase({ options, value, defaultValue, onValueChange, allowEmptySelection = false, variant = "outline", size, buttonClassName, ref,...props }) {
+	const valueString = value === void 0 ? void 0 : String(value);
+	const defaultValueString = defaultValue === void 0 ? void 0 : String(defaultValue);
+	const valueByString = react.useMemo(() => {
+		const map = /* @__PURE__ */ new Map();
+		for (const option of options) map.set(String(option.value), option.value);
+		return map;
+	}, [options]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn_ui.ToggleGroup, {
+		...props,
+		ref,
+		type: "single",
+		value: valueString,
+		defaultValue: defaultValueString,
+		variant: toVariant(variant),
+		size: toSize(size),
+		onValueChange: (nextValue) => {
+			if (nextValue === "") {
+				if (allowEmptySelection !== true) return;
+				onValueChange?.(void 0);
+				return;
+			}
+			onValueChange?.(valueByString.get(nextValue) ?? nextValue);
+		},
+		children: options.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn_ui.ToggleGroupItem, {
+			value: String(option.value),
+			"aria-label": String(option.value),
+			disabled: option.disabled,
+			className: buttonClassName,
+			children: option.label
+		}, String(option.value)))
+	});
+}
+/**
+* ToggleGroup component for single selection from a set of options.
+*
+* For multiple selection (array fields), use ArrayToggleGroup instead.
+*
+* Example usage:
+* ```tsx
+* const schema = {
+*   type: 'object',
+*   properties: {
+*     period: {
+*       type: 'string',
+*       title: 'Select period',
+*       enum: [
+*         { label: 'Day', value: 'day' },
+*         { label: 'Week', value: 'week' },
+*         { label: 'Month', value: 'month' },
+*       ],
+*       'x-decorator': 'FormItem',
+*       'x-component': 'ToggleGroup',
+*       'x-component-props': {
+*         allowEmptySelection: false,
+*       },
+*     },
+*   },
+* };
+* ```
+*/
+const ToggleGroup = (0, __formily_react.connect)(ToggleGroupBase, (0, __formily_react.mapProps)({
+	value: true,
+	onInput: "onValueChange",
+	dataSource: "options"
+}, (props, field) => {
+	const toggleGroupProps = props;
+	const fieldValue = field.value;
+	const resolvedOptions = coerceOptions(require_resolve_field_options.resolveFieldOptions({
+		field,
+		options: props.options
+	}));
+	const value = isToggleGroupValue(fieldValue) ? fieldValue : void 0;
+	return {
+		...toggleGroupProps,
+		options: resolvedOptions,
+		value,
+		onValueChange: (nextValue) => {
+			field.onInput(nextValue).catch(() => {});
+		}
+	};
+}));
+
+//#endregion
+exports.ToggleGroup = ToggleGroup;

package/dist/components/ToggleGroup.d.cts

@@ -0,0 +1,55 @@
+import * as React$1 from "react";
+import { ToggleGroupProps } from "@pixpilot/shadcn-ui";
+import "react/jsx-runtime";
+
+//#region src/components/ToggleGroup.d.ts
+type ToggleGroupValue = string | number;
+type ToggleGroupVariant = 'default' | 'outline';
+type ToggleGroupSize = 'default' | 'sm' | 'lg';
+interface ToggleGroupOption {
+  label: React$1.ReactNode;
+  value: ToggleGroupValue;
+  disabled?: boolean;
+}
+interface ToggleGroupBaseProps extends Omit<ToggleGroupProps, 'type' | 'value' | 'defaultValue' | 'onValueChange' | 'children' | 'variant' | 'size'> {
+  options: readonly ToggleGroupOption[];
+  value?: ToggleGroupValue;
+  defaultValue?: ToggleGroupValue;
+  onValueChange?: (value: ToggleGroupValue | undefined) => void;
+  allowEmptySelection?: boolean;
+  variant?: ToggleGroupVariant;
+  size?: ToggleGroupSize;
+  buttonClassName?: string;
+  ref?: React$1.Ref<HTMLDivElement>;
+}
+/**
+ * ToggleGroup component for single selection from a set of options.
+ *
+ * For multiple selection (array fields), use ArrayToggleGroup instead.
+ *
+ * Example usage:
+ * ```tsx
+ * const schema = {
+ *   type: 'object',
+ *   properties: {
+ *     period: {
+ *       type: 'string',
+ *       title: 'Select period',
+ *       enum: [
+ *         { label: 'Day', value: 'day' },
+ *         { label: 'Week', value: 'week' },
+ *         { label: 'Month', value: 'month' },
+ *       ],
+ *       'x-decorator': 'FormItem',
+ *       'x-component': 'ToggleGroup',
+ *       'x-component-props': {
+ *         allowEmptySelection: false,
+ *       },
+ *     },
+ *   },
+ * };
+ * ```
+ */
+declare const ToggleGroup: React$1.ForwardRefExoticComponent<Omit<Partial<ToggleGroupBaseProps>, "ref"> & React$1.RefAttributes<unknown>>;
+//#endregion
+export { ToggleGroup, ToggleGroupBaseProps };

package/dist/components/ToggleGroup.d.ts

@@ -0,0 +1,55 @@
+import * as React$1 from "react";
+import { ToggleGroupProps } from "@pixpilot/shadcn-ui";
+import "react/jsx-runtime";
+
+//#region src/components/ToggleGroup.d.ts
+type ToggleGroupValue = string | number;
+type ToggleGroupVariant = 'default' | 'outline';
+type ToggleGroupSize = 'default' | 'sm' | 'lg';
+interface ToggleGroupOption {
+  label: React$1.ReactNode;
+  value: ToggleGroupValue;
+  disabled?: boolean;
+}
+interface ToggleGroupBaseProps extends Omit<ToggleGroupProps, 'type' | 'value' | 'defaultValue' | 'onValueChange' | 'children' | 'variant' | 'size'> {
+  options: readonly ToggleGroupOption[];
+  value?: ToggleGroupValue;
+  defaultValue?: ToggleGroupValue;
+  onValueChange?: (value: ToggleGroupValue | undefined) => void;
+  allowEmptySelection?: boolean;
+  variant?: ToggleGroupVariant;
+  size?: ToggleGroupSize;
+  buttonClassName?: string;
+  ref?: React$1.Ref<HTMLDivElement>;
+}
+/**
+ * ToggleGroup component for single selection from a set of options.
+ *
+ * For multiple selection (array fields), use ArrayToggleGroup instead.
+ *
+ * Example usage:
+ * ```tsx
+ * const schema = {
+ *   type: 'object',
+ *   properties: {
+ *     period: {
+ *       type: 'string',
+ *       title: 'Select period',
+ *       enum: [
+ *         { label: 'Day', value: 'day' },
+ *         { label: 'Week', value: 'week' },
+ *         { label: 'Month', value: 'month' },
+ *       ],
+ *       'x-decorator': 'FormItem',
+ *       'x-component': 'ToggleGroup',
+ *       'x-component-props': {
+ *         allowEmptySelection: false,
+ *       },
+ *     },
+ *   },
+ * };
+ * ```
+ */
+declare const ToggleGroup$1: React$1.ForwardRefExoticComponent<Omit<Partial<ToggleGroupBaseProps>, "ref"> & React$1.RefAttributes<unknown>>;
+//#endregion
+export { ToggleGroup$1 as ToggleGroup, ToggleGroupBaseProps };

package/dist/components/ToggleGroup.js

@@ -0,0 +1,113 @@
+import { resolveFieldOptions } from "../utils/resolve-field-options.js";
+import { connect, mapProps } from "@formily/react";
+import * as React$1 from "react";
+import { ToggleGroup, ToggleGroupItem } from "@pixpilot/shadcn-ui";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/ToggleGroup.tsx
+function toVariant(input) {
+	return input === "outline" || input === "default" ? input : void 0;
+}
+function toSize(input) {
+	return input === "sm" || input === "lg" || input === "default" ? input : void 0;
+}
+function isToggleGroupValue(value) {
+	return typeof value === "string" || typeof value === "number";
+}
+function coerceOptions(options) {
+	if (!Array.isArray(options)) return [];
+	return options.map((option) => {
+		const { value, label, disabled } = option;
+		if (!isToggleGroupValue(value)) return null;
+		return {
+			value,
+			label,
+			disabled: Boolean(disabled)
+		};
+	}).filter((v) => v !== null);
+}
+function ToggleGroupBase({ options, value, defaultValue, onValueChange, allowEmptySelection = false, variant = "outline", size, buttonClassName, ref,...props }) {
+	const valueString = value === void 0 ? void 0 : String(value);
+	const defaultValueString = defaultValue === void 0 ? void 0 : String(defaultValue);
+	const valueByString = React$1.useMemo(() => {
+		const map = /* @__PURE__ */ new Map();
+		for (const option of options) map.set(String(option.value), option.value);
+		return map;
+	}, [options]);
+	return /* @__PURE__ */ jsx(ToggleGroup, {
+		...props,
+		ref,
+		type: "single",
+		value: valueString,
+		defaultValue: defaultValueString,
+		variant: toVariant(variant),
+		size: toSize(size),
+		onValueChange: (nextValue) => {
+			if (nextValue === "") {
+				if (allowEmptySelection !== true) return;
+				onValueChange?.(void 0);
+				return;
+			}
+			onValueChange?.(valueByString.get(nextValue) ?? nextValue);
+		},
+		children: options.map((option) => /* @__PURE__ */ jsx(ToggleGroupItem, {
+			value: String(option.value),
+			"aria-label": String(option.value),
+			disabled: option.disabled,
+			className: buttonClassName,
+			children: option.label
+		}, String(option.value)))
+	});
+}
+/**
+* ToggleGroup component for single selection from a set of options.
+*
+* For multiple selection (array fields), use ArrayToggleGroup instead.
+*
+* Example usage:
+* ```tsx
+* const schema = {
+*   type: 'object',
+*   properties: {
+*     period: {
+*       type: 'string',
+*       title: 'Select period',
+*       enum: [
+*         { label: 'Day', value: 'day' },
+*         { label: 'Week', value: 'week' },
+*         { label: 'Month', value: 'month' },
+*       ],
+*       'x-decorator': 'FormItem',
+*       'x-component': 'ToggleGroup',
+*       'x-component-props': {
+*         allowEmptySelection: false,
+*       },
+*     },
+*   },
+* };
+* ```
+*/
+const ToggleGroup$1 = connect(ToggleGroupBase, mapProps({
+	value: true,
+	onInput: "onValueChange",
+	dataSource: "options"
+}, (props, field) => {
+	const toggleGroupProps = props;
+	const fieldValue = field.value;
+	const resolvedOptions = coerceOptions(resolveFieldOptions({
+		field,
+		options: props.options
+	}));
+	const value = isToggleGroupValue(fieldValue) ? fieldValue : void 0;
+	return {
+		...toggleGroupProps,
+		options: resolvedOptions,
+		value,
+		onValueChange: (nextValue) => {
+			field.onInput(nextValue).catch(() => {});
+		}
+	};
+}));
+
+//#endregion
+export { ToggleGroup$1 as ToggleGroup };

package/dist/components/array-base/components/Addition.cjs

@@ -18,17 +18,25 @@ function ArrayAddition({ ref,...props }) {
 	const { fullWidth = true } = props;
 	const self = (0, __formily_react.useField)();
 	const array = require_array_context.useArray();
+	const currentLength = Array.isArray(array?.field?.value) ? array.field.value.length : 0;
+	const maxItems = array?.schema?.maxItems;
+	const isAtMax = typeof maxItems === "number" && currentLength >= maxItems;
+	const isDisabled = Boolean(self?.disabled || array?.props?.disabled || isAtMax);
+	const tooltip = isAtMax ? `Maximum of ${maxItems} items reached` : props.tooltip;
 	if (!array) return null;
 	if (array.field?.pattern !== "editable" && array.field?.pattern !== "disabled") return null;
+	const defaultLabel = props.title ?? self.title ?? props.children ?? "Add Item";
+	const buttonLabel = isAtMax ? `Limit Reached (${currentLength}/${maxItems})` : defaultLabel;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn_ui.Button, {
 		type: "button",
 		variant: fullWidth ? "ghost" : "outline",
 		...props,
-		disabled: self?.disabled || array.props?.disabled,
+		disabledTooltip: tooltip,
+		disabled: isDisabled,
 		className: (0, __pixpilot_shadcn_ui.cn)(props.className, { "w-full border border-dashed border-muted": fullWidth }),
 		ref,
 		onClick: (e) => {
-			if (array.props?.disabled) return;
+			if (array.props?.disabled || isAtMax) return;
 			if (props.onClick) {
 				props.onClick(e);
 				if (e.defaultPrevented) return;
@@ -42,7 +50,7 @@ function ArrayAddition({ ref,...props }) {
 				array.props?.onAdd?.((array?.field?.value?.length ?? 1) - 1);
 			}
 		},
-		children: [props.icon !== void 0 ? props.icon : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.PlusIcon, { className: "mr-2 size-4" }), props.title ?? self.title ?? props.children ?? "Add Item"]
+		children: [!isAtMax && (props.icon !== void 0 ? props.icon : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.PlusIcon, { className: "mr-2 size-4" })), buttonLabel]
 	});
 }
 ArrayAddition.displayName = "ArrayAddition";

package/dist/components/array-base/components/Addition.js

@@ -12,17 +12,25 @@ function ArrayAddition({ ref,...props }) {
 	const { fullWidth = true } = props;
 	const self = useField();
 	const array = useArray();
+	const currentLength = Array.isArray(array?.field?.value) ? array.field.value.length : 0;
+	const maxItems = array?.schema?.maxItems;
+	const isAtMax = typeof maxItems === "number" && currentLength >= maxItems;
+	const isDisabled = Boolean(self?.disabled || array?.props?.disabled || isAtMax);
+	const tooltip = isAtMax ? `Maximum of ${maxItems} items reached` : props.tooltip;
 	if (!array) return null;
 	if (array.field?.pattern !== "editable" && array.field?.pattern !== "disabled") return null;
+	const defaultLabel = props.title ?? self.title ?? props.children ?? "Add Item";
+	const buttonLabel = isAtMax ? `Limit Reached (${currentLength}/${maxItems})` : defaultLabel;
 	return /* @__PURE__ */ jsxs(Button, {
 		type: "button",
 		variant: fullWidth ? "ghost" : "outline",
 		...props,
-		disabled: self?.disabled || array.props?.disabled,
+		disabledTooltip: tooltip,
+		disabled: isDisabled,
 		className: cn(props.className, { "w-full border border-dashed border-muted": fullWidth }),
 		ref,
 		onClick: (e) => {
-			if (array.props?.disabled) return;
+			if (array.props?.disabled || isAtMax) return;
 			if (props.onClick) {
 				props.onClick(e);
 				if (e.defaultPrevented) return;
@@ -36,7 +44,7 @@ function ArrayAddition({ ref,...props }) {
 				array.props?.onAdd?.((array?.field?.value?.length ?? 1) - 1);
 			}
 		},
-		children: [props.icon !== void 0 ? props.icon : /* @__PURE__ */ jsx(PlusIcon, { className: "mr-2 size-4" }), props.title ?? self.title ?? props.children ?? "Add Item"]
+		children: [!isAtMax && (props.icon !== void 0 ? props.icon : /* @__PURE__ */ jsx(PlusIcon, { className: "mr-2 size-4" })), buttonLabel]
 	});
 }
 ArrayAddition.displayName = "ArrayAddition";