zebpay-ui 0.0.9 → 0.0.12

package/dist/cjs/components/Button/index.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import * as React from "react";
+import { ButtonProps } from "./typings";
+declare const Button: React.FC<ButtonProps>;
+export default Button;

package/dist/cjs/components/Button/styles.d.ts

@@ -0,0 +1,10 @@
+export declare const linkButton: import("@emotion/utils").SerializedStyles;
+export declare const primaryButton: import("@emotion/utils").SerializedStyles;
+export declare const secondaryButton: import("@emotion/utils").SerializedStyles;
+export declare const specialButton: import("@emotion/utils").SerializedStyles;
+export declare const specialButtonText: import("@emotion/utils").SerializedStyles;
+export declare const specialButtonSmText: import("@emotion/utils").SerializedStyles;
+export declare const tertiaryButton: import("@emotion/utils").SerializedStyles;
+export declare const tertiaryButtonText: import("@emotion/utils").SerializedStyles;
+export declare const tabButton: import("@emotion/utils").SerializedStyles;
+export declare const disabledButton: import("@emotion/utils").SerializedStyles;

package/dist/cjs/components/Button/typings.d.ts

@@ -0,0 +1,11 @@
+import { Interpolation, Theme } from "@emotion/react";
+export declare type ButtonSize = "small" | "medium" | "large" | "full-width";
+export declare type ButtonType = "link" | "primary" | "secondary" | "special" | "tertiary" | "tab";
+export interface ButtonProps {
+    type: ButtonType;
+    size?: ButtonSize;
+    onClick: () => void;
+    disabled?: boolean;
+    loading?: boolean;
+    style?: Interpolation<Theme>;
+}

package/dist/cjs/components/Checkbox/index.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import { FC } from "react";
+import { CheckboxProps } from "./typings";
+declare const Checkbox: FC<CheckboxProps>;
+export default Checkbox;

package/dist/cjs/components/Checkbox/styles.d.ts

@@ -0,0 +1,8 @@
+export declare const checkboxContainer: import("@emotion/utils").SerializedStyles;
+export declare const labelContainer: import("@emotion/utils").SerializedStyles;
+export declare const disabledLabel: import("@emotion/utils").SerializedStyles;
+export declare const input: import("@emotion/utils").SerializedStyles;
+export declare const checkCheckmark: import("@emotion/utils").SerializedStyles;
+export declare const checkLabel: import("@emotion/utils").SerializedStyles;
+export declare const checkComponent: import("@emotion/utils").SerializedStyles;
+export declare const checkmark: import("@emotion/utils").SerializedStyles;

package/dist/cjs/components/Checkbox/typings.d.ts

@@ -0,0 +1,13 @@
+import { SerializedStyles } from "@emotion/react";
+import { ReactText } from "react";
+export interface CheckboxProps {
+    value: ReactText;
+    checked: boolean;
+    onChange: (args: {
+        checked: boolean;
+        value: ReactText;
+    }) => void;
+    label?: string | JSX.Element;
+    disabled?: boolean;
+    style?: SerializedStyles;
+}

package/dist/cjs/components/CircularLoader/index.d.ts

@@ -0,0 +1,4 @@
+import { FC } from "react";
+import { CircularLoaderProps } from "./typings";
+declare const CircularLoader: FC<CircularLoaderProps>;
+export default CircularLoader;

package/dist/cjs/components/CircularLoader/style.d.ts

@@ -0,0 +1,2 @@
+export declare const rotateAnimation: import("@emotion/react").Keyframes;
+export declare const loader: import("@emotion/utils").SerializedStyles;

package/dist/cjs/components/CircularLoader/typings.d.ts

@@ -0,0 +1,4 @@
+export interface CircularLoaderProps {
+    size: number;
+    color?: string;
+}

package/dist/cjs/components/DateRangePicker/index.d.ts

@@ -0,0 +1,14 @@
+/** @jsxImportSource @emotion/react */
+import React from "react";
+import "./styles.css";
+interface DateRangePickerProps {
+    months: number;
+    onChange(ranges: Selection): void;
+    ranges: Selection;
+}
+interface Selection {
+    startDate: Date;
+    endDate: Date;
+}
+declare const DateRangePicker: React.FC<DateRangePickerProps>;
+export default DateRangePicker;

package/dist/cjs/components/Input/index.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { InputProps } from "./typings";
+declare const Input: React.FC<InputProps>;
+export default Input;

package/dist/cjs/components/Input/styles.d.ts

@@ -0,0 +1,13 @@
+export declare const invalidInputGroup: import("@emotion/utils").SerializedStyles;
+export declare const formLabel: import("@emotion/utils").SerializedStyles;
+export declare const activeFormLabel: import("@emotion/utils").SerializedStyles;
+export declare const inputGroup: import("@emotion/utils").SerializedStyles;
+export declare const focusedInputGroup: import("@emotion/utils").SerializedStyles;
+export declare const formControl: import("@emotion/utils").SerializedStyles;
+export declare const fieldFullRounded: import("@emotion/utils").SerializedStyles;
+export declare const fieldNoRounded: import("@emotion/utils").SerializedStyles;
+export declare const fieldSecondHalfRounded: import("@emotion/utils").SerializedStyles;
+export declare const fieldFirstHalfRounded: import("@emotion/utils").SerializedStyles;
+export declare const inputGroupText: import("@emotion/utils").SerializedStyles;
+export declare const inputGroupPrepend: import("@emotion/utils").SerializedStyles;
+export declare const infoCta: import("@emotion/utils").SerializedStyles;

package/dist/cjs/components/Input/typings.d.ts

@@ -0,0 +1,23 @@
+import { SerializedStyles } from "@emotion/react";
+import { ReactText } from "react";
+export interface InputTargetProps {
+    value: string;
+    name: string;
+}
+export interface InputProps {
+    label: string;
+    placeholder: string;
+    value: ReactText;
+    onChange: (target: InputTargetProps) => void;
+    name?: string;
+    appendItem?: string | JSX.Element;
+    prependItem?: string | JSX.Element;
+    infoText?: string;
+    errorText?: string;
+    type?: "text" | "number" | "password";
+    style?: SerializedStyles;
+    cta?: {
+        label: string;
+        onClick: () => void;
+    };
+}

package/dist/cjs/components/Popper/index.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import * as React from "react";
+import { PopperProps } from "./typings";
+declare const Popper: React.FC<PopperProps>;
+export default Popper;

package/dist/cjs/components/Popper/styles.d.ts

@@ -0,0 +1,6 @@
+export declare const container: import("@emotion/utils").SerializedStyles;
+export declare const popup: import("@emotion/utils").SerializedStyles;
+export declare const header: import("@emotion/utils").SerializedStyles;
+export declare const button: import("@emotion/utils").SerializedStyles;
+export declare const closer: import("@emotion/utils").SerializedStyles;
+export declare const label: (hovered?: boolean | undefined) => import("@emotion/utils").SerializedStyles;

package/dist/cjs/components/Popper/typings.d.ts

@@ -0,0 +1,14 @@
+import { SerializedStyles } from "@emotion/react";
+import { ReactElement } from "react";
+import { ButtonProps } from "../Button/typings";
+export interface PopperProps {
+    label: string;
+    onClose?: () => void;
+    buttonProps?: ButtonProps;
+    renderChildren: (props: ChildrenProps) => ReactElement;
+    style?: SerializedStyles;
+}
+export interface ChildrenProps {
+    close: () => void;
+    isOpened: boolean;
+}

package/dist/cjs/components/Radio/index.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import React from "react";
+import { RadioProps } from "./typings";
+declare const Radio: React.FC<RadioProps>;
+export default Radio;

package/dist/cjs/components/Radio/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const container: import("@emotion/utils").SerializedStyles;
+export declare const input: import("@emotion/utils").SerializedStyles;
+export declare const checkmark: import("@emotion/utils").SerializedStyles;

package/dist/cjs/components/Radio/typings.d.ts

@@ -0,0 +1,13 @@
+import { SerializedStyles } from "@emotion/react";
+import { ReactText } from "react";
+export interface RadioProps {
+    selected: boolean;
+    onChange: (args: {
+        selected: boolean;
+        value: ReactText;
+    }) => void;
+    value?: ReactText;
+    label?: string | JSX.Element;
+    name: string;
+    style?: SerializedStyles;
+}

package/dist/cjs/components/Toast/index.d.ts

@@ -0,0 +1,6 @@
+/** @jsxImportSource @emotion/react */
+import React from "react";
+import { ToastProps } from "./typings";
+export declare const generateToast: ({ title, description, type, onClose, }: ToastProps) => void;
+declare const Toast: React.FC<ToastProps>;
+export default Toast;

package/dist/cjs/components/Toast/styles.d.ts

@@ -0,0 +1,12 @@
+export declare const toastContainer: import("@emotion/utils").SerializedStyles;
+export declare const toastHeading: import("@emotion/utils").SerializedStyles;
+export declare const toastDetails: import("@emotion/utils").SerializedStyles;
+export declare const toastTitle: import("@emotion/utils").SerializedStyles;
+export declare const closeCta: import("@emotion/utils").SerializedStyles;
+export declare const toastDescription: import("@emotion/utils").SerializedStyles;
+export declare const info: import("@emotion/utils").SerializedStyles;
+export declare const infoToastHeading: import("@emotion/utils").SerializedStyles;
+export declare const error: import("@emotion/utils").SerializedStyles;
+export declare const errorToastHeading: import("@emotion/utils").SerializedStyles;
+export declare const success: import("@emotion/utils").SerializedStyles;
+export declare const successToastHeading: import("@emotion/utils").SerializedStyles;

package/dist/cjs/components/Toast/typings.d.ts

@@ -0,0 +1,6 @@
+export interface ToastProps {
+    title: string;
+    description: string;
+    type: "info" | "error" | "success";
+    onClose?: () => void;
+}

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

@@ -0,0 +1,8 @@
+import Button from "./Button";
+import Checkbox from "./Checkbox";
+import CircularLoader from "./CircularLoader";
+import Input from "./Input";
+import Popper from "./Popper";
+import Radio from "./Radio";
+import Toast from "./Toast";
+export { Button, Checkbox, CircularLoader, Input, Radio, Toast, Popper, };

package/dist/cjs/hooks/index.d.ts

@@ -0,0 +1 @@
+export { default as useFocus } from "./useFocus";

package/dist/cjs/hooks/useFocus.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+declare function useFocus<T extends HTMLElement>(): [
+    React.MutableRefObject<T | null>,
+    () => void
+];
+export default useFocus;

package/dist/cjs/index.d.ts

@@ -1,179 +1,2 @@
-import * as React from 'react';
-import React__default, { ReactText, FC, ReactElement } from 'react';
-import { Interpolation, Theme, SerializedStyles, CSSObject } from '@emotion/react';
-import * as _emotion_utils from '@emotion/utils';
-
-declare type ButtonSize = "small" | "medium" | "large" | "full-width";
-declare type ButtonType = "link" | "primary" | "secondary" | "special" | "tertiary" | "tab";
-interface ButtonProps {
-    type: ButtonType;
-    size?: ButtonSize;
-    onClick: () => void;
-    disabled?: boolean;
-    loading?: boolean;
-    style?: Interpolation<Theme>;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Button: React.FC<ButtonProps>;
-
-interface CheckboxProps {
-    value: ReactText;
-    checked: boolean;
-    onChange: (args: {
-        checked: boolean;
-        value: ReactText;
-    }) => void;
-    label?: string | JSX.Element;
-    disabled?: boolean;
-    style?: SerializedStyles;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Checkbox: FC<CheckboxProps>;
-
-interface CircularLoaderProps {
-    size: number;
-    color?: string;
-}
-
-declare const CircularLoader: FC<CircularLoaderProps>;
-
-interface InputTargetProps {
-    value: string;
-    name: string;
-}
-interface InputProps {
-    label: string;
-    placeholder: string;
-    value: ReactText;
-    onChange: (target: InputTargetProps) => void;
-    name?: string;
-    appendItem?: string | JSX.Element;
-    prependItem?: string | JSX.Element;
-    infoText?: string;
-    errorText?: string;
-    type?: "text" | "number" | "password";
-    style?: SerializedStyles;
-    cta?: {
-        label: string;
-        onClick: () => void;
-    };
-}
-
-declare const Input: React__default.FC<InputProps>;
-
-interface PopperProps {
-    label: string;
-    onClose?: () => void;
-    buttonProps?: ButtonProps;
-    renderChildren: (props: ChildrenProps) => ReactElement;
-    style?: SerializedStyles;
-}
-interface ChildrenProps {
-    close: () => void;
-    isOpened: boolean;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Popper: React.FC<PopperProps>;
-
-interface RadioProps {
-    selected: boolean;
-    onChange: (args: {
-        selected: boolean;
-        value: ReactText;
-    }) => void;
-    value?: ReactText;
-    label?: string | JSX.Element;
-    name: string;
-    style?: SerializedStyles;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Radio: React__default.FC<RadioProps>;
-
-interface ToastProps {
-    title: string;
-    description: string;
-    type: "info" | "error" | "success";
-    onClose?: () => void;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Toast: React__default.FC<ToastProps>;
-
-declare const colors: {
-    Zeb_Solid_White: string;
-    Zeb_Solid_BG_Blue: string;
-    Zeb_Solid_Dark_Blue: string;
-    Zeb_Solid_Bright_Blue: string;
-    Zeb_Solid_Light_Blue: string;
-    Zeb_Solid_Green: string;
-    Zeb_Solid_Red: string;
-    Zeb_Solid_Yellow: string;
-    Zeb_Solid_Grey: string;
-    Zeb_Solid_Dark_Grey: string;
-    Zeb_Solid_Black: string;
-    Zeb_Solid_Light_Blue_01: string;
-    Zeb_Solid_Grey_01: string;
-    Zeb_Gradient_Blue_01: string;
-    Zeb_Gradient_Blue_02: string;
-    Zeb_Gradient_Dark_Blue: string;
-    Zeb_Transparent_25: string;
-    Zeb_Transparent_Green: string;
-    Zeb_Transparent_Yellow: string;
-    Zeb_Transparent_Red: string;
-    Zeb_BG_Blue: string;
-    Zeb_BG_Light_Blue: string;
-    Zeb_BG_Green: string;
-    Zeb_BG_Red: string;
-    Zeb_BG_Yellow: string;
-    Zeb_Transparent_4: string;
-    Zeb_Effects_Shadow_Hover: string;
-    Zeb_Effects_Shadow_W_Drawer: string;
-    Zeb_Effects_Shadow_M_Drawer: string;
-    Zeb_Effects_Shadow_Hover_Up: string;
-    Zeb_Effects_Shimmer: string;
-};
-
-interface Styles {
-    [key: string]: CSSObject;
-}
-declare const typography: Styles;
-
-declare const utils: {
-    remConverter: (value: number) => string;
-    widthPercentage: (value: number) => _emotion_utils.SerializedStyles;
-    heightPercentage: (value: number) => _emotion_utils.SerializedStyles;
-    mr: (value: number) => _emotion_utils.SerializedStyles;
-    ml: (value: number) => _emotion_utils.SerializedStyles;
-    mt: (value: number) => _emotion_utils.SerializedStyles;
-    mb: (value: number) => _emotion_utils.SerializedStyles;
-};
-
-declare const mixins: {
-    flexJustifiedBetween: _emotion_utils.SerializedStyles;
-    flexJustifiedCenter: _emotion_utils.SerializedStyles;
-    flexJustifiedEnd: _emotion_utils.SerializedStyles;
-    flexAlignCenter: _emotion_utils.SerializedStyles;
-    flexAlignStart: _emotion_utils.SerializedStyles;
-    flexNoWrap: _emotion_utils.SerializedStyles;
-    flexColumn: _emotion_utils.SerializedStyles;
-    textSuccess: _emotion_utils.SerializedStyles;
-    textError: _emotion_utils.SerializedStyles;
-    bgSuccess: _emotion_utils.SerializedStyles;
-    bgError: _emotion_utils.SerializedStyles;
-    textFaded: _emotion_utils.SerializedStyles;
-    textCapitalize: _emotion_utils.SerializedStyles;
-    textAlignmentCenter: _emotion_utils.SerializedStyles;
-    textAlignmentLeft: _emotion_utils.SerializedStyles;
-    textAlignmentRight: _emotion_utils.SerializedStyles;
-};
-
-export { Button, Checkbox, CircularLoader, Input, Popper, Radio, Toast, colors, mixins, typography, utils };
+export * from "./components";
+export * from "./styles";

package/dist/cjs/styles/colors.d.ts

@@ -0,0 +1,34 @@
+declare const colors: {
+    Zeb_Solid_White: string;
+    Zeb_Solid_BG_Blue: string;
+    Zeb_Solid_Dark_Blue: string;
+    Zeb_Solid_Bright_Blue: string;
+    Zeb_Solid_Light_Blue: string;
+    Zeb_Solid_Green: string;
+    Zeb_Solid_Red: string;
+    Zeb_Solid_Yellow: string;
+    Zeb_Solid_Grey: string;
+    Zeb_Solid_Dark_Grey: string;
+    Zeb_Solid_Black: string;
+    Zeb_Solid_Light_Blue_01: string;
+    Zeb_Solid_Grey_01: string;
+    Zeb_Gradient_Blue_01: string;
+    Zeb_Gradient_Blue_02: string;
+    Zeb_Gradient_Dark_Blue: string;
+    Zeb_Transparent_25: string;
+    Zeb_Transparent_Green: string;
+    Zeb_Transparent_Yellow: string;
+    Zeb_Transparent_Red: string;
+    Zeb_BG_Blue: string;
+    Zeb_BG_Light_Blue: string;
+    Zeb_BG_Green: string;
+    Zeb_BG_Red: string;
+    Zeb_BG_Yellow: string;
+    Zeb_Transparent_4: string;
+    Zeb_Effects_Shadow_Hover: string;
+    Zeb_Effects_Shadow_W_Drawer: string;
+    Zeb_Effects_Shadow_M_Drawer: string;
+    Zeb_Effects_Shadow_Hover_Up: string;
+    Zeb_Effects_Shimmer: string;
+};
+export default colors;

package/dist/cjs/styles/index.d.ts

@@ -0,0 +1,5 @@
+import colors from "./colors";
+import typography from "./typography";
+import utils from "./utils";
+import mixins from "./mixins";
+export { colors, typography, utils, mixins };

package/dist/cjs/styles/mixins.d.ts

@@ -0,0 +1,19 @@
+declare const mixins: {
+    flexJustifiedBetween: import("@emotion/utils").SerializedStyles;
+    flexJustifiedCenter: import("@emotion/utils").SerializedStyles;
+    flexJustifiedEnd: import("@emotion/utils").SerializedStyles;
+    flexAlignCenter: import("@emotion/utils").SerializedStyles;
+    flexAlignStart: import("@emotion/utils").SerializedStyles;
+    flexNoWrap: import("@emotion/utils").SerializedStyles;
+    flexColumn: import("@emotion/utils").SerializedStyles;
+    textSuccess: import("@emotion/utils").SerializedStyles;
+    textError: import("@emotion/utils").SerializedStyles;
+    bgSuccess: import("@emotion/utils").SerializedStyles;
+    bgError: import("@emotion/utils").SerializedStyles;
+    textFaded: import("@emotion/utils").SerializedStyles;
+    textCapitalize: import("@emotion/utils").SerializedStyles;
+    textAlignmentCenter: import("@emotion/utils").SerializedStyles;
+    textAlignmentLeft: import("@emotion/utils").SerializedStyles;
+    textAlignmentRight: import("@emotion/utils").SerializedStyles;
+};
+export default mixins;

package/dist/cjs/styles/typography.d.ts

@@ -0,0 +1,6 @@
+import { CSSObject } from "@emotion/react";
+interface Styles {
+    [key: string]: CSSObject;
+}
+declare const typography: Styles;
+export default typography;

package/dist/cjs/styles/utils.d.ts

@@ -0,0 +1,10 @@
+declare const utils: {
+    remConverter: (value: number) => string;
+    widthPercentage: (value: number) => import("@emotion/utils").SerializedStyles;
+    heightPercentage: (value: number) => import("@emotion/utils").SerializedStyles;
+    mr: (value: number) => import("@emotion/utils").SerializedStyles;
+    ml: (value: number) => import("@emotion/utils").SerializedStyles;
+    mt: (value: number) => import("@emotion/utils").SerializedStyles;
+    mb: (value: number) => import("@emotion/utils").SerializedStyles;
+};
+export default utils;

package/dist/esm/components/Button/index.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import * as React from "react";
+import { ButtonProps } from "./typings";
+declare const Button: React.FC<ButtonProps>;
+export default Button;

package/dist/esm/components/Button/styles.d.ts

@@ -0,0 +1,10 @@
+export declare const linkButton: import("@emotion/utils").SerializedStyles;
+export declare const primaryButton: import("@emotion/utils").SerializedStyles;
+export declare const secondaryButton: import("@emotion/utils").SerializedStyles;
+export declare const specialButton: import("@emotion/utils").SerializedStyles;
+export declare const specialButtonText: import("@emotion/utils").SerializedStyles;
+export declare const specialButtonSmText: import("@emotion/utils").SerializedStyles;
+export declare const tertiaryButton: import("@emotion/utils").SerializedStyles;
+export declare const tertiaryButtonText: import("@emotion/utils").SerializedStyles;
+export declare const tabButton: import("@emotion/utils").SerializedStyles;
+export declare const disabledButton: import("@emotion/utils").SerializedStyles;

package/dist/esm/components/Button/typings.d.ts

@@ -0,0 +1,11 @@
+import { Interpolation, Theme } from "@emotion/react";
+export declare type ButtonSize = "small" | "medium" | "large" | "full-width";
+export declare type ButtonType = "link" | "primary" | "secondary" | "special" | "tertiary" | "tab";
+export interface ButtonProps {
+    type: ButtonType;
+    size?: ButtonSize;
+    onClick: () => void;
+    disabled?: boolean;
+    loading?: boolean;
+    style?: Interpolation<Theme>;
+}

package/dist/esm/components/Checkbox/index.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import { FC } from "react";
+import { CheckboxProps } from "./typings";
+declare const Checkbox: FC<CheckboxProps>;
+export default Checkbox;

package/dist/esm/components/Checkbox/styles.d.ts

@@ -0,0 +1,8 @@
+export declare const checkboxContainer: import("@emotion/utils").SerializedStyles;
+export declare const labelContainer: import("@emotion/utils").SerializedStyles;
+export declare const disabledLabel: import("@emotion/utils").SerializedStyles;
+export declare const input: import("@emotion/utils").SerializedStyles;
+export declare const checkCheckmark: import("@emotion/utils").SerializedStyles;
+export declare const checkLabel: import("@emotion/utils").SerializedStyles;
+export declare const checkComponent: import("@emotion/utils").SerializedStyles;
+export declare const checkmark: import("@emotion/utils").SerializedStyles;

package/dist/esm/components/Checkbox/typings.d.ts

@@ -0,0 +1,13 @@
+import { SerializedStyles } from "@emotion/react";
+import { ReactText } from "react";
+export interface CheckboxProps {
+    value: ReactText;
+    checked: boolean;
+    onChange: (args: {
+        checked: boolean;
+        value: ReactText;
+    }) => void;
+    label?: string | JSX.Element;
+    disabled?: boolean;
+    style?: SerializedStyles;
+}

package/dist/esm/components/CircularLoader/index.d.ts

@@ -0,0 +1,4 @@
+import { FC } from "react";
+import { CircularLoaderProps } from "./typings";
+declare const CircularLoader: FC<CircularLoaderProps>;
+export default CircularLoader;

package/dist/esm/components/CircularLoader/style.d.ts

@@ -0,0 +1,2 @@
+export declare const rotateAnimation: import("@emotion/react").Keyframes;
+export declare const loader: import("@emotion/utils").SerializedStyles;

package/dist/esm/components/CircularLoader/typings.d.ts

@@ -0,0 +1,4 @@
+export interface CircularLoaderProps {
+    size: number;
+    color?: string;
+}

package/dist/esm/components/DateRangePicker/index.d.ts

@@ -0,0 +1,14 @@
+/** @jsxImportSource @emotion/react */
+import React from "react";
+import "./styles.css";
+interface DateRangePickerProps {
+    months: number;
+    onChange(ranges: Selection): void;
+    ranges: Selection;
+}
+interface Selection {
+    startDate: Date;
+    endDate: Date;
+}
+declare const DateRangePicker: React.FC<DateRangePickerProps>;
+export default DateRangePicker;

package/dist/esm/components/Input/index.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { InputProps } from "./typings";
+declare const Input: React.FC<InputProps>;
+export default Input;

package/dist/esm/components/Input/styles.d.ts

@@ -0,0 +1,13 @@
+export declare const invalidInputGroup: import("@emotion/utils").SerializedStyles;
+export declare const formLabel: import("@emotion/utils").SerializedStyles;
+export declare const activeFormLabel: import("@emotion/utils").SerializedStyles;
+export declare const inputGroup: import("@emotion/utils").SerializedStyles;
+export declare const focusedInputGroup: import("@emotion/utils").SerializedStyles;
+export declare const formControl: import("@emotion/utils").SerializedStyles;
+export declare const fieldFullRounded: import("@emotion/utils").SerializedStyles;
+export declare const fieldNoRounded: import("@emotion/utils").SerializedStyles;
+export declare const fieldSecondHalfRounded: import("@emotion/utils").SerializedStyles;
+export declare const fieldFirstHalfRounded: import("@emotion/utils").SerializedStyles;
+export declare const inputGroupText: import("@emotion/utils").SerializedStyles;
+export declare const inputGroupPrepend: import("@emotion/utils").SerializedStyles;
+export declare const infoCta: import("@emotion/utils").SerializedStyles;

package/dist/esm/components/Input/typings.d.ts

@@ -0,0 +1,23 @@
+import { SerializedStyles } from "@emotion/react";
+import { ReactText } from "react";
+export interface InputTargetProps {
+    value: string;
+    name: string;
+}
+export interface InputProps {
+    label: string;
+    placeholder: string;
+    value: ReactText;
+    onChange: (target: InputTargetProps) => void;
+    name?: string;
+    appendItem?: string | JSX.Element;
+    prependItem?: string | JSX.Element;
+    infoText?: string;
+    errorText?: string;
+    type?: "text" | "number" | "password";
+    style?: SerializedStyles;
+    cta?: {
+        label: string;
+        onClick: () => void;
+    };
+}

package/dist/esm/components/Popper/index.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import * as React from "react";
+import { PopperProps } from "./typings";
+declare const Popper: React.FC<PopperProps>;
+export default Popper;

package/dist/esm/components/Popper/styles.d.ts

@@ -0,0 +1,6 @@
+export declare const container: import("@emotion/utils").SerializedStyles;
+export declare const popup: import("@emotion/utils").SerializedStyles;
+export declare const header: import("@emotion/utils").SerializedStyles;
+export declare const button: import("@emotion/utils").SerializedStyles;
+export declare const closer: import("@emotion/utils").SerializedStyles;
+export declare const label: (hovered?: boolean | undefined) => import("@emotion/utils").SerializedStyles;

package/dist/esm/components/Popper/typings.d.ts

@@ -0,0 +1,14 @@
+import { SerializedStyles } from "@emotion/react";
+import { ReactElement } from "react";
+import { ButtonProps } from "../Button/typings";
+export interface PopperProps {
+    label: string;
+    onClose?: () => void;
+    buttonProps?: ButtonProps;
+    renderChildren: (props: ChildrenProps) => ReactElement;
+    style?: SerializedStyles;
+}
+export interface ChildrenProps {
+    close: () => void;
+    isOpened: boolean;
+}

package/dist/esm/components/Radio/index.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import React from "react";
+import { RadioProps } from "./typings";
+declare const Radio: React.FC<RadioProps>;
+export default Radio;

package/dist/esm/components/Radio/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const container: import("@emotion/utils").SerializedStyles;
+export declare const input: import("@emotion/utils").SerializedStyles;
+export declare const checkmark: import("@emotion/utils").SerializedStyles;

package/dist/esm/components/Radio/typings.d.ts

@@ -0,0 +1,13 @@
+import { SerializedStyles } from "@emotion/react";
+import { ReactText } from "react";
+export interface RadioProps {
+    selected: boolean;
+    onChange: (args: {
+        selected: boolean;
+        value: ReactText;
+    }) => void;
+    value?: ReactText;
+    label?: string | JSX.Element;
+    name: string;
+    style?: SerializedStyles;
+}

package/dist/esm/components/Toast/index.d.ts

@@ -0,0 +1,6 @@
+/** @jsxImportSource @emotion/react */
+import React from "react";
+import { ToastProps } from "./typings";
+export declare const generateToast: ({ title, description, type, onClose, }: ToastProps) => void;
+declare const Toast: React.FC<ToastProps>;
+export default Toast;

package/dist/esm/components/Toast/styles.d.ts

@@ -0,0 +1,12 @@
+export declare const toastContainer: import("@emotion/utils").SerializedStyles;
+export declare const toastHeading: import("@emotion/utils").SerializedStyles;
+export declare const toastDetails: import("@emotion/utils").SerializedStyles;
+export declare const toastTitle: import("@emotion/utils").SerializedStyles;
+export declare const closeCta: import("@emotion/utils").SerializedStyles;
+export declare const toastDescription: import("@emotion/utils").SerializedStyles;
+export declare const info: import("@emotion/utils").SerializedStyles;
+export declare const infoToastHeading: import("@emotion/utils").SerializedStyles;
+export declare const error: import("@emotion/utils").SerializedStyles;
+export declare const errorToastHeading: import("@emotion/utils").SerializedStyles;
+export declare const success: import("@emotion/utils").SerializedStyles;
+export declare const successToastHeading: import("@emotion/utils").SerializedStyles;

package/dist/esm/components/Toast/typings.d.ts

@@ -0,0 +1,6 @@
+export interface ToastProps {
+    title: string;
+    description: string;
+    type: "info" | "error" | "success";
+    onClose?: () => void;
+}

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

@@ -0,0 +1,8 @@
+import Button from "./Button";
+import Checkbox from "./Checkbox";
+import CircularLoader from "./CircularLoader";
+import Input from "./Input";
+import Popper from "./Popper";
+import Radio from "./Radio";
+import Toast from "./Toast";
+export { Button, Checkbox, CircularLoader, Input, Radio, Toast, Popper, };

package/dist/esm/hooks/index.d.ts

@@ -0,0 +1 @@
+export { default as useFocus } from "./useFocus";

package/dist/esm/hooks/useFocus.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+declare function useFocus<T extends HTMLElement>(): [
+    React.MutableRefObject<T | null>,
+    () => void
+];
+export default useFocus;

package/dist/esm/index.d.ts

@@ -1,179 +1,2 @@
-import * as React from 'react';
-import React__default, { ReactText, FC, ReactElement } from 'react';
-import { Interpolation, Theme, SerializedStyles, CSSObject } from '@emotion/react';
-import * as _emotion_utils from '@emotion/utils';
-
-declare type ButtonSize = "small" | "medium" | "large" | "full-width";
-declare type ButtonType = "link" | "primary" | "secondary" | "special" | "tertiary" | "tab";
-interface ButtonProps {
-    type: ButtonType;
-    size?: ButtonSize;
-    onClick: () => void;
-    disabled?: boolean;
-    loading?: boolean;
-    style?: Interpolation<Theme>;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Button: React.FC<ButtonProps>;
-
-interface CheckboxProps {
-    value: ReactText;
-    checked: boolean;
-    onChange: (args: {
-        checked: boolean;
-        value: ReactText;
-    }) => void;
-    label?: string | JSX.Element;
-    disabled?: boolean;
-    style?: SerializedStyles;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Checkbox: FC<CheckboxProps>;
-
-interface CircularLoaderProps {
-    size: number;
-    color?: string;
-}
-
-declare const CircularLoader: FC<CircularLoaderProps>;
-
-interface InputTargetProps {
-    value: string;
-    name: string;
-}
-interface InputProps {
-    label: string;
-    placeholder: string;
-    value: ReactText;
-    onChange: (target: InputTargetProps) => void;
-    name?: string;
-    appendItem?: string | JSX.Element;
-    prependItem?: string | JSX.Element;
-    infoText?: string;
-    errorText?: string;
-    type?: "text" | "number" | "password";
-    style?: SerializedStyles;
-    cta?: {
-        label: string;
-        onClick: () => void;
-    };
-}
-
-declare const Input: React__default.FC<InputProps>;
-
-interface PopperProps {
-    label: string;
-    onClose?: () => void;
-    buttonProps?: ButtonProps;
-    renderChildren: (props: ChildrenProps) => ReactElement;
-    style?: SerializedStyles;
-}
-interface ChildrenProps {
-    close: () => void;
-    isOpened: boolean;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Popper: React.FC<PopperProps>;
-
-interface RadioProps {
-    selected: boolean;
-    onChange: (args: {
-        selected: boolean;
-        value: ReactText;
-    }) => void;
-    value?: ReactText;
-    label?: string | JSX.Element;
-    name: string;
-    style?: SerializedStyles;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Radio: React__default.FC<RadioProps>;
-
-interface ToastProps {
-    title: string;
-    description: string;
-    type: "info" | "error" | "success";
-    onClose?: () => void;
-}
-
-/** @jsxImportSource @emotion/react */
-
-declare const Toast: React__default.FC<ToastProps>;
-
-declare const colors: {
-    Zeb_Solid_White: string;
-    Zeb_Solid_BG_Blue: string;
-    Zeb_Solid_Dark_Blue: string;
-    Zeb_Solid_Bright_Blue: string;
-    Zeb_Solid_Light_Blue: string;
-    Zeb_Solid_Green: string;
-    Zeb_Solid_Red: string;
-    Zeb_Solid_Yellow: string;
-    Zeb_Solid_Grey: string;
-    Zeb_Solid_Dark_Grey: string;
-    Zeb_Solid_Black: string;
-    Zeb_Solid_Light_Blue_01: string;
-    Zeb_Solid_Grey_01: string;
-    Zeb_Gradient_Blue_01: string;
-    Zeb_Gradient_Blue_02: string;
-    Zeb_Gradient_Dark_Blue: string;
-    Zeb_Transparent_25: string;
-    Zeb_Transparent_Green: string;
-    Zeb_Transparent_Yellow: string;
-    Zeb_Transparent_Red: string;
-    Zeb_BG_Blue: string;
-    Zeb_BG_Light_Blue: string;
-    Zeb_BG_Green: string;
-    Zeb_BG_Red: string;
-    Zeb_BG_Yellow: string;
-    Zeb_Transparent_4: string;
-    Zeb_Effects_Shadow_Hover: string;
-    Zeb_Effects_Shadow_W_Drawer: string;
-    Zeb_Effects_Shadow_M_Drawer: string;
-    Zeb_Effects_Shadow_Hover_Up: string;
-    Zeb_Effects_Shimmer: string;
-};
-
-interface Styles {
-    [key: string]: CSSObject;
-}
-declare const typography: Styles;
-
-declare const utils: {
-    remConverter: (value: number) => string;
-    widthPercentage: (value: number) => _emotion_utils.SerializedStyles;
-    heightPercentage: (value: number) => _emotion_utils.SerializedStyles;
-    mr: (value: number) => _emotion_utils.SerializedStyles;
-    ml: (value: number) => _emotion_utils.SerializedStyles;
-    mt: (value: number) => _emotion_utils.SerializedStyles;
-    mb: (value: number) => _emotion_utils.SerializedStyles;
-};
-
-declare const mixins: {
-    flexJustifiedBetween: _emotion_utils.SerializedStyles;
-    flexJustifiedCenter: _emotion_utils.SerializedStyles;
-    flexJustifiedEnd: _emotion_utils.SerializedStyles;
-    flexAlignCenter: _emotion_utils.SerializedStyles;
-    flexAlignStart: _emotion_utils.SerializedStyles;
-    flexNoWrap: _emotion_utils.SerializedStyles;
-    flexColumn: _emotion_utils.SerializedStyles;
-    textSuccess: _emotion_utils.SerializedStyles;
-    textError: _emotion_utils.SerializedStyles;
-    bgSuccess: _emotion_utils.SerializedStyles;
-    bgError: _emotion_utils.SerializedStyles;
-    textFaded: _emotion_utils.SerializedStyles;
-    textCapitalize: _emotion_utils.SerializedStyles;
-    textAlignmentCenter: _emotion_utils.SerializedStyles;
-    textAlignmentLeft: _emotion_utils.SerializedStyles;
-    textAlignmentRight: _emotion_utils.SerializedStyles;
-};
-
-export { Button, Checkbox, CircularLoader, Input, Popper, Radio, Toast, colors, mixins, typography, utils };
+export * from "./components";
+export * from "./styles";

package/dist/esm/styles/colors.d.ts

@@ -0,0 +1,34 @@
+declare const colors: {
+    Zeb_Solid_White: string;
+    Zeb_Solid_BG_Blue: string;
+    Zeb_Solid_Dark_Blue: string;
+    Zeb_Solid_Bright_Blue: string;
+    Zeb_Solid_Light_Blue: string;
+    Zeb_Solid_Green: string;
+    Zeb_Solid_Red: string;
+    Zeb_Solid_Yellow: string;
+    Zeb_Solid_Grey: string;
+    Zeb_Solid_Dark_Grey: string;
+    Zeb_Solid_Black: string;
+    Zeb_Solid_Light_Blue_01: string;
+    Zeb_Solid_Grey_01: string;
+    Zeb_Gradient_Blue_01: string;
+    Zeb_Gradient_Blue_02: string;
+    Zeb_Gradient_Dark_Blue: string;
+    Zeb_Transparent_25: string;
+    Zeb_Transparent_Green: string;
+    Zeb_Transparent_Yellow: string;
+    Zeb_Transparent_Red: string;
+    Zeb_BG_Blue: string;
+    Zeb_BG_Light_Blue: string;
+    Zeb_BG_Green: string;
+    Zeb_BG_Red: string;
+    Zeb_BG_Yellow: string;
+    Zeb_Transparent_4: string;
+    Zeb_Effects_Shadow_Hover: string;
+    Zeb_Effects_Shadow_W_Drawer: string;
+    Zeb_Effects_Shadow_M_Drawer: string;
+    Zeb_Effects_Shadow_Hover_Up: string;
+    Zeb_Effects_Shimmer: string;
+};
+export default colors;

package/dist/esm/styles/index.d.ts

@@ -0,0 +1,5 @@
+import colors from "./colors";
+import typography from "./typography";
+import utils from "./utils";
+import mixins from "./mixins";
+export { colors, typography, utils, mixins };

package/dist/esm/styles/mixins.d.ts

@@ -0,0 +1,19 @@
+declare const mixins: {
+    flexJustifiedBetween: import("@emotion/utils").SerializedStyles;
+    flexJustifiedCenter: import("@emotion/utils").SerializedStyles;
+    flexJustifiedEnd: import("@emotion/utils").SerializedStyles;
+    flexAlignCenter: import("@emotion/utils").SerializedStyles;
+    flexAlignStart: import("@emotion/utils").SerializedStyles;
+    flexNoWrap: import("@emotion/utils").SerializedStyles;
+    flexColumn: import("@emotion/utils").SerializedStyles;
+    textSuccess: import("@emotion/utils").SerializedStyles;
+    textError: import("@emotion/utils").SerializedStyles;
+    bgSuccess: import("@emotion/utils").SerializedStyles;
+    bgError: import("@emotion/utils").SerializedStyles;
+    textFaded: import("@emotion/utils").SerializedStyles;
+    textCapitalize: import("@emotion/utils").SerializedStyles;
+    textAlignmentCenter: import("@emotion/utils").SerializedStyles;
+    textAlignmentLeft: import("@emotion/utils").SerializedStyles;
+    textAlignmentRight: import("@emotion/utils").SerializedStyles;
+};
+export default mixins;

package/dist/esm/styles/typography.d.ts

@@ -0,0 +1,6 @@
+import { CSSObject } from "@emotion/react";
+interface Styles {
+    [key: string]: CSSObject;
+}
+declare const typography: Styles;
+export default typography;

package/dist/esm/styles/utils.d.ts

@@ -0,0 +1,10 @@
+declare const utils: {
+    remConverter: (value: number) => string;
+    widthPercentage: (value: number) => import("@emotion/utils").SerializedStyles;
+    heightPercentage: (value: number) => import("@emotion/utils").SerializedStyles;
+    mr: (value: number) => import("@emotion/utils").SerializedStyles;
+    ml: (value: number) => import("@emotion/utils").SerializedStyles;
+    mt: (value: number) => import("@emotion/utils").SerializedStyles;
+    mb: (value: number) => import("@emotion/utils").SerializedStyles;
+};
+export default utils;

package/package.json

@@ -1,13 +1,12 @@
 {
   "name": "zebpay-ui",
-  "version": "0.0.9",
+  "version": "0.0.12",
   "description": "",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "repository": "https://github.com/zebpay/znew.design.system.git",
   "author": "chaitanyazebpay <chaitanya.g@zebpay.com>",
   "license": "MIT",
-  "type": "module",
   "scripts": {
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook",
@@ -16,12 +15,13 @@
     "build:icons": "yarn run build && mkdirp dist/icons && fantasticon svgs -o dist/icons",
     "lint-staged": "lint-staged",
     "prepare": "husky install",
-    "build": "rimraf dist && rollup -c && rimraf dist/esm/dist && rimraf dist/cjs/dist",
-    "watch": "rimraf dist && rollup rollup.config.js -w && rimraf dist/esm/dist"
+    "build": "rimraf dist && rollup -c",
+    "watch": "rimraf dist && rollup -c rollup.config.js -w"
   },
   "devDependencies": {
     "@babel/core": "^7.17.5",
-    "@emotion/react": "^11.9.3",
+    "@babel/preset-react": "^7.18.6",
+    "@emotion/babel-plugin": "^11.9.2",
     "@rollup/plugin-commonjs": "^21.0.3",
     "@rollup/plugin-node-resolve": "^13.1.3",
     "@rollup/plugin-typescript": "^8.3.1",
@@ -47,22 +47,22 @@
     "rimraf": "^3.0.2",
     "rollup": "^2.70.1",
     "rollup-plugin-babel": "^4.4.0",
-    "rollup-plugin-dts": "^4.2.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-terser": "^7.0.2",
     "typescript": "^4.5.5"
   },
   "peerDependencies": {
-    "@emotion/react": "^11.8.1",
+    "@emotion/react": "^11.9.3",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   },
   "dependencies": {
-    "@babel/preset-react": "^7.18.6",
-    "@emotion/babel-plugin": "^11.9.2",
+    "@emotion/react": "^11.9.3",
     "@types/react-date-range": "^1.4.3",
     "date-fns": "^2.28.0",
+    "react": "^17.0.2",
     "react-date-range": "^1.4.0",
+    "react-dom": "^17.0.2",
     "react-hot-toast": "^2.2.0"
   }
 }