welcome-ui 8.1.0-alpha.3 → 8.1.1

package/dist/types/components/Toggle/styles.d.ts

@@ -1,16 +1,15 @@
-import { CheckboxProps } from '../Checkbox';
-import { ToggleOptions } from './index';
 import { Size } from './theme';
+import { ToggleOptions } from './index';
 import * as Ariakit from '@ariakit/react';
 export declare const Toggle: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Ariakit.CheckboxOptions<"input"> & Omit<Omit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
-    ref?: ((instance: HTMLInputElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<HTMLInputElement> | null | undefined;
+    ref?: import('react').Ref<HTMLInputElement>;
 }, keyof Ariakit.CheckboxOptions<T>> & {
     [index: `data-${string}`]: unknown;
 }, ToggleOptions>> & string & Omit<(props: Ariakit.CheckboxProps) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>>, keyof import('react').Component<any, {}, any>>;
 export declare const Wrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, {
-    onClick: CheckboxProps["onClick"];
+    onClick: React.MouseEventHandler<HTMLInputElement>;
 }>> & string;
 export declare const IconWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, {
-    checked?: boolean;
+    checked: boolean;
     size: Size;
 }>> & string;

package/dist/types/components/Toggle/theme.d.ts

@@ -1,11 +1,11 @@
 import { CSSObject } from '@xstyled/styled-components';
-import { ThemeValues } from '../theme';
+import { ThemeValues } from '../../theme';
 export type Size = 'xs' | 'sm' | 'md';
+type State = 'default' | 'checked' | 'disabled';
 export type ThemeToggles = {
-    after: Record<'sizes' | State, CSSObject>;
-    icon: Record<'position' | 'sizes', CSSObject>;
-    item: Record<'sizes' | State, CSSObject>;
+    after: Record<State | 'sizes', CSSObject>;
+    icon: Record<'sizes' | 'position', CSSObject>;
+    item: Record<State | 'sizes', CSSObject>;
 };
-type State = 'checked' | 'default' | 'disabled';
 export declare const getToggles: (theme: ThemeValues) => ThemeToggles;
 export {};

package/dist/types/components/Tooltip/index.d.ts

@@ -3,9 +3,9 @@ import { CreateWuiProps } from '../System';
 import * as Ariakit from '@ariakit/react';
 export type TooltipOptions = {
     children: React.ReactNode;
-    content: JSX.Element | string;
+    content: string | JSX.Element;
     fixed?: boolean;
     withArrow?: boolean;
-} & Pick<Ariakit.TooltipOptions, 'gutter'> & Pick<Ariakit.TooltipStoreProps, 'placement'>;
+} & Pick<Ariakit.TooltipStoreProps, 'placement'> & Pick<Ariakit.TooltipOptions, 'gutter'>;
 export type TooltipProps = CreateWuiProps<'div', TooltipOptions>;
 export declare const Tooltip: import('../System').CreateWuiComponent<"div", TooltipProps>;

package/dist/types/components/Tooltip/styles.d.ts

@@ -2,7 +2,7 @@ import { TooltipProps } from './index';
 type FadeIn = {
     fixed?: boolean;
     placement?: TooltipProps['placement'];
-    popoverHeight?: number;
+    popoverHeight: number;
     withArrow?: boolean;
 };
 export declare const FadeIn: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, FadeIn>> & string;

package/dist/types/components/Tooltip/theme.d.ts

@@ -1,4 +1,4 @@
 import { CSSObject } from '@xstyled/styled-components';
-import { ThemeValues } from '../theme';
+import { ThemeValues } from '../../theme';
 export type ThemeTooltips = CSSObject;
 export declare const getTooltips: (theme: ThemeValues) => ThemeTooltips;

package/dist/types/components/VariantIcon/index.d.ts

@@ -1,5 +1,5 @@
-import { CreateWuiProps } from '../System';
 import { Size, Variant } from './theme';
+import { CreateWuiProps } from '../System';
 export interface VariantIconOptions {
     icon?: JSX.Element;
     size?: Size;

package/dist/types/components/VariantIcon/styles.d.ts

@@ -1,4 +1,4 @@
 import { VariantIconOptions } from '.';
 export declare const VariantIcon: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, {
-    variant: string | VariantIconOptions["variant"];
+    variant: VariantIconOptions["variant"] | string;
 }>> & string;

package/dist/types/components/VariantIcon/theme.d.ts

@@ -1,6 +1,6 @@
 import { CSSObject } from '@xstyled/styled-components';
-import { ThemeValues } from '../theme';
+import { ThemeValues } from '../../theme';
 export type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+export type Variant = 'danger' | 'warning' | 'success' | 'info' | 'default' | 'ai';
 export type ThemeVariantIcon = Record<Variant, CSSObject>;
-export type Variant = 'ai' | 'danger' | 'default' | 'info' | 'success' | 'warning';
 export declare const getVariantIcon: (theme: ThemeValues) => ThemeVariantIcon;

package/dist/types/components/WuiProvider/font.d.ts

@@ -1,5 +1,5 @@
 import { css } from '@xstyled/styled-components';
-import { ThemeValues } from '../theme';
+import { ThemeValues } from '../../theme';
 type FontVariation = {
     display?: FontDisplay;
     extensions?: string[];
@@ -9,6 +9,8 @@ type FontVariation = {
     url: string;
     weight?: string;
 };
-export declare function getSource(url: FontVariation['url'], extensions: FontVariation['extensions'], isVariable: FontVariation['isVariable']): string | undefined;
-export declare const fonts: (theme: ThemeValues) => null | ReturnType<typeof css>;
+export declare function getSource(url: FontVariation['url'], extensions: FontVariation['extensions'], isVariable: FontVariation['isVariable']): string;
+export declare const fonts: () => ({ theme }: {
+    theme: ThemeValues;
+}) => ReturnType<typeof css>;
 export {};

package/dist/types/components/WuiProvider/index.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
-import { ThemeValues } from '../theme';
+import { ThemeValues } from '../../theme';
 export interface WuiProviderProps {
     children?: React.ReactNode;
     hasGlobalStyle?: boolean;

package/dist/types/theme/colors.d.ts

@@ -100,7 +100,6 @@ declare const palette: {
     'yellow-90': string;
 };
 export declare const getColors: (systemColors: typeof palette) => {
-    overlay: string;
     'primary-10': string;
     'primary-20': string;
     'primary-30': string;
@@ -116,6 +115,7 @@ export declare const getColors: (systemColors: typeof palette) => {
     'secondary-pink': string;
     'secondary-teal': string;
     'secondary-violet': string;
+    overlay: string;
     'beige-10': string;
     'beige-20': string;
     'beige-30': string;
@@ -217,7 +217,6 @@ export declare const getColors: (systemColors: typeof palette) => {
     'yellow-90': string;
 };
 export declare const colors: {
-    overlay: string;
     'primary-10': string;
     'primary-20': string;
     'primary-30': string;
@@ -233,6 +232,7 @@ export declare const colors: {
     'secondary-pink': string;
     'secondary-teal': string;
     'secondary-violet': string;
+    overlay: string;
     'beige-10': string;
     'beige-20': string;
     'beige-30': string;
@@ -334,5 +334,13 @@ export declare const colors: {
     'yellow-90': string;
 };
 export type ThemeColors = typeof colors;
-export type ThemeSecondaryColors = 'blue' | 'green' | 'orange' | 'pink' | 'teal' | 'violet';
+declare const enum SecondaryColors {
+    'blue' = 0,
+    'green' = 1,
+    'orange' = 2,
+    'pink' = 3,
+    'teal' = 4,
+    'violet' = 5
+}
+export type ThemeSecondaryColors = keyof typeof SecondaryColors;
 export {};

package/dist/types/theme/dark.d.ts

@@ -1,6 +1,6 @@
 import { ThemeValues } from '.';
 type RecursivePartial<T> = {
-    [P in keyof T]?: RecursivePartial<T[P]> | T[P];
+    [P in keyof T]?: T[P] | RecursivePartial<T[P]>;
 };
 export declare const colorsDark: ThemeValues['colors'];
 export declare const darkTheme: RecursivePartial<ThemeValues>;

package/dist/types/theme/defaultFields.d.ts

@@ -1,6 +1,11 @@
 import { CSSObject } from '@xstyled/styled-components';
+import { DefaultFieldStylesProps } from '../utils/field-styles';
 import { ThemeValues } from '.';
-import { Size } from '../utils/field-styles';
+type VariantsTheme = {
+    danger: CSSObject;
+    success: CSSObject;
+    warning: CSSObject;
+};
 export type ThemeDefaultFields = {
     checkableField: {
         checked: CSSObject;
@@ -13,11 +18,11 @@ export type ThemeDefaultFields = {
     default: CSSObject;
     disabled: CSSObject;
     fieldset: CSSObject;
-    focused: {
+    focused: VariantsTheme & {
         default: CSSObject;
-    } & VariantsTheme;
+    };
     hover: CSSObject;
-    iconPlacement: Record<Size, CSSObject>;
+    iconPlacement: Record<DefaultFieldStylesProps['size'], CSSObject>;
     placeholder: CSSObject;
     select: {
         default: CSSObject;
@@ -27,13 +32,8 @@ export type ThemeDefaultFields = {
         selected: CSSObject;
         selectedAndHighlighted: CSSObject;
     };
-    sizes: Record<Size, CSSObject>;
+    sizes: Record<DefaultFieldStylesProps['size'], CSSObject>;
     variants: VariantsTheme;
 };
-type VariantsTheme = {
-    danger: CSSObject;
-    success: CSSObject;
-    warning: CSSObject;
-};
 export declare const getDefaultFields: (theme: ThemeValues) => ThemeDefaultFields;
 export {};

package/dist/types/theme/fonts.d.ts

@@ -1,9 +1,4 @@
 import { ThemeValues } from '.';
-export type ThemeFontFaces = {
-    'welcome-font': FontFace[];
-    'welcome-icon-font': FontFace[];
-    'work-sans': FontFace[];
-};
 type FontFace = {
     display?: FontDisplay;
     extensions?: string[];
@@ -14,5 +9,10 @@ type FontFace = {
     url: string;
     weight?: string;
 };
+export type ThemeFontFaces = {
+    'welcome-font': FontFace[];
+    'welcome-icon-font': FontFace[];
+    'work-sans': FontFace[];
+};
 export declare const fontFaces: (theme: ThemeValues) => ThemeFontFaces;
 export {};

package/dist/types/theme/index.d.ts

@@ -6,16 +6,16 @@ import { ThemeBadges } from '../components/Badge/theme';
 import { ThemeBreadcrumbs } from '../components/Breadcrumb/theme';
 import { ThemeButtons } from '../components/Button/theme';
 import { ThemeCards } from '../components/Card/theme';
-import { ThemeCheckboxes } from '../components/Checkbox/theme';
 import { ThemeDateTimePickerCommon } from '../components/DateTimePickerCommon/theme';
+import { ThemeCheckboxes } from '../components/Checkbox/theme';
 import { ThemeDrawers } from '../components/Drawer/theme';
 import { ThemeDropdownMenu } from '../components/DropdownMenu/theme';
 import { ThemeFileDrops } from '../components/FileDrop/theme';
 import { ThemeHints } from '../components/Hint/theme';
-import { ThemeIcons } from '../components/Icon/theme';
 import { ThemeLabels } from '../components/Label/theme';
 import { ThemeLinks } from '../components/Link/theme';
 import { ThemeLoaders } from '../components/Loader/theme';
+import { ThemeIcons } from '../components/Icon/theme';
 import { ThemeModals } from '../components/Modal/theme';
 import { ThemePagination } from '../components/Pagination/theme';
 import { ThemePopovers } from '../components/Popover/theme';
@@ -31,33 +31,24 @@ import { ThemeToasts } from '../components/Toast/theme';
 import { ThemeToggles } from '../components/Toggle/theme';
 import { ThemeTooltips } from '../components/Tooltip/theme';
 import { ThemeVariantIcon } from '../components/VariantIcon/theme';
-import { ThemeBorderWidths } from './borders';
+import { darkTheme } from './dark';
 import { ThemeColors } from './colors';
-import { ThemeDefaultFields } from './defaultFields';
-import { ThemeFocus } from './focus';
 import { ThemeFontFaces } from './fonts';
+import { ThemeFonts, ThemeFontSizes, ThemeFontWeights, ThemeLetterSpacings, ThemeLineHeights, ThemeTexts, ThemeTextsFontColors, ThemeTextsFontFamily, ThemeTextsFontWeights, ThemeTextsTextTransform } from './typography';
+import { ThemeTimingFunction, ThemeTransitions } from './transitions';
+import { ThemeUnderline } from './underline';
 import { ThemeRadii } from './radii';
+import { ThemeBorderWidths } from './borders';
 import { ThemeScreens } from './screens';
-import { ThemeSelection } from './selection';
 import { ThemeShadows } from './shadows';
 import { ThemeSpace } from './space';
-import { ThemeTimingFunction, ThemeTransitions } from './transitions';
-import { ThemeFonts, ThemeFontSizes, ThemeFontWeights, ThemeLetterSpacings, ThemeLineHeights, ThemeTexts, ThemeTextsFontColors, ThemeTextsFontFamily, ThemeTextsFontWeights, ThemeTextsTextTransform } from './typography';
-import { ThemeUnderline } from './underline';
-import { darkTheme } from './dark';
-export type ThemeColorTokens = keyof ThemeColors;
-export type ThemeFontsUrl = 'https://cdn.welcome-ui.com/fonts' | 'https://cdn.welcometothejungle.com/fonts' | string;
-export type ThemeProps = {
-    [param: string]: unknown;
-    defaultFontFamily?: string;
-    defaultFontSize?: number;
-    defaultLetterSpacing?: string;
-    defaultLineHeight?: number;
-    fontsUrl?: ThemeFontsUrl;
-    headingFontFamily?: string;
-    iconFontFamily?: string;
-};
-export interface ThemeValues extends Omit<XStyledTheme, 'transitions'>, StyledComponentsTheme {
+import { ThemeSelection } from './selection';
+import { ThemeFocus } from './focus';
+import { ThemeDefaultFields } from './defaultFields';
+type OverrideKeys = 'colors' | 'radii' | 'borderWidths' | 'fontSizes' | 'lineHeights' | 'fontWeights' | 'letterSpacings' | 'fonts' | 'sizes' | 'screens' | 'space' | 'shadows' | 'texts';
+type XStyledTheme = Omit<XStyledDefaultTheme, OverrideKeys>;
+type StyledComponentsTheme = Omit<StyledComponentDefaultTheme, OverrideKeys>;
+export interface ThemeValues extends XStyledTheme, StyledComponentsTheme {
     accordions: ThemeAccordions;
     alerts: ThemeAlerts;
     avatars: ThemeAvatars;
@@ -77,10 +68,10 @@ export interface ThemeValues extends Omit<XStyledTheme, 'transitions'>, StyledCo
     fileDrops: ThemeFileDrops;
     focus: ThemeFocus;
     fontFaces: ThemeFontFaces;
-    fonts: ThemeFonts;
     fontSizes: ThemeFontSizes;
-    fontsUrl: ThemeFontsUrl;
     fontWeights: ThemeFontWeights;
+    fonts: ThemeFonts;
+    fontsUrl: ThemeFontsUrl;
     hints: ThemeHints;
     icons: ThemeIcons;
     inset: ThemeSpace;
@@ -111,12 +102,12 @@ export interface ThemeValues extends Omit<XStyledTheme, 'transitions'>, StyledCo
     textsFontWeights: ThemeTextsFontWeights;
     textsTextTransform: ThemeTextsTextTransform;
     timingFunction: ThemeTimingFunction;
-    toasts: ThemeToasts;
     toEm: (int: number) => string;
-    toggles: ThemeToggles;
-    tooltips: ThemeTooltips;
     toPx: (int: number) => string;
     toRem: (int: number) => string;
+    toasts: ThemeToasts;
+    toggles: ThemeToggles;
+    tooltips: ThemeTooltips;
     transformers: {
         border: (value: CSSScalar) => CSSScalar;
         px: (value: CSSScalar) => CSSScalar;
@@ -125,8 +116,17 @@ export interface ThemeValues extends Omit<XStyledTheme, 'transitions'>, StyledCo
     underline: ThemeUnderline;
     variantIcon: ThemeVariantIcon;
 }
-type OverrideKeys = 'borderWidths' | 'colors' | 'fonts' | 'fontSizes' | 'fontWeights' | 'letterSpacings' | 'lineHeights' | 'radii' | 'screens' | 'shadows' | 'sizes' | 'space' | 'texts';
-type StyledComponentsTheme = Omit<StyledComponentDefaultTheme, OverrideKeys>;
-type XStyledTheme = Omit<XStyledDefaultTheme, OverrideKeys>;
+export type ThemeFontsUrl = 'https://cdn.welcome-ui.com/fonts' | 'https://cdn.welcometothejungle.com/fonts' | string;
+export type ThemeColorTokens = keyof ThemeColors;
+export type ThemeProps = {
+    [param: string]: unknown;
+    defaultFontFamily?: string;
+    defaultFontSize?: number;
+    defaultLetterSpacing?: string;
+    defaultLineHeight?: number;
+    fontsUrl?: ThemeFontsUrl;
+    headingFontFamily?: string;
+    iconFontFamily?: string;
+};
 export declare const createTheme: (options?: ThemeProps) => ThemeValues;
 export { darkTheme };

package/dist/types/theme/screens.d.ts

@@ -1,6 +1,6 @@
 export type ThemeScreens = {
-    [key: number]: number;
     [key: string]: number;
+    [key: number]: number;
     '3xl': number;
     '4xl': number;
     lg: number;

package/dist/types/theme/space.d.ts

@@ -1,7 +1,7 @@
 import { ThemeValues } from '.';
 export type ThemeSpace = {
-    [key: number]: string;
     [key: string]: string;
+    [key: number]: string;
     '3xl': string;
     '4xl': string;
     '5xl': string;

package/dist/types/theme/typography.d.ts

@@ -127,7 +127,7 @@ export type ThemeTexts = {
 export declare const getTexts: (theme: ThemeValues) => ThemeTexts;
 export type ThemeFonts = {
     headings: string;
-    icons?: string;
+    icons: string;
     texts: string;
 };
 export declare const getFonts: (defaultFontFamily: ThemeProps["defaultFontFamily"], headingFontFamily: ThemeProps["headingFontFamily"], iconFontFamily: ThemeProps["iconFontFamily"]) => ThemeFonts;

package/dist/types/utils/field-styles.d.ts

@@ -1,17 +1,17 @@
 import { css } from '@xstyled/styled-components';
 export type DefaultFieldIconSize = 'sm' | 'xs';
-export type Size = 'lg' | 'md' | 'sm' | 'xs';
+export type Size = 'xs' | 'sm' | 'md' | 'lg';
 export declare const FIELD_ICON_SIZE: {
     [key in Size]: DefaultFieldIconSize;
 };
-export type DefaultFieldStylesProps = {
+export type DefaultFieldStylesProps = Partial<{
     hasIcon?: boolean;
-    iconPlacement?: 'both' | 'left' | 'right';
+    iconPlacement?: 'right' | 'left' | 'both';
     isClearable?: boolean;
-    size?: Size;
+    size: Size;
     transparent?: boolean;
-    variant?: 'danger' | 'success' | 'warning';
-};
+    variant: 'danger' | 'success' | 'warning';
+}>;
 type DefaultFieldStyles = (args: DefaultFieldStylesProps) => ReturnType<typeof css>;
 export declare const defaultFieldStyles: DefaultFieldStyles;
 export {};

package/dist/types/utils/index.d.ts

@@ -1,10 +1,10 @@
-export * from './field-styles';
 export * from './format-bytes';
 export * from './hex-to-rgba';
+export * from './field-styles';
 export * from './overflow-ellipsis';
 export * from './throttle';
-export * from './ts-utils';
 export * from './use-copy-text';
 export * from './use-fork-ref';
 export * from './use-isomorphic-layout-effect';
 export * from './use-viewport';
+export * from './ts-utils';

package/dist/types/utils/ts-utils.d.ts

@@ -16,4 +16,4 @@
  * const bg: color = 'yellow'
  * const bg: color = '#FFF'
  */
-export type LiteralUnion<T, U = string> = (Record<never, never> & U) | T;
+export type LiteralUnion<T, U = string> = T | (U & Record<never, never>);

package/dist/types/utils/use-copy-text.d.ts

@@ -1,4 +1,4 @@
-type Content = number | React.RefObject<HTMLElement | HTMLInputElement> | string;
+type Content = React.RefObject<HTMLElement | HTMLInputElement> | number | string;
 type Timeout = number;
 type useCopyTextReturn = [() => void, boolean];
 export declare function useCopyText(content: Content, timeout: Timeout): useCopyTextReturn;

package/dist/types/utils/use-create-portal.d.ts

@@ -1,4 +1,4 @@
 /**
  * Hook that mimic the React createPortal function in order to make it SSR friendly
  */
-export declare function useCreatePortal(disable?: boolean): ((children: React.ReactNode) => unknown) | ((children: React.ReactNode, container?: DocumentFragment | Element, key?: null | string) => import('react').ReactPortal);
+export declare function useCreatePortal(disable?: boolean): ((children: React.ReactNode) => any) | ((children: React.ReactNode, container?: Element | DocumentFragment, key?: string | null) => import('react').ReactPortal);

package/dist/types/utils/use-viewport.d.ts

@@ -1,6 +1,6 @@
 type Size = {
-    height: number | undefined;
-    width: number | undefined;
+    height: number;
+    width: number;
 };
 export declare function useViewportSize(): Size;
 export {};

package/dist/types/utils/wrap-children.d.ts

@@ -1 +1 @@
-export declare const wrapChildren: (children?: JSX.Element | string) => unknown;
+export declare const wrapChildren: (children?: string | JSX.Element) => unknown;

package/dist/{use-fork-ref-DvaCTfQ_.mjs → use-fork-ref-CUZErtAC.mjs}

@@ -3,13 +3,12 @@ import { useMemo as e } from "react";
 function o(u, n) {
   typeof u == "function" ? u(n) : u && (u.current = n);
 }
-function s(u, n) {
-  return e(() => u == null && n == null ? () => {
-  } : (t) => {
+function l(u, n) {
+  return e(() => u == null && n == null ? null : (t) => {
     o(u, t), o(n, t);
   }, [u, n]);
 }
 export {
   o as s,
-  s as u
+  l as u
 };

package/dist/{use-viewport-CWpjoHXy.mjs → use-viewport-CfklieD-.mjs}

@@ -4,9 +4,9 @@ import { u as o } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
 function w() {
   const [t, e] = n({ height: void 0, width: void 0 });
   return o(() => {
-    e({ height: window.innerHeight, width: window.innerWidth });
+    e({ width: window.innerWidth, height: window.innerHeight });
     function i() {
-      e({ height: window.innerHeight, width: window.innerWidth });
+      e({ width: window.innerWidth, height: window.innerHeight });
     }
     return window.addEventListener("resize", i), () => window.removeEventListener("resize", i);
   }, []), t;

package/dist/utils.mjs

@@ -1,106 +1,33 @@
 "use client";
-import { F as L, d as q } from "./field-styles-BVlRlvuu.mjs";
-import { f as N } from "./format-bytes-gST0dTWd.mjs";
-import { h as P } from "./hex-to-rgba-DU_XzKIK.mjs";
-import { o as B } from "./overflow-ellipsis-DGV5Kgt-.mjs";
-import { t as j } from "./throttle-CW18pWlW.mjs";
-import { g as w } from "./_commonjsHelpers-CXJ7dpIk.mjs";
-import { useState as D, useCallback as E } from "react";
-import { s as K, u as O } from "./use-fork-ref-DvaCTfQ_.mjs";
-import { u as X } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
-import { u as $ } from "./use-viewport-CWpjoHXy.mjs";
-var m, C;
-function T() {
-  return C || (C = 1, m = function() {
-    var e = document.getSelection();
-    if (!e.rangeCount)
-      return function() {
-      };
-    for (var o = document.activeElement, c = [], l = 0; l < e.rangeCount; l++)
-      c.push(e.getRangeAt(l));
-    switch (o.tagName.toUpperCase()) {
-      // .toUpperCase handles XHTML
-      case "INPUT":
-      case "TEXTAREA":
-        o.blur();
-        break;
-      default:
-        o = null;
-        break;
-    }
-    return e.removeAllRanges(), function() {
-      e.type === "Caret" && e.removeAllRanges(), e.rangeCount || c.forEach(function(u) {
-        e.addRange(u);
-      }), o && o.focus();
-    };
-  }), m;
-}
-var y, b;
-function h() {
-  if (b) return y;
-  b = 1;
-  var e = T(), o = {
-    "text/plain": "Text",
-    "text/html": "Url",
-    default: "Text"
-  }, c = "Copy to clipboard: #{key}, Enter";
-  function l(a) {
-    var t = (/mac os x/i.test(navigator.userAgent) ? "⌘" : "Ctrl") + "+C";
-    return a.replace(/#{\s*key\s*}/g, t);
-  }
-  function u(a, t) {
-    var s, g, v, f, i, r, p = !1;
-    t || (t = {}), s = t.debug || !1;
-    try {
-      v = e(), f = document.createRange(), i = document.getSelection(), r = document.createElement("span"), r.textContent = a, r.ariaHidden = "true", r.style.all = "unset", r.style.position = "fixed", r.style.top = 0, r.style.clip = "rect(0, 0, 0, 0)", r.style.whiteSpace = "pre", r.style.webkitUserSelect = "text", r.style.MozUserSelect = "text", r.style.msUserSelect = "text", r.style.userSelect = "text", r.addEventListener("copy", function(n) {
-        if (n.stopPropagation(), t.format)
-          if (n.preventDefault(), typeof n.clipboardData > "u") {
-            s && console.warn("unable to use e.clipboardData"), s && console.warn("trying IE specific stuff"), window.clipboardData.clearData();
-            var d = o[t.format] || o.default;
-            window.clipboardData.setData(d, a);
-          } else
-            n.clipboardData.clearData(), n.clipboardData.setData(t.format, a);
-        t.onCopy && (n.preventDefault(), t.onCopy(n.clipboardData));
-      }), document.body.appendChild(r), f.selectNodeContents(r), i.addRange(f);
-      var x = document.execCommand("copy");
-      if (!x)
-        throw new Error("copy command was unsuccessful");
-      p = !0;
-    } catch (n) {
-      s && console.error("unable to copy using execCommand: ", n), s && console.warn("trying IE specific stuff");
-      try {
-        window.clipboardData.setData(t.format || "text", a), t.onCopy && t.onCopy(window.clipboardData), p = !0;
-      } catch (d) {
-        s && console.error("unable to copy using clipboardData: ", d), s && console.error("falling back to prompt"), g = l("message" in t ? t.message : c), window.prompt(g, a);
-      }
-    } finally {
-      i && (typeof i.removeRange == "function" ? i.removeRange(f) : i.removeAllRanges()), r && document.body.removeChild(r), v();
-    }
-    return p;
-  }
-  return y = u, y;
-}
-var S = h();
-const R = /* @__PURE__ */ w(S);
-function A(e, o) {
-  const [c, l] = D(!1);
-  return [E(() => {
-    let a;
-    typeof e == "number" || typeof e == "string" ? a = e.toString() : e.current instanceof HTMLInputElement ? a = e.current.value : e.current instanceof HTMLElement && (a = e.current.textContent);
-    const t = a && R(a);
-    l(t || !1), o && setTimeout(l, o);
-  }, [e, o]), c];
+import { f as y } from "./format-bytes-gST0dTWd.mjs";
+import { h as C } from "./hex-to-rgba-BIDK-3ab.mjs";
+import { F as S, d as T } from "./field-styles-CfVLcVQp.mjs";
+import { o as h } from "./overflow-ellipsis-DGV5Kgt-.mjs";
+import { t as L } from "./throttle-BDBzFeFj.mjs";
+import { useState as p, useCallback as a } from "react";
+import { c as i } from "./index-BhcLigYU.mjs";
+import { s as g, u as v } from "./use-fork-ref-CUZErtAC.mjs";
+import { u as k } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
+import { u as B } from "./use-viewport-CfklieD-.mjs";
+function c(e, r) {
+  const [s, t] = p();
+  return [a(() => {
+    let o;
+    typeof e == "number" || typeof e == "string" ? o = e.toString() : e.current instanceof HTMLInputElement ? o = e.current.value : e.current instanceof HTMLElement && (o = e.current.textContent);
+    const f = i(o);
+    t(f), r && setTimeout(t, r);
+  }, [e, r]), s];
 }
 export {
-  L as FIELD_ICON_SIZE,
-  q as defaultFieldStyles,
-  N as formatBytes,
-  P as hexToRGBA,
-  B as overflowEllipsis,
-  K as setRef,
-  j as throttle,
-  A as useCopyText,
-  O as useForkRef,
-  X as useIsomorphicLayoutEffect,
-  $ as useViewportSize
+  S as FIELD_ICON_SIZE,
+  T as defaultFieldStyles,
+  y as formatBytes,
+  C as hexToRGBA,
+  h as overflowEllipsis,
+  g as setRef,
+  L as throttle,
+  c as useCopyText,
+  v as useForkRef,
+  k as useIsomorphicLayoutEffect,
+  B as useViewportSize
 };