@pixpilot/shadcn-ui 0.25.1 → 0.27.0

package/dist/AbsoluteFill.cjs

@@ -15,6 +15,7 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 function AbsoluteFill(props) {
 	const { ref, className,...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "absolute-fill",
 		ref,
 		...rest,
 		className: (0, __pixpilot_shadcn.cn)("absolute top-0 right-0 bottom-0 left-0", className)

package/dist/AbsoluteFill.js

@@ -11,6 +11,7 @@ import { jsx } from "react/jsx-runtime";
 function AbsoluteFill(props) {
 	const { ref, className,...rest } = props;
 	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "absolute-fill",
 		ref,
 		...rest,
 		className: cn("absolute top-0 right-0 bottom-0 left-0", className)

package/dist/Button.cjs

@@ -33,6 +33,7 @@ function Button(props) {
 	const showTooltip = hasTooltip || hasDisabledTooltip;
 	const tooltipContent = hasDisabledTooltip ? disabledTooltip ?? "" : tooltip ?? title ?? "";
 	const Loader = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "button-loader",
 		className: (0, __pixpilot_shadcn.cn)("flex items-center justify-center", loaderPlacement === "center" && "rounded-0 absolute inset-0", loaderPlacement === "start" && "mr-1", loaderPlacement === "end" && "ml-1"),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Loader2, {
 			className: "text-background animate-spin",

package/dist/Button.js

@@ -28,6 +28,7 @@ function Button$1(props) {
 	const showTooltip = hasTooltip || hasDisabledTooltip;
 	const tooltipContent = hasDisabledTooltip ? disabledTooltip ?? "" : tooltip ?? title ?? "";
 	const Loader = /* @__PURE__ */ jsx("div", {
+		"data-slot": "button-loader",
 		className: cn("flex items-center justify-center", loaderPlacement === "center" && "rounded-0 absolute inset-0", loaderPlacement === "start" && "mr-1", loaderPlacement === "end" && "ml-1"),
 		children: /* @__PURE__ */ jsx(Loader2, {
 			className: "text-background animate-spin",

package/dist/ColorSelect.d.ts

@@ -1,6 +1,6 @@
 import { Select, SelectContent } from "@pixpilot/shadcn";
 import React, { ComponentProps } from "react";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 
 //#region src/ColorSelect.d.ts
 interface ColorSelectOption {
@@ -15,6 +15,6 @@ type BaseColorSelectProps = {
   placeholder?: string;
   keyboardMode?: 'cycle' | 'dropdown';
 } & Omit<ComponentProps<typeof Select>, 'value' | 'onValueChange' | 'children'>;
-declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime1.JSX.Element;
+declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 export { BaseColorSelectProps, ColorSelect, ColorSelectOption };

package/dist/ContentCard.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 import { Card } from "@pixpilot/shadcn";
 import React, { ReactNode } from "react";
 
@@ -8,7 +8,7 @@ interface SectionCardProps extends React.ComponentProps<typeof Card> {
   children: ReactNode;
   marginBottom?: boolean;
 }
-declare function ContentCard(props: SectionCardProps): react_jsx_runtime3.JSX.Element;
+declare function ContentCard(props: SectionCardProps): react_jsx_runtime2.JSX.Element;
 declare namespace ContentCard {
   var displayName: string;
 }

package/dist/ContentCard.d.ts

@@ -1,6 +1,6 @@
 import { Card } from "@pixpilot/shadcn";
 import React, { ReactNode } from "react";
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 
 //#region src/ContentCard.d.ts
 interface SectionCardProps extends React.ComponentProps<typeof Card> {
@@ -8,7 +8,7 @@ interface SectionCardProps extends React.ComponentProps<typeof Card> {
   children: ReactNode;
   marginBottom?: boolean;
 }
-declare function ContentCard(props: SectionCardProps): react_jsx_runtime2.JSX.Element;
+declare function ContentCard(props: SectionCardProps): react_jsx_runtime3.JSX.Element;
 declare namespace ContentCard {
   var displayName: string;
 }

package/dist/DatePicker.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 import { Calendar } from "@pixpilot/shadcn";
 import { ComponentProps } from "react";
 
@@ -8,7 +8,7 @@ type DatePickerProps = {
   onChange?: (date: Date | undefined) => void;
   placeholder?: string;
 } & Omit<ComponentProps<typeof Calendar>, 'selected' | 'onSelect' | 'mode'>;
-declare function DatePicker(props: DatePickerProps): react_jsx_runtime2.JSX.Element;
+declare function DatePicker(props: DatePickerProps): react_jsx_runtime3.JSX.Element;
 declare namespace DatePicker {
   var displayName: string;
 }

package/dist/DatePicker.d.ts

@@ -1,6 +1,6 @@
 import { Calendar } from "@pixpilot/shadcn";
 import { ComponentProps } from "react";
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 
 //#region src/DatePicker.d.ts
 type DatePickerProps = {
@@ -8,7 +8,7 @@ type DatePickerProps = {
   onChange?: (date: Date | undefined) => void;
   placeholder?: string;
 } & Omit<ComponentProps<typeof Calendar>, 'selected' | 'onSelect' | 'mode'>;
-declare function DatePicker(props: DatePickerProps): react_jsx_runtime3.JSX.Element;
+declare function DatePicker(props: DatePickerProps): react_jsx_runtime1.JSX.Element;
 declare namespace DatePicker {
   var displayName: string;
 }

package/dist/ScaledPreview.cjs

@@ -20,6 +20,7 @@ const ScaledPreview = ({ baseSize = DEFAULT_BASE_SIZE, scaleFactor, previewBoxSi
 	const finalScale = forceScale ?? calculatedScale;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		...rest,
+		"data-slot": "scaled-preview",
 		style: {
 			width: calculatedPreviewBoxSize.width,
 			height: calculatedPreviewBoxSize.height,
@@ -27,6 +28,7 @@ const ScaledPreview = ({ baseSize = DEFAULT_BASE_SIZE, scaleFactor, previewBoxSi
 			...rest.style
 		},
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			"data-slot": "scaled-preview-content",
 			className: "absolute top-1/2 left-1/2",
 			style: {
 				width: baseSize.width,

package/dist/ScaledPreview.js

@@ -17,6 +17,7 @@ const ScaledPreview = ({ baseSize = DEFAULT_BASE_SIZE, scaleFactor, previewBoxSi
 	const finalScale = forceScale ?? calculatedScale;
 	return /* @__PURE__ */ jsx("div", {
 		...rest,
+		"data-slot": "scaled-preview",
 		style: {
 			width: calculatedPreviewBoxSize.width,
 			height: calculatedPreviewBoxSize.height,
@@ -24,6 +25,7 @@ const ScaledPreview = ({ baseSize = DEFAULT_BASE_SIZE, scaleFactor, previewBoxSi
 			...rest.style
 		},
 		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "scaled-preview-content",
 			className: "absolute top-1/2 left-1/2",
 			style: {
 				width: baseSize.width,

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

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

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

@@ -1,10 +1,10 @@
 import { FileUploadInlineProps } from "./types.js";
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime7 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_runtime8.JSX.Element;
+declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime7.JSX.Element;
 //#endregion
 export { FileUploadInline };

package/dist/index.cjs

@@ -53,7 +53,12 @@ require('./tabs/index.cjs');
 const require_tags_input = require('./tags-input.cjs');
 const require_ThemeProvider = require('./theme-provider/ThemeProvider.cjs');
 require('./theme-provider/index.cjs');
-const require_ThemeToggle = require('./ThemeToggle.cjs');
+const require_ThemeModeDropdown = require('./theme-toggle/ThemeModeDropdown.cjs');
+const require_ThemeModeSwitchInside = require('./theme-toggle/ThemeModeSwitchInside.cjs');
+const require_ThemeModeSwitchOutside = require('./theme-toggle/ThemeModeSwitchOutside.cjs');
+const require_ThemeModeToggleButton = require('./theme-toggle/ThemeModeToggleButton.cjs');
+const require_ThemeToggle = require('./theme-toggle/ThemeToggle.cjs');
+require('./theme-toggle/index.cjs');
 const require_toast = require('./toast/toast.cjs');
 require('./toast/index.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");
@@ -98,6 +103,10 @@ exports.TabsContext = require_TabsContext.TabsContext;
 exports.TabsList = require_TabsList.TabsList;
 exports.TabsTrigger = require_TabsTrigger.TabsTrigger;
 exports.TagsInput = require_tags_input.TagsInput;
+exports.ThemeModeDropdown = require_ThemeModeDropdown.ThemeModeDropdown;
+exports.ThemeModeSwitchInside = require_ThemeModeSwitchInside.ThemeModeSwitchInside;
+exports.ThemeModeSwitchOutside = require_ThemeModeSwitchOutside.ThemeModeSwitchOutside;
+exports.ThemeModeToggleButton = require_ThemeModeToggleButton.ThemeModeToggleButton;
 exports.ThemeProvider = require_ThemeProvider.ThemeProvider;
 exports.ThemeToggle = require_ThemeToggle.ThemeToggle;
 exports.cn = __pixpilot_shadcn.cn;

package/dist/index.d.cts

@@ -58,8 +58,13 @@ import "./tabs/index.cjs";
 import { TagsInput, TagsInputProps } from "./tags-input.cjs";
 import { ThemeProvider, ThemeProviderProps } from "./theme-provider/ThemeProvider.cjs";
 import { useTheme } from "./theme-provider/index.cjs";
-import { ThemeToggle } from "./ThemeToggle.cjs";
+import { ThemeModeDropdown, ThemeModeDropdownProps } from "./theme-toggle/ThemeModeDropdown.cjs";
+import { ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize } from "./theme-toggle/ThemeModeSwitchInside.cjs";
+import { ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps } from "./theme-toggle/ThemeModeSwitchOutside.cjs";
+import { ThemeModeToggleButton, ThemeModeToggleButtonProps } from "./theme-toggle/ThemeModeToggleButton.cjs";
+import { ThemeToggle, ThemeToggleProps } from "./theme-toggle/ThemeToggle.cjs";
+import "./theme-toggle/index.cjs";
 import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.cjs";
 import "./toast/index.cjs";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, 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, DialogProvider, DialogProviderProps, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, PresetColor, RichTextEditor, RichTextEditorProps, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeProvider, ThemeProviderProps, ThemeToggle, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, 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, DialogProvider, DialogProviderProps, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, PresetColor, RichTextEditor, RichTextEditorProps, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, 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, ThemeToggle, ThemeToggleProps, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.d.ts

@@ -60,8 +60,13 @@ import "./tabs/index.js";
 import { TagsInput, TagsInputProps } from "./tags-input.js";
 import { ThemeProvider, ThemeProviderProps } from "./theme-provider/ThemeProvider.js";
 import { useTheme } from "./theme-provider/index.js";
-import { ThemeToggle } from "./ThemeToggle.js";
+import { ThemeModeDropdown, ThemeModeDropdownProps } from "./theme-toggle/ThemeModeDropdown.js";
+import { ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize } from "./theme-toggle/ThemeModeSwitchInside.js";
+import { ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps } from "./theme-toggle/ThemeModeSwitchOutside.js";
+import { ThemeModeToggleButton, ThemeModeToggleButtonProps } from "./theme-toggle/ThemeModeToggleButton.js";
+import { ThemeToggle, ThemeToggleProps } from "./theme-toggle/ThemeToggle.js";
+import "./theme-toggle/index.js";
 import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.js";
 import "./toast/index.js";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, 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, DialogProvider, DialogProviderProps, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, PresetColor, RichTextEditor, RichTextEditorProps, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeProvider, ThemeProviderProps, ThemeToggle, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, 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, DialogProvider, DialogProviderProps, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, PresetColor, RichTextEditor, RichTextEditorProps, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, 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, ThemeToggle, ThemeToggleProps, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.js

@@ -54,9 +54,14 @@ import "./tabs/index.js";
 import { TagsInput } from "./tags-input.js";
 import { ThemeProvider } from "./theme-provider/ThemeProvider.js";
 import { useTheme } from "./theme-provider/index.js";
-import { ThemeToggle } from "./ThemeToggle.js";
+import { ThemeModeDropdown } from "./theme-toggle/ThemeModeDropdown.js";
+import { ThemeModeSwitchInside } from "./theme-toggle/ThemeModeSwitchInside.js";
+import { ThemeModeSwitchOutside } from "./theme-toggle/ThemeModeSwitchOutside.js";
+import { ThemeModeToggleButton } from "./theme-toggle/ThemeModeToggleButton.js";
+import { ThemeToggle } from "./theme-toggle/ThemeToggle.js";
+import "./theme-toggle/index.js";
 import { DEFAULT_ALERT_DURATION, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.js";
 import "./toast/index.js";
 import { cn } from "@pixpilot/shadcn";
 
-export { AbsoluteFill, Alert, AvatarUpload, Button, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DialogProvider, FileUpload, FileUploadInline, IconPicker, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, ThemeProvider, ThemeToggle, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AvatarUpload, Button, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DialogProvider, FileUpload, FileUploadInline, IconPicker, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, ThemeToggle, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

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_runtime9 from "react/jsx-runtime";
+import * as react_jsx_runtime8 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_runtime9.JSX.Element;
+declare function Input$1(props: InputProps$1): react_jsx_runtime8.JSX.Element;
 //#endregion
 export { Input$1 as Input, InputProps$1 as InputProps };

package/dist/layout/Layout.cjs

@@ -9,6 +9,7 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 //#region src/layout/Layout.tsx
 const Layout = react.default.forwardRef(({ className, as: Component = "div",...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
+		"data-slot": "layout",
 		ref,
 		className: (0, __pixpilot_shadcn.cn)("flex w-full flex-col overflow-hidden", "h-dvh", "max-h-full", className),
 		...props

package/dist/layout/Layout.js

@@ -5,6 +5,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/layout/Layout.tsx
 const Layout = React.forwardRef(({ className, as: Component = "div",...props }, ref) => {
 	return /* @__PURE__ */ jsx(Component, {
+		"data-slot": "layout",
 		ref,
 		className: cn("flex w-full flex-col overflow-hidden", "h-dvh", "max-h-full", className),
 		...props

package/dist/layout/LayoutFooter.cjs

@@ -8,6 +8,7 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/layout/LayoutFooter.tsx
 const LayoutFooter = react.default.forwardRef(({ className, as: Component = "div",...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
+	"data-slot": "layout-footer",
 	...props,
 	className: (0, __pixpilot_shadcn.cn)(className),
 	ref

package/dist/layout/LayoutFooter.js

@@ -4,6 +4,7 @@ import { jsx } from "react/jsx-runtime";
 
 //#region src/layout/LayoutFooter.tsx
 const LayoutFooter = React.forwardRef(({ className, as: Component = "div",...props }, ref) => /* @__PURE__ */ jsx(Component, {
+	"data-slot": "layout-footer",
 	...props,
 	className: cn(className),
 	ref

package/dist/layout/LayoutHeader.cjs

@@ -8,6 +8,7 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
 //#region src/layout/LayoutHeader.tsx
 const LayoutHeader = react.default.forwardRef(({ className, as: Component = "div",...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
+	"data-slot": "layout-header",
 	...props,
 	className: (0, __pixpilot_shadcn.cn)(className),
 	ref

package/dist/layout/LayoutHeader.js

@@ -4,6 +4,7 @@ import { jsx } from "react/jsx-runtime";
 
 //#region src/layout/LayoutHeader.tsx
 const LayoutHeader = React.forwardRef(({ className, as: Component = "div",...props }, ref) => /* @__PURE__ */ jsx(Component, {
+	"data-slot": "layout-header",
 	...props,
 	className: cn(className),
 	ref

package/dist/layout/LayoutMain.cjs

@@ -9,6 +9,7 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 //#region src/layout/LayoutMain.tsx
 const LayoutMain = react.default.forwardRef(({ autoScroll = true, className, as: Component = "div",...props }, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
+		"data-slot": "layout-main",
 		ref,
 		className: (0, __pixpilot_shadcn.cn)("flex-1", { "overflow-auto": autoScroll }, className),
 		...props

package/dist/layout/LayoutMain.js

@@ -5,6 +5,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/layout/LayoutMain.tsx
 const LayoutMain = React.forwardRef(({ autoScroll = true, className, as: Component = "div",...props }, ref) => {
 	return /* @__PURE__ */ jsx(Component, {
+		"data-slot": "layout-main",
 		ref,
 		className: cn("flex-1", { "overflow-auto": autoScroll }, className),
 		...props

package/dist/theme-provider/index.d.ts

@@ -1,3 +1,3 @@
 import { ThemeProvider as ThemeProvider$1, ThemeProviderProps } from "./ThemeProvider.js";
-import { useTheme as useTheme$1 } from "next-themes";
-export { useTheme$1 as useTheme };
+import { useTheme } from "next-themes";
+export { useTheme };

package/dist/theme-provider/index.js

@@ -1,4 +1,4 @@
 import { ThemeProvider as ThemeProvider$1 } from "./ThemeProvider.js";
-import { useTheme as useTheme$1 } from "next-themes";
+import { useTheme } from "next-themes";
 
-export { useTheme$1 as useTheme };
+export { useTheme };

package/dist/theme-toggle/ThemeModeDropdown.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/theme-toggle/ThemeModeDropdown.tsx
+/**
+* Theme mode selector dropdown.
+* Provides Light / Dark / System options.
+* Pure component - requires theme and setTheme props.
+*/
+function ThemeModeDropdown(props) {
+	const { align = "end", className, theme, setTheme, resolvedTheme, disabled } = props;
+	const isDark = resolvedTheme === "dark";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.DropdownMenuTrigger, {
+		asChild: true,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.Button, {
+			variant: "outline",
+			size: "icon",
+			className: (0, __pixpilot_shadcn.cn)(className),
+			disabled,
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Sun, { className: (0, __pixpilot_shadcn.cn)("h-[1.2rem] w-[1.2rem] transition-all", isDark ? "scale-0 -rotate-90" : "scale-100 rotate-0") }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Moon, { className: (0, __pixpilot_shadcn.cn)("absolute h-[1.2rem] w-[1.2rem] transition-all", isDark ? "scale-100 rotate-0" : "scale-0 rotate-90") }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "sr-only",
+					children: "Toggle theme"
+				})
+			]
+		})
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.DropdownMenuContent, {
+		align,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.DropdownMenuItem, {
+				onClick: () => setTheme?.("light"),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Sun, { className: "h-4 w-4 mr-2" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "flex-1",
+						children: "Light"
+					}),
+					theme === "light" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Check, { className: "h-4 w-4 ml-2" })
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.DropdownMenuItem, {
+				onClick: () => setTheme?.("dark"),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Moon, { className: "h-4 w-4 mr-2" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "flex-1",
+						children: "Dark"
+					}),
+					theme === "dark" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Check, { className: "h-4 w-4 ml-2" })
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.DropdownMenuItem, {
+				onClick: () => setTheme?.("system"),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Monitor, { className: "h-4 w-4 mr-2" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "flex-1",
+						children: "System"
+					}),
+					theme === "system" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Check, { className: "h-4 w-4 ml-2" })
+				]
+			})
+		]
+	})] });
+}
+ThemeModeDropdown.displayName = "ThemeModeDropdown";
+
+//#endregion
+exports.ThemeModeDropdown = ThemeModeDropdown;

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

@@ -0,0 +1,25 @@
+import * as react_jsx_runtime10 from "react/jsx-runtime";
+
+//#region src/theme-toggle/ThemeModeDropdown.d.ts
+interface ThemeModeDropdownProps {
+  align?: 'start' | 'center' | 'end';
+  className?: string;
+  /** Current theme value ("light" | "dark" | "system") */
+  theme?: string;
+  /** Function to change the theme */
+  setTheme?: (theme: string) => void;
+  /** The resolved theme ("light" | "dark") */
+  resolvedTheme?: string;
+  disabled?: boolean;
+}
+/**
+ * Theme mode selector dropdown.
+ * Provides Light / Dark / System options.
+ * Pure component - requires theme and setTheme props.
+ */
+declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime10.JSX.Element;
+declare namespace ThemeModeDropdown {
+  var displayName: string;
+}
+//#endregion
+export { ThemeModeDropdown, ThemeModeDropdownProps };

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

@@ -0,0 +1,25 @@
+import * as react_jsx_runtime9 from "react/jsx-runtime";
+
+//#region src/theme-toggle/ThemeModeDropdown.d.ts
+interface ThemeModeDropdownProps {
+  align?: 'start' | 'center' | 'end';
+  className?: string;
+  /** Current theme value ("light" | "dark" | "system") */
+  theme?: string;
+  /** Function to change the theme */
+  setTheme?: (theme: string) => void;
+  /** The resolved theme ("light" | "dark") */
+  resolvedTheme?: string;
+  disabled?: boolean;
+}
+/**
+ * Theme mode selector dropdown.
+ * Provides Light / Dark / System options.
+ * Pure component - requires theme and setTheme props.
+ */
+declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime9.JSX.Element;
+declare namespace ThemeModeDropdown {
+  var displayName: string;
+}
+//#endregion
+export { ThemeModeDropdown, ThemeModeDropdownProps };

package/dist/theme-toggle/ThemeModeDropdown.js

@@ -0,0 +1,76 @@
+'use client';
+
+
+import { Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, cn } from "@pixpilot/shadcn";
+import { Check, Monitor, Moon, Sun } from "lucide-react";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/theme-toggle/ThemeModeDropdown.tsx
+/**
+* Theme mode selector dropdown.
+* Provides Light / Dark / System options.
+* Pure component - requires theme and setTheme props.
+*/
+function ThemeModeDropdown(props) {
+	const { align = "end", className, theme, setTheme, resolvedTheme, disabled } = props;
+	const isDark = resolvedTheme === "dark";
+	return /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
+		asChild: true,
+		children: /* @__PURE__ */ jsxs(Button, {
+			variant: "outline",
+			size: "icon",
+			className: cn(className),
+			disabled,
+			children: [
+				/* @__PURE__ */ jsx(Sun, { className: cn("h-[1.2rem] w-[1.2rem] transition-all", isDark ? "scale-0 -rotate-90" : "scale-100 rotate-0") }),
+				/* @__PURE__ */ jsx(Moon, { className: cn("absolute h-[1.2rem] w-[1.2rem] transition-all", isDark ? "scale-100 rotate-0" : "scale-0 rotate-90") }),
+				/* @__PURE__ */ jsx("span", {
+					className: "sr-only",
+					children: "Toggle theme"
+				})
+			]
+		})
+	}), /* @__PURE__ */ jsxs(DropdownMenuContent, {
+		align,
+		children: [
+			/* @__PURE__ */ jsxs(DropdownMenuItem, {
+				onClick: () => setTheme?.("light"),
+				children: [
+					/* @__PURE__ */ jsx(Sun, { className: "h-4 w-4 mr-2" }),
+					/* @__PURE__ */ jsx("span", {
+						className: "flex-1",
+						children: "Light"
+					}),
+					theme === "light" && /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 ml-2" })
+				]
+			}),
+			/* @__PURE__ */ jsxs(DropdownMenuItem, {
+				onClick: () => setTheme?.("dark"),
+				children: [
+					/* @__PURE__ */ jsx(Moon, { className: "h-4 w-4 mr-2" }),
+					/* @__PURE__ */ jsx("span", {
+						className: "flex-1",
+						children: "Dark"
+					}),
+					theme === "dark" && /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 ml-2" })
+				]
+			}),
+			/* @__PURE__ */ jsxs(DropdownMenuItem, {
+				onClick: () => setTheme?.("system"),
+				children: [
+					/* @__PURE__ */ jsx(Monitor, { className: "h-4 w-4 mr-2" }),
+					/* @__PURE__ */ jsx("span", {
+						className: "flex-1",
+						children: "System"
+					}),
+					theme === "system" && /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 ml-2" })
+				]
+			})
+		]
+	})] });
+}
+ThemeModeDropdown.displayName = "ThemeModeDropdown";
+
+//#endregion
+export { ThemeModeDropdown };