@yuno-payments/dashboard-design-system 2.9.5 → 3.0.0

package/dist/components/molecules/dots-menu/dots-menu.types.d.ts

@@ -1,72 +0,0 @@
-import { IconName } from '../icon';
-/**
- * Represents a single action in the dots menu
- */
-export interface DotsMenuAction {
-    /**
-     * Display name for the action
-     */
-    name?: string;
-    /**
-     * Unique identifier for the action
-     */
-    key: number | string;
-    /**
-     * Icon to display for the action
-     */
-    icon: IconName;
-    /**
-     * Whether the action is allowed (shows tooltip if false)
-     * @default true
-     */
-    allowed?: boolean;
-    /**
-     * Callback fired when the action is clicked
-     */
-    handleClick?: (options?: unknown) => void;
-}
-/**
- * Options configuration for the dots menu
- */
-export interface DotsMenuOptions {
-    /**
-     * Array of actions to display in the menu
-     */
-    actions?: DotsMenuAction[];
-    /**
-     * Additional data that can be passed to action handlers
-     */
-    [key: string]: unknown;
-}
-/**
- * Props for the DotsMenu component
- */
-export interface DotsMenuProps {
-    /**
-     * Configuration object containing actions and data
-     */
-    options: DotsMenuOptions;
-    /**
-     * Whether the menu trigger is disabled
-     * @default false
-     */
-    disabled?: boolean;
-    /**
-     * Custom icon for the menu trigger (null uses default dots)
-     * @default null
-     */
-    icon?: IconName | null;
-    /**
-     * Additional CSS classes
-     */
-    className?: string;
-    /**
-     * Whether to remove absolute positioning
-     * @default false
-     */
-    withoutAbsolute?: boolean;
-    /**
-     * Bottom margin in pixels
-     */
-    marginBottom?: number;
-}

package/dist/components/molecules/dots-menu/index.d.ts

@@ -1,2 +0,0 @@
-export { DotsMenu } from './dots-menu';
-export type { DotsMenuProps, DotsMenuAction, DotsMenuOptions, } from './dots-menu.types';

package/dist/components/molecules/empty/empty-icon.d.ts

@@ -1,19 +0,0 @@
-import { ReactNode } from 'react';
-import { IconProps } from '../../atoms/icon';
-/**
- * @deprecated Use the `media` prop of the `Empty` component directly instead.
- */
-export interface EmptyIconProps {
-    /** Icon name to display */
-    name: IconProps["name"];
-    /** Icon size */
-    size?: IconProps["size"];
-    /** Additional className for the icon */
-    className?: string;
-    /** Custom icon element (if you want to pass a custom icon instead of using name) */
-    children?: ReactNode;
-}
-/**
- * @deprecated Use the `media` prop of the `Empty` component directly instead.
- */
-export declare function EmptyIcon({ name, size, className, children, }: EmptyIconProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/molecules/empty/empty-icon.js

@@ -1,14 +0,0 @@
-import { j as o } from "../../../_virtual/jsx-runtime.js";
-import "react";
-import { Icon as t } from "../../atoms/icon/icon.js";
-function d({
-  name: r,
-  size: m = "xl",
-  className: n,
-  children: s
-}) {
-  return /* @__PURE__ */ o.jsx("div", { className: "p-4 bg-background rounded-lg shadow-sm", children: s || /* @__PURE__ */ o.jsx(t, { name: r, size: m, className: n }) });
-}
-export {
-  d as EmptyIcon
-};

package/dist/components/molecules/empty/empty.d.ts

@@ -1,36 +0,0 @@
-import { HTMLAttributes, ReactNode } from 'react';
-export interface EmptyProps extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * Media content to display (image, icon, or any ReactNode)
-     * @default ThemedImage with table illustrations (light/dark)
-     * Pass `null` to hide the media content
-     */
-    media?: ReactNode | null;
-    /**
-     * Title text displayed prominently
-     */
-    title: string;
-    /**
-     * Optional description text displayed below the title
-     */
-    description?: string;
-    /**
-     * Optional actions (buttons, links, or any ReactNode) displayed below the description
-     */
-    actions?: ReactNode;
-}
-/**
- * Empty state component for displaying when there's no content or data.
- * Shows an optional image/icon, title, description, and action buttons.
- *
- * @example
- * ```tsx
- * <Empty
- *   title="No results found"
- *   description="Try adjusting your search or filter criteria"
- *   actions={<Button>Clear filters</Button>}
- * />
- * ```
- */
-declare const Empty: import('react').ForwardRefExoticComponent<EmptyProps & import('react').RefAttributes<HTMLDivElement>>;
-export { Empty };

package/dist/components/molecules/empty/empty.js

@@ -1,49 +0,0 @@
-import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as i } from "react";
-import { cn as d } from "../../../lib/utils.js";
-import { Typography as r } from "../../atoms/typography/typography.js";
-import { ThemedImage as p } from "../../atoms/themed-image/themed-image.js";
-const x = "https://dashboard-assets.y.uno/common/empty-states/empty_illustration_tables.svg", f = "https://dashboard-assets.y.uno/common/empty-states/empty_illustration_tables_dark.svg", h = i(
-  ({ className: m, media: s, title: o, description: t, actions: a, ...n }, c) => {
-    const l = s === void 0 ? /* @__PURE__ */ e.jsx(
-      p,
-      {
-        lightSrc: x,
-        darkSrc: f,
-        alt: ""
-      }
-    ) : s;
-    return /* @__PURE__ */ e.jsxs(
-      "div",
-      {
-        ref: c,
-        className: d(
-          "flex flex-col items-center gap-6 bg-secondary px-6 py-12 rounded-lg w-full",
-          m
-        ),
-        ...n,
-        children: [
-          l && /* @__PURE__ */ e.jsx("div", { className: "flex-shrink-0", children: l }),
-          /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-6 items-center w-full", children: [
-            /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2 items-center w-full", children: [
-              /* @__PURE__ */ e.jsx(
-                r,
-                {
-                  as: "h3",
-                  className: "text-base font-semibold text-center leading-none",
-                  children: o
-                }
-              ),
-              t && /* @__PURE__ */ e.jsx(r, { variant: "muted", className: "text-center", children: t })
-            ] }),
-            a && /* @__PURE__ */ e.jsx("div", { className: "flex gap-3 items-center justify-center", children: a })
-          ] })
-        ]
-      }
-    );
-  }
-);
-h.displayName = "Empty";
-export {
-  h as Empty
-};

package/dist/components/molecules/empty/index.d.ts

@@ -1,2 +0,0 @@
-export { Empty, type EmptyProps } from './empty';
-export { EmptyIcon, type EmptyIconProps } from './empty-icon';

package/dist/components/molecules/field/field.d.ts

@@ -1,91 +0,0 @@
-import { ComponentProps, InputHTMLAttributes, ReactNode } from 'react';
-import { ButtonProps } from '../../atoms/button';
-import { Icon, IconName } from '../../atoms/icon';
-/**
- * Props for the Field component
- */
-export interface FieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "className"> {
-    /**
-     * Label text displayed above the input
-     */
-    label?: string;
-    /**
-     * Helper text displayed below the input
-     */
-    description?: string;
-    /**
-     * Error message displayed below the input (overrides description)
-     */
-    error?: string;
-    /**
-     * Info content displayed in a tooltip next to the label
-     */
-    info?: ReactNode;
-    /**
-     * Indicator to show at the right of the label.
-     * - Pass `true` to automatically show "required" or "optional" based on the `required` prop
-     * - Pass a custom string to display that text instead
-     */
-    requiredIndicator?: boolean | string;
-    /**
-     * Optional button to display next to the input
-     */
-    button?: ButtonProps;
-    /**
-     * Icon to display at the start (left side) of the input
-     */
-    startIcon?: IconName;
-    /**
-     * Additional props to pass to the start icon
-     */
-    startIconProps?: ComponentProps<typeof Icon>;
-    /**
-     * Icon to display at the end (right side) of the input
-     */
-    endIcon?: IconName;
-    /**
-     * Additional props to pass to the end icon
-     */
-    endIconProps?: Partial<ComponentProps<typeof Icon>>;
-    /**
-     * Layout orientation of the label and input
-     * @default "vertical"
-     */
-    orientation?: "vertical" | "horizontal" | "responsive";
-    /**
-     * Additional CSS classes for the field container
-     */
-    className?: string;
-    /**
-     * Additional props to pass to the input element
-     */
-    inputProps?: InputHTMLAttributes<HTMLInputElement>;
-}
-/**
- * Form field component with label, description, error handling, and icon support.
- *
- * @example
- * ```tsx
- * <Field
- *   label="Email"
- *   placeholder="Enter your email"
- *   startIcon="Envelope"
- *   description="We'll never share your email"
- *   info="Your email will be used for account recovery"
- *   required
- *   requiredIndicator
- * />
- * <Field
- *   label="Phone"
- *   placeholder="Enter your phone"
- *   requiredIndicator
- * />
- * <Field
- *   label="Username"
- *   placeholder="Choose a username"
- *   requiredIndicator="Recommended"
- * />
- * ```
- */
-declare const Field: import('react').ForwardRefExoticComponent<FieldProps & import('react').RefAttributes<HTMLInputElement>>;
-export { Field };

package/dist/components/molecules/field/field.js

@@ -1,106 +0,0 @@
-import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as b, useId as w } from "react";
-import { InputGroup as y, InputGroupAddon as h, InputGroupInput as z } from "../../../vendor/shadcn/input-group.js";
-import { cn as l } from "../../../lib/utils.js";
-import { Button as B } from "../../atoms/button/button.js";
-import { Icon as N } from "../../atoms/icon/icon.js";
-import { Field as R, FieldDescription as A, FieldError as D } from "../../../vendor/shadcn/field.js";
-import { Label as I } from "../../atoms/label/label.js";
-const L = b(
-  ({
-    className: v,
-    orientation: g = "vertical",
-    label: c,
-    description: a,
-    error: s,
-    info: o,
-    requiredIndicator: x,
-    required: f,
-    id: F,
-    button: u,
-    disabled: r,
-    startIcon: j,
-    startIconProps: d,
-    endIcon: p,
-    endIconProps: m,
-    inputProps: t,
-    ...$
-  }, E) => {
-    const G = w(), i = F || t?.id || G, n = !!s;
-    return /* @__PURE__ */ e.jsxs(
-      R,
-      {
-        orientation: g,
-        "data-invalid": n,
-        className: l("w-full", v),
-        children: [
-          (c || o || x) && /* @__PURE__ */ e.jsx(
-            I,
-            {
-              htmlFor: i,
-              info: o,
-              requiredIndicator: x,
-              required: f,
-              disabled: r,
-              children: c
-            }
-          ),
-          /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
-            /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2 items-center", children: [
-              /* @__PURE__ */ e.jsxs(y, { className: "flex-1", children: [
-                j && /* @__PURE__ */ e.jsx(h, { align: "inline-start", children: /* @__PURE__ */ e.jsx(
-                  N,
-                  {
-                    name: d?.name || j,
-                    size: "sm",
-                    ...d,
-                    className: l(
-                      "cursor-default text-muted-foreground",
-                      d?.className
-                    )
-                  }
-                ) }),
-                /* @__PURE__ */ e.jsx(
-                  z,
-                  {
-                    ref: E,
-                    disabled: r,
-                    required: f,
-                    className: l(
-                      n && "border-destructive focus-visible:border-destructive",
-                      t?.className
-                    ),
-                    "aria-invalid": n ? !0 : void 0,
-                    "aria-describedby": a || s ? `${i}-description` : void 0,
-                    ...$,
-                    ...t,
-                    id: i
-                  }
-                ),
-                p && /* @__PURE__ */ e.jsx(h, { align: "inline-end", children: /* @__PURE__ */ e.jsx(
-                  N,
-                  {
-                    name: m?.name || p,
-                    size: "sm",
-                    ...m,
-                    className: l(
-                      "cursor-default text-muted-foreground",
-                      m?.className
-                    )
-                  }
-                ) })
-              ] }),
-              u && /* @__PURE__ */ e.jsx(B, { disabled: r, ...u })
-            ] }),
-            a && !s && /* @__PURE__ */ e.jsx(A, { id: `${i}-description`, children: a }),
-            s && /* @__PURE__ */ e.jsx(D, { id: `${i}-description`, children: s })
-          ] })
-        ]
-      }
-    );
-  }
-);
-L.displayName = "Field";
-export {
-  L as Field
-};

package/dist/components/molecules/field/index.d.ts

@@ -1 +0,0 @@
-export { Field, type FieldProps } from './field';

package/dist/components/molecules/file-upload/file-upload.d.ts

@@ -1,87 +0,0 @@
-import { ReactNode } from 'react';
-/**
- * Represents a file in the upload list with its metadata and upload status.
- */
-export interface UploadFile {
-    /** Unique identifier for the file entry */
-    id: string;
-    /** The native File object (optional if representing a pre-existing remote file) */
-    file?: File;
-    /** Display name of the file */
-    name: string;
-    /** File size in bytes */
-    size: number;
-    /** Upload progress from 0-100. When 100 or undefined, file is considered "Uploaded" */
-    progress?: number;
-    /** Upload status. If omitted, derived from progress: 0-99 = "uploading", 100/undefined = "uploaded" */
-    status?: "uploading" | "uploaded" | "error";
-    /** Optional error message when status is "error" */
-    errorMessage?: string;
-}
-/**
- * Props for the FileUpload component
- */
-export interface FileUploadProps {
-    /** Array of upload file objects (controlled) */
-    value?: UploadFile[];
-    /** Callback when new files are added (via drop or click). Provides the newly added native File objects */
-    onFilesAdded?: (files: File[]) => void;
-    /** Callback to remove a file by id */
-    onRemove?: (fileId: string) => void;
-    /** Accepted file extensions (e.g., ".pdf,.docx,.txt,.csv"). Used for validation AND to auto-generate the "Supports: ..." text */
-    accept?: string;
-    /** Maximum file size in bytes (e.g., 10485760 for 10MB). Used for validation AND to auto-generate the "X MB max file size." text */
-    maxSize?: number;
-    /** Maximum number of files allowed */
-    maxFiles?: number;
-    /** Allow multiple file selection @default true */
-    multiple?: boolean;
-    /** Label text displayed above the dropzone */
-    label?: string;
-    /** Info content displayed in a tooltip next to the label */
-    info?: ReactNode;
-    /** Indicator to show at the right of the label */
-    requiredIndicator?: boolean | string;
-    /** Whether the field is required */
-    required?: boolean;
-    /** Whether the component is disabled */
-    disabled?: boolean;
-    /** Error message displayed below the component */
-    error?: string;
-    /** Additional CSS classes for the root container */
-    className?: string;
-    /** Custom text for the dropzone. "Select" is always prepended with link styling. @default "a file or drag it here" */
-    dropzoneText?: string;
-    /** Image URL displayed in the dropzone above the text @default "https://dashboard-assets.y.uno/batch-refunds/upload_media.png" */
-    image?: string;
-}
-/**
- * File upload component with drag & drop support and integrated file list.
- *
- * Includes a dropzone area for selecting/dropping files and an integrated list
- * showing upload progress or completion status for each file. The consumer only
- * needs to render `<FileUpload />` -- no separate file list component required.
- *
- * Helper texts ("Supports: PDF, DOCX..." and "10 MB max file size.") are
- * auto-generated from the `accept` and `maxSize` props.
- *
- * @example
- * ```tsx
- * const [files, setFiles] = useState<UploadFile[]>([]);
- *
- * <FileUpload
- *   label="Knowledge base"
- *   accept=".pdf,.docx,.txt,.csv"
- *   maxSize={10 * 1024 * 1024}
- *   value={files}
- *   onFilesAdded={(newFiles) => {
- *     // Create UploadFile entries and start uploading
- *   }}
- *   onRemove={(fileId) => {
- *     setFiles((prev) => prev.filter((f) => f.id !== fileId));
- *   }}
- * />
- * ```
- */
-declare const FileUpload: import('react').ForwardRefExoticComponent<FileUploadProps & import('react').RefAttributes<HTMLInputElement>>;
-export { FileUpload };