@pixpilot/formily-shadcn 0.35.1 → 0.36.0

package/dist/components/DatePicker.d.cts

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

package/dist/components/FormGrid.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 
 //#region src/components/FormGrid.d.ts
 interface IFormGridProps extends React.HTMLAttributes<HTMLDivElement> {}
@@ -7,6 +7,6 @@ declare function FormGrid({
   className,
   children,
   ...rest
-}: IFormGridProps): react_jsx_runtime1.JSX.Element;
+}: IFormGridProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 export { FormGrid };

package/dist/components/IconPicker.d.cts

@@ -1,4 +1,4 @@
-import * as react4 from "react";
+import * as react8 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: react4.ForwardRefExoticComponent<Partial<Omit<IconPickerProps, "providers"> & {
+declare const IconPicker: react8.ForwardRefExoticComponent<Partial<Omit<IconPickerProps, "providers"> & {
   providers?: IconProviderProps[];
-}> & react4.RefAttributes<unknown>>;
+}> & react8.RefAttributes<unknown>>;
 //#endregion
 export { IconPicker };

package/dist/components/IconToggle.d.cts

@@ -1,4 +1,4 @@
-import * as react6 from "react";
+import * as react10 from "react";
 import * as _pixpilot_shadcn_ui0 from "@pixpilot/shadcn-ui";
 
 //#region src/components/IconToggle.d.ts
@@ -6,6 +6,6 @@ import * as _pixpilot_shadcn_ui0 from "@pixpilot/shadcn-ui";
  * Formily-connected IconToggle component
  * Toggle button with customizable icons for boolean values
  */
-declare const IconToggle: react6.ForwardRefExoticComponent<Omit<Partial<Omit<_pixpilot_shadcn_ui0.IconToggleProps, "ref"> & react6.RefAttributes<HTMLButtonElement>>, "ref"> & react6.RefAttributes<unknown>>;
+declare const IconToggle: react10.ForwardRefExoticComponent<Omit<Partial<Omit<_pixpilot_shadcn_ui0.IconToggleProps, "ref"> & react10.RefAttributes<HTMLButtonElement>>, "ref"> & react10.RefAttributes<unknown>>;
 //#endregion
 export { IconToggle };

package/dist/components/Input.d.cts

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

package/dist/components/Radio.d.ts

@@ -1,5 +1,5 @@
 import { FC } from "react";
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 import { RadioGroup } from "@pixpilot/shadcn";
 
 //#region src/components/Radio.d.ts
@@ -15,7 +15,7 @@ type RadioProps = {
 /**
  * Radio component with options rendering
  */
-declare function Radio(props: RadioProps): react_jsx_runtime2.JSX.Element;
+declare function Radio(props: RadioProps): react_jsx_runtime1.JSX.Element;
 declare namespace Radio {
   var displayName: string;
 }

package/dist/components/Separator.d.cts

@@ -1,4 +1,4 @@
-import * as react13 from "react";
+import * as react15 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: react15.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_separator0.SeparatorProps & react15.RefAttributes<HTMLDivElement>>, "ref"> & react15.RefAttributes<unknown>>;
 //#endregion
 export { Separator };

package/dist/components/Switch.d.cts

@@ -1,4 +1,4 @@
-import * as react16 from "react";
+import * as react22 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: react22.ForwardRefExoticComponent<Omit<Partial<_radix_ui_react_switch0.SwitchProps & react22.RefAttributes<HTMLButtonElement>>, "ref"> & react22.RefAttributes<unknown>>;
 //#endregion
 export { Switch };

package/dist/components/TagsInputInline.d.cts

@@ -1,4 +1,4 @@
-import * as react19 from "react";
+import * as react13 from "react";
 import * as _pixpilot_shadcn_ui0 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: react13.ForwardRefExoticComponent<Partial<_pixpilot_shadcn_ui0.TagsInputProps> & react13.RefAttributes<unknown>>;
 //#endregion
 export { TagsInputInLine };

package/dist/components/Textarea.d.cts

@@ -1,9 +1,9 @@
-import * as react21 from "react";
+import * as react18 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: react18.ForwardRefExoticComponent<Omit<Partial<react18.ClassAttributes<HTMLTextAreaElement> & react18.TextareaHTMLAttributes<HTMLTextAreaElement>>, "ref"> & react18.RefAttributes<unknown>>;
 //#endregion
 export { Textarea };

package/dist/components/array-tags/ArrayTags.cjs

@@ -0,0 +1,76 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.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/array-tags/ArrayTags.tsx
+/**
+* ArrayTags component - A simple array field for strings/numbers using TagsInput
+*
+* This component provides a tag-based interface for managing simple arrays
+* of primitive values (strings or numbers), unlike other array fields that
+* handle complex object arrays.
+*
+* Features:
+* - Inline tag editing
+* - Keyboard navigation
+* - Paste support with delimiter parsing
+* - Validation support
+* - Max tags limit
+* - Duplicate prevention
+*
+* Example usage:
+* ```tsx
+* const schema = {
+*   type: 'object',
+*   properties: {
+*     tags: {
+*       type: 'array',
+*       title: 'Tags',
+*       'x-decorator': 'FormItem',
+*       'x-component': 'ArrayTags',
+*       'x-component-props': {
+*         placeholder: 'Add tags...',
+*         maxTags: 10,
+*       },
+*     },
+*   },
+* };
+* ```
+*/
+const ArrayTags = (0, __formily_react.observer)((props) => {
+	const field = (0, __formily_react.useField)();
+	const { placeholder = "Add items...", emptyText = "No options found.", className, disabled, readOnly, maxTags, allowDuplicates = false, editable = false, delimiter = ",", addOnPaste = true, addOnTab = true, onValidate, value, onChange } = props;
+	const effectiveValue = value ?? field.value ?? [];
+	const effectiveDisabled = disabled ?? field.disabled ?? false;
+	const effectiveReadOnly = readOnly ?? field.readOnly ?? false;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn_ui.TagsInput, {
+		value: effectiveValue,
+		onChange: react.default.useCallback((newValue) => {
+			if (onChange) onChange(newValue);
+			else field.setValue(newValue);
+		}, [field, onChange]),
+		placeholder,
+		emptyText,
+		className,
+		disabled: effectiveDisabled,
+		readOnly: effectiveReadOnly,
+		maxTags,
+		allowDuplicates,
+		editable,
+		delimiter,
+		addOnPaste,
+		addOnTab,
+		onValidate,
+		freeSolo: true
+	});
+});
+ArrayTags.displayName = "ArrayTags";
+
+//#endregion
+exports.ArrayTags = ArrayTags;

package/dist/components/array-tags/ArrayTags.d.cts

@@ -0,0 +1,57 @@
+import * as _formily_react0 from "@formily/react";
+import React from "react";
+
+//#region src/components/array-tags/ArrayTags.d.ts
+interface ArrayTagsProps {
+  value?: Array<string | number>;
+  onChange?: (value: Array<string | number>) => void;
+  placeholder?: string;
+  emptyText?: string;
+  className?: string;
+  disabled?: boolean;
+  readOnly?: boolean;
+  maxTags?: number;
+  allowDuplicates?: boolean;
+  editable?: boolean;
+  delimiter?: string;
+  addOnPaste?: boolean;
+  addOnTab?: boolean;
+  onValidate?: (value: string) => boolean;
+}
+/**
+ * ArrayTags component - A simple array field for strings/numbers using TagsInput
+ *
+ * This component provides a tag-based interface for managing simple arrays
+ * of primitive values (strings or numbers), unlike other array fields that
+ * handle complex object arrays.
+ *
+ * Features:
+ * - Inline tag editing
+ * - Keyboard navigation
+ * - Paste support with delimiter parsing
+ * - Validation support
+ * - Max tags limit
+ * - Duplicate prevention
+ *
+ * Example usage:
+ * ```tsx
+ * const schema = {
+ *   type: 'object',
+ *   properties: {
+ *     tags: {
+ *       type: 'array',
+ *       title: 'Tags',
+ *       'x-decorator': 'FormItem',
+ *       'x-component': 'ArrayTags',
+ *       'x-component-props': {
+ *         placeholder: 'Add tags...',
+ *         maxTags: 10,
+ *       },
+ *     },
+ *   },
+ * };
+ * ```
+ */
+declare const ArrayTags: React.MemoExoticComponent<_formily_react0.ReactFC<ArrayTagsProps>>;
+//#endregion
+export { ArrayTags, ArrayTagsProps };

package/dist/components/array-tags/ArrayTags.d.ts

@@ -0,0 +1,57 @@
+import * as _formily_react0 from "@formily/react";
+import React from "react";
+
+//#region src/components/array-tags/ArrayTags.d.ts
+interface ArrayTagsProps {
+  value?: Array<string | number>;
+  onChange?: (value: Array<string | number>) => void;
+  placeholder?: string;
+  emptyText?: string;
+  className?: string;
+  disabled?: boolean;
+  readOnly?: boolean;
+  maxTags?: number;
+  allowDuplicates?: boolean;
+  editable?: boolean;
+  delimiter?: string;
+  addOnPaste?: boolean;
+  addOnTab?: boolean;
+  onValidate?: (value: string) => boolean;
+}
+/**
+ * ArrayTags component - A simple array field for strings/numbers using TagsInput
+ *
+ * This component provides a tag-based interface for managing simple arrays
+ * of primitive values (strings or numbers), unlike other array fields that
+ * handle complex object arrays.
+ *
+ * Features:
+ * - Inline tag editing
+ * - Keyboard navigation
+ * - Paste support with delimiter parsing
+ * - Validation support
+ * - Max tags limit
+ * - Duplicate prevention
+ *
+ * Example usage:
+ * ```tsx
+ * const schema = {
+ *   type: 'object',
+ *   properties: {
+ *     tags: {
+ *       type: 'array',
+ *       title: 'Tags',
+ *       'x-decorator': 'FormItem',
+ *       'x-component': 'ArrayTags',
+ *       'x-component-props': {
+ *         placeholder: 'Add tags...',
+ *         maxTags: 10,
+ *       },
+ *     },
+ *   },
+ * };
+ * ```
+ */
+declare const ArrayTags: React.MemoExoticComponent<_formily_react0.ReactFC<ArrayTagsProps>>;
+//#endregion
+export { ArrayTags, ArrayTagsProps };

package/dist/components/array-tags/ArrayTags.js

@@ -0,0 +1,71 @@
+import { observer, useField } from "@formily/react";
+import React from "react";
+import { TagsInput } from "@pixpilot/shadcn-ui";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/array-tags/ArrayTags.tsx
+/**
+* ArrayTags component - A simple array field for strings/numbers using TagsInput
+*
+* This component provides a tag-based interface for managing simple arrays
+* of primitive values (strings or numbers), unlike other array fields that
+* handle complex object arrays.
+*
+* Features:
+* - Inline tag editing
+* - Keyboard navigation
+* - Paste support with delimiter parsing
+* - Validation support
+* - Max tags limit
+* - Duplicate prevention
+*
+* Example usage:
+* ```tsx
+* const schema = {
+*   type: 'object',
+*   properties: {
+*     tags: {
+*       type: 'array',
+*       title: 'Tags',
+*       'x-decorator': 'FormItem',
+*       'x-component': 'ArrayTags',
+*       'x-component-props': {
+*         placeholder: 'Add tags...',
+*         maxTags: 10,
+*       },
+*     },
+*   },
+* };
+* ```
+*/
+const ArrayTags = observer((props) => {
+	const field = useField();
+	const { placeholder = "Add items...", emptyText = "No options found.", className, disabled, readOnly, maxTags, allowDuplicates = false, editable = false, delimiter = ",", addOnPaste = true, addOnTab = true, onValidate, value, onChange } = props;
+	const effectiveValue = value ?? field.value ?? [];
+	const effectiveDisabled = disabled ?? field.disabled ?? false;
+	const effectiveReadOnly = readOnly ?? field.readOnly ?? false;
+	return /* @__PURE__ */ jsx(TagsInput, {
+		value: effectiveValue,
+		onChange: React.useCallback((newValue) => {
+			if (onChange) onChange(newValue);
+			else field.setValue(newValue);
+		}, [field, onChange]),
+		placeholder,
+		emptyText,
+		className,
+		disabled: effectiveDisabled,
+		readOnly: effectiveReadOnly,
+		maxTags,
+		allowDuplicates,
+		editable,
+		delimiter,
+		addOnPaste,
+		addOnTab,
+		onValidate,
+		freeSolo: true
+	});
+});
+ArrayTags.displayName = "ArrayTags";
+
+//#endregion
+export { ArrayTags };

package/dist/components/array-tags/index.cjs

@@ -0,0 +1 @@
+const require_ArrayTags = require('./ArrayTags.cjs');

package/dist/components/array-tags/index.d.cts

@@ -0,0 +1 @@
+import { ArrayTags, ArrayTagsProps } from "./ArrayTags.cjs";

package/dist/components/array-tags/index.d.ts

@@ -0,0 +1 @@
+import { ArrayTags, ArrayTagsProps } from "./ArrayTags.js";

package/dist/components/array-tags/index.js

@@ -0,0 +1 @@
+import { ArrayTags } from "./ArrayTags.js";

package/dist/components/form-item/ConnectedFormItem.d.cts

@@ -1,13 +1,13 @@
 import { FormItemProps } from "./form-item-types.cjs";
-import * as react1623 from "react";
+import * as react1656 from "react";
 
 //#region src/components/form-item/ConnectedFormItem.d.ts
 /**
  * FormItem component connected to Formily field state.
  * Automatically maps field validation state to component props.
  */
-declare const FormItem: react1623.ForwardRefExoticComponent<Omit<Partial<FormItemProps & {
-  children?: react1623.ReactNode | undefined;
-}>, "ref"> & react1623.RefAttributes<unknown>>;
+declare const FormItem: react1656.ForwardRefExoticComponent<Omit<Partial<FormItemProps & {
+  children?: react1656.ReactNode | undefined;
+}>, "ref"> & react1656.RefAttributes<unknown>>;
 //#endregion
 export { FormItem };

package/dist/components/form-item/ConnectedFormItem.d.ts

@@ -1,13 +1,13 @@
 import { FormItemProps } from "./form-item-types.js";
-import * as react1623 from "react";
+import * as react1656 from "react";
 
 //#region src/components/form-item/ConnectedFormItem.d.ts
 /**
  * FormItem component connected to Formily field state.
  * Automatically maps field validation state to component props.
  */
-declare const FormItem: react1623.ForwardRefExoticComponent<Omit<Partial<FormItemProps & {
-  children?: react1623.ReactNode | undefined;
-}>, "ref"> & react1623.RefAttributes<unknown>>;
+declare const FormItem: react1656.ForwardRefExoticComponent<Omit<Partial<FormItemProps & {
+  children?: react1656.ReactNode | undefined;
+}>, "ref"> & react1656.RefAttributes<unknown>>;
 //#endregion
 export { FormItem };

package/dist/components/schema-field/schema-field-basics.cjs

@@ -8,6 +8,8 @@ const require_ArrayDialog = require('../array-dialog/ArrayDialog.cjs');
 require('../array-dialog/index.cjs');
 const require_ArrayPopover = require('../array-popover/ArrayPopover.cjs');
 require('../array-popover/index.cjs');
+const require_ArrayTags = require('../array-tags/ArrayTags.cjs');
+require('../array-tags/index.cjs');
 const require_Checkbox = require('../Checkbox.cjs');
 const require_Column = require('../Column.cjs');
 const require_DatePicker = require('../DatePicker.cjs');
@@ -51,6 +53,10 @@ const basicComponentRegistry = {
 		component: require_ArrayPopover.ArrayPopover,
 		decorator: "FormItem"
 	},
+	ArrayTags: {
+		component: require_ArrayTags.ArrayTags,
+		decorator: "FormItem"
+	},
 	Checkbox: {
 		component: require_Checkbox.Checkbox,
 		decorator: "FormItem"