@pixpilot/shadcn-ui 0.47.0 → 0.48.0

package/dist/dialog/Dialog.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime9 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 import * as React$1 from "react";
 import * as _radix_ui_react_dialog0 from "@radix-ui/react-dialog";
 
@@ -9,14 +9,14 @@ declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<_radix_ui_re
 declare function DialogHeader({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 declare function DialogBody({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 declare function DialogFooter({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 //#endregion
 export { DialogBody, DialogContent, DialogFooter, DialogHeader };

package/dist/dialog/Dialog.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime9 from "react/jsx-runtime";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
 import * as _radix_ui_react_dialog0 from "@radix-ui/react-dialog";
 
 //#region src/dialog/Dialog.d.ts
@@ -9,14 +9,14 @@ declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<_radix_ui_re
 declare function DialogHeader({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
 declare function DialogBody({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
 declare function DialogFooter({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime9.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
 //#endregion
 export { DialogBody, DialogContent, DialogFooter, DialogHeader };

package/dist/file-upload/FileUpload.d.cts

@@ -1,7 +1,7 @@
 import { FileUploadProps } from "./types/index.cjs";
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
 
 //#region src/file-upload/FileUpload.d.ts
-declare function FileUpload(props: FileUploadProps): react_jsx_runtime8.JSX.Element;
+declare function FileUpload(props: FileUploadProps): react_jsx_runtime7.JSX.Element;
 //#endregion
 export { FileUpload };

package/dist/file-upload/FileUpload.d.ts

@@ -1,7 +1,7 @@
 import { FileUploadProps } from "./types/index.js";
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 
 //#region src/file-upload/FileUpload.d.ts
-declare function FileUpload(props: FileUploadProps): react_jsx_runtime8.JSX.Element;
+declare function FileUpload(props: FileUploadProps): react_jsx_runtime18.JSX.Element;
 //#endregion
 export { FileUpload };

package/dist/file-upload-inline/FileUploadInline.d.cts

@@ -1,10 +1,10 @@
 import { FileUploadInlineProps } from "./types.cjs";
-import * as react_jsx_runtime12 from "react/jsx-runtime";
+import * as react_jsx_runtime11 from "react/jsx-runtime";
 
 //#region src/file-upload-inline/FileUploadInline.d.ts
 /**
  * FileUploadInline - An inline file upload component using FileUpload primitives
  */
-declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime12.JSX.Element;
+declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime11.JSX.Element;
 //#endregion
 export { FileUploadInline };

package/dist/file-upload-inline/FileUploadInline.d.ts

@@ -1,10 +1,10 @@
 import { FileUploadInlineProps } from "./types.js";
-import * as react_jsx_runtime12 from "react/jsx-runtime";
+import * as react_jsx_runtime10 from "react/jsx-runtime";
 
 //#region src/file-upload-inline/FileUploadInline.d.ts
 /**
  * FileUploadInline - An inline file upload component using FileUpload primitives
  */
-declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime12.JSX.Element;
+declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime10.JSX.Element;
 //#endregion
 export { FileUploadInline };

package/dist/index.cjs

@@ -58,7 +58,9 @@ const require_TabsContext = require('./tabs/TabsContext.cjs');
 const require_TabsList = require('./tabs/TabsList.cjs');
 const require_TabsTrigger = require('./tabs/TabsTrigger.cjs');
 require('./tabs/index.cjs');
-const require_TagsInput = require('./TagsInput.cjs');
+const require_TagsInputInline = require('./tags-input/TagsInputInline.cjs');
+const require_TagsInput = require('./tags-input/TagsInput.cjs');
+require('./tags-input/index.cjs');
 const require_ThemeProvider = require('./theme-provider/ThemeProvider.cjs');
 require('./theme-provider/index.cjs');
 const require_ThemeModeDropdown = require('./theme-toggle/ThemeModeDropdown.cjs');
@@ -131,6 +133,7 @@ exports.TabsContext = require_TabsContext.TabsContext;
 exports.TabsList = require_TabsList.TabsList;
 exports.TabsTrigger = require_TabsTrigger.TabsTrigger;
 exports.TagsInput = require_TagsInput.TagsInput;
+exports.TagsInputInline = require_TagsInputInline.TagsInputInline;
 exports.ThemeModeDropdown = require_ThemeModeDropdown.ThemeModeDropdown;
 exports.ThemeModeSwitchInside = require_ThemeModeSwitchInside.ThemeModeSwitchInside;
 exports.ThemeModeSwitchOutside = require_ThemeModeSwitchOutside.ThemeModeSwitchOutside;

package/dist/index.d.cts

@@ -62,7 +62,9 @@ import { TabsContext, TabsContextValue, useTabsContext } from "./tabs/TabsContex
 import { TabsList, TabsListProps } from "./tabs/TabsList.cjs";
 import { TabsTrigger, TabsTriggerProps } from "./tabs/TabsTrigger.cjs";
 import "./tabs/index.cjs";
-import { TagsInput, TagsInputProps } from "./TagsInput.cjs";
+import { TagsInput, TagsInputProps } from "./tags-input/TagsInput.cjs";
+import { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps } from "./tags-input/TagsInputInline.cjs";
+import "./tags-input/index.cjs";
 import { ThemeProvider, ThemeProviderProps } from "./theme-provider/ThemeProvider.cjs";
 import { useTheme } from "./theme-provider/index.cjs";
 import { ThemeModeDropdown, ThemeModeDropdownProps } from "./theme-toggle/ThemeModeDropdown.cjs";
@@ -76,4 +78,4 @@ import "./toast/index.cjs";
 import { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue } from "./ToggleGroup.cjs";
 import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.cjs";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.d.ts

@@ -64,7 +64,9 @@ import { TabsContext, TabsContextValue, useTabsContext } from "./tabs/TabsContex
 import { TabsList, TabsListProps } from "./tabs/TabsList.js";
 import { TabsTrigger, TabsTriggerProps } from "./tabs/TabsTrigger.js";
 import "./tabs/index.js";
-import { TagsInput, TagsInputProps } from "./TagsInput.js";
+import { TagsInput, TagsInputProps } from "./tags-input/TagsInput.js";
+import { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps } from "./tags-input/TagsInputInline.js";
+import "./tags-input/index.js";
 import { ThemeProvider, ThemeProviderProps } from "./theme-provider/ThemeProvider.js";
 import { useTheme } from "./theme-provider/index.js";
 import { ThemeModeDropdown, ThemeModeDropdownProps } from "./theme-toggle/ThemeModeDropdown.js";
@@ -78,4 +80,4 @@ import "./toast/index.js";
 import { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue } from "./ToggleGroup.js";
 import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.js";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.js

@@ -59,7 +59,9 @@ import { TabsContext, useTabsContext } from "./tabs/TabsContext.js";
 import { TabsList } from "./tabs/TabsList.js";
 import { TabsTrigger } from "./tabs/TabsTrigger.js";
 import "./tabs/index.js";
-import { TagsInput } from "./TagsInput.js";
+import { TagsInputInline } from "./tags-input/TagsInputInline.js";
+import { TagsInput } from "./tags-input/TagsInput.js";
+import "./tags-input/index.js";
 import { ThemeProvider } from "./theme-provider/ThemeProvider.js";
 import { useTheme } from "./theme-provider/index.js";
 import { ThemeModeDropdown } from "./theme-toggle/ThemeModeDropdown.js";
@@ -73,4 +75,4 @@ import "./toast/index.js";
 import { ToggleGroup, ToggleGroupItem } from "./ToggleGroup.js";
 import { cn } from "@pixpilot/shadcn";
 
-export { AbsoluteFill, Alert, AvatarUpload, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogTitle, DialogTrigger, FileUpload, FileUploadInline, IconPicker, IconToggle, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Rating, RatingButton, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, ToggleGroup, ToggleGroupItem, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AvatarUpload, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogTitle, DialogTrigger, FileUpload, FileUploadInline, IconPicker, IconToggle, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Rating, RatingButton, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, TagsInputInline, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, ToggleGroup, ToggleGroupItem, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/input/Input.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime13 from "react/jsx-runtime";
+import * as react_jsx_runtime12 from "react/jsx-runtime";
 import { InputProps } from "@pixpilot/shadcn";
 import * as React$1 from "react";
 
@@ -10,6 +10,6 @@ type InputProps$1 = InputProps & {
   prefixClassName?: string;
   suffixClassName?: string;
 };
-declare function Input(props: InputProps$1): react_jsx_runtime13.JSX.Element;
+declare function Input(props: InputProps$1): react_jsx_runtime12.JSX.Element;
 //#endregion
 export { Input, InputProps$1 as InputProps };

package/dist/input/Input.d.ts

@@ -1,6 +1,6 @@
 import { InputProps } from "@pixpilot/shadcn";
 import * as React$1 from "react";
-import * as react_jsx_runtime13 from "react/jsx-runtime";
+import * as react_jsx_runtime11 from "react/jsx-runtime";
 
 //#region src/input/Input.d.ts
 type InputProps$1 = InputProps & {
@@ -10,6 +10,6 @@ type InputProps$1 = InputProps & {
   prefixClassName?: string;
   suffixClassName?: string;
 };
-declare function Input$1(props: InputProps$1): react_jsx_runtime13.JSX.Element;
+declare function Input$1(props: InputProps$1): react_jsx_runtime11.JSX.Element;
 //#endregion
 export { Input$1 as Input, InputProps$1 as InputProps };

package/dist/{TagsInput.cjs → tags-input/TagsInput.cjs}

@@ -1,8 +1,9 @@
 'use client';
 
 
-const require_rolldown_runtime = require('./_virtual/rolldown_runtime.cjs');
-const require_CommandOptionList = require('./CommandOptionList.cjs');
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_CommandOptionList = require('../CommandOptionList.cjs');
+const require_TagsInputInline = require('./TagsInputInline.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");
 __pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
 let react = require("react");
@@ -10,7 +11,7 @@ react = require_rolldown_runtime.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
 react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
-//#region src/TagsInput.tsx
+//#region src/tags-input/TagsInput.tsx
 const EMPTY_ARRAY = [];
 const EMPTY_OPTIONS = [];
 /**
@@ -29,9 +30,10 @@ const EMPTY_OPTIONS = [];
 * - Options support with dropdown (like Select)
 * - freeSolo mode for custom tags (like MUI Autocomplete)
 */
-function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, freeSolo = true, placeholder = "Add tags...", emptyText = "No options found.", className, disabled = false, readOnly = false, maxTags, allowDuplicates = false, editable = false, label, delimiter = ",", addOnPaste = true, addOnTab = true, onValidate }) {
+function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, freeSolo = true, placeholder = "Add tags...", emptyText = "No options found.", className, disabled = false, readOnly = false, maxTags, allowDuplicates = false, editable = false, label, delimiter = ",", addOnPaste = true, addOnTab = true, onValidate, addButtonVisibility = "touch" }) {
 	const [open, setOpen] = (0, react.useState)(false);
 	const [searchValue, setSearchValue] = (0, react.useState)("");
+	const [freeInputValue, setFreeInputValue] = (0, react.useState)("");
 	const inputRef = (0, react.useRef)(null);
 	const hasOptions = options.length > 0;
 	(0, react.useEffect)(() => {
@@ -64,6 +66,7 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 	]);
 	const handleValueChange = (0, react.useCallback)((newTags) => {
 		setSearchValue("");
+		setFreeInputValue("");
 		if (hasOptions) {
 			const convertedValues = newTags.map((tag) => {
 				return options.find((opt) => String(opt.value) === tag)?.value ?? tag;
@@ -93,6 +96,25 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 		freeSolo,
 		options
 	]);
+	const handleAddCurrentInput = (0, react.useCallback)(() => {
+		if (disabled || readOnly) return;
+		const nextValue = (hasOptions ? searchValue : freeInputValue).trim();
+		if (!nextValue) return;
+		if (!handleValidate(nextValue)) return;
+		handleValueChange([...stringValues, nextValue]);
+		inputRef.current?.focus();
+	}, [
+		disabled,
+		readOnly,
+		hasOptions,
+		searchValue,
+		freeInputValue,
+		handleValidate,
+		handleValueChange,
+		stringValues
+	]);
+	const currentInputValue = hasOptions ? searchValue : freeInputValue;
+	const canAddCurrentValue = Boolean(currentInputValue.trim()) && handleValidate(currentInputValue.trim());
 	const handleSelectOption = (0, react.useCallback)((optionValue) => {
 		const isSelected = value.some((v) => String(v) === String(optionValue));
 		let newValues;
@@ -101,7 +123,18 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 		onChange?.(newValues);
 		setSearchValue("");
 	}, [value, onChange]);
-	if (!hasOptions) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.TagsInputInLineRoot, {
+	const inlineItems = (0, react.useMemo)(() => (hasOptions ? value : stringValues).map((tag) => ({
+		key: String(tag),
+		value: String(tag),
+		label: hasOptions ? getLabel(tag) : String(tag)
+	})), [
+		getLabel,
+		hasOptions,
+		stringValues,
+		value
+	]);
+	if (!hasOptions) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_TagsInputInline.TagsInputInline, {
+		label,
 		className,
 		disabled,
 		editable,
@@ -113,14 +146,17 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 		delimiter,
 		addOnPaste,
 		addOnTab,
-		children: [
-			label !== void 0 && label !== "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineLabel, { children: label }) : null,
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.TagsInputInLineList, { children: [stringValues.map((tag) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineItem, {
-				value: tag,
-				children: tag
-			}, tag)), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineInput, { placeholder })] }),
-			value.length > 0 && !disabled && !readOnly && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineClear, {})
-		]
+		items: inlineItems,
+		inputRef,
+		inputPlaceholder: placeholder,
+		inputValue: freeInputValue,
+		onInputChange: (e) => {
+			setFreeInputValue(e.target.value);
+		},
+		addButtonVisibility,
+		canAddCurrentValue,
+		onAddCurrentInput: handleAddCurrentInput,
+		showClear: value.length > 0 && !disabled && !readOnly
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: (0, __pixpilot_shadcn.cn)("relative", className),
@@ -131,7 +167,9 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 				asChild: true,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: "w-full",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.TagsInputInLineRoot, {
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_TagsInputInline.TagsInputInline, {
+						label,
+						showLabel: false,
 						disabled,
 						editable,
 						max: maxTags,
@@ -142,61 +180,57 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 						delimiter: freeSolo ? delimiter : void 0,
 						addOnPaste: freeSolo ? addOnPaste : false,
 						addOnTab: freeSolo ? addOnTab : false,
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.TagsInputInLineList, {
-							onClick: (e) => {
-								if (!disabled && !readOnly) {
-									e.stopPropagation();
-									setOpen(true);
+						items: inlineItems,
+						onListClick: (e) => {
+							if (!disabled && !readOnly) {
+								e.stopPropagation();
+								setOpen(true);
+							}
+						},
+						inputRef,
+						inputPlaceholder: placeholder,
+						inputValue: searchValue,
+						onInputFocus: (e) => {
+							e.stopPropagation();
+							setOpen(true);
+						},
+						onInputChange: (e) => {
+							e.stopPropagation();
+							setSearchValue(e.target.value);
+						},
+						onInputKeyDown: (e) => {
+							if (open && (e.key === "ArrowDown" || e.key === "ArrowUp")) {
+								e.preventDefault();
+								e.stopPropagation();
+								const command = document.querySelector("[cmdk-root]");
+								if (command) {
+									const event = new KeyboardEvent("keydown", {
+										key: e.key,
+										bubbles: true,
+										cancelable: true
+									});
+									command.dispatchEvent(event);
 								}
-							},
-							children: [value.map((val) => {
-								const displayLabel = getLabel(val);
-								return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineItem, {
-									value: String(val),
-									children: displayLabel
-								}, String(val));
-							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineInput, {
-								ref: inputRef,
-								placeholder,
-								onFocus: (e) => {
-									e.stopPropagation();
-									setOpen(true);
-								},
-								onChange: (e) => {
-									e.stopPropagation();
-									setSearchValue(e.target.value);
-								},
-								onKeyDown: (e) => {
-									if (open && (e.key === "ArrowDown" || e.key === "ArrowUp")) {
-										e.preventDefault();
-										e.stopPropagation();
-										const command = document.querySelector("[cmdk-root]");
-										if (command) {
-											const event = new KeyboardEvent("keydown", {
-												key: e.key,
-												bubbles: true,
-												cancelable: true
-											});
-											command.dispatchEvent(event);
-										}
-										return;
-									}
-									if (open && e.key === "Enter") {
-										const selectedItem = document.querySelector("[cmdk-item][data-selected=\"true\"]");
-										if (selectedItem) {
-											e.preventDefault();
-											e.stopPropagation();
-											selectedItem.click();
-											return;
-										}
-									}
-									e.stopPropagation();
-								},
-								onMouseDown: (e) => {
+								return;
+							}
+							if (open && e.key === "Enter") {
+								const selectedItem = document.querySelector("[cmdk-item][data-selected=\"true\"]");
+								if (selectedItem) {
+									e.preventDefault();
 									e.stopPropagation();
+									selectedItem.click();
+									return;
 								}
-							})]
-						}), value.length > 0 && !disabled && !readOnly && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineClear, {})]
+							}
+							e.stopPropagation();
+						},
+						onInputMouseDown: (e) => {
+							e.stopPropagation();
+						},
+						addButtonVisibility,
+						canAddCurrentValue,
+						onAddCurrentInput: handleAddCurrentInput,
+						showClear: value.length > 0 && !disabled && !readOnly
 					})
 				})
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PopoverContent, {

package/dist/{TagsInput.d.ts → tags-input/TagsInput.d.cts}

@@ -1,7 +1,7 @@
-import { CommandOptionListItem } from "./CommandOptionList.js";
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import { CommandOptionListItem } from "../CommandOptionList.cjs";
+import * as react_jsx_runtime14 from "react/jsx-runtime";
 
-//#region src/TagsInput.d.ts
+//#region src/tags-input/TagsInput.d.ts
 interface TagsInputProps {
   value?: Array<string | number>;
   onChange?: (value: Array<string | number>) => void;
@@ -20,6 +20,7 @@ interface TagsInputProps {
   addOnPaste?: boolean;
   addOnTab?: boolean;
   onValidate?: (value: string) => boolean;
+  addButtonVisibility?: 'always' | 'touch' | 'never';
 }
 /**
  * TagsInput component - Inline tags input based on DiceUI
@@ -54,7 +55,8 @@ declare function TagsInput({
   delimiter,
   addOnPaste,
   addOnTab,
-  onValidate
-}: TagsInputProps): react_jsx_runtime7.JSX.Element;
+  onValidate,
+  addButtonVisibility
+}: TagsInputProps): react_jsx_runtime14.JSX.Element;
 //#endregion
 export { TagsInput, TagsInputProps };

package/dist/{TagsInput.d.cts → tags-input/TagsInput.d.ts}

@@ -1,7 +1,7 @@
-import { CommandOptionListItem } from "./CommandOptionList.cjs";
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import { CommandOptionListItem } from "../CommandOptionList.js";
+import * as react_jsx_runtime12 from "react/jsx-runtime";
 
-//#region src/TagsInput.d.ts
+//#region src/tags-input/TagsInput.d.ts
 interface TagsInputProps {
   value?: Array<string | number>;
   onChange?: (value: Array<string | number>) => void;
@@ -20,6 +20,7 @@ interface TagsInputProps {
   addOnPaste?: boolean;
   addOnTab?: boolean;
   onValidate?: (value: string) => boolean;
+  addButtonVisibility?: 'always' | 'touch' | 'never';
 }
 /**
  * TagsInput component - Inline tags input based on DiceUI
@@ -54,7 +55,8 @@ declare function TagsInput({
   delimiter,
   addOnPaste,
   addOnTab,
-  onValidate
-}: TagsInputProps): react_jsx_runtime7.JSX.Element;
+  onValidate,
+  addButtonVisibility
+}: TagsInputProps): react_jsx_runtime12.JSX.Element;
 //#endregion
 export { TagsInput, TagsInputProps };

package/dist/{TagsInput.js → tags-input/TagsInput.js}

@@ -1,12 +1,13 @@
 'use client';
 
 
-import { CommandOptionList } from "./CommandOptionList.js";
-import { Command, Popover, PopoverContent, PopoverTrigger, TagsInputInLineClear, TagsInputInLineInput, TagsInputInLineItem, TagsInputInLineLabel, TagsInputInLineList, TagsInputInLineRoot, cn } from "@pixpilot/shadcn";
+import { CommandOptionList } from "../CommandOptionList.js";
+import { TagsInputInline } from "./TagsInputInline.js";
+import { Command, Popover, PopoverContent, PopoverTrigger, TagsInputInLineLabel, cn } from "@pixpilot/shadcn";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
-//#region src/TagsInput.tsx
+//#region src/tags-input/TagsInput.tsx
 const EMPTY_ARRAY = [];
 const EMPTY_OPTIONS = [];
 /**
@@ -25,9 +26,10 @@ const EMPTY_OPTIONS = [];
 * - Options support with dropdown (like Select)
 * - freeSolo mode for custom tags (like MUI Autocomplete)
 */
-function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, freeSolo = true, placeholder = "Add tags...", emptyText = "No options found.", className, disabled = false, readOnly = false, maxTags, allowDuplicates = false, editable = false, label, delimiter = ",", addOnPaste = true, addOnTab = true, onValidate }) {
+function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, freeSolo = true, placeholder = "Add tags...", emptyText = "No options found.", className, disabled = false, readOnly = false, maxTags, allowDuplicates = false, editable = false, label, delimiter = ",", addOnPaste = true, addOnTab = true, onValidate, addButtonVisibility = "touch" }) {
 	const [open, setOpen] = useState(false);
 	const [searchValue, setSearchValue] = useState("");
+	const [freeInputValue, setFreeInputValue] = useState("");
 	const inputRef = useRef(null);
 	const hasOptions = options.length > 0;
 	useEffect(() => {
@@ -60,6 +62,7 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 	]);
 	const handleValueChange = useCallback((newTags) => {
 		setSearchValue("");
+		setFreeInputValue("");
 		if (hasOptions) {
 			const convertedValues = newTags.map((tag) => {
 				return options.find((opt) => String(opt.value) === tag)?.value ?? tag;
@@ -89,6 +92,25 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 		freeSolo,
 		options
 	]);
+	const handleAddCurrentInput = useCallback(() => {
+		if (disabled || readOnly) return;
+		const nextValue = (hasOptions ? searchValue : freeInputValue).trim();
+		if (!nextValue) return;
+		if (!handleValidate(nextValue)) return;
+		handleValueChange([...stringValues, nextValue]);
+		inputRef.current?.focus();
+	}, [
+		disabled,
+		readOnly,
+		hasOptions,
+		searchValue,
+		freeInputValue,
+		handleValidate,
+		handleValueChange,
+		stringValues
+	]);
+	const currentInputValue = hasOptions ? searchValue : freeInputValue;
+	const canAddCurrentValue = Boolean(currentInputValue.trim()) && handleValidate(currentInputValue.trim());
 	const handleSelectOption = useCallback((optionValue) => {
 		const isSelected = value.some((v) => String(v) === String(optionValue));
 		let newValues;
@@ -97,7 +119,18 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 		onChange?.(newValues);
 		setSearchValue("");
 	}, [value, onChange]);
-	if (!hasOptions) return /* @__PURE__ */ jsxs(TagsInputInLineRoot, {
+	const inlineItems = useMemo(() => (hasOptions ? value : stringValues).map((tag) => ({
+		key: String(tag),
+		value: String(tag),
+		label: hasOptions ? getLabel(tag) : String(tag)
+	})), [
+		getLabel,
+		hasOptions,
+		stringValues,
+		value
+	]);
+	if (!hasOptions) return /* @__PURE__ */ jsx(TagsInputInline, {
+		label,
 		className,
 		disabled,
 		editable,
@@ -109,14 +142,17 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 		delimiter,
 		addOnPaste,
 		addOnTab,
-		children: [
-			label !== void 0 && label !== "" ? /* @__PURE__ */ jsx(TagsInputInLineLabel, { children: label }) : null,
-			/* @__PURE__ */ jsxs(TagsInputInLineList, { children: [stringValues.map((tag) => /* @__PURE__ */ jsx(TagsInputInLineItem, {
-				value: tag,
-				children: tag
-			}, tag)), /* @__PURE__ */ jsx(TagsInputInLineInput, { placeholder })] }),
-			value.length > 0 && !disabled && !readOnly && /* @__PURE__ */ jsx(TagsInputInLineClear, {})
-		]
+		items: inlineItems,
+		inputRef,
+		inputPlaceholder: placeholder,
+		inputValue: freeInputValue,
+		onInputChange: (e) => {
+			setFreeInputValue(e.target.value);
+		},
+		addButtonVisibility,
+		canAddCurrentValue,
+		onAddCurrentInput: handleAddCurrentInput,
+		showClear: value.length > 0 && !disabled && !readOnly
 	});
 	return /* @__PURE__ */ jsxs("div", {
 		className: cn("relative", className),
@@ -127,7 +163,9 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 				asChild: true,
 				children: /* @__PURE__ */ jsx("div", {
 					className: "w-full",
-					children: /* @__PURE__ */ jsxs(TagsInputInLineRoot, {
+					children: /* @__PURE__ */ jsx(TagsInputInline, {
+						label,
+						showLabel: false,
 						disabled,
 						editable,
 						max: maxTags,
@@ -138,61 +176,57 @@ function TagsInput({ value = EMPTY_ARRAY, onChange, options = EMPTY_OPTIONS, fre
 						delimiter: freeSolo ? delimiter : void 0,
 						addOnPaste: freeSolo ? addOnPaste : false,
 						addOnTab: freeSolo ? addOnTab : false,
-						children: [/* @__PURE__ */ jsxs(TagsInputInLineList, {
-							onClick: (e) => {
-								if (!disabled && !readOnly) {
-									e.stopPropagation();
-									setOpen(true);
+						items: inlineItems,
+						onListClick: (e) => {
+							if (!disabled && !readOnly) {
+								e.stopPropagation();
+								setOpen(true);
+							}
+						},
+						inputRef,
+						inputPlaceholder: placeholder,
+						inputValue: searchValue,
+						onInputFocus: (e) => {
+							e.stopPropagation();
+							setOpen(true);
+						},
+						onInputChange: (e) => {
+							e.stopPropagation();
+							setSearchValue(e.target.value);
+						},
+						onInputKeyDown: (e) => {
+							if (open && (e.key === "ArrowDown" || e.key === "ArrowUp")) {
+								e.preventDefault();
+								e.stopPropagation();
+								const command = document.querySelector("[cmdk-root]");
+								if (command) {
+									const event = new KeyboardEvent("keydown", {
+										key: e.key,
+										bubbles: true,
+										cancelable: true
+									});
+									command.dispatchEvent(event);
 								}
-							},
-							children: [value.map((val) => {
-								const displayLabel = getLabel(val);
-								return /* @__PURE__ */ jsx(TagsInputInLineItem, {
-									value: String(val),
-									children: displayLabel
-								}, String(val));
-							}), /* @__PURE__ */ jsx(TagsInputInLineInput, {
-								ref: inputRef,
-								placeholder,
-								onFocus: (e) => {
-									e.stopPropagation();
-									setOpen(true);
-								},
-								onChange: (e) => {
-									e.stopPropagation();
-									setSearchValue(e.target.value);
-								},
-								onKeyDown: (e) => {
-									if (open && (e.key === "ArrowDown" || e.key === "ArrowUp")) {
-										e.preventDefault();
-										e.stopPropagation();
-										const command = document.querySelector("[cmdk-root]");
-										if (command) {
-											const event = new KeyboardEvent("keydown", {
-												key: e.key,
-												bubbles: true,
-												cancelable: true
-											});
-											command.dispatchEvent(event);
-										}
-										return;
-									}
-									if (open && e.key === "Enter") {
-										const selectedItem = document.querySelector("[cmdk-item][data-selected=\"true\"]");
-										if (selectedItem) {
-											e.preventDefault();
-											e.stopPropagation();
-											selectedItem.click();
-											return;
-										}
-									}
-									e.stopPropagation();
-								},
-								onMouseDown: (e) => {
+								return;
+							}
+							if (open && e.key === "Enter") {
+								const selectedItem = document.querySelector("[cmdk-item][data-selected=\"true\"]");
+								if (selectedItem) {
+									e.preventDefault();
 									e.stopPropagation();
+									selectedItem.click();
+									return;
 								}
-							})]
-						}), value.length > 0 && !disabled && !readOnly && /* @__PURE__ */ jsx(TagsInputInLineClear, {})]
+							}
+							e.stopPropagation();
+						},
+						onInputMouseDown: (e) => {
+							e.stopPropagation();
+						},
+						addButtonVisibility,
+						canAddCurrentValue,
+						onAddCurrentInput: handleAddCurrentInput,
+						showClear: value.length > 0 && !disabled && !readOnly
 					})
 				})
 			}), /* @__PURE__ */ jsx(PopoverContent, {

package/dist/tags-input/TagsInputInline.cjs

@@ -0,0 +1,81 @@
+'use client';
+
+
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+let __pixpilot_shadcn = require("@pixpilot/shadcn");
+__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+let lucide_react = require("lucide-react");
+lucide_react = require_rolldown_runtime.__toESM(lucide_react);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/tags-input/TagsInputInline.tsx
+function TagsInputInline({ label, showLabel = true, className, disabled = false, editable, max, onValueChange, onValidate, readOnly = false, value, delimiter, addOnPaste, addOnTab, items, onListClick, inputRef, inputPlaceholder, inputValue, onInputFocus, onInputChange, onInputKeyDown, onInputMouseDown, addButtonVisibility = "touch", slots, canAddCurrentValue = false, onAddCurrentInput, showClear = false }) {
+	const addButtonVisibilityClassName = (0, react.useMemo)(() => {
+		if (addButtonVisibility === "always") return "inline-flex";
+		if (addButtonVisibility === "touch") return "hidden pointer-coarse:inline-flex";
+		return "hidden";
+	}, [addButtonVisibility]);
+	const isAddDisabled = disabled || readOnly || !canAddCurrentValue;
+	const { className: listClassName,...listRest } = slots?.list || {};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.TagsInputInLineRoot, {
+		className,
+		disabled,
+		editable,
+		max,
+		onValueChange,
+		onValidate,
+		readOnly,
+		value,
+		delimiter,
+		addOnPaste,
+		addOnTab,
+		children: [
+			showLabel && label !== void 0 && label !== "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineLabel, {
+				...slots?.label || {},
+				children: label
+			}) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.TagsInputInLineList, {
+				...listRest,
+				className: (0, __pixpilot_shadcn.cn)("relative pr-10", listClassName),
+				onClick: onListClick,
+				children: [
+					items.map((item) => /* @__PURE__ */ (0, react.createElement)(__pixpilot_shadcn.TagsInputInLineItem, {
+						...slots?.item || {},
+						key: item.key,
+						value: item.value
+					}, item.label)),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineInput, {
+						...slots?.input || {},
+						ref: inputRef,
+						placeholder: inputPlaceholder,
+						value: inputValue,
+						onFocus: onInputFocus,
+						onChange: onInputChange,
+						onKeyDown: onInputKeyDown,
+						onMouseDown: onInputMouseDown
+					}),
+					addButtonVisibility !== "never" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.Button, {
+						...slots?.addButton,
+						type: "button",
+						size: "icon",
+						variant: "ghost",
+						className: (0, __pixpilot_shadcn.cn)("absolute top-1/2 right-1.5 h-8 w-8 -translate-y-1/2 shrink-0", slots?.addButton?.className, addButtonVisibilityClassName),
+						disabled: isAddDisabled,
+						onClick: onAddCurrentInput,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, { className: "size-5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "sr-only",
+							children: "Add tag"
+						})]
+					}) : null
+				]
+			}),
+			showClear ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TagsInputInLineClear, { ...slots?.clear || {} }) : null
+		]
+	});
+}
+
+//#endregion
+exports.TagsInputInline = TagsInputInline;

package/dist/tags-input/TagsInputInline.d.cts

@@ -0,0 +1,80 @@
+import * as react_jsx_runtime13 from "react/jsx-runtime";
+import { ChangeEventHandler, FocusEventHandler, KeyboardEventHandler, MouseEventHandler, Ref } from "react";
+
+//#region src/tags-input/TagsInputInline.d.ts
+interface TagsInputInlineItem {
+  key: string;
+  value: string;
+  label: string;
+}
+interface TagsInputInlineProps {
+  label?: string;
+  showLabel?: boolean;
+  className?: string;
+  disabled?: boolean;
+  editable?: boolean;
+  max?: number;
+  onValueChange: (value: string[]) => void;
+  onValidate: (value: string) => boolean;
+  readOnly?: boolean;
+  value: string[];
+  delimiter?: string;
+  addOnPaste?: boolean;
+  addOnTab?: boolean;
+  items: TagsInputInlineItem[];
+  onListClick?: MouseEventHandler<HTMLDivElement>;
+  inputRef?: Ref<HTMLInputElement>;
+  inputPlaceholder?: string;
+  inputValue: string;
+  onInputFocus?: FocusEventHandler<HTMLInputElement>;
+  onInputChange?: ChangeEventHandler<HTMLInputElement>;
+  onInputKeyDown?: KeyboardEventHandler<HTMLInputElement>;
+  onInputMouseDown?: MouseEventHandler<HTMLInputElement>;
+  addButtonVisibility?: 'always' | 'touch' | 'never';
+  slots?: {
+    list?: {
+      className?: string;
+    };
+    label?: Record<string, any>;
+    item?: Record<string, any>;
+    input?: Record<string, any>;
+    addButton?: {
+      className?: string;
+    };
+    clear?: Record<string, any>;
+  };
+  canAddCurrentValue?: boolean;
+  onAddCurrentInput?: () => void;
+  showClear?: boolean;
+}
+declare function TagsInputInline({
+  label,
+  showLabel,
+  className,
+  disabled,
+  editable,
+  max,
+  onValueChange,
+  onValidate,
+  readOnly,
+  value,
+  delimiter,
+  addOnPaste,
+  addOnTab,
+  items,
+  onListClick,
+  inputRef,
+  inputPlaceholder,
+  inputValue,
+  onInputFocus,
+  onInputChange,
+  onInputKeyDown,
+  onInputMouseDown,
+  addButtonVisibility,
+  slots,
+  canAddCurrentValue,
+  onAddCurrentInput,
+  showClear
+}: TagsInputInlineProps): react_jsx_runtime13.JSX.Element;
+//#endregion
+export { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps };

package/dist/tags-input/TagsInputInline.d.ts

@@ -0,0 +1,80 @@
+import { ChangeEventHandler, FocusEventHandler, KeyboardEventHandler, MouseEventHandler, Ref } from "react";
+import * as react_jsx_runtime13 from "react/jsx-runtime";
+
+//#region src/tags-input/TagsInputInline.d.ts
+interface TagsInputInlineItem {
+  key: string;
+  value: string;
+  label: string;
+}
+interface TagsInputInlineProps {
+  label?: string;
+  showLabel?: boolean;
+  className?: string;
+  disabled?: boolean;
+  editable?: boolean;
+  max?: number;
+  onValueChange: (value: string[]) => void;
+  onValidate: (value: string) => boolean;
+  readOnly?: boolean;
+  value: string[];
+  delimiter?: string;
+  addOnPaste?: boolean;
+  addOnTab?: boolean;
+  items: TagsInputInlineItem[];
+  onListClick?: MouseEventHandler<HTMLDivElement>;
+  inputRef?: Ref<HTMLInputElement>;
+  inputPlaceholder?: string;
+  inputValue: string;
+  onInputFocus?: FocusEventHandler<HTMLInputElement>;
+  onInputChange?: ChangeEventHandler<HTMLInputElement>;
+  onInputKeyDown?: KeyboardEventHandler<HTMLInputElement>;
+  onInputMouseDown?: MouseEventHandler<HTMLInputElement>;
+  addButtonVisibility?: 'always' | 'touch' | 'never';
+  slots?: {
+    list?: {
+      className?: string;
+    };
+    label?: Record<string, any>;
+    item?: Record<string, any>;
+    input?: Record<string, any>;
+    addButton?: {
+      className?: string;
+    };
+    clear?: Record<string, any>;
+  };
+  canAddCurrentValue?: boolean;
+  onAddCurrentInput?: () => void;
+  showClear?: boolean;
+}
+declare function TagsInputInline({
+  label,
+  showLabel,
+  className,
+  disabled,
+  editable,
+  max,
+  onValueChange,
+  onValidate,
+  readOnly,
+  value,
+  delimiter,
+  addOnPaste,
+  addOnTab,
+  items,
+  onListClick,
+  inputRef,
+  inputPlaceholder,
+  inputValue,
+  onInputFocus,
+  onInputChange,
+  onInputKeyDown,
+  onInputMouseDown,
+  addButtonVisibility,
+  slots,
+  canAddCurrentValue,
+  onAddCurrentInput,
+  showClear
+}: TagsInputInlineProps): react_jsx_runtime13.JSX.Element;
+//#endregion
+export { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps };

package/dist/tags-input/TagsInputInline.js

@@ -0,0 +1,76 @@
+'use client';
+
+
+import { Button, TagsInputInLineClear, TagsInputInLineInput, TagsInputInLineItem, TagsInputInLineLabel, TagsInputInLineList, TagsInputInLineRoot, cn } from "@pixpilot/shadcn";
+import { Plus } from "lucide-react";
+import { createElement, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/tags-input/TagsInputInline.tsx
+function TagsInputInline({ label, showLabel = true, className, disabled = false, editable, max, onValueChange, onValidate, readOnly = false, value, delimiter, addOnPaste, addOnTab, items, onListClick, inputRef, inputPlaceholder, inputValue, onInputFocus, onInputChange, onInputKeyDown, onInputMouseDown, addButtonVisibility = "touch", slots, canAddCurrentValue = false, onAddCurrentInput, showClear = false }) {
+	const addButtonVisibilityClassName = useMemo(() => {
+		if (addButtonVisibility === "always") return "inline-flex";
+		if (addButtonVisibility === "touch") return "hidden pointer-coarse:inline-flex";
+		return "hidden";
+	}, [addButtonVisibility]);
+	const isAddDisabled = disabled || readOnly || !canAddCurrentValue;
+	const { className: listClassName,...listRest } = slots?.list || {};
+	return /* @__PURE__ */ jsxs(TagsInputInLineRoot, {
+		className,
+		disabled,
+		editable,
+		max,
+		onValueChange,
+		onValidate,
+		readOnly,
+		value,
+		delimiter,
+		addOnPaste,
+		addOnTab,
+		children: [
+			showLabel && label !== void 0 && label !== "" ? /* @__PURE__ */ jsx(TagsInputInLineLabel, {
+				...slots?.label || {},
+				children: label
+			}) : null,
+			/* @__PURE__ */ jsxs(TagsInputInLineList, {
+				...listRest,
+				className: cn("relative pr-10", listClassName),
+				onClick: onListClick,
+				children: [
+					items.map((item) => /* @__PURE__ */ createElement(TagsInputInLineItem, {
+						...slots?.item || {},
+						key: item.key,
+						value: item.value
+					}, item.label)),
+					/* @__PURE__ */ jsx(TagsInputInLineInput, {
+						...slots?.input || {},
+						ref: inputRef,
+						placeholder: inputPlaceholder,
+						value: inputValue,
+						onFocus: onInputFocus,
+						onChange: onInputChange,
+						onKeyDown: onInputKeyDown,
+						onMouseDown: onInputMouseDown
+					}),
+					addButtonVisibility !== "never" ? /* @__PURE__ */ jsxs(Button, {
+						...slots?.addButton,
+						type: "button",
+						size: "icon",
+						variant: "ghost",
+						className: cn("absolute top-1/2 right-1.5 h-8 w-8 -translate-y-1/2 shrink-0", slots?.addButton?.className, addButtonVisibilityClassName),
+						disabled: isAddDisabled,
+						onClick: onAddCurrentInput,
+						children: [/* @__PURE__ */ jsx(Plus, { className: "size-5" }), /* @__PURE__ */ jsx("span", {
+							className: "sr-only",
+							children: "Add tag"
+						})]
+					}) : null
+				]
+			}),
+			showClear ? /* @__PURE__ */ jsx(TagsInputInLineClear, { ...slots?.clear || {} }) : null
+		]
+	});
+}
+
+//#endregion
+export { TagsInputInline };

package/dist/tags-input/index.cjs

@@ -0,0 +1,2 @@
+const require_TagsInputInline = require('./TagsInputInline.cjs');
+const require_TagsInput = require('./TagsInput.cjs');

package/dist/tags-input/index.d.cts

@@ -0,0 +1,2 @@
+import { TagsInput, TagsInputProps } from "./TagsInput.cjs";
+import { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps } from "./TagsInputInline.cjs";

package/dist/tags-input/index.d.ts

@@ -0,0 +1,2 @@
+import { TagsInput, TagsInputProps } from "./TagsInput.js";
+import { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps } from "./TagsInputInline.js";

package/dist/tags-input/index.js

@@ -0,0 +1,2 @@
+import { TagsInputInline } from "./TagsInputInline.js";
+import { TagsInput } from "./TagsInput.js";

package/dist/theme-toggle/ThemeModeDropdown.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime15 from "react/jsx-runtime";
+import * as react_jsx_runtime16 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeDropdown.d.ts
 interface ThemeModeDropdownProps {
@@ -17,7 +17,7 @@ interface ThemeModeDropdownProps {
  * Provides Light / Dark / System options.
  * Pure component - requires themeValue and onChange props.
  */
-declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime15.JSX.Element;
+declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime16.JSX.Element;
 declare namespace ThemeModeDropdown {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeDropdown.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime14 from "react/jsx-runtime";
+import * as react_jsx_runtime15 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeDropdown.d.ts
 interface ThemeModeDropdownProps {
@@ -17,7 +17,7 @@ interface ThemeModeDropdownProps {
  * Provides Light / Dark / System options.
  * Pure component - requires themeValue and onChange props.
  */
-declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime14.JSX.Element;
+declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime15.JSX.Element;
 declare namespace ThemeModeDropdown {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchInside.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime16 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchInside.d.ts
 type ThemeModeSwitchInsideSize = 'sm' | 'md' | 'lg';
@@ -25,7 +25,7 @@ interface ThemeModeSwitchInsideProps {
  * Icons are embedded within the switch control.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime16.JSX.Element;
+declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime17.JSX.Element;
 declare namespace ThemeModeSwitchInside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchInside.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime15 from "react/jsx-runtime";
+import * as react_jsx_runtime16 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchInside.d.ts
 type ThemeModeSwitchInsideSize = 'sm' | 'md' | 'lg';
@@ -25,7 +25,7 @@ interface ThemeModeSwitchInsideProps {
  * Icons are embedded within the switch control.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime15.JSX.Element;
+declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime16.JSX.Element;
 declare namespace ThemeModeSwitchInside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchOutside.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime17 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchOutside.d.ts
 interface ThemeModeSwitchOutsideProps {
@@ -22,7 +22,7 @@ interface ThemeModeSwitchOutsideProps {
  * Icons flank the switch control on either side.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime17.JSX.Element;
+declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime18.JSX.Element;
 declare namespace ThemeModeSwitchOutside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchOutside.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime16 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchOutside.d.ts
 interface ThemeModeSwitchOutsideProps {
@@ -22,7 +22,7 @@ interface ThemeModeSwitchOutsideProps {
  * Icons flank the switch control on either side.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime16.JSX.Element;
+declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime17.JSX.Element;
 declare namespace ThemeModeSwitchOutside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeToggleButton.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime14 from "react/jsx-runtime";
+import * as react_jsx_runtime15 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeToggleButton.d.ts
 interface ThemeModeToggleButtonProps {
@@ -13,7 +13,7 @@ interface ThemeModeToggleButtonProps {
  * Light/Dark toggle button.
  * Pure component - toggles between light and dark.
  */
-declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime14.JSX.Element;
+declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime15.JSX.Element;
 declare namespace ThemeModeToggleButton {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeToggleButton.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime17 from "react/jsx-runtime";
+import * as react_jsx_runtime14 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeToggleButton.d.ts
 interface ThemeModeToggleButtonProps {
@@ -13,7 +13,7 @@ interface ThemeModeToggleButtonProps {
  * Light/Dark toggle button.
  * Pure component - toggles between light and dark.
  */
-declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime17.JSX.Element;
+declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime14.JSX.Element;
 declare namespace ThemeModeToggleButton {
   var displayName: string;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pixpilot/shadcn-ui",
   "type": "module",
-  "version": "0.47.0",
+  "version": "0.48.0",
   "description": "Custom UI components and utilities built with shadcn/ui.",
   "author": "m.doaie <m.doaie@hotmail.com>",
   "license": "MIT",
@@ -63,9 +63,9 @@
     "@internal/eslint-config": "0.3.0",
     "@internal/hooks": "0.0.0",
     "@internal/prettier-config": "0.0.1",
-    "@internal/tsconfig": "0.1.0",
     "@internal/tsdown-config": "0.1.0",
-    "@internal/vitest-config": "0.1.0"
+    "@internal/vitest-config": "0.1.0",
+    "@internal/tsconfig": "0.1.0"
   },
   "prettier": "@internal/prettier-config",
   "scripts": {