@spaced-out/ui-design-system 0.4.13-beta.1 → 0.4.14

package/lib/components/InfinitePagination/InfinitePagination.stories.js

@@ -1,343 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports._WithVariableSizeList = exports._WithFixedSizeList = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _space = require("../../styles/variables/_space");
-var _Card = require("../Card");
-var _InfinitePagination = require("./InfinitePagination");
-var _InfinitePaginationStoriesModule = _interopRequireDefault(require("./InfinitePagination.stories.module.css"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-var _default = exports.default = {
-  tags: ['autodocs'],
-  title: 'Layout/Infinite Pagination',
-  component: _InfinitePagination.InfinitePagination,
-  argTypes: {
-    items: {
-      description: 'The array of data items to render in the list',
-      control: {
-        type: 'object'
-      },
-      table: {
-        type: {
-          summary: 'Array<GenericObject>'
-        }
-      }
-    },
-    width: {
-      description: 'Width of the list',
-      control: {
-        type: 'text'
-      },
-      table: {
-        type: {
-          summary: 'string'
-        },
-        defaultValue: {
-          summary: 'spaceFluid'
-        }
-      }
-    },
-    threshold: {
-      description: 'Distance in pixels from the bottom to trigger loading more items',
-      control: {
-        type: 'number'
-      },
-      table: {
-        type: {
-          summary: 'number'
-        },
-        defaultValue: {
-          summary: 200
-        }
-      }
-    },
-    classNames: {
-      description: 'Provide an optional className to be applied to the wrapper',
-      control: {
-        type: 'object'
-      },
-      table: {
-        type: {
-          summary: '{wrapper?: string}'
-        }
-      }
-    },
-    renderItem: {
-      description: 'Function to render a single item',
-      control: false,
-      table: {
-        type: {
-          summary: '(item: GenericObject, index: number) => React.ReactNode'
-        }
-      }
-    },
-    getItemKey: {
-      description: 'Optional function to generate a key for each item',
-      control: false,
-      table: {
-        type: {
-          summary: '(item: GenericObject, index: number) => string | number'
-        }
-      }
-    },
-    hasNextPage: {
-      description: 'Boolean to determine if there are more items to load',
-      control: {
-        type: 'boolean'
-      },
-      table: {
-        type: {
-          summary: 'boolean'
-        }
-      }
-    },
-    loadMoreItems: {
-      description: 'Callback function to load more items',
-      control: false,
-      table: {
-        type: {
-          summary: '() => Promise<void>'
-        }
-      }
-    },
-    itemSize: {
-      description: 'Either a number or a function returning the height of each item',
-      control: false,
-      table: {
-        type: {
-          summary: 'number | (index: number) => number'
-        }
-      }
-    },
-    isVariableSizeList: {
-      description: 'Determines whether the list has variable item sizes',
-      control: {
-        type: 'boolean'
-      },
-      table: {
-        type: {
-          summary: 'boolean'
-        },
-        defaultValue: {
-          summary: false
-        }
-      }
-    }
-  },
-  parameters: {
-    docs: {
-      subtitle: 'Displays a virtualized, scrollable list with infinite pagination.',
-      description: {
-        component: `
-\`\`\`js
-import { InfinitePagination } from "@spaced-out/ui-design-system/lib/components/InfinitePagination";
-\`\`\`
-
-The \`InfinitePagination\` component renders a performant scrollable list using \`react-window\` and supports both fixed and variable item heights. It automatically loads more data as the user scrolls near the bottom of the list.
-
-- Supports infinite scroll via \`loadMoreItems\`
-- Accepts custom item renderers via \`renderItem\`
-- Optionally supports variable height items
-- Displays a loading spinner when fetching more items
-
-Use this component when rendering long lists of data without sacrificing performance.
-      `
-      }
-    },
-    storySource: {
-      componentPath: '/src/components/InfinitePagination/InfinitePagination.jsx'
-    }
-  }
-};
-const _WithFixedSizeList = args => {
-  const [items, setItems] = React.useState([]);
-  const [page, setPage] = React.useState(1);
-  const [hasNextPage, setHasNextPage] = React.useState(true);
-  const [isLoading, setIsLoading] = React.useState(false);
-
-  // Simulate fetching data from an API
-  const fetchItems = React.useCallback(async pageNumber => {
-    setIsLoading(true);
-
-    // Simulate API call delay
-    await new Promise(resolve => setTimeout(resolve, 1000));
-
-    // Generate mock data for this page
-    const pageSize = 20;
-    const startId = (pageNumber - 1) * pageSize + 1;
-
-    // Simulate reaching the end of available data after page 5
-    if (pageNumber > 5) {
-      setHasNextPage(false);
-      setIsLoading(false);
-      return [];
-    }
-    const newItems = Array.from({
-      length: pageSize
-    }, (_, index) => ({
-      id: startId + index,
-      title: `Item ${startId + index}`,
-      description: `This is the description for item ${startId + index}`
-    }));
-    setIsLoading(false);
-    return newItems;
-  }, []);
-
-  // Initial data load
-  React.useEffect(() => {
-    const loadInitialData = async () => {
-      const initialItems = await fetchItems(1);
-      // @ts-ignore - TS2345 - Argument of type '{ id: number; title: string; description: string; }[]' is not assignable to parameter of type 'SetStateAction<never[]>'.
-      setItems(initialItems);
-    };
-    loadInitialData();
-  }, [fetchItems]);
-
-  // Function to load more items when user scrolls to bottom
-  const loadMoreItems = React.useCallback(async () => {
-    if (isLoading || !hasNextPage) {
-      return;
-    }
-    const nextPage = page + 1;
-    const newItems = await fetchItems(nextPage);
-
-    // @ts-ignore - TS2345 - Argument of type '(prevItems: never[]) => { id: number; title: string; description: string; }[]' is not assignable to parameter of type 'SetStateAction<never[]>'.
-    setItems(prevItems => [...prevItems, ...newItems]);
-    setPage(nextPage);
-  }, [fetchItems, isLoading, hasNextPage, page]);
-
-  // Render each item in the list
-  // @ts-ignore - TS7031 - Binding element 'title' implicitly has an 'any' type. | TS6133 - 'description' is declared but its value is never read. | TS7031 - Binding element 'description' implicitly has an 'any' type.
-  const renderItem = _ref => {
-    let {
-      title,
-      description
-    } = _ref;
-    return /*#__PURE__*/React.createElement(_Card.Card, args, /*#__PURE__*/React.createElement(_Card.CardTitle, null, String(title)));
-  };
-
-  // Extract key from item
-  const getItemKey = item => String(item.id);
-  return /*#__PURE__*/React.createElement("div", {
-    className: _InfinitePaginationStoriesModule.default.storyContainer
-  }, /*#__PURE__*/React.createElement(_InfinitePagination.InfinitePagination, _extends({}, args, {
-    items: items,
-    width: _space.spaceFluid,
-    itemSize: 100
-    // @ts-ignore - TS2769 - No overload matches this call.
-    ,
-    renderItem: renderItem,
-    loadMoreItems: loadMoreItems,
-    hasNextPage: hasNextPage,
-    getItemKey: getItemKey,
-    isVariableSizeList: false
-  })));
-};
-exports._WithFixedSizeList = _WithFixedSizeList;
-_WithFixedSizeList.args = {
-  classNames: ''
-};
-const _WithVariableSizeList = args => {
-  const [items, setItems] = React.useState([]);
-  const [page, setPage] = React.useState(1);
-  const [hasNextPage, setHasNextPage] = React.useState(true);
-  const [isLoading, setIsLoading] = React.useState(false);
-
-  // Simulate fetching data from an API
-  const fetchItems = React.useCallback(async pageNumber => {
-    setIsLoading(true);
-
-    // Simulate API call delay
-    await new Promise(resolve => setTimeout(resolve, 1000));
-
-    // Generate mock data for this page
-    const pageSize = 20;
-    const startId = (pageNumber - 1) * pageSize + 1;
-
-    // Simulate reaching the end of available data after page 5
-    if (pageNumber > 5) {
-      setHasNextPage(false);
-      setIsLoading(false);
-      return [];
-    }
-    const newItems = Array.from({
-      length: pageSize
-    }, (_, index) => ({
-      id: startId + index,
-      title: `Item ${startId + index}`,
-      description: `This is the description for item ${startId + index}`
-    }));
-    setIsLoading(false);
-    return newItems;
-  }, []);
-
-  // Initial data load
-  React.useEffect(() => {
-    const loadInitialData = async () => {
-      const initialItems = await fetchItems(1);
-      // @ts-ignore - TS2345 - Argument of type '{ id: number; title: string; description: string; }[]' is not assignable to parameter of type 'SetStateAction<never[]>'.
-      setItems(initialItems);
-    };
-    loadInitialData();
-  }, [fetchItems]);
-
-  // Function to load more items when user scrolls to bottom
-  const loadMoreItems = React.useCallback(async () => {
-    if (isLoading || !hasNextPage) {
-      return;
-    }
-    const nextPage = page + 1;
-    const newItems = await fetchItems(nextPage);
-
-    // @ts-ignore - TS2345 - Argument of type '(prevItems: never[]) => { id: number; title: string; description: string; }[]' is not assignable to parameter of type 'SetStateAction<never[]>'.
-    setItems(prevItems => [...prevItems, ...newItems]);
-    setPage(nextPage);
-  }, [fetchItems, isLoading, hasNextPage, page]);
-
-  // Render each item in the list
-  const renderItem = _ref2 => {
-    let {
-      title,
-      // @ts-ignore - TS6133 - 'description' is declared but its value is never read.
-      description
-    } = _ref2;
-    return /*#__PURE__*/React.createElement("div", {
-      className: _InfinitePaginationStoriesModule.default.variableListItem
-    }, /*#__PURE__*/React.createElement(_Card.Card, {
-      classNames: {
-        wrapper: _InfinitePaginationStoriesModule.default.variableListCard
-      }
-    }, /*#__PURE__*/React.createElement(_Card.CardTitle, null, String(title))));
-  };
-
-  // Extract key from item
-  const getItemKey = item => String(item.id);
-  const getItemSize = index => {
-    const min = 100;
-    const max = 300;
-    const pseudoRandom = Math.sin(index * 987.654) * 10000;
-    const fractional = pseudoRandom - Math.floor(pseudoRandom);
-    return Math.floor(fractional * (max - min + 1)) + min;
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: _InfinitePaginationStoriesModule.default.storyContainer
-  }, /*#__PURE__*/React.createElement(_InfinitePagination.InfinitePagination, _extends({}, args, {
-    items: items,
-    width: _space.spaceFluid,
-    itemSize: getItemSize,
-    renderItem: renderItem,
-    loadMoreItems: loadMoreItems,
-    hasNextPage: hasNextPage,
-    getItemKey: getItemKey,
-    isVariableSizeList: true
-  })));
-};
-exports._WithVariableSizeList = _WithVariableSizeList;
-_WithVariableSizeList.args = {
-  classNames: ''
-};

package/lib/components/InfinitePagination/index.d.ts

@@ -1,2 +0,0 @@
-export * from './InfinitePagination';
-//# sourceMappingURL=index.d.ts.map

package/lib/components/InfinitePagination/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InfinitePagination/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}

package/lib/components/InlineDropdown/InlineDropdown.d.ts

@@ -1,25 +0,0 @@
-import { Flow } from 'flow-to-typescript-codemod';
-import * as React from 'react';
-import { ClickAwayRefType } from '../../utils/click-away';
-import type { UnstyledButtonProps } from '../Button';
-import type { AnchorType } from '../ButtonDropdown';
-import type { MenuOption, MenuProps } from '../Menu';
-import { ElevationType } from '../Tooltip';
-type ClassNames = Readonly<{
-    buttonWrapper?: string;
-    dropdownContainer?: string;
-}>;
-export type InlineDropdownProps = ((UnstyledButtonProps) & {
-    classNames?: ClassNames;
-    menu?: MenuProps;
-    anchorPosition?: AnchorType;
-    onOptionSelect?: (option: MenuOption, arg2?: React.SyntheticEvent<HTMLElement> | null | undefined) => unknown;
-    onMenuOpen?: () => unknown;
-    onMenuClose?: () => unknown;
-    size?: 'medium' | 'small' | 'extraSmall';
-    elevation?: ElevationType;
-    clickAwayRef?: ClickAwayRefType;
-});
-export declare const InlineDropdown: Flow.AbstractComponent<InlineDropdownProps, HTMLDivElement>;
-export {};
-//# sourceMappingURL=InlineDropdown.d.ts.map

package/lib/components/InlineDropdown/InlineDropdown.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InlineDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/InlineDropdown/InlineDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAEhD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,OAAO,EAAC,gBAAgB,EAAY,MAAM,wBAAwB,CAAC;AAEnE,OAAO,KAAK,EAAC,mBAAmB,EAAC,MAAM,WAAW,CAAC;AAEnD,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAElD,OAAO,KAAK,EAAC,UAAU,EAAE,SAAS,EAAC,MAAM,SAAS,CAAC;AAEnD,OAAO,EAAC,aAAa,EAAoB,MAAM,YAAY,CAAC;AAM5D,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,CAAC,CAAC,mBAAmB,CAAC,GAAG;IACzD,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B,cAAc,CAAC,EAAE,CACf,MAAM,EAAE,UAAU,EAClB,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,SAAS,KACxD,OAAO,CAAC;IACb,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC;IAC5B,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,YAAY,CAAC;IACzC,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,YAAY,CAAC,EAAE,gBAAgB,CAAC;CACjC,CAAC,CAAC;AAEH,eAAO,MAAM,cAAc,EAAE,IAAI,CAAC,iBAAiB,CAAC,mBAAmB,EAAE,cAAc,CA4HrF,CAAC"}