Dashboard sipadu mbip
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

useBreakpoint.d.ts 1.5KB

1234567891011121314151617181920212223242526272829303132333435
  1. export declare type BreakpointDirection = 'up' | 'down' | true;
  2. export declare type BreakpointMap<TKey extends string> = Partial<Record<TKey, BreakpointDirection>>;
  3. /**
  4. * Create a responsive hook we a set of breakpoint names and widths.
  5. * You can use any valid css units as well as a numbers (for pixels).
  6. *
  7. * **NOTE:** The object key order is important! it's assumed to be in order from smallest to largest
  8. *
  9. * ```ts
  10. * const useBreakpoint = createBreakpointHook({
  11. * xs: 0,
  12. * sm: 576,
  13. * md: 768,
  14. * lg: 992,
  15. * xl: 1200,
  16. * })
  17. * ```
  18. *
  19. * **Watch out!** using string values will sometimes construct media queries using css `calc()` which
  20. * is NOT supported in media queries by all browsers at the moment. use numbers for
  21. * the widest range of browser support.
  22. *
  23. * @param breakpointValues A object hash of names to breakpoint dimensions
  24. */
  25. export declare function createBreakpointHook<TKey extends string>(breakpointValues: Record<TKey, string | number>): {
  26. (breakpointMap: Partial<Record<TKey, BreakpointDirection>>): boolean;
  27. (breakpoint: TKey, direction?: true | "up" | "down" | undefined): boolean;
  28. };
  29. export declare type DefaultBreakpoints = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
  30. export declare type DefaultBreakpointMap = BreakpointMap<DefaultBreakpoints>;
  31. declare const useBreakpoint: {
  32. (breakpointMap: Partial<Record<DefaultBreakpoints, BreakpointDirection>>): boolean;
  33. (breakpoint: DefaultBreakpoints, direction?: true | "up" | "down" | undefined): boolean;
  34. };
  35. export default useBreakpoint;