@soppiya/elementus 1.0.0 → 1.0.2

package/dist/components/exceptionList/ExceptionList.stories.d.ts

@@ -0,0 +1,20 @@
+import { StoryObj } from '@storybook/react-vite';
+import { default as ExceptionList } from './ExceptionList';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<Omit<import('./ExceptionList').ExceptionListProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {};
+    args: {
+        onClick: import('storybook/internal/test').Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof ExceptionList>;
+export declare const Success: Story;
+export declare const Danger: Story;
+export declare const Warning: Story;
+export declare const Children: Story;

package/dist/components/exceptionList/index.d.ts

@@ -0,0 +1 @@
+export { default as ExceptionList } from './ExceptionList';

package/dist/components/grid/Grid.d.ts

@@ -0,0 +1,20 @@
+import { ColProps, GridProps } from './Grid.props';
+/*************************
+ *  Column component
+ *************************/
+declare const Col: import('react').ForwardRefExoticComponent<Omit<ColProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+/*************************
+ *  Grid component
+ *************************/
+declare const GridBase: import('react').ForwardRefExoticComponent<Omit<GridProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+/*************************
+ * Type: extend Grid with Col
+ *************************/
+type GridComponent = typeof GridBase & {
+    Col: typeof Col;
+};
+/*************************
+ * Attach Col to Grid
+ *************************/
+declare const Grid: GridComponent;
+export default Grid;

package/dist/components/grid/Grid.props.d.ts

@@ -0,0 +1,35 @@
+import { OrderProps, ResponsiveAlignContentProps, ResponsiveAlignItemsProps, ResponsiveColAuto, ResponsiveColSpan, ResponsiveColSpanEnd, ResponsiveColSpanFull, ResponsiveColSpanStart, ResponsiveColsProps, ResponsiveGapProps, ResponsiveGapXProps, ResponsiveGapYProps, ResponsiveJustifyContentProps, ResponsiveJustifyItemsProps, ResponsiveJustifySelfProps, ResponsiveOrderProps, ResponsiveRowSpan, ResponsiveRowSpanAuto, ResponsiveRowSpanEnd, ResponsiveRowSpanFull, ResponsiveRowSpanStart, ResponsiveRowsProps } from '../../utils/types/types';
+/*************************
+ * Grid Props
+ *************************/
+export interface GridProps extends React.ComponentProps<"div"> {
+    children?: React.ReactNode;
+    cols?: ResponsiveColsProps;
+    rows?: ResponsiveRowsProps;
+    gap?: ResponsiveGapProps;
+    gapX?: ResponsiveGapXProps;
+    gapY?: ResponsiveGapYProps;
+    justifyContent?: ResponsiveJustifyContentProps;
+    alignItems?: ResponsiveAlignItemsProps;
+    justifyItems?: ResponsiveJustifyItemsProps;
+    justifySelf?: ResponsiveJustifySelfProps;
+    alignContent?: ResponsiveAlignContentProps;
+}
+/*************************
+ * Col Props
+ *************************/
+export interface ColProps extends React.ComponentProps<"div"> {
+    children?: React.ReactNode;
+    order?: ResponsiveOrderProps | OrderProps;
+    alignContent?: ResponsiveAlignContentProps;
+    colSpanFull?: ResponsiveColSpanFull;
+    colAuto?: ResponsiveColAuto;
+    colStart?: ResponsiveColSpanStart;
+    colEnd?: ResponsiveColSpanEnd;
+    colSpan?: ResponsiveColSpan;
+    rowSpanFull?: ResponsiveRowSpanFull;
+    rowAuto?: ResponsiveRowSpanAuto;
+    rowSpan?: ResponsiveRowSpan;
+    rowStart?: ResponsiveRowSpanStart;
+    rowEnd?: ResponsiveRowSpanEnd;
+}

package/dist/components/grid/Grid.stories.d.ts

@@ -0,0 +1,19 @@
+import { StoryObj } from '@storybook/react-vite';
+import { default as Grid } from './Grid';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<Omit<import('./Grid.props').GridProps, "ref"> & import('react').RefAttributes<HTMLDivElement>> & {
+        Col: import('react').ForwardRefExoticComponent<Omit<import('./Grid.props').ColProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    };
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {};
+    args: {
+        onClick: import('storybook/internal/test').Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Grid>;
+export declare const Default: Story;

package/dist/components/grid/index.d.ts

@@ -0,0 +1 @@
+export { default as Grid } from './Grid';

package/dist/components/image/Image.d.ts

@@ -0,0 +1,22 @@
+import { ResponsiveRadiusSideProps } from '../../utils/types/types';
+import { default as React } from 'react';
+type Sizes = "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+interface ImageProps extends React.ComponentProps<'img'> {
+    url?: string;
+    altText?: string;
+    width?: string;
+    height?: string;
+    className?: string;
+    objectFit?: 'fill' | 'contain' | 'cover' | 'scale-down' | 'inherit' | 'initial' | 'revert' | 'revert-layer' | 'unset';
+    size?: {
+        xs: Sizes;
+        sm?: Sizes;
+        md?: Sizes;
+        lg?: Sizes;
+    } | Sizes;
+    radius?: ResponsiveRadiusSideProps;
+    isImageScaling?: boolean;
+    onClick?: () => void;
+}
+declare const Image: React.ForwardRefExoticComponent<Omit<ImageProps, "ref"> & React.RefAttributes<HTMLImageElement>>;
+export default Image;

package/dist/components/image/Image.stories.d.ts

@@ -0,0 +1,11 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { default as Image } from './Image';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<typeof Image>;
+export declare const XS: Story;
+export declare const SM: Story;
+export declare const MD: Story;
+export declare const LG: Story;
+export declare const XL: Story;
+export declare const XXL: Story;

package/dist/components/image/index.d.ts

@@ -0,0 +1 @@
+export { default as Image } from './Image';

package/dist/components/index.d.ts

@@ -0,0 +1,55 @@
+export { Accordion, AccordionGroup } from './accordion';
+export { AnimatedBar } from './animatedBar';
+export { Badge } from './badge';
+export { Banner } from './banner';
+export { BlockStack } from './blockStack';
+export { Box } from './box';
+export { Button } from './button';
+export { ButtonGroup } from './buttonGroup';
+export { AppError } from './appError';
+export { Card } from './card';
+export { Checkbox } from './checkbox';
+export { ColorPicker } from './colorPicker';
+export { CursorPagination } from './cursorPagination';
+export { DatePicker } from './datePicker';
+export { DemoColorPicker } from './demoColorPicker';
+export { Divider } from './divider';
+export { DropdownPagination } from './dropdownPagination';
+export { EdgeBlurWrapper } from './edgeBlurWrapper';
+export { EmptyState } from './emptyState';
+export { ExceptionList } from './exceptionList';
+export { Grid } from './grid';
+export { Image } from './image';
+export { InlineStack } from './inlineStack';
+export { Input } from './input';
+export { List } from './list';
+export { Listbox } from './listBox';
+export { Modal } from './modal';
+export { OTP } from './otp';
+export { Page } from './page';
+export { Pagination } from './pagination';
+export { Phone } from './phone';
+export { Popover } from './popover';
+export { ProgressBar } from './progressBar';
+export { Radio } from './radio';
+export { Range } from './range';
+export { ResourceItem } from './resourceItem';
+export { Select } from './select';
+export { SkeletonBodyText } from './skeletonBodyText';
+export { SkeletonDisplayText } from './skeletonDisplayText';
+export { SkeletonThumbnail } from './skeletonThumbnail';
+export { Snackbar, SnackBarProvider, useSnackbar } from './snackBar';
+export { SoppiyaIcon } from './soppiyaIcon';
+export { Spinner } from './spinner';
+export { Switch } from './switch';
+export { Tab } from './tab';
+export { Table } from './table';
+export { type Columns, type DataSource } from './table/Table.Props';
+export { Tag } from './tag';
+export { TagList } from './tagList';
+export { Text } from './text';
+export { Textarea } from './textarea';
+export { TinyMce } from './tinyMce';
+export { Tooltip } from './tooltip';
+export { UserAvatar } from './userAvatar';
+export { VerifyStatus } from './verifyStatus';

package/dist/components/inlineStack/InlineStack.d.ts

@@ -0,0 +1,37 @@
+import { AllowedElementsProps, AxisOverflowProps, BorderStyleProps, BorderWidthProps, ColorProps, FlexDirectionProps, FlexWrapProps, OrderProps, PositionDirectionProps, PositionProps, RadiusProps, ResponsiveAlignContentProps, ResponsiveAlignItemsProps, ResponsiveBackgroundColorProps, ResponsiveBorderStyleProps, ResponsiveBorderWidthProps, ResponsiveColorProps, ResponsiveFlexDirectionProps, ResponsiveFlexWrapProps, ResponsiveGapProps, ResponsiveGapXProps, ResponsiveGapYProps, ResponsiveJustifyContentProps, ResponsiveJustifyItemsProps, ResponsiveJustifySelfProps, ResponsiveOrderProps, ResponsivePositionDirectionProps, ResponsivePositionProps, ResponsiveRadiusSideProps, ResponsiveShadowProps, ResponsiveSideProps, ShadowProps, SpaceProps } from '../../utils/types/types';
+/*************************
+ * Component Props
+ *************************/
+export interface InlineStackProps extends React.HTMLAttributes<HTMLElement> {
+    children?: React.ReactNode;
+    as?: AllowedElementsProps;
+    background?: ResponsiveBackgroundColorProps | ColorProps;
+    shadow?: ResponsiveShadowProps | ShadowProps;
+    flexWrap?: ResponsiveFlexWrapProps | FlexWrapProps;
+    flexDirection?: ResponsiveFlexDirectionProps | FlexDirectionProps;
+    gap?: ResponsiveGapProps | SpaceProps;
+    gapX?: ResponsiveGapXProps | SpaceProps;
+    gapY?: ResponsiveGapYProps | SpaceProps;
+    justifyContent?: ResponsiveJustifyContentProps;
+    alignItems?: ResponsiveAlignItemsProps;
+    justifyItems?: ResponsiveJustifyItemsProps;
+    justifySelf?: ResponsiveJustifySelfProps;
+    alignContent?: ResponsiveAlignContentProps;
+    order?: ResponsiveOrderProps | OrderProps;
+    padding?: ResponsiveSideProps;
+    border?: boolean;
+    borderColor?: ResponsiveColorProps | ColorProps;
+    borderWidth?: ResponsiveBorderWidthProps | BorderWidthProps;
+    borderStyle?: ResponsiveBorderStyleProps | BorderStyleProps;
+    radius?: RadiusProps | ResponsiveRadiusSideProps;
+    overflow?: AxisOverflowProps;
+    position?: ResponsivePositionProps | PositionProps;
+    zIndex?: string;
+    left?: ResponsivePositionDirectionProps | PositionDirectionProps;
+    right?: ResponsivePositionDirectionProps | PositionDirectionProps;
+    top?: ResponsivePositionDirectionProps | PositionDirectionProps;
+    bottom?: ResponsivePositionDirectionProps | PositionDirectionProps;
+    stack?: "auto" | "full";
+}
+declare const InlineStack: import('react').ForwardRefExoticComponent<InlineStackProps & import('react').RefAttributes<HTMLElement>>;
+export default InlineStack;

package/dist/components/inlineStack/InlineStack.stories.d.ts

@@ -0,0 +1,38 @@
+import { StoryObj } from '@storybook/react-vite';
+import { default as InlineStack } from './InlineStack';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<import('./InlineStack').InlineStackProps & import('react').RefAttributes<HTMLElement>>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        flexDirection: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+        };
+        flexWrap: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+        };
+    };
+    args: {
+        onClick: import('storybook/internal/test').Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof InlineStack>;
+export declare const Default: Story;
+export declare const JustifyCentered: Story;
+export declare const SpaceBetween: Story;
+export declare const SpaceAround: Story;
+export declare const SpaceEvenly: Story;
+export declare const JustifyContentEnd: Story;
+export declare const JustifyContentStart: Story;
+export declare const RowReverse: Story;
+export declare const FlexWrap: Story;

package/dist/components/inlineStack/index.d.ts

@@ -0,0 +1 @@
+export { default as InlineStack } from './InlineStack';

package/dist/{ui → components}/input/Input.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
-import { InputProps } from "./inputModel";
+import { default as React } from 'react';
+import { InputProps } from './Input.props';
 declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
 export default Input;

package/dist/components/input/Input.props.d.ts

@@ -0,0 +1,36 @@
+/*************************
+ * Type definition
+ *************************/
+export type ErrorType = {
+    status: boolean;
+    message: string;
+};
+export type Sizes = "xs" | "sm" | "md" | "lg";
+/*************************
+ * Omit native conflicting attributes
+ *************************/
+export type NativeInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "prefix" | "suffix">;
+/*************************
+ * Component Props
+ *************************/
+export interface InputProps extends NativeInputProps {
+    size?: {
+        xs?: Sizes;
+        sm?: Sizes;
+        md?: Sizes;
+        lg?: Sizes;
+    } | Sizes;
+    label?: React.ReactNode | string;
+    helpText?: string;
+    labelHidden?: boolean;
+    error?: ErrorType;
+    isLoading?: boolean;
+    labelAction?: React.ReactNode;
+    prefix?: React.ReactNode | string;
+    prefixSeparator?: boolean;
+    suffix?: React.ReactNode | string;
+    suffixSeparator?: boolean;
+    radius?: string;
+    hideArrow?: boolean;
+    className?: string;
+}

package/dist/components/input/Input.stories.d.ts

@@ -0,0 +1,35 @@
+import { StoryObj } from '@storybook/react-vite';
+import { default as Input } from './Input';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<import('./Input.props').InputProps & import('react').RefAttributes<HTMLInputElement>>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        label: {
+            control: "text";
+        };
+        size: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+        };
+    };
+    args: {
+        onClick: import('storybook/internal/test').Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Input>;
+export declare const Default: Story;
+export declare const Password: Story;
+export declare const Prefix: Story;
+export declare const Suffix: Story;
+export declare const Error: Story;
+export declare const LabelAction: Story;
+export declare const Search: Story;
+export declare const Disabled: Story;
+export declare const Readonly: Story;

package/dist/components/input/index.d.ts

@@ -0,0 +1 @@
+export { default as Input } from './Input';

package/dist/components/list/List.d.ts

@@ -0,0 +1,27 @@
+import { DisplayProps, FlexDirectionProps, FlexWrapProps, ResponsiveAlignContentProps, ResponsiveAlignItemsProps, ResponsiveDisplayProps, ResponsiveFlexDirectionProps, ResponsiveFlexWrapProps, ResponsiveGapProps, ResponsiveGapXProps, ResponsiveGapYProps, ResponsiveJustifyContentProps, ResponsiveJustifyItemsProps, ResponsiveJustifySelfProps, ResponsiveSideProps, SpaceProps } from '../../utils/types/types';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+type ListFC = ForwardRefExoticComponent<Omit<ListProps, "ref"> & RefAttributes<HTMLUListElement>> & {
+    Item: typeof ListItem;
+};
+export interface ListProps extends React.ComponentProps<"ul"> {
+    children?: React.ReactNode;
+    type?: "bullet" | "number" | "extraTight" | "none";
+    display?: ResponsiveDisplayProps | DisplayProps;
+    flexWrap?: ResponsiveFlexWrapProps | FlexWrapProps;
+    flexDirection?: ResponsiveFlexDirectionProps | FlexDirectionProps;
+    gap?: ResponsiveGapProps | SpaceProps;
+    gapX?: ResponsiveGapXProps | SpaceProps;
+    gapY?: ResponsiveGapYProps | SpaceProps;
+    justifyContent?: ResponsiveJustifyContentProps;
+    alignItems?: ResponsiveAlignItemsProps;
+    justifyItems?: ResponsiveJustifyItemsProps;
+    justifySelf?: ResponsiveJustifySelfProps;
+    alignContent?: ResponsiveAlignContentProps;
+    padding?: ResponsiveSideProps;
+}
+declare const List: ListFC;
+export interface ListItemProps extends React.ComponentProps<"li"> {
+    children?: React.ReactNode | string;
+}
+declare const ListItem: ForwardRefExoticComponent<Omit<ListItemProps, "ref"> & RefAttributes<HTMLLIElement>>;
+export default List;

package/dist/components/list/List.stories.d.ts

@@ -0,0 +1,22 @@
+import { StoryObj } from '@storybook/react-vite';
+import { default as List } from './List';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<Omit<import('./List').ListProps, "ref"> & import('react').RefAttributes<HTMLUListElement>> & {
+        Item: import('react').ForwardRefExoticComponent<Omit<import('./List').ListItemProps, "ref"> & import('react').RefAttributes<HTMLLIElement>>;
+    };
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {};
+    args: {
+        onClick: import('storybook/internal/test').Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof List>;
+export declare const Default: Story;
+export declare const Bullet: Story;
+export declare const Number: Story;
+export declare const ExtraTight: Story;

package/dist/components/list/index.d.ts

@@ -0,0 +1 @@
+export { default as List } from './List';

package/dist/components/listBox/Listbox.d.ts

@@ -0,0 +1,27 @@
+import { RadiusProps, ResponsiveRadiusSideProps } from '../../utils/types/types';
+import { ForwardRefExoticComponent, ReactNode, RefAttributes } from 'react';
+type ListBoxFC = ForwardRefExoticComponent<Omit<ListBoxProps, "ref"> & RefAttributes<HTMLUListElement>> & {
+    Option: typeof Option;
+};
+export interface ListBoxProps extends React.ComponentProps<"ul"> {
+    children?: ReactNode;
+    type?: "default" | "withIcon" | "withSearch";
+    headerContent?: ReactNode;
+    listBoxClass?: string;
+}
+declare const ListBox: ListBoxFC;
+type Sizes = "xs" | "sm" | "md" | "lg";
+export interface OptionProps extends React.ComponentProps<"li"> {
+    size?: {
+        xs: Sizes;
+        sm?: Sizes;
+        md?: Sizes;
+        lg?: Sizes;
+    } | Sizes;
+    children?: ReactNode | string;
+    isActive?: boolean;
+    radius?: ResponsiveRadiusSideProps | RadiusProps;
+    separator?: boolean;
+}
+declare const Option: ForwardRefExoticComponent<Omit<OptionProps, "ref"> & RefAttributes<HTMLLIElement>>;
+export default ListBox;

package/dist/components/listBox/Listbox.stories.d.ts

@@ -0,0 +1,20 @@
+import { StoryObj } from '@storybook/react-vite';
+import { default as Listbox } from './Listbox';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<Omit<import('./Listbox').ListBoxProps, "ref"> & import('react').RefAttributes<HTMLUListElement>> & {
+        Option: import('react').ForwardRefExoticComponent<Omit<import('./Listbox').OptionProps, "ref"> & import('react').RefAttributes<HTMLLIElement>>;
+    };
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {};
+    args: {
+        onClick: import('storybook/internal/test').Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Listbox>;
+export declare const Default: Story;
+export declare const Separator: Story;

package/dist/components/listBox/index.d.ts

@@ -0,0 +1 @@
+export { default as Listbox } from './Listbox';

package/dist/components/modal/Modal.d.ts

@@ -0,0 +1,45 @@
+import { ColorProps, ResponsiveBackgroundProps, ResponsiveSideProps } from '../../utils/types/types';
+type Sizes = "sm" | "md" | "lg";
+type Color = "primary" | "secondary" | "success" | "info" | "warning" | "danger" | "white" | "blue";
+type Variant = "solid" | "outline" | "fill" | "plain" | "link";
+type PrimaryActionProps = {
+    content: React.ReactNode;
+    variation?: Variant;
+    color?: Color;
+    size?: Sizes;
+    disabled?: boolean;
+    loading?: boolean;
+    onAction?: () => void;
+};
+type SecondaryActionProps = {
+    content: React.ReactNode;
+    variation?: Variant;
+    color?: Color;
+    size?: Sizes;
+    disabled?: boolean;
+    loading?: boolean;
+    onAction?: () => void;
+};
+export interface ModalProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    children?: React.ReactNode;
+    activator?: React.ReactNode;
+    title?: React.ReactNode | string;
+    primaryAction?: PrimaryActionProps;
+    secondaryAction?: SecondaryActionProps;
+    buttons?: React.ReactNode;
+    open?: boolean;
+    headerBg?: ResponsiveBackgroundProps | ColorProps;
+    bodyBg?: ResponsiveBackgroundProps | ColorProps;
+    footerBg?: ResponsiveBackgroundProps | ColorProps;
+    headerPadding?: ResponsiveSideProps;
+    bodyPadding?: ResponsiveSideProps;
+    footerPadding?: ResponsiveSideProps;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | "full";
+    scroll?: boolean;
+    headerClass?: string;
+    bodyClass?: string;
+    footerClass?: string;
+    onClose?: () => void;
+}
+declare const Modal: import('react').ForwardRefExoticComponent<ModalProps & import('react').RefAttributes<HTMLDivElement>>;
+export default Modal;

package/dist/components/modal/Modal.stories.d.ts

@@ -0,0 +1,19 @@
+import { StoryObj } from '@storybook/react-vite';
+import { default as Modal } from './Modal';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<import('./Modal').ModalProps & import('react').RefAttributes<HTMLDivElement>>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {};
+    args: {
+        onClick: import('storybook/internal/test').Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Modal>;
+export declare const Default: Story;
+export declare const ModalWithBg: Story;
+export declare const FullWidth: Story;

package/dist/components/modal/index.d.ts

@@ -0,0 +1 @@
+export { default as Modal } from './Modal';

package/dist/components/otp/OTP.Props.d.ts

@@ -0,0 +1,20 @@
+import { default as React, FocusEvent } from 'react';
+export type ErrorType = {
+    status: boolean;
+    message: string;
+};
+export type Sizes = "xs" | "sm" | "md" | "lg";
+export interface OTPProps extends Omit<React.ComponentProps<'input'>, "size"> {
+    size?: {
+        xs?: Sizes;
+        sm?: Sizes;
+        md?: Sizes;
+        lg?: Sizes;
+    } | Sizes;
+    label?: string;
+    helpText?: string;
+    error?: ErrorType;
+    onOtpValue?: (value: string) => void;
+    onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
+    onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
+}

package/dist/components/otp/OTP.d.ts

@@ -0,0 +1,3 @@
+import { OTPProps } from './OTP.Props';
+declare const OTP: import('react').ForwardRefExoticComponent<Omit<OTPProps, "ref"> & import('react').RefAttributes<HTMLInputElement>>;
+export default OTP;

package/dist/components/otp/OTP.stories.d.ts

@@ -0,0 +1,31 @@
+import { StoryObj } from '@storybook/react-vite';
+import { default as OTP } from './OTP';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<Omit<import('./OTP.Props').OTPProps, "ref"> & import('react').RefAttributes<HTMLInputElement>>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        label: {
+            control: "text";
+        };
+        size: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+        };
+    };
+    args: {
+        onClick: import('storybook/internal/test').Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof OTP>;
+export declare const Default: Story;
+export declare const Error: Story;
+export declare const Disabled: Story;
+export declare const ReadOnly: Story;
+export declare const HelpText: Story;

package/dist/components/otp/index.d.ts

@@ -0,0 +1 @@
+export { default as OTP } from './OTP';

package/dist/components/page/Page.d.ts

@@ -0,0 +1,6 @@
+import { PageProps } from './Page.props';
+/*******************************
+ * Main component
+ ********************************/
+declare const Page: import('react').ForwardRefExoticComponent<PageProps & import('react').RefAttributes<HTMLDivElement>>;
+export default Page;

package/dist/components/page/Page.props.d.ts

@@ -0,0 +1,40 @@
+import { ResponsiveSideProps } from '../../utils/types/types';
+/*******************************
+ * Props
+ ********************************/
+type Color = "primary" | "secondary" | "success" | "info" | "warning" | "danger" | "white" | "blue";
+type Variant = "solid" | "outline" | "fill" | "plain" | "link";
+export type Sizes = "xs" | "sm" | "md" | "lg";
+type PrimaryAction = {
+    content: React.ReactNode;
+    variation?: Variant;
+    size?: Sizes;
+    color?: Color;
+    disabled?: boolean;
+    loading?: boolean;
+    onAction?: () => void;
+};
+type SecondaryAction = {
+    content: React.ReactNode;
+    variation?: Variant;
+    color?: Color;
+    disabled?: boolean;
+    loading?: boolean;
+    size?: Sizes;
+    onAction?: () => void;
+};
+export interface PageProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    title?: React.ReactNode;
+    subtitle?: React.ReactNode;
+    subTitleMaxWidth?: boolean;
+    compactTitle?: boolean;
+    titleMetaData?: React.ReactNode;
+    buttons?: React.ReactNode;
+    primaryAction?: PrimaryAction;
+    secondaryAction?: SecondaryAction;
+    children?: React.ReactNode;
+    backAction?: React.ReactNode;
+    backUrl?: string;
+    padding?: ResponsiveSideProps;
+}
+export {};