@os-design/core 1.0.255 → 1.0.257

package/dist/InputSearch/index.d.ts

@@ -0,0 +1,30 @@
+import { type InputProps } from '../Input';
+import { type InputSearchLocale } from './utils/defaultLocale';
+export interface InputSearchProps extends Omit<InputProps, 'type' | 'onChange'> {
+    /**
+     * The locale.
+     * @default undefined
+     */
+    locale?: InputSearchLocale;
+    /**
+     * The input value.
+     * @default undefined
+     */
+    value?: string;
+    /**
+     * The default value.
+     * @default undefined
+     */
+    defaultValue?: string;
+    /**
+     * The change event handler.
+     * @default undefined
+     */
+    onChange?: (value: string) => void;
+}
+/**
+ * The search input.
+ */
+declare const InputSearch: import("react").ForwardRefExoticComponent<InputSearchProps & import("react").RefAttributes<HTMLInputElement>>;
+export default InputSearch;
+//# sourceMappingURL=index.d.ts.map

package/dist/InputSearch/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/InputSearch/index.tsx"],"names":[],"mappings":"AAOA,OAAc,EAAE,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAClD,OAAsB,EAAE,KAAK,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE9E,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,UAAU,CAAC;IAC7C;;;OAGG;IACH,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAWD;;GAEG;AACH,QAAA,MAAM,WAAW,+GA4DhB,CAAC;AAIF,eAAe,WAAW,CAAC"}

package/dist/InputSearch/index.js

@@ -0,0 +1,72 @@
+import { keyframes } from '@emotion/react';
+import styled from '@emotion/styled';
+import { CloseCircle, Search } from '@os-design/icons';
+import { ThemeOverrider } from '@os-design/theming';
+import { useForwardedRef, useForwardedState } from '@os-design/utils';
+import { forwardRef } from 'react';
+import Button from "../Button/index.js";
+import Input from "../Input/index.js";
+import defaultLocale from "./utils/defaultLocale.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+const fadeIn = keyframes`
+  from { opacity: 0; }
+  to { opacity: 1; }
+`;
+const ClearButton = styled(Button)`
+  animation: ${fadeIn} ${p => p.theme.transitionDelay}ms;
+`;
+
+/**
+ * The search input.
+ */
+const InputSearch = /*#__PURE__*/forwardRef(({
+  locale = defaultLocale,
+  value,
+  defaultValue,
+  onChange = () => {},
+  disabled,
+  left,
+  leftHasPadding = true,
+  right,
+  ...rest
+}, ref) => {
+  const [inputRef, mergedInputRef] = useForwardedRef(ref);
+  const [forwardedValue, setForwardedValue] = useForwardedState({
+    value,
+    defaultValue,
+    onChange
+  });
+  return /*#__PURE__*/_jsx(Input, {
+    type: "text",
+    left: left || /*#__PURE__*/_jsx(Search, {}, 'search-icon'),
+    leftHasPadding: leftHasPadding,
+    right: /*#__PURE__*/_jsxs(_Fragment, {
+      children: [!!forwardedValue && /*#__PURE__*/_jsx(ThemeOverrider, {
+        overrides: {
+          buttonIconScaleFactor: 1.2
+        },
+        children: /*#__PURE__*/_jsx(ClearButton, {
+          type: "ghost",
+          wide: "never",
+          size: "small",
+          disabled: disabled,
+          onClick: () => {
+            setForwardedValue('');
+            if (!inputRef.current) return;
+            inputRef.current.focus();
+          },
+          "aria-label": locale.clearLabel,
+          children: /*#__PURE__*/_jsx(CloseCircle, {})
+        }, 'clear-button')
+      }), right]
+    }),
+    value: forwardedValue,
+    onChange: setForwardedValue,
+    role: "searchbox",
+    disabled: disabled,
+    ...rest,
+    ref: mergedInputRef
+  });
+});
+InputSearch.displayName = 'InputSearch';
+export default InputSearch;

package/dist/InputSearch/utils/defaultLocale.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaultLocale.d.ts","sourceRoot":"","sources":["../../../src/InputSearch/utils/defaultLocale.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,iBAAiB;IAChC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,aAAa,EAAE,iBAEpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/InputSearch/utils/defaultLocale.js

@@ -0,0 +1,4 @@
+const defaultLocale = {
+  clearLabel: 'Clear'
+};
+export default defaultLocale;

package/dist/InputSkeleton/index.d.ts

@@ -0,0 +1,9 @@
+import { type WithSize } from '@os-design/styles';
+import { type SkeletonProps } from '../Skeleton';
+export type InputSkeletonProps = Omit<SkeletonProps, 'width'> & WithSize;
+/**
+ * Provides an input placeholder while a user waits for the content to load.
+ */
+declare const InputSkeleton: import("react").ForwardRefExoticComponent<Omit<SkeletonProps, "width"> & WithSize & import("react").RefAttributes<HTMLDivElement>>;
+export default InputSkeleton;
+//# sourceMappingURL=index.d.ts.map

package/dist/InputSkeleton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/InputSkeleton/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG9D,OAAiB,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAE3D,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC;AAUzE;;GAEG;AACH,QAAA,MAAM,aAAa,oIAElB,CAAC;AAIF,eAAe,aAAa,CAAC"}

package/dist/InputSkeleton/index.js

@@ -0,0 +1,21 @@
+import styled from '@emotion/styled';
+import { sizeStyles } from '@os-design/styles';
+import { omitEmotionProps } from '@os-design/utils';
+import { forwardRef } from 'react';
+import Skeleton from "../Skeleton/index.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const StyledInputSkeleton = styled(Skeleton, omitEmotionProps('size'))`
+  height: ${p => p.theme.baseHeight}em;
+  ${sizeStyles};
+`;
+
+/**
+ * Provides an input placeholder while a user waits for the content to load.
+ */
+const InputSkeleton = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/_jsx(StyledInputSkeleton, {
+  width: "100%",
+  ...props,
+  ref: ref
+}));
+InputSkeleton.displayName = 'InputSkeleton';
+export default InputSkeleton;

package/dist/Layout/LayoutContext.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+export interface LayoutContextProps {
+    /**
+     * Whether there is the navigation in the layout.
+     */
+    hasNavigation: boolean;
+    /**
+     * Whether there is the page header in the layout.
+     */
+    hasPageHeader: boolean;
+}
+declare const LayoutContext: React.Context<LayoutContextProps>;
+export default LayoutContext;
+//# sourceMappingURL=LayoutContext.d.ts.map

package/dist/Layout/LayoutContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutContext.d.ts","sourceRoot":"","sources":["../../src/Layout/LayoutContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,aAAa,mCAGjB,CAAC;AAIH,eAAe,aAAa,CAAC"}

package/dist/Layout/LayoutContext.js

@@ -0,0 +1,7 @@
+import React from 'react';
+const LayoutContext = /*#__PURE__*/React.createContext({
+  hasNavigation: false,
+  hasPageHeader: false
+});
+LayoutContext.displayName = 'LayoutContext';
+export default LayoutContext;

package/dist/Layout/index.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+export interface LayoutProps {
+    /**
+     * Whether there is the navigation in the layout.
+     * @default false
+     */
+    hasNavigation?: boolean;
+    /**
+     * Whether there is the page header in the layout.
+     * @default false
+     */
+    hasPageHeader?: boolean;
+    /**
+     * The children.
+     * @default undefined
+     */
+    children?: React.ReactNode;
+}
+/**
+ * The layout of the page.
+ */
+declare const Layout: React.FC<LayoutProps>;
+export default Layout;
+//# sourceMappingURL=index.d.ts.map

package/dist/Layout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Layout/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAGvC,MAAM,WAAW,WAAW;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAejC,CAAC;AAIF,eAAe,MAAM,CAAC"}

package/dist/Layout/index.js

@@ -0,0 +1,22 @@
+import React, { useMemo } from 'react';
+import LayoutContext from "./LayoutContext.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * The layout of the page.
+ */
+const Layout = ({
+  hasNavigation = false,
+  hasPageHeader = false,
+  children
+}) => {
+  const contextValue = useMemo(() => ({
+    hasNavigation,
+    hasPageHeader
+  }), [hasNavigation, hasPageHeader]);
+  return /*#__PURE__*/_jsx(LayoutContext.Provider, {
+    value: contextValue,
+    children: children
+  });
+};
+Layout.displayName = 'Layout';
+export default Layout;

package/dist/Link/index.d.ts

@@ -0,0 +1,37 @@
+import { type WithSize } from '@os-design/styles';
+import React from 'react';
+export interface ReactRouterLinkProps {
+    to?: string;
+    replace?: boolean;
+}
+type JsxAProps = Omit<JSX.IntrinsicElements['a'], 'ref'>;
+export interface LinkProps extends JsxAProps, ReactRouterLinkProps, WithSize {
+    /**
+     * Type of the underline styles.
+     * @default hover
+     */
+    underline?: 'hover' | 'always' | 'never';
+    /**
+     * Whether the link is disabled.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * The custom link component.
+     * For example, the Link from react-router-dom.
+     * @default undefined
+     */
+    as?: React.ElementType;
+}
+export declare const underlineHoverStyles: (p: any) => false | import("@emotion/utils").SerializedStyles;
+export declare const underlineAlwaysStyles: (p: any) => false | import("@emotion/utils").SerializedStyles;
+export declare const DisabledWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * The link component to navigate between pages.
+ */
+declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
+export default Link;
+//# sourceMappingURL=index.d.ts.map

package/dist/Link/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Link/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,QAAQ,EACd,MAAM,mBAAmB,CAAC;AAG3B,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,MAAM,WAAW,oBAAoB;IACnC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,KAAK,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,CAAC;AACzD,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,oBAAoB,EAAE,QAAQ;IAC1E;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;CACxB;AAgBD,eAAO,MAAM,oBAAoB,+DAkB9B,CAAC;AAEJ,eAAO,MAAM,qBAAqB,+DAS/B,CAAC;AAcJ,eAAO,MAAM,eAAe;;SAvET,MAAO,WAAW;qFA2EpC,CAAC;AAyBF;;GAEG;AACH,QAAA,MAAM,IAAI,qFAgCT,CAAC;AAIF,eAAe,IAAI,CAAC"}

package/dist/Link/index.js

@@ -0,0 +1,111 @@
+import { css } from '@emotion/react';
+import styled from '@emotion/styled';
+import { resetFocusStyles, sizeStyles, transitionStyles } from '@os-design/styles';
+import { clr } from '@os-design/theming';
+import { omitEmotionProps } from '@os-design/utils';
+import React, { forwardRef } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+const underlineBaseStyles = p => css`
+  position: relative;
+  display: inline-block;
+
+  &::after {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    content: '';
+    height: 0.125em;
+    background-color: ${clr(p.theme.linkColor)};
+  }
+`;
+export const underlineHoverStyles = p => p.underline === 'hover' && css`
+    @media (hover: hover) {
+      ${underlineBaseStyles(p)};
+
+      &::after {
+        width: 0;
+        opacity: 0;
+        ${transitionStyles('width', 'opacity')(p)};
+      }
+
+      &:hover::after,
+      &:focus::after {
+        width: 100%;
+        opacity: 1;
+      }
+    }
+  `;
+export const underlineAlwaysStyles = p => p.underline === 'always' && css`
+    ${underlineBaseStyles(p)};
+
+    &::after {
+      width: 100%;
+      opacity: 1;
+    }
+  `;
+const disabledStyles = p => p.disabled && css`
+    pointer-events: none;
+
+    &,
+    &:active,
+    &:focus {
+      color: ${clr(p.theme.inputColorPlaceholder)};
+    }
+  `;
+export const DisabledWrapper = styled.div`
+  display: inline-block;
+  cursor: not-allowed;
+  line-height: 1.2;
+`;
+const StyledLink = styled('a', omitEmotionProps('size', 'underline', 'disabled', 'as'))`
+  ${resetFocusStyles};
+
+  cursor: pointer;
+  text-decoration: none;
+  line-height: 1.2;
+  padding-bottom: 0.1em;
+
+  &,
+  &:active,
+  &:focus {
+    color: ${p => clr(p.theme.linkColor)};
+  }
+
+  ${underlineHoverStyles};
+  ${underlineAlwaysStyles};
+  ${disabledStyles};
+  ${sizeStyles};
+`;
+
+/**
+ * The link component to navigate between pages.
+ */
+const Link = /*#__PURE__*/forwardRef(({
+  underline = 'hover',
+  disabled = false,
+  as,
+  onMouseDown = () => {},
+  ...rest
+}, ref) => {
+  if (disabled) {
+    return /*#__PURE__*/_jsx(DisabledWrapper, {
+      children: /*#__PURE__*/_jsx(StyledLink, {
+        disabled: true,
+        ...rest,
+        ref: ref
+      })
+    });
+  }
+  return /*#__PURE__*/_jsx(StyledLink, {
+    underline: underline,
+    as: as,
+    onMouseDown: e => {
+      onMouseDown(e);
+      e.preventDefault();
+    },
+    ...rest,
+    ref: ref
+  });
+});
+Link.displayName = 'Link';
+export default Link;

package/dist/LinkButton/index.d.ts

@@ -0,0 +1,20 @@
+import { type WithSize } from '@os-design/styles';
+type JsxButtonProps = Omit<JSX.IntrinsicElements['button'], 'ref'>;
+export interface LinkButtonProps extends JsxButtonProps, WithSize {
+    /**
+     * Type of the underline styles.
+     * @default hover
+     */
+    underline?: 'hover' | 'always' | 'never';
+    /**
+     * Whether the link is disabled.
+     * @default false
+     */
+    disabled?: boolean;
+}
+/**
+ * The link component that is rendered as a button.
+ */
+declare const LinkButton: import("react").ForwardRefExoticComponent<LinkButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export default LinkButton;
+//# sourceMappingURL=index.d.ts.map

package/dist/LinkButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/LinkButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGL,KAAK,QAAQ,EACd,MAAM,mBAAmB,CAAC;AAU3B,KAAK,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,CAAC;AAEnE,MAAM,WAAW,eAAgB,SAAQ,cAAc,EAAE,QAAQ;IAC/D;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA2BD;;GAEG;AACH,QAAA,MAAM,UAAU,+GAyBf,CAAC;AAIF,eAAe,UAAU,CAAC"}

package/dist/LinkButton/index.js

@@ -0,0 +1,57 @@
+import { css } from '@emotion/react';
+import styled from '@emotion/styled';
+import { resetButtonStyles, sizeStyles } from '@os-design/styles';
+import { clr } from '@os-design/theming';
+import { omitEmotionProps } from '@os-design/utils';
+import { forwardRef } from 'react';
+import { DisabledWrapper, underlineAlwaysStyles, underlineHoverStyles } from "../Link/index.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const disabledStyles = p => p.disabled && css`
+    cursor: inherit;
+    color: ${clr(p.theme.inputColorPlaceholder)};
+  `;
+const StyledButton = styled('button', omitEmotionProps('size', 'underline'))`
+  ${resetButtonStyles};
+
+  cursor: pointer;
+  text-align: left;
+  line-height: 1.2;
+  padding-bottom: 0.1em;
+  color: ${p => clr(p.theme.linkColor)};
+
+  ${underlineHoverStyles};
+  ${underlineAlwaysStyles};
+  ${disabledStyles};
+  ${sizeStyles};
+`;
+
+/**
+ * The link component that is rendered as a button.
+ */
+const LinkButton = /*#__PURE__*/forwardRef(({
+  underline = 'hover',
+  disabled = false,
+  onMouseDown = () => {},
+  ...rest
+}, ref) => {
+  if (disabled) {
+    return /*#__PURE__*/_jsx(DisabledWrapper, {
+      children: /*#__PURE__*/_jsx(StyledButton, {
+        disabled: true,
+        ...rest,
+        ref: ref
+      })
+    });
+  }
+  return /*#__PURE__*/_jsx(StyledButton, {
+    underline: underline,
+    onMouseDown: e => {
+      onMouseDown(e);
+      e.preventDefault();
+    },
+    ...rest,
+    ref: ref
+  });
+});
+LinkButton.displayName = 'LinkButton';
+export default LinkButton;

package/dist/List/WindowScroller.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+export interface ScrollPosition {
+    top: number;
+    left: number;
+}
+interface WindowScrollerProps {
+    onScroll?: (props: ScrollPosition) => void;
+    children?: React.ReactNode;
+}
+/**
+ * Specifies the number of milliseconds during which to disable pointer events while
+ * a scroll is in progress. This improves performance and makes scrolling smoother.
+ */
+export declare const DISABLE_BODY_POINTER_EVENTS_TIMEOUT = 150;
+declare const WindowScroller: React.FC<WindowScrollerProps>;
+export default WindowScroller;
+//# sourceMappingURL=WindowScroller.d.ts.map

package/dist/List/WindowScroller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WindowScroller.d.ts","sourceRoot":"","sources":["../../src/List/WindowScroller.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAM9D,MAAM,WAAW,cAAc;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,mBAAmB;IAC3B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;GAGG;AACH,eAAO,MAAM,mCAAmC,MAAM,CAAC;AAEvD,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAwBjD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/List/WindowScroller.js

@@ -0,0 +1,33 @@
+import { useEvent } from '@os-design/utils';
+import React, { useCallback, useEffect, useRef } from 'react';
+import { disableBodyPointerEvents, enableBodyPointerEventsAfterDelay } from "./utils/bodyPointerEvents.js";
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Specifies the number of milliseconds during which to disable pointer events while
+ * a scroll is in progress. This improves performance and makes scrolling smoother.
+ */
+export const DISABLE_BODY_POINTER_EVENTS_TIMEOUT = 150;
+const WindowScroller = ({
+  onScroll = () => {},
+  children
+}) => {
+  const onScrollRef = useRef();
+  useEffect(() => {
+    onScrollRef.current = onScroll;
+  }, [onScroll]);
+  const scrollListener = useCallback(() => {
+    disableBodyPointerEvents();
+    enableBodyPointerEventsAfterDelay(DISABLE_BODY_POINTER_EVENTS_TIMEOUT);
+    if (!onScrollRef.current) return;
+    onScrollRef.current({
+      top: window.scrollY,
+      left: window.scrollX
+    });
+  }, []);
+  useEffect(() => () => enableBodyPointerEventsAfterDelay(0), []);
+  useEvent(document, 'scroll', scrollListener);
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: children
+  });
+};
+export default WindowScroller;

package/dist/List/index.d.ts

@@ -0,0 +1,67 @@
+import React, { type CSSProperties } from 'react';
+import { FixedSizeList, type ListChildComponentProps, type ListProps as RWListProps } from 'react-window';
+export interface ListProps extends Partial<RWListProps> {
+    /**
+     * Total number of items in the list.
+     */
+    itemCount: number;
+    /**
+     * The item height in em.
+     * @default 4
+     */
+    itemHeight?: number;
+    /**
+     * A threshold N means that the onLoadNext function calls when a user scrolls all items except N.
+     * @default 10
+     */
+    threshold?: number;
+    /**
+     * Defines how many items outside of the visible "window" to render at all times.
+     * @default 10
+     */
+    overscanCount?: number;
+    /**
+     * The height of the list in px.
+     * @default undefined
+     */
+    height?: number;
+    /**
+     * The top padding in em.
+     * @default 0
+     */
+    paddingTop?: number;
+    /**
+     * The bottom padding in em.
+     * @default 0
+     */
+    paddingBottom?: number;
+    /**
+     * The inline css style.
+     * @default undefined
+     */
+    style?: CSSProperties;
+    /**
+     * The component that renders if the list is empty.
+     * @default undefined
+     */
+    empty?: React.ReactNode;
+    /**
+     * The callback to load more items.
+     * @default undefined
+     */
+    onLoadNext?: () => void;
+    /**
+     * The callback to render items.
+     * @default () => null
+     */
+    itemRenderer?: React.FC<ListChildComponentProps>;
+}
+/**
+ * Virtualized list.
+ * Used the react-window library.
+ */
+declare const List: React.ForwardRefExoticComponent<ListProps & React.RefAttributes<FixedSizeList<any>>>;
+export { default as WindowScroller } from './WindowScroller';
+export { default as useRWLoadNext } from './utils/useRWLoadNext';
+export default List;
+//# sourceMappingURL=index.d.ts.map

package/dist/List/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/List/index.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,EACZ,KAAK,aAAa,EAKnB,MAAM,OAAO,CAAC;AACf,OAAO,EACL,aAAa,EACb,KAAK,uBAAuB,EAC5B,KAAK,SAAS,IAAI,WAAW,EAC9B,MAAM,cAAc,CAAC;AAKtB,MAAM,WAAW,SAAU,SAAQ,OAAO,CAAC,WAAW,CAAC;IACrD;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAAC,CAAC;CAClD;AAED;;;GAGG;AACH,QAAA,MAAM,IAAI,sFA8JT,CAAC;AAIF,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEjE,eAAe,IAAI,CAAC"}