npm - @majoo-ui/react - Versions diffs - 1.57.20 → 1.58.0 - Mend

@majoo-ui/react 1.57.20 → 1.58.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/components/card/Card.d.ts +516 -0
package/components/card/index.d.ts +2 -0
package/components/form/components/InputDateRange/InputDateRange.d.ts +38 -0
package/components/form/components/InputDateRange/index.d.ts +2 -0
package/components/form/components/InputSelect/InputSelect.d.ts +5 -1
package/components/form/components/index.d.ts +1 -0
package/index.esm.js +4379 -4330
package/index.umd.js +3738 -3681
package/package.json +1 -1

package/components/card/Card.d.ts ADDED Viewed

@@ -0,0 +1,516 @@
+import React from 'react';
+import { CSS } from '../../config/stitches.config';
+interface CardProps {
+    className?: string;
+    css?: CSS;
+    color?: 'green' | 'orange' | 'blue' | 'purple' | 'yellow' | 'red' | 'dark';
+    shadow?: boolean;
+    radius?: string;
+    padding?: string;
+    title?: JSX.Element | string;
+    label?: JSX.Element | string;
+    description?: JSX.Element | string;
+    width?: string;
+    textColor?: string;
+    icon?: JSX.Element;
+    showBottomLine?: boolean;
+    children?: React.ReactNode;
+}
+export declare const CardComponent: import("@stitches/react/types/styled-component").StyledComponent<"div", {
+    shadow?: boolean | "true" | undefined;
+    isTemplateFormat?: boolean | "true" | undefined;
+}, {
+    sm: "(min-width: 359px)";
+    md: "(min-width: 767px)";
+    lg: "(min-width: 1023px)";
+    xl: "(min-width: 1199px)";
+    '2xl': "(min-width: 1399px)";
+    '3xl': "(min-width: 1600px)";
+}, import("@stitches/react/types/css-util").CSS<{
+    sm: "(min-width: 359px)";
+    md: "(min-width: 767px)";
+    lg: "(min-width: 1023px)";
+    xl: "(min-width: 1199px)";
+    '2xl': "(min-width: 1399px)";
+    '3xl': "(min-width: 1600px)";
+}, {
+    colors: unknown;
+    space: unknown;
+    shadows: unknown;
+    fontSizes: unknown;
+    fonts: unknown;
+    lineHeights: unknown;
+    letterSpacings: unknown;
+    radii: unknown;
+    sizes: unknown;
+    zIndices: unknown;
+}, import("@stitches/react/types/config").DefaultThemeMap, {
+    m: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        margin: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mt: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginTop: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mr: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginRight: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mb: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginBottom: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    ml: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginLeft: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mx: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginLeft: {
+            readonly [$$ScaleValue]: "space";
+        };
+        marginRight: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    my: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginTop: {
+            readonly [$$ScaleValue]: "space";
+        };
+        marginBottom: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    size: (value: {
+        readonly [$$PropertyValue]: "width";
+    }) => {
+        width: {
+            readonly [$$PropertyValue]: "width";
+        };
+        height: {
+            readonly [$$PropertyValue]: "width";
+        };
+    };
+    subtleColor: (value: string) => {
+        color: string;
+        backgroundColor: string;
+    };
+}>>;
+export declare const CardLineColor: import("@stitches/react/types/styled-component").StyledComponent<"span", {
+    color?: "dark" | "green" | "orange" | "blue" | "purple" | "yellow" | "red" | "lightBlue" | undefined;
+}, {
+    sm: "(min-width: 359px)";
+    md: "(min-width: 767px)";
+    lg: "(min-width: 1023px)";
+    xl: "(min-width: 1199px)";
+    '2xl': "(min-width: 1399px)";
+    '3xl': "(min-width: 1600px)";
+}, import("@stitches/react/types/css-util").CSS<{
+    sm: "(min-width: 359px)";
+    md: "(min-width: 767px)";
+    lg: "(min-width: 1023px)";
+    xl: "(min-width: 1199px)";
+    '2xl': "(min-width: 1399px)";
+    '3xl': "(min-width: 1600px)";
+}, {
+    colors: unknown;
+    space: unknown;
+    shadows: unknown;
+    fontSizes: unknown;
+    fonts: unknown;
+    lineHeights: unknown;
+    letterSpacings: unknown;
+    radii: unknown;
+    sizes: unknown;
+    zIndices: unknown;
+}, import("@stitches/react/types/config").DefaultThemeMap, {
+    m: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        margin: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mt: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginTop: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mr: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginRight: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mb: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginBottom: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    ml: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginLeft: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mx: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginLeft: {
+            readonly [$$ScaleValue]: "space";
+        };
+        marginRight: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    my: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginTop: {
+            readonly [$$ScaleValue]: "space";
+        };
+        marginBottom: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    size: (value: {
+        readonly [$$PropertyValue]: "width";
+    }) => {
+        width: {
+            readonly [$$PropertyValue]: "width";
+        };
+        height: {
+            readonly [$$PropertyValue]: "width";
+        };
+    };
+    subtleColor: (value: string) => {
+        color: string;
+        backgroundColor: string;
+    };
+}>>;
+export declare const StyledTitle: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {
+    sm: "(min-width: 359px)";
+    md: "(min-width: 767px)";
+    lg: "(min-width: 1023px)";
+    xl: "(min-width: 1199px)";
+    '2xl': "(min-width: 1399px)";
+    '3xl': "(min-width: 1600px)";
+}, import("@stitches/react/types/css-util").CSS<{
+    sm: "(min-width: 359px)";
+    md: "(min-width: 767px)";
+    lg: "(min-width: 1023px)";
+    xl: "(min-width: 1199px)";
+    '2xl': "(min-width: 1399px)";
+    '3xl': "(min-width: 1600px)";
+}, {
+    colors: unknown;
+    space: unknown;
+    shadows: unknown;
+    fontSizes: unknown;
+    fonts: unknown;
+    lineHeights: unknown;
+    letterSpacings: unknown;
+    radii: unknown;
+    sizes: unknown;
+    zIndices: unknown;
+}, import("@stitches/react/types/config").DefaultThemeMap, {
+    m: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        margin: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mt: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginTop: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mr: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginRight: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mb: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginBottom: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    ml: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginLeft: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mx: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginLeft: {
+            readonly [$$ScaleValue]: "space";
+        };
+        marginRight: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    my: (value: {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginTop: {
+            readonly [$$ScaleValue]: "space";
+        };
+        marginBottom: {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    size: (value: {
+        readonly [$$PropertyValue]: "width";
+    }) => {
+        width: {
+            readonly [$$PropertyValue]: "width";
+        };
+        height: {
+            readonly [$$PropertyValue]: "width";
+        };
+    };
+    subtleColor: (value: string) => {
+        color: string;
+        backgroundColor: string;
+    };
+}>>;
+export declare const Card: {
+    ({ className, children, color, shadow, radius, padding, title, width, textColor, icon, showBottomLine, label, description, ...props }: CardProps): JSX.Element;
+    defaultProps: {
+        className: string;
+        color: string;
+        shadow: boolean;
+        radius: string;
+        padding: string;
+        title: string;
+        showBottomLine: boolean;
+    };
+    Label: import("@stitches/react/types/styled-component").StyledComponent<"h3", {}, {
+        sm: "(min-width: 359px)";
+        md: "(min-width: 767px)";
+        lg: "(min-width: 1023px)";
+        xl: "(min-width: 1199px)";
+        '2xl': "(min-width: 1399px)";
+        '3xl': "(min-width: 1600px)";
+    }, import("@stitches/react/types/css-util").CSS<{
+        sm: "(min-width: 359px)";
+        md: "(min-width: 767px)";
+        lg: "(min-width: 1023px)";
+        xl: "(min-width: 1199px)";
+        '2xl': "(min-width: 1399px)";
+        '3xl': "(min-width: 1600px)";
+    }, {
+        colors: unknown;
+        space: unknown;
+        shadows: unknown;
+        fontSizes: unknown;
+        fonts: unknown;
+        lineHeights: unknown;
+        letterSpacings: unknown;
+        radii: unknown;
+        sizes: unknown;
+        zIndices: unknown;
+    }, import("@stitches/react/types/config").DefaultThemeMap, {
+        m: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            margin: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mt: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginTop: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mr: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginRight: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mb: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginBottom: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        ml: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginLeft: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mx: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginLeft: {
+                readonly [$$ScaleValue]: "space";
+            };
+            marginRight: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        my: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginTop: {
+                readonly [$$ScaleValue]: "space";
+            };
+            marginBottom: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        size: (value: {
+            readonly [$$PropertyValue]: "width";
+        }) => {
+            width: {
+                readonly [$$PropertyValue]: "width";
+            };
+            height: {
+                readonly [$$PropertyValue]: "width";
+            };
+        };
+        subtleColor: (value: string) => {
+            color: string;
+            backgroundColor: string;
+        };
+    }>>;
+    Description: import("@stitches/react/types/styled-component").StyledComponent<"p", {}, {
+        sm: "(min-width: 359px)";
+        md: "(min-width: 767px)";
+        lg: "(min-width: 1023px)";
+        xl: "(min-width: 1199px)";
+        '2xl': "(min-width: 1399px)";
+        '3xl': "(min-width: 1600px)";
+    }, import("@stitches/react/types/css-util").CSS<{
+        sm: "(min-width: 359px)";
+        md: "(min-width: 767px)";
+        lg: "(min-width: 1023px)";
+        xl: "(min-width: 1199px)";
+        '2xl': "(min-width: 1399px)";
+        '3xl': "(min-width: 1600px)";
+    }, {
+        colors: unknown;
+        space: unknown;
+        shadows: unknown;
+        fontSizes: unknown;
+        fonts: unknown;
+        lineHeights: unknown;
+        letterSpacings: unknown;
+        radii: unknown;
+        sizes: unknown;
+        zIndices: unknown;
+    }, import("@stitches/react/types/config").DefaultThemeMap, {
+        m: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            margin: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mt: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginTop: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mr: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginRight: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mb: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginBottom: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        ml: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginLeft: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mx: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginLeft: {
+                readonly [$$ScaleValue]: "space";
+            };
+            marginRight: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        my: (value: {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginTop: {
+                readonly [$$ScaleValue]: "space";
+            };
+            marginBottom: {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        size: (value: {
+            readonly [$$PropertyValue]: "width";
+        }) => {
+            width: {
+                readonly [$$PropertyValue]: "width";
+            };
+            height: {
+                readonly [$$PropertyValue]: "width";
+            };
+        };
+        subtleColor: (value: string) => {
+            color: string;
+            backgroundColor: string;
+        };
+    }>>;
+};
+export default Card;

package/components/card/index.d.ts ADDED Viewed

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

package/components/form/components/InputDateRange/InputDateRange.d.ts ADDED Viewed

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { CSS } from '../../../../config/stitches.config';
+interface InputDateRangeProps {
+    /**
+     * Specify the InputDateRange placeholder.
+     */
+    placeholder?: string;
+    /**
+     * Specify an `onChange` handler that is called whenever the InputDateRange value changes.
+     */
+    onChange?: (value: any) => void;
+    /**
+     * Specify the input size.
+     */
+    size?: 'sm' | 'lg';
+    /**
+     * 	If true, the component is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Specify the options view placement.
+     */
+    placement?: 'bottom' | 'top';
+    /**
+     * 	If true, the input will become read-only state.
+     */
+    readOnly?: boolean;
+    /**
+     * If true, the input will become invalid state.
+     */
+    isInvalid?: boolean;
+    /**
+     * Additional CSS InputDateRange styles
+     */
+    css?: CSS;
+}
+export declare const InputDateRange: React.ForwardRefExoticComponent<InputDateRangeProps & React.RefAttributes<HTMLInputElement>>;
+export default InputDateRange;

package/components/form/components/InputDateRange/index.d.ts ADDED Viewed

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

package/components/form/components/InputSelect/InputSelect.d.ts CHANGED Viewed

@@ -705,7 +705,7 @@ interface InputSelectProps extends Omit<DownshiftProps<Option>, 'initialSelected
     /**
      * Specify the InputSelect placeholder.
      */
-    placeholder?: string;
+    placeholder?: string | null;
     /**
      * Specify the search input placeholder.
      */
@@ -809,6 +809,10 @@ interface InputSelectProps extends Omit<DownshiftProps<Option>, 'initialSelected
      * Render custom footer inside option. If onClick not working on mobile, you can using both onClick and onTouchStart.
      */
     renderFooter?: () => React.ReactNode;
+    /**
+     * Custom empty data message
+     */
+    emptyDataMessage?: string;
 }
 export declare const InputSelect: React.ForwardRefExoticComponent<InputSelectProps & React.RefAttributes<HTMLInputElement>>;
 export default InputSelect;

package/components/form/components/index.d.ts CHANGED Viewed

@@ -22,3 +22,4 @@ export { default as InputResourceList } from './InputResourceList/InputResourceL
 export * from './InputCombobox';
 export * from './InputOTP';
 export * from './InputCounter';
+export * from './InputDateRange';