@pixpilot/shadcn-ui 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 pixpilot
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,3 @@
+# @pixpilot/shadcn-ui
+
+## Usage Add usage instructions here.

package/dist/index-B2C9gOoj.d.ts

@@ -0,0 +1,477 @@
+import { Button as Button$1, Calendar, Card, Command, FileUploadProps, PopoverContent as PopoverContent$1, Select as Select$1, Slider as Slider$1, Tooltip, buttonVariants, cn } from "@pixpilot/shadcn";
+import React$1, { ComponentProps, ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import "@ebay/nice-modal-react";
+import { ThemeProvider as ThemeProvider$1, useTheme } from "next-themes";
+
+//#region src/AbsoluteFill.d.ts
+/**
+ * Stretched element to enable tooltips on disabled buttons
+ * When a button is disabled, tooltips don't work by default.
+ * This element is positioned absolutely over the button to capture events.
+ */
+declare function AbsoluteFill(props: React$1.HTMLAttributes<HTMLDivElement> & {
+  ref?: React$1.Ref<HTMLDivElement>;
+}): react_jsx_runtime0.JSX.Element;
+declare namespace AbsoluteFill {
+  var displayName: string;
+}
+//#endregion
+//#region src/Alert.d.ts
+type AlertVariant = 'error' | 'info' | 'warning' | 'success' | 'default';
+interface AlertBaseProps {
+  variant?: AlertVariant;
+  description?: string;
+  duration?: number;
+  title?: string;
+  className?: string;
+  icon?: React$1.JSX.Element | boolean;
+}
+interface AlertProps extends React$1.HTMLAttributes<HTMLDivElement>, AlertBaseProps {}
+declare const Alert: React$1.FC<AlertProps>;
+//#endregion
+//#region src/Button.d.ts
+interface ButtonLoaderProps {
+  /**
+   * Position of the loader relative to button content
+   * @default 'end'
+   */
+  placement?: 'start' | 'end' | 'center';
+}
+interface ButtonProps extends React$1.ComponentProps<typeof Button$1>, VariantProps<typeof buttonVariants> {
+  /**
+   * Tooltip message to show when button is disabled
+   */
+  disabledTooltip?: string;
+  /**
+   * Regular tooltip message
+   */
+  tooltip?: string;
+  /**
+   * Loading state
+   */
+  loading?: boolean;
+  /**
+   * Loader configuration
+   */
+  LoaderProps?: ButtonLoaderProps;
+  /**
+   * Click handler for when disabled button is clicked
+   */
+  onDisabledClick?: (e: React$1.MouseEvent<HTMLDivElement>) => void;
+  /**
+   * Props to pass to the tooltip component
+   */
+  TooltipProps?: Omit<React$1.ComponentProps<typeof Tooltip>, 'children' | 'delayDuration'>;
+}
+declare function Button(props: ButtonProps & {
+  ref?: React$1.Ref<HTMLButtonElement>;
+}): react_jsx_runtime0.JSX.Element;
+declare namespace Button {
+  var displayName: string;
+}
+//#endregion
+//#region src/CloseButtonRounded.d.ts
+interface CloseButtonRoundedProps extends React$1.ComponentProps<typeof Button$1> {}
+declare const CloseButtonRounded: React$1.FC<CloseButtonRoundedProps>;
+//#endregion
+//#region src/CloseButtonAbsolute.d.ts
+interface PopoverCloseButtonProps extends React$1.ComponentProps<typeof CloseButtonRounded> {}
+declare const CloseButtonAbsolute: React$1.FC<PopoverCloseButtonProps>;
+//#endregion
+//#region src/CommandOptionList.d.ts
+interface CommandOptionListItem {
+  value: string;
+  label: string;
+}
+interface CommandOptionListProps {
+  emptyText?: string;
+  options: CommandOptionListItem[];
+  value?: unknown;
+  onChange?: (value: any) => void;
+}
+declare const CommandOptionList: React.FC<CommandOptionListProps>;
+//#endregion
+//#region src/Combobox.d.ts
+type ComboboxProps = {
+  value?: string;
+  onChange?: (value: string) => void;
+  options?: CommandOptionListItem[];
+  placeholder?: string;
+  searchPlaceholder?: string;
+  emptyText?: string;
+} & Omit<ComponentProps<typeof Command>, 'value' | 'onValueChange'>;
+declare const Combobox: React$1.FC<ComboboxProps>;
+//#endregion
+//#region src/confirmation-dialog/ConfirmationDialog.d.ts
+interface ConfirmationDialogProps {
+  title: string;
+  description?: string;
+  confirmText?: string;
+  cancelText?: string;
+  onConfirm?: () => void;
+  onCancel?: () => void;
+}
+//#endregion
+//#region src/confirmation-dialog/confirmation-dialogs.d.ts
+interface ConfirmDialog extends ConfirmationDialogProps {}
+declare function showConfirmDialog(props: ConfirmDialog): Promise<boolean>;
+//#endregion
+//#region src/confirmation-dialog/DialogProvider.d.ts
+interface DialogProviderProps {
+  children?: React$1.ReactNode;
+}
+declare const DialogProvider: React$1.FC<DialogProviderProps>;
+//#endregion
+//#region src/ContentCard.d.ts
+interface SectionCardProps extends React$1.ComponentProps<typeof Card> {
+  title?: string;
+  children: ReactNode;
+  marginBottom?: boolean;
+}
+declare function ContentCard(props: SectionCardProps): react_jsx_runtime0.JSX.Element;
+declare namespace ContentCard {
+  var displayName: string;
+}
+//#endregion
+//#region src/DatePicker.d.ts
+type BaseDatePickerProps = {
+  value?: Date;
+  onChange?: (date: Date | undefined) => void;
+  placeholder?: string;
+} & Omit<ComponentProps<typeof Calendar>, 'selected' | 'onSelect' | 'mode'>;
+declare function DatePicker(props: BaseDatePickerProps): react_jsx_runtime0.JSX.Element;
+declare namespace DatePicker {
+  var displayName: string;
+}
+//#endregion
+//#region src/FileUploadInline.d.ts
+interface FileUploadInlineProps extends Omit<FileUploadProps, 'value'> {
+  /**
+   * The current file value (single file or array)
+   */
+  value?: File | File[] | null;
+  /**
+   * Callback when file changes
+   */
+  onChange?: (file: File | File[] | null) => void;
+  /**
+   * Button text when no file is selected
+   */
+  buttonText?: string;
+  /**
+   * Show file icon
+   */
+  showIcon?: boolean;
+  /**
+   * Whether to show a clear button when a file is selected
+   */
+  showClear?: boolean;
+  /**
+   * Custom class name for the container
+   */
+  className?: string;
+  /**
+   * Accepted file types
+   */
+  accept?: string;
+  /**
+   * Whether the input is disabled
+   */
+  disabled?: boolean;
+  /**
+   * Maximum file size in bytes
+   */
+  maxSize?: number;
+  /**
+   * Maximum number of files (for multiple uploads)
+   */
+  maxFiles?: number;
+  /**
+   * Allow multiple file selection
+   */
+  multiple?: boolean;
+}
+/**
+ * FileUploadInline - An inline file upload component using FileUpload primitives
+ *
+ * Features:
+ * - Shows a "Browse file" or custom button text
+ * - Displays selected filename with truncation
+ * - Uses FileUpload component primitives for proper file handling
+ * - Clean inline design
+ */
+declare function FileUploadInline({
+  value,
+  onChange,
+  buttonText,
+  showIcon,
+  showClear,
+  className,
+  accept,
+  disabled,
+  maxSize,
+  maxFiles,
+  multiple,
+  ...rest
+}: FileUploadInlineProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/Loader.d.ts
+interface LoaderProps {
+  backdrop?: boolean;
+  /**
+   * Position of the loader
+   * @default 'center'
+   */
+  placement?: 'top' | 'bottom' | 'center';
+  loading: boolean;
+  message?: string;
+  /**
+   * Delay in milliseconds before showing the loader
+   * @default 300
+   */
+  delay?: number;
+}
+declare const Loader: React$1.FC<LoaderProps>;
+//#endregion
+//#region src/Pagination/Pagination.d.ts
+interface PaginationProps {
+  /**
+   * Current page number (1-indexed)
+   */
+  page: number;
+  /**
+   * Total number of pages
+   */
+  totalPages: number;
+  /**
+   * Callback when page changes
+   */
+  onPageChange: (event: React$1.ChangeEvent<unknown>, page: number) => void;
+  /**
+   * Maximum number of page numbers to display (excluding ellipsis)
+   * For example, with maxVisiblePages=4 and 10 total pages:
+   * - Page 1: <1 2 3 ... 10>
+   * - Page 5: <1 ... 5 ... 10>
+   * - Page 10: <1 ... 8 9 10>
+   * Set to 0 to hide page numbers entirely (only show prev/next buttons)
+   *
+   * @default 4
+   */
+  maxVisiblePages?: number;
+  /**
+   * Display variant:
+   * - 'full': Shows page numbers with prev/next (e.g., < 1 2 3 ... 10 >)
+   * - 'simple': Only shows prev/next buttons (e.g., < >)
+   * - 'compact': Shows page indicator with all nav buttons (e.g., << < 2/10 > >>)
+   *
+   * @default 'full'
+   */
+  variant?: 'full' | 'simple' | 'compact';
+  /**
+   * Size of the pagination component
+   * @default 'medium'
+   */
+  size?: 'small' | 'medium' | 'large';
+  /**
+   * Whether to show first/last page buttons
+   * @default true
+   */
+  showFirstLastButtons?: boolean;
+  /**
+   * Whether to show page info text (e.g., "Page 1 of 10")
+   * Only used with 'simple' variant
+   * @default false
+   */
+  showPageInfo?: boolean;
+  className?: string;
+}
+/**
+ * Reusable pagination component with configurable page number display.
+ *
+ * @example
+ * // Full variant - default with page numbers
+ * <Pagination
+ *   page={currentPage}
+ *   totalPages={totalPages}
+ *   onPageChange={handlePageChange}
+ *   variant="full"
+ * />
+ *
+ * @example
+ * // Compact variant - page indicator with first/prev/next/last buttons
+ * <Pagination
+ *   page={currentPage}
+ *   totalPages={totalPages}
+ *   onPageChange={handlePageChange}
+ *   variant="compact"
+ * />
+ *
+ * @example
+ * // Simple variant - only prev/next buttons
+ * <Pagination
+ *   page={currentPage}
+ *   totalPages={totalPages}
+ *   onPageChange={handlePageChange}
+ *   variant="simple"
+ *   showPageInfo={true}
+ * />
+ */
+declare const Pagination: React$1.FC<PaginationProps>;
+//#endregion
+//#region src/PopoverContent.d.ts
+interface PopoverContentProps extends React$1.ComponentProps<typeof PopoverContent$1> {}
+declare const PopoverContent: React$1.FC<PopoverContentProps>;
+//#endregion
+//#region src/Select.d.ts
+interface Option {
+  value: string | number;
+  label: string;
+}
+type BaseSelectProps = {
+  options?: Option[];
+  value?: string;
+  onChange?: (value: string) => void;
+  placeholder?: string;
+} & Omit<ComponentProps<typeof Select$1>, 'value' | 'onValueChange' | 'children'>;
+declare function Select(props: BaseSelectProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/Slider.d.ts
+interface SliderProps extends React$1.ComponentProps<typeof Slider$1> {}
+declare const Slider: React$1.FC<SliderProps>;
+//#endregion
+//#region src/spinner/spinner.d.ts
+declare const SpinnerSize: {
+  readonly sm: 24;
+  readonly md: 40;
+  readonly lg: 64;
+  readonly xl: 96;
+};
+type SpinnerSizeKey = keyof typeof SpinnerSize;
+interface SpinnerProps {
+  /**
+   * Size of the spinner - can be a preset ('sm', 'md', 'lg', 'xl') or a number in pixels
+   * @default 'md' (40px)
+   */
+  size?: SpinnerSizeKey | number;
+  /**
+   * Width of the spinner stroke in pixels
+   * If not provided, automatically calculated as 10% of size (minimum 2px)
+   * @default Auto-calculated based on size
+   */
+  strokeWidth?: number;
+  /**
+   * Duration of rotation animation in seconds
+   * @default 2
+   */
+  speed?: number;
+  /**
+   * Single color for the spinner
+   * Use 'currentColor' to inherit text color from parent (works with dark/light mode)
+   * @default 'currentColor'
+   */
+  color?: string;
+  /**
+   * Array of colors for color-changing animation
+   * If provided, overrides the color prop
+   */
+  colors?: string[];
+  /**
+   * Additional CSS class name
+   */
+  className?: string;
+}
+declare const Spinner: React$1.FC<SpinnerProps>;
+//#endregion
+//#region src/tags-input.d.ts
+interface TagsInputProps {
+  value?: Array<string | number>;
+  onChange?: (value: Array<string | number>) => void;
+  options?: CommandOptionListItem[];
+  freeSolo?: boolean;
+  placeholder?: string;
+  emptyText?: string;
+  className?: string;
+  disabled?: boolean;
+  readOnly?: boolean;
+  maxTags?: number;
+  allowDuplicates?: boolean;
+  editable?: boolean;
+  label?: string;
+  delimiter?: string;
+  addOnPaste?: boolean;
+  addOnTab?: boolean;
+  onValidate?: (value: string) => boolean;
+}
+/**
+ * TagsInput component - Inline tags input based on DiceUI
+ *
+ * This is a different implementation than TagsInput, using the DiceUI library
+ * for a more streamlined inline editing experience.
+ *
+ * Features:
+ * - Inline tag display and editing
+ * - Keyboard navigation (Arrow keys, Home, End, Delete, Backspace)
+ * - Optional tag editing (editable prop)
+ * - Validation support
+ * - Paste support with delimiter parsing
+ * - Max tags limit
+ * - Options support with dropdown (like Select)
+ * - freeSolo mode for custom tags (like MUI Autocomplete)
+ */
+declare function TagsInput({
+  value,
+  onChange,
+  options,
+  freeSolo,
+  placeholder,
+  emptyText,
+  className,
+  disabled,
+  readOnly,
+  maxTags,
+  allowDuplicates,
+  editable,
+  label,
+  delimiter,
+  addOnPaste,
+  addOnTab,
+  onValidate
+}: TagsInputProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/theme-provider/ThemeProvider.d.ts
+/**
+ * Note: In Chrome extensions, a flicker (Flash of Wrong Theme, or FOWT) may occur on page load
+ * during development mode. This is resolved in production builds where scripts are included
+ * in the HTML head to apply the theme before content renders. Do not attempt to fix this in dev.
+ */
+interface ThemeProviderProps extends ComponentProps<typeof ThemeProvider$1> {
+  children: React$1.ReactNode;
+}
+declare const ThemeProvider: React$1.FC<ThemeProviderProps>;
+//#endregion
+//#region src/ThemeToggle.d.ts
+declare function ThemeToggle(): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/toast/AlertToast.d.ts
+interface AlertToastProps extends AlertProps {
+  onClose?: () => void;
+}
+//#endregion
+//#region src/toast/toast.d.ts
+declare const DEFAULT_ALERT_DURATION = 10000;
+interface ToastProps extends AlertBaseProps {
+  duration?: number;
+}
+declare function toast(props: ToastProps): void;
+type ToastMessage = string | ({
+  title: string;
+  description: string;
+} & AlertToastProps);
+declare function toastInfo(message: ToastMessage, duration?: number): void;
+declare function toastSuccess(message: ToastMessage, duration?: number): void;
+declare function toastWarning(message: ToastMessage, duration?: number): void;
+declare function toastError(message: ToastMessage, duration?: number): void;
+//#endregion
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, Button, ButtonLoaderProps, ButtonProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, Combobox, CommandOptionList, CommandOptionListItem, CommandOptionListProps, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DialogProvider, DialogProviderProps, FileUploadInline, FileUploadInlineProps, Loader, LoaderProps, type Option, Pagination, PaginationProps, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, Select, Slider, SliderProps, Spinner, SpinnerProps, TagsInput, TagsInputProps, ThemeProvider, ThemeProviderProps, ThemeToggle, ToastMessage, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useTheme };