@web-fuse/wf-components 1.0.5 → 1.0.7

package/dist/util/index.d.ts

@@ -1 +1,2 @@
 export * from "./wfDarkAlgorithm";
+export * from "./useMessageApi";

package/dist/util/randomstring.d.ts

@@ -0,0 +1,5 @@
+/**
+ * returns a random string with the desired length
+ */
+declare const getRandomString: (length: number) => string;
+export default getRandomString;

package/dist/util/useMessageApi.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import type { MessageInstance } from "antd/es/message/interface";
+export declare const MessageProvider: ({ children }: React.PropsWithChildren) => import("react").FunctionComponentElement<import("react").ProviderProps<MessageInstance | null>>;
+export declare const useMessageApi: () => MessageInstance | null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web-fuse/wf-components",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "A library containing common form and display components",
   "type": "module",
   "main": "dist/index.cjs.js",

package/readme.md

@@ -17,6 +17,12 @@ To make changes in the repository you should first run storybook as explained in
 
 Each component must always be exported using `export default` and each component must always be assigned to a `const` variable before it is exported. If this is not done vite may have problems rebuilding the component and React will not know the name of the component.
 
+## Ant design global message API
+
+You can create a global context for the ant design message API by using the `MessageProvider` component. The messages can be styled by placing the `ConfigurationProvider` higher in the component tree and [customizing the theme](https://ant.design/components/message#design-token). Use the `useMessageApi` hook to access the message API and show message to the user.
+
+It is currently not possible to create nested MessageProviders.
+
 ## Custom theme algorithm for antd
 
 If you are using the `theme.darkAlgorithm` in your antd `ConfigProvider` you may notice that your primary color is not preserved. Therefor this package includes the `wfDarkAlgorithm` export. The only change, compared the the darkAlgorithm exported by antd, is that it takes retains your primary color.

package/dist/Form/Input.d.ts

@@ -1,16 +0,0 @@
-/// <reference types="react" />
-import { InputProps as AntProps, InputRef } from "antd";
-export declare const HtmlInput: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<AntProps & import("react").RefAttributes<InputRef>, "ref"> & {
-    ref?: ((instance: InputRef | null) => void) | import("react").RefObject<InputRef> | null | undefined;
-}, never>> & Omit<import("react").ForwardRefExoticComponent<AntProps & import("react").RefAttributes<InputRef>> & {
-    Group: import("react").FC<import("antd/es/input").GroupProps>;
-    Search: import("react").ForwardRefExoticComponent<import("antd/es/input").SearchProps & import("react").RefAttributes<InputRef>>;
-    TextArea: import("react").ForwardRefExoticComponent<import("antd/es/input").TextAreaProps & import("react").RefAttributes<import("antd/es/input/TextArea").TextAreaRef>>;
-    Password: import("react").ForwardRefExoticComponent<import("antd/es/input").PasswordProps & import("react").RefAttributes<InputRef>>;
-    OTP: import("react").ForwardRefExoticComponent<import("antd/es/input/OTP").OTPProps & import("react").RefAttributes<import("antd/es/input/OTP").OTPRef>>;
-}, keyof import("react").Component<any, {}, any>>;
-interface InputProps extends AntProps {
-    label?: React.ReactNode;
-}
-declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<InputRef>>;
-export default Input;