@pixpilot/shadcn-ui 0.6.0 → 0.8.0

package/dist/{spinner/spinner.cjs → circle-loader/circle-loader.cjs}

@@ -5,8 +5,8 @@ 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/spinner/spinner.tsx
-const SpinnerSize = {
+//#region src/circle-loader/circle-loader.tsx
+const CircleLoaderSize = {
 	sm: 24,
 	md: 40,
 	lg: 64,
@@ -20,8 +20,8 @@ const DEFAULT_COLOR = "currentColor";
 const VIEWBOX_STROKE_REF = 40;
 const PERCENT_MULTIPLIER = 100;
 let spinnerIdCounter = 0;
-const Spinner = ({ size: sizeProp = DEFAULT_SIZE, strokeWidth: strokeWidthProp, speed = DEFAULT_SPEED, color = DEFAULT_COLOR, colors, className = "" }) => {
-	const size = typeof sizeProp === "string" ? SpinnerSize[sizeProp] : sizeProp;
+const CircleLoader = ({ size: sizeProp = DEFAULT_SIZE, strokeWidth: strokeWidthProp, speed = DEFAULT_SPEED, color = DEFAULT_COLOR, colors, className = "" }) => {
+	const size = typeof sizeProp === "string" ? CircleLoaderSize[sizeProp] : sizeProp;
 	const strokeWidth = strokeWidthProp ?? Math.max(MIN_STROKE_WIDTH, Math.round(size * STROKE_WIDTH_RATIO));
 	const uniqueId = (0, react.useMemo)(() => `spinner-${++spinnerIdCounter}-${Date.now()}`, []);
 	const viewBoxStrokeWidth = strokeWidth / size * VIEWBOX_STROKE_REF;
@@ -68,7 +68,7 @@ const Spinner = ({ size: sizeProp = DEFAULT_SIZE, strokeWidth: strokeWidthProp,
 		})
 	})] });
 };
-Spinner.displayName = "Spinner";
+CircleLoader.displayName = "CircleLoader";
 
 //#endregion
-exports.Spinner = Spinner;
+exports.CircleLoader = CircleLoader;

package/dist/{spinner/spinner.d.cts → circle-loader/circle-loader.d.cts}

@@ -1,19 +1,19 @@
 import React from "react";
 
-//#region src/spinner/spinner.d.ts
-declare const SpinnerSize: {
+//#region src/circle-loader/circle-loader.d.ts
+declare const CircleLoaderSize: {
   readonly sm: 24;
   readonly md: 40;
   readonly lg: 64;
   readonly xl: 96;
 };
-type SpinnerSizeKey = keyof typeof SpinnerSize;
-interface SpinnerProps {
+type CircleLoaderSizeKey = keyof typeof CircleLoaderSize;
+interface CircleLoaderProps {
   /**
    * Size of the spinner - can be a preset ('sm', 'md', 'lg', 'xl') or a number in pixels
    * @default 'md' (40px)
    */
-  size?: SpinnerSizeKey | number;
+  size?: CircleLoaderSizeKey | number;
   /**
    * Width of the spinner stroke in pixels
    * If not provided, automatically calculated as 10% of size (minimum 2px)
@@ -41,6 +41,6 @@ interface SpinnerProps {
    */
   className?: string;
 }
-declare const Spinner: React.FC<SpinnerProps>;
+declare const CircleLoader: React.FC<CircleLoaderProps>;
 //#endregion
-export { Spinner, SpinnerProps };
+export { CircleLoader, CircleLoaderProps };

package/dist/{spinner/spinner.d.ts → circle-loader/circle-loader.d.ts}

@@ -1,19 +1,19 @@
 import React from "react";
 
-//#region src/spinner/spinner.d.ts
-declare const SpinnerSize: {
+//#region src/circle-loader/circle-loader.d.ts
+declare const CircleLoaderSize: {
   readonly sm: 24;
   readonly md: 40;
   readonly lg: 64;
   readonly xl: 96;
 };
-type SpinnerSizeKey = keyof typeof SpinnerSize;
-interface SpinnerProps {
+type CircleLoaderSizeKey = keyof typeof CircleLoaderSize;
+interface CircleLoaderProps {
   /**
    * Size of the spinner - can be a preset ('sm', 'md', 'lg', 'xl') or a number in pixels
    * @default 'md' (40px)
    */
-  size?: SpinnerSizeKey | number;
+  size?: CircleLoaderSizeKey | number;
   /**
    * Width of the spinner stroke in pixels
    * If not provided, automatically calculated as 10% of size (minimum 2px)
@@ -41,6 +41,6 @@ interface SpinnerProps {
    */
   className?: string;
 }
-declare const Spinner: React.FC<SpinnerProps>;
+declare const CircleLoader: React.FC<CircleLoaderProps>;
 //#endregion
-export { Spinner, SpinnerProps };
+export { CircleLoader, CircleLoaderProps };

package/dist/{spinner/spinner.js → circle-loader/circle-loader.js}

@@ -2,8 +2,8 @@ import { getGlobalStyles } from "./styles.js";
 import React, { useMemo } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 
-//#region src/spinner/spinner.tsx
-const SpinnerSize = {
+//#region src/circle-loader/circle-loader.tsx
+const CircleLoaderSize = {
 	sm: 24,
 	md: 40,
 	lg: 64,
@@ -17,8 +17,8 @@ const DEFAULT_COLOR = "currentColor";
 const VIEWBOX_STROKE_REF = 40;
 const PERCENT_MULTIPLIER = 100;
 let spinnerIdCounter = 0;
-const Spinner = ({ size: sizeProp = DEFAULT_SIZE, strokeWidth: strokeWidthProp, speed = DEFAULT_SPEED, color = DEFAULT_COLOR, colors, className = "" }) => {
-	const size = typeof sizeProp === "string" ? SpinnerSize[sizeProp] : sizeProp;
+const CircleLoader = ({ size: sizeProp = DEFAULT_SIZE, strokeWidth: strokeWidthProp, speed = DEFAULT_SPEED, color = DEFAULT_COLOR, colors, className = "" }) => {
+	const size = typeof sizeProp === "string" ? CircleLoaderSize[sizeProp] : sizeProp;
 	const strokeWidth = strokeWidthProp ?? Math.max(MIN_STROKE_WIDTH, Math.round(size * STROKE_WIDTH_RATIO));
 	const uniqueId = useMemo(() => `spinner-${++spinnerIdCounter}-${Date.now()}`, []);
 	const viewBoxStrokeWidth = strokeWidth / size * VIEWBOX_STROKE_REF;
@@ -65,7 +65,7 @@ const Spinner = ({ size: sizeProp = DEFAULT_SIZE, strokeWidth: strokeWidthProp,
 		})
 	})] });
 };
-Spinner.displayName = "Spinner";
+CircleLoader.displayName = "CircleLoader";
 
 //#endregion
-export { Spinner };
+export { CircleLoader };

package/dist/circle-loader/index.cjs

@@ -0,0 +1 @@
+const require_circle_loader = require('./circle-loader.cjs');

package/dist/circle-loader/index.d.cts

@@ -0,0 +1 @@
+import { CircleLoader, CircleLoaderProps } from "./circle-loader.cjs";

package/dist/circle-loader/index.d.ts

@@ -0,0 +1 @@
+import { CircleLoader, CircleLoaderProps } from "./circle-loader.js";

package/dist/circle-loader/index.js

@@ -0,0 +1 @@
+import { CircleLoader } from "./circle-loader.js";

package/dist/{spinner → circle-loader}/styles.cjs

@@ -1,5 +1,5 @@
 
-//#region src/spinner/styles.ts
+//#region src/circle-loader/styles.ts
 function getGlobalStyles(options) {
 	const { uniqueId, speed = 2, size, colors, color } = options;
 	const getColorAnimationId = () => {

package/dist/{spinner → circle-loader}/styles.js

@@ -1,4 +1,4 @@
-//#region src/spinner/styles.ts
+//#region src/circle-loader/styles.ts
 function getGlobalStyles(options) {
 	const { uniqueId, speed = 2, size, colors, color } = options;
 	const getColorAnimationId = () => {

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_runtime6 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_runtime6.JSX.Element;
+declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime7.JSX.Element;
 //#endregion
 export { FileUploadInline };

package/dist/index.cjs

@@ -6,6 +6,8 @@ const require_Alert = require('./Alert.cjs');
 const require_AvatarUpload = require('./avatar-upload/AvatarUpload.cjs');
 require('./avatar-upload/index.cjs');
 const require_Button = require('./Button.cjs');
+const require_circle_loader = require('./circle-loader/circle-loader.cjs');
+require('./circle-loader/index.cjs');
 const require_CloseButtonRounded = require('./CloseButtonRounded.cjs');
 const require_CloseButtonAbsolute = require('./CloseButtonAbsolute.cjs');
 const require_Combobox = require('./Combobox.cjs');
@@ -21,14 +23,17 @@ require('./hooks/index.cjs');
 const require_LoadingOverlay = require('./LoadingOverlay.cjs');
 const require_IconPicker = require('./icon-selector/IconPicker.cjs');
 require('./icon-selector/index.cjs');
+const require_Layout = require('./layout/Layout.cjs');
+const require_LayoutFooter = require('./layout/LayoutFooter.cjs');
+const require_LayoutHeader = require('./layout/LayoutHeader.cjs');
+const require_LayoutMain = require('./layout/LayoutMain.cjs');
+require('./layout/index.cjs');
 const require_Pagination = require('./pagination/Pagination.cjs');
 require('./pagination/index.cjs');
 const require_RichTextEditor = require('./rich-text-editor/RichTextEditor.cjs');
 require('./rich-text-editor/index.cjs');
 const require_Select = require('./Select.cjs');
 const require_Slider = require('./Slider.cjs');
-const require_spinner = require('./spinner/spinner.cjs');
-require('./spinner/index.cjs');
 const require_tags_input = require('./tags-input.cjs');
 const require_ThemeProvider = require('./theme-provider/ThemeProvider.cjs');
 require('./theme-provider/index.cjs');
@@ -44,6 +49,7 @@ exports.AbsoluteFill = require_AbsoluteFill.AbsoluteFill;
 exports.Alert = require_Alert.Alert;
 exports.AvatarUpload = require_AvatarUpload.AvatarUpload;
 exports.Button = require_Button.Button;
+exports.CircleLoader = require_circle_loader.CircleLoader;
 exports.CloseButtonAbsolute = require_CloseButtonAbsolute.CloseButtonAbsolute;
 exports.CloseButtonRounded = require_CloseButtonRounded.CloseButtonRounded;
 exports.Combobox = require_Combobox.Combobox;
@@ -54,12 +60,15 @@ exports.DialogProvider = require_DialogProvider.DialogProvider;
 exports.FileUpload = require_FileUpload.FileUpload;
 exports.FileUploadInline = require_FileUploadInline.FileUploadInline;
 exports.IconPicker = require_IconPicker.IconPicker;
+exports.Layout = require_Layout.Layout;
+exports.LayoutFooter = require_LayoutFooter.LayoutFooter;
+exports.LayoutHeader = require_LayoutHeader.LayoutHeader;
+exports.LayoutMain = require_LayoutMain.LayoutMain;
 exports.LoadingOverlay = require_LoadingOverlay.LoadingOverlay;
 exports.Pagination = require_Pagination.Pagination;
 exports.RichTextEditor = require_RichTextEditor.RichTextEditor;
 exports.Select = require_Select.Select;
 exports.Slider = require_Slider.Slider;
-exports.Spinner = require_spinner.Spinner;
 exports.TagsInput = require_tags_input.TagsInput;
 exports.ThemeProvider = require_ThemeProvider.ThemeProvider;
 exports.ThemeToggle = require_ThemeToggle.ThemeToggle;

package/dist/index.d.cts

@@ -6,6 +6,8 @@ import { Alert, AlertBaseProps, AlertProps, AlertVariant } from "./Alert.cjs";
 import { AvatarUpload, AvatarUploadProps } from "./avatar-upload/AvatarUpload.cjs";
 import "./avatar-upload/index.cjs";
 import { Button, ButtonLoaderProps, ButtonProps } from "./Button.cjs";
+import { CircleLoader, CircleLoaderProps } from "./circle-loader/circle-loader.cjs";
+import "./circle-loader/index.cjs";
 import { CloseButtonRounded, CloseButtonRoundedProps } from "./CloseButtonRounded.cjs";
 import { CloseButtonAbsolute, PopoverCloseButtonProps } from "./CloseButtonAbsolute.cjs";
 import { Combobox } from "./Combobox.cjs";
@@ -22,6 +24,11 @@ import { useMediaQuery } from "./hooks/use-media-query.cjs";
 import { IconProvider, IconProviderLoader, IconProviderProps } from "./icon-selector/types.cjs";
 import { IconPicker, IconPickerProps, IconPickerVariant } from "./icon-selector/IconPicker.cjs";
 import "./icon-selector/index.cjs";
+import { Layout, LayoutProps } from "./layout/Layout.cjs";
+import { LayoutFooter, LayoutFooterProps } from "./layout/LayoutFooter.cjs";
+import { LayoutHeader, LayoutHeaderProps } from "./layout/LayoutHeader.cjs";
+import { LayoutMain, LayoutMainProps } from "./layout/LayoutMain.cjs";
+import "./layout/index.cjs";
 import { LoaderProps, LoadingOverlay } from "./LoadingOverlay.cjs";
 import { Pagination, PaginationProps } from "./pagination/Pagination.cjs";
 import "./pagination/index.cjs";
@@ -29,8 +36,6 @@ import { RichTextEditor, RichTextEditorProps, ToolbarOption } from "./rich-text-
 import "./rich-text-editor/index.cjs";
 import { Select, SelectOption } from "./Select.cjs";
 import { Slider, SliderProps } from "./Slider.cjs";
-import { Spinner, SpinnerProps } from "./spinner/spinner.cjs";
-import "./spinner/index.cjs";
 import { TagsInput, TagsInputProps } from "./tags-input.cjs";
 import { ThemeProvider, ThemeProviderProps } from "./theme-provider/ThemeProvider.cjs";
 import { useTheme } from "./theme-provider/index.cjs";
@@ -38,4 +43,4 @@ import { ThemeToggle } from "./ThemeToggle.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, Button, ButtonLoaderProps, ButtonProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, 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, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, RichTextEditor, RichTextEditorProps, Select, SelectOption, SingleFileUploadProps, Slider, SliderProps, Spinner, SpinnerProps, TagsInput, TagsInputProps, ThemeProvider, ThemeProviderProps, ThemeToggle, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, 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, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, RichTextEditor, RichTextEditorProps, Select, SelectOption, SingleFileUploadProps, Slider, SliderProps, TagsInput, TagsInputProps, ThemeProvider, ThemeProviderProps, ThemeToggle, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useTheme };

package/dist/index.d.ts

@@ -6,6 +6,8 @@ import { Alert, AlertBaseProps, AlertProps, AlertVariant } from "./Alert.js";
 import { AvatarUpload, AvatarUploadProps } from "./avatar-upload/AvatarUpload.js";
 import "./avatar-upload/index.js";
 import { Button, ButtonLoaderProps, ButtonProps } from "./Button.js";
+import { CircleLoader, CircleLoaderProps } from "./circle-loader/circle-loader.js";
+import "./circle-loader/index.js";
 import { CloseButtonRounded, CloseButtonRoundedProps } from "./CloseButtonRounded.js";
 import { CloseButtonAbsolute, PopoverCloseButtonProps } from "./CloseButtonAbsolute.js";
 import { Combobox } from "./Combobox.js";
@@ -23,6 +25,11 @@ import "./hooks/index.js";
 import { IconProvider, IconProviderLoader, IconProviderProps } from "./icon-selector/types.js";
 import { IconPicker, IconPickerProps, IconPickerVariant } from "./icon-selector/IconPicker.js";
 import "./icon-selector/index.js";
+import { Layout, LayoutProps } from "./layout/Layout.js";
+import { LayoutFooter, LayoutFooterProps } from "./layout/LayoutFooter.js";
+import { LayoutHeader, LayoutHeaderProps } from "./layout/LayoutHeader.js";
+import { LayoutMain, LayoutMainProps } from "./layout/LayoutMain.js";
+import "./layout/index.js";
 import { LoaderProps, LoadingOverlay } from "./LoadingOverlay.js";
 import { Pagination, PaginationProps } from "./pagination/Pagination.js";
 import "./pagination/index.js";
@@ -30,8 +37,6 @@ import { RichTextEditor, RichTextEditorProps, ToolbarOption } from "./rich-text-
 import "./rich-text-editor/index.js";
 import { Select, SelectOption } from "./Select.js";
 import { Slider, SliderProps } from "./Slider.js";
-import { Spinner, SpinnerProps } from "./spinner/spinner.js";
-import "./spinner/index.js";
 import { TagsInput, TagsInputProps } from "./tags-input.js";
 import { ThemeProvider, ThemeProviderProps } from "./theme-provider/ThemeProvider.js";
 import { useTheme } from "./theme-provider/index.js";
@@ -39,4 +44,4 @@ import { ThemeToggle } from "./ThemeToggle.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, Button, ButtonLoaderProps, ButtonProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, 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, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, RichTextEditor, RichTextEditorProps, Select, SelectOption, SingleFileUploadProps, Slider, SliderProps, Spinner, SpinnerProps, TagsInput, TagsInputProps, ThemeProvider, ThemeProviderProps, ThemeToggle, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, 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, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, RichTextEditor, RichTextEditorProps, Select, SelectOption, SingleFileUploadProps, Slider, SliderProps, TagsInput, TagsInputProps, ThemeProvider, ThemeProviderProps, ThemeToggle, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useTheme };

package/dist/index.js

@@ -5,6 +5,8 @@ import { Alert } from "./Alert.js";
 import { AvatarUpload } from "./avatar-upload/AvatarUpload.js";
 import "./avatar-upload/index.js";
 import { Button } from "./Button.js";
+import { CircleLoader } from "./circle-loader/circle-loader.js";
+import "./circle-loader/index.js";
 import { CloseButtonRounded } from "./CloseButtonRounded.js";
 import { CloseButtonAbsolute } from "./CloseButtonAbsolute.js";
 import { Combobox } from "./Combobox.js";
@@ -20,14 +22,17 @@ import "./hooks/index.js";
 import { LoadingOverlay } from "./LoadingOverlay.js";
 import { IconPicker } from "./icon-selector/IconPicker.js";
 import "./icon-selector/index.js";
+import { Layout } from "./layout/Layout.js";
+import { LayoutFooter } from "./layout/LayoutFooter.js";
+import { LayoutHeader } from "./layout/LayoutHeader.js";
+import { LayoutMain } from "./layout/LayoutMain.js";
+import "./layout/index.js";
 import { Pagination } from "./pagination/Pagination.js";
 import "./pagination/index.js";
 import { RichTextEditor } from "./rich-text-editor/RichTextEditor.js";
 import "./rich-text-editor/index.js";
 import { Select } from "./Select.js";
 import { Slider } from "./Slider.js";
-import { Spinner } from "./spinner/spinner.js";
-import "./spinner/index.js";
 import { TagsInput } from "./tags-input.js";
 import { ThemeProvider } from "./theme-provider/ThemeProvider.js";
 import { useTheme } from "./theme-provider/index.js";
@@ -36,4 +41,4 @@ import { DEFAULT_ALERT_DURATION, toast, toastError, toastInfo, toastSuccess, toa
 import "./toast/index.js";
 import { cn } from "@pixpilot/shadcn";
 
-export { AbsoluteFill, Alert, AvatarUpload, Button, CloseButtonAbsolute, CloseButtonRounded, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DialogProvider, FileUpload, FileUploadInline, IconPicker, LoadingOverlay, Pagination, RichTextEditor, Select, Slider, Spinner, TagsInput, ThemeProvider, ThemeToggle, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useTheme };
+export { AbsoluteFill, Alert, AvatarUpload, Button, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DialogProvider, FileUpload, FileUploadInline, IconPicker, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, RichTextEditor, Select, Slider, TagsInput, ThemeProvider, ThemeToggle, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useTheme };

package/dist/layout/Layout.cjs

@@ -0,0 +1,20 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+let __pixpilot_shadcn = require("@pixpilot/shadcn");
+__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+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/layout/Layout.tsx
+const Layout = react.default.forwardRef(({ className,...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		ref,
+		className: (0, __pixpilot_shadcn.cn)("flex w-full flex-col overflow-hidden", "h-dvh", "max-h-full", className),
+		...props
+	});
+});
+Layout.displayName = "Layout";
+
+//#endregion
+exports.Layout = Layout;

package/dist/layout/Layout.d.cts

@@ -0,0 +1,7 @@
+import React from "react";
+
+//#region src/layout/Layout.d.ts
+interface LayoutProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare const Layout: React.ForwardRefExoticComponent<LayoutProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { Layout, LayoutProps };

package/dist/layout/Layout.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+
+//#region src/layout/Layout.d.ts
+interface LayoutProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare const Layout: React.ForwardRefExoticComponent<LayoutProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { Layout, LayoutProps };

package/dist/layout/Layout.js

@@ -0,0 +1,16 @@
+import { cn } from "@pixpilot/shadcn";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/layout/Layout.tsx
+const Layout = React.forwardRef(({ className,...props }, ref) => {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cn("flex w-full flex-col overflow-hidden", "h-dvh", "max-h-full", className),
+		...props
+	});
+});
+Layout.displayName = "Layout";
+
+//#endregion
+export { Layout };

package/dist/layout/LayoutFooter.cjs

@@ -0,0 +1,18 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+let __pixpilot_shadcn = require("@pixpilot/shadcn");
+__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+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/layout/LayoutFooter.tsx
+const LayoutFooter = react.default.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	...props,
+	className: (0, __pixpilot_shadcn.cn)(className),
+	ref
+}));
+LayoutFooter.displayName = "LayoutFooter";
+
+//#endregion
+exports.LayoutFooter = LayoutFooter;

package/dist/layout/LayoutFooter.d.cts

@@ -0,0 +1,7 @@
+import React from "react";
+
+//#region src/layout/LayoutFooter.d.ts
+interface LayoutFooterProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare const LayoutFooter: React.ForwardRefExoticComponent<LayoutFooterProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { LayoutFooter, LayoutFooterProps };

package/dist/layout/LayoutFooter.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+
+//#region src/layout/LayoutFooter.d.ts
+interface LayoutFooterProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare const LayoutFooter: React.ForwardRefExoticComponent<LayoutFooterProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { LayoutFooter, LayoutFooterProps };

package/dist/layout/LayoutFooter.js

@@ -0,0 +1,14 @@
+import { cn } from "@pixpilot/shadcn";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/layout/LayoutFooter.tsx
+const LayoutFooter = React.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
+	...props,
+	className: cn(className),
+	ref
+}));
+LayoutFooter.displayName = "LayoutFooter";
+
+//#endregion
+export { LayoutFooter };

package/dist/layout/LayoutHeader.cjs

@@ -0,0 +1,18 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+let __pixpilot_shadcn = require("@pixpilot/shadcn");
+__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+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/layout/LayoutHeader.tsx
+const LayoutHeader = react.default.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	...props,
+	className: (0, __pixpilot_shadcn.cn)(className),
+	ref
+}));
+LayoutHeader.displayName = "LayoutHeader";
+
+//#endregion
+exports.LayoutHeader = LayoutHeader;

package/dist/layout/LayoutHeader.d.cts

@@ -0,0 +1,7 @@
+import React from "react";
+
+//#region src/layout/LayoutHeader.d.ts
+interface LayoutHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare const LayoutHeader: React.ForwardRefExoticComponent<LayoutHeaderProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { LayoutHeader, LayoutHeaderProps };

package/dist/layout/LayoutHeader.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+
+//#region src/layout/LayoutHeader.d.ts
+interface LayoutHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare const LayoutHeader: React.ForwardRefExoticComponent<LayoutHeaderProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { LayoutHeader, LayoutHeaderProps };

package/dist/layout/LayoutHeader.js

@@ -0,0 +1,14 @@
+import { cn } from "@pixpilot/shadcn";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/layout/LayoutHeader.tsx
+const LayoutHeader = React.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
+	...props,
+	className: cn(className),
+	ref
+}));
+LayoutHeader.displayName = "LayoutHeader";
+
+//#endregion
+export { LayoutHeader };

package/dist/layout/LayoutMain.cjs

@@ -0,0 +1,20 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+let __pixpilot_shadcn = require("@pixpilot/shadcn");
+__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+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/layout/LayoutMain.tsx
+const LayoutMain = react.default.forwardRef(({ autoScroll = true, className,...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("main", {
+		ref,
+		className: (0, __pixpilot_shadcn.cn)("flex-1", { "overflow-auto": autoScroll }, className),
+		...props
+	});
+});
+LayoutMain.displayName = "LayoutMain";
+
+//#endregion
+exports.LayoutMain = LayoutMain;

package/dist/layout/LayoutMain.d.cts

@@ -0,0 +1,9 @@
+import React from "react";
+
+//#region src/layout/LayoutMain.d.ts
+interface LayoutMainProps extends React.HTMLAttributes<HTMLElement> {
+  autoScroll?: boolean;
+}
+declare const LayoutMain: React.ForwardRefExoticComponent<LayoutMainProps & React.RefAttributes<HTMLElement>>;
+//#endregion
+export { LayoutMain, LayoutMainProps };

package/dist/layout/LayoutMain.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+
+//#region src/layout/LayoutMain.d.ts
+interface LayoutMainProps extends React.HTMLAttributes<HTMLElement> {
+  autoScroll?: boolean;
+}
+declare const LayoutMain: React.ForwardRefExoticComponent<LayoutMainProps & React.RefAttributes<HTMLElement>>;
+//#endregion
+export { LayoutMain, LayoutMainProps };

package/dist/layout/LayoutMain.js

@@ -0,0 +1,16 @@
+import { cn } from "@pixpilot/shadcn";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/layout/LayoutMain.tsx
+const LayoutMain = React.forwardRef(({ autoScroll = true, className,...props }, ref) => {
+	return /* @__PURE__ */ jsx("main", {
+		ref,
+		className: cn("flex-1", { "overflow-auto": autoScroll }, className),
+		...props
+	});
+});
+LayoutMain.displayName = "LayoutMain";
+
+//#endregion
+export { LayoutMain };

package/dist/layout/index.cjs

@@ -0,0 +1,4 @@
+const require_Layout = require('./Layout.cjs');
+const require_LayoutFooter = require('./LayoutFooter.cjs');
+const require_LayoutHeader = require('./LayoutHeader.cjs');
+const require_LayoutMain = require('./LayoutMain.cjs');

package/dist/layout/index.d.cts

@@ -0,0 +1,4 @@
+import { Layout, LayoutProps } from "./Layout.cjs";
+import { LayoutFooter, LayoutFooterProps } from "./LayoutFooter.cjs";
+import { LayoutHeader, LayoutHeaderProps } from "./LayoutHeader.cjs";
+import { LayoutMain, LayoutMainProps } from "./LayoutMain.cjs";

package/dist/layout/index.d.ts

@@ -0,0 +1,4 @@
+import { Layout, LayoutProps } from "./Layout.js";
+import { LayoutFooter, LayoutFooterProps } from "./LayoutFooter.js";
+import { LayoutHeader, LayoutHeaderProps } from "./LayoutHeader.js";
+import { LayoutMain, LayoutMainProps } from "./LayoutMain.js";

package/dist/layout/index.js

@@ -0,0 +1,4 @@
+import { Layout } from "./Layout.js";
+import { LayoutFooter } from "./LayoutFooter.js";
+import { LayoutHeader } from "./LayoutHeader.js";
+import { LayoutMain } from "./LayoutMain.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pixpilot/shadcn-ui",
   "type": "module",
-  "version": "0.6.0",
+  "version": "0.8.0",
   "description": "Custom UI components and utilities built with shadcn/ui.",
   "author": "m.doaie <m.doaie@hotmail.com>",
   "license": "MIT",

package/dist/spinner/index.cjs

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

package/dist/spinner/index.d.cts

@@ -1 +0,0 @@
-import { Spinner, SpinnerProps } from "./spinner.cjs";

package/dist/spinner/index.d.ts

@@ -1 +0,0 @@
-import { Spinner, SpinnerProps } from "./spinner.js";

package/dist/spinner/index.js

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