beesoft-components 0.4.7 → 0.4.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "beesoft-components",
-  "version": "0.4.7",
+  "version": "0.4.8",
   "private": false,
   "type": "module",
   "author": {

package/types/index.d.ts

@@ -1,7 +1,9 @@
 import { ButtonHTMLAttributes } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
+import { JSXElementConstructor } from 'react';
 import { default as React_2 } from 'react';
+import { ReactElement } from 'react';
 import { ReactNode } from 'react';
 import { ReactPortal } from 'react';
 import { RefAttributes } from 'react';
@@ -326,6 +328,45 @@ declare interface MarkupEvents {
     markupCreated?: (element: Element) => void;
 }
 
+export declare const MediaQuery: ({ mobileQuery, tabletQuery, desktopQuery, mobileMarkup, aboveMobileMarkup, tabletMarkup, desktopMarkup, }: MediaQueryProps) => string | number | true | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | null;
+
+declare interface MediaQueryProps {
+    /**
+     * The media query for mobile devices.
+     *
+     * Default: `screen and (max-width: 640px)`
+     */
+    mobileQuery?: string;
+    /**
+     * The media query for tablet devices.
+     *
+     * Default: `screen and (min-width: 641px and max-width: 768px)`
+     */
+    tabletQuery?: string;
+    /**
+     * The media query for desktop devices.
+     *
+     * Default: `screen and (min-width: 1024px)`
+     */
+    desktopQuery?: string;
+    /**
+     * Markup to use when a device is a mobile phone.
+     */
+    mobileMarkup?: TypeOrArray<ReactNode>;
+    /**
+     * Markup to use when a device is anything other than a mobile phone.
+     */
+    aboveMobileMarkup?: TypeOrArray<ReactNode>;
+    /**
+     * Markup to use when a device is a tablet.
+     */
+    tabletMarkup?: TypeOrArray<ReactNode>;
+    /**
+     * Markup to use when a device is a desktop.
+     */
+    desktopMarkup?: TypeOrArray<ReactNode>;
+}
+
 export declare const MobileOverlayPanel: ({ visible, target, appendTo, unmountWhenHidden, transitionDuration, showTransitionOptions, hideTransitionOptions, approveText, shown, hidden, isClickedWithin, children, }: MobileOverlayPanelProps) => ReactPortal;
 
 declare interface MobileOverlayPanelProps {