@dxos/react-ui-searchlist 0.8.4-main.fd6878d → 0.8.4-main.fffef41

package/src/composites/PopoverCombobox.stories.tsx

@@ -1,44 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import '@dxos-theme';
-
-import React from 'react';
-
-import { faker } from '@dxos/random';
-import { withTheme } from '@dxos/storybook-utils';
-
-import { PopoverCombobox } from './PopoverCombobox';
-
-faker.seed(1234);
-
-const storybookItems = faker.helpers.uniqueArray(faker.commerce.productName, 16);
-
-const DefaultStory = () => {
-  return (
-    <PopoverCombobox.Root placeholder='Nothing selected'>
-      <PopoverCombobox.Trigger />
-      <PopoverCombobox.Content filter={(value, search) => (value.includes(search) ? 1 : 0)}>
-        <PopoverCombobox.Input placeholder='Search...' />
-        <PopoverCombobox.List>
-          {storybookItems.map((value) => (
-            <PopoverCombobox.Item key={value}>{value}</PopoverCombobox.Item>
-          ))}
-        </PopoverCombobox.List>
-        <PopoverCombobox.Arrow />
-      </PopoverCombobox.Content>
-    </PopoverCombobox.Root>
-  );
-};
-
-export default {
-  title: 'ui/react-ui-searchlist/PopoverCombobox',
-  component: PopoverCombobox,
-  render: DefaultStory,
-  decorators: [withTheme],
-};
-
-export const Default = {
-  args: {},
-};

package/src/composites/PopoverCombobox.tsx

@@ -1,208 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { useControllableState } from '@radix-ui/react-use-controllable-state';
-import React, { forwardRef } from 'react';
-
-import {
-  Popover,
-  type PopoverArrowProps,
-  type PopoverContentProps,
-  type PopoverViewportProps,
-  type PopoverVirtualTriggerProps,
-} from '@dxos/react-ui';
-
-import {
-  Combobox,
-  type ComboboxRootProps,
-  type ComboboxTriggerProps,
-  SearchList,
-  type SearchListContentProps,
-  type SearchListEmptyProps,
-  type SearchListInputProps,
-  type SearchListItemProps,
-  type SearchListRootProps,
-} from '../components';
-
-type PopoverComboboxRootProps = ComboboxRootProps & { modal?: boolean };
-
-const PopoverComboboxRoot = ({
-  modal,
-  children,
-  open: propsOpen,
-  onOpenChange: propsOnOpenChange,
-  defaultOpen,
-  ...props
-}: PopoverComboboxRootProps) => {
-  const [open, onOpenChange] = useControllableState({
-    prop: propsOpen,
-    onChange: propsOnOpenChange,
-    defaultProp: defaultOpen,
-  });
-  return (
-    <Combobox.Root open={open} onOpenChange={onOpenChange} {...props}>
-      <Popover.Root open={open} onOpenChange={onOpenChange} modal={modal}>
-        {children}
-      </Popover.Root>
-    </Combobox.Root>
-  );
-};
-
-type PopoverComboboxContentProps = SearchListRootProps & PopoverContentProps;
-
-const POPOVER_COMBOBOX_CONTENT_NAME = 'PopoverComboboxContent';
-
-const PopoverComboboxContent = forwardRef<HTMLDivElement, PopoverComboboxContentProps>(
-  (
-    {
-      side = 'bottom',
-      collisionPadding = 48,
-      sideOffset,
-      align,
-      alignOffset,
-      avoidCollisions,
-      collisionBoundary,
-      arrowPadding,
-      sticky,
-      hideWhenDetached,
-      onOpenAutoFocus,
-      onCloseAutoFocus,
-      onEscapeKeyDown,
-      onPointerDownOutside,
-      onFocusOutside,
-      onInteractOutside,
-      forceMount,
-      children,
-      classNames,
-      ...props
-    },
-    forwardedRef,
-  ) => {
-    const { modalId } = Combobox.useComboboxContext(POPOVER_COMBOBOX_CONTENT_NAME);
-    return (
-      <Popover.Content
-        {...{
-          side,
-          sideOffset,
-          align,
-          alignOffset,
-          avoidCollisions,
-          collisionBoundary,
-          collisionPadding,
-          arrowPadding,
-          sticky,
-          hideWhenDetached,
-          onOpenAutoFocus,
-          onCloseAutoFocus,
-          onEscapeKeyDown,
-          onPointerDownOutside,
-          onFocusOutside,
-          onInteractOutside,
-          forceMount,
-          classNames,
-        }}
-        id={modalId}
-        ref={forwardedRef}
-      >
-        <Popover.Viewport>
-          <SearchList.Root {...props} classNames='contents density-fine' role='none'>
-            {children}
-          </SearchList.Root>
-        </Popover.Viewport>
-      </Popover.Content>
-    );
-  },
-);
-
-PopoverComboboxContent.displayName = POPOVER_COMBOBOX_CONTENT_NAME;
-
-type PopoverComboboxTriggerProps = ComboboxTriggerProps;
-
-const PopoverComboboxTrigger = forwardRef<HTMLButtonElement, PopoverComboboxTriggerProps>((props, forwardedRef) => {
-  return (
-    <Popover.Trigger asChild>
-      <Combobox.Trigger {...props} ref={forwardedRef} />
-    </Popover.Trigger>
-  );
-});
-
-type PopoverComboboxVirtualTriggerProps = PopoverVirtualTriggerProps;
-
-const PopoverComboboxVirtualTrigger = Popover.VirtualTrigger;
-
-type PopoverComboboxInputProps = SearchListInputProps;
-
-const PopoverComboboxInput = forwardRef<HTMLInputElement, PopoverComboboxInputProps>(
-  ({ classNames, ...props }, forwardedRef) => {
-    return (
-      <SearchList.Input
-        {...props}
-        classNames={[
-          'mli-cardSpacingChrome mbs-cardSpacingChrome is-[calc(100%-2*var(--dx-cardSpacingChrome))]',
-          classNames,
-        ]}
-        ref={forwardedRef}
-      />
-    );
-  },
-);
-
-type PopoverComboboxListProps = SearchListContentProps &
-  Pick<PopoverViewportProps, 'constrainBlock' | 'constrainInline'>;
-
-const PopoverComboboxList = forwardRef<HTMLDivElement, PopoverComboboxListProps>(
-  ({ constrainInline, constrainBlock, ...props }, forwardedRef) => {
-    return (
-      <Popover.Viewport {...{ constrainInline, constrainBlock }}>
-        <SearchList.Content {...props} ref={forwardedRef} />
-      </Popover.Viewport>
-    );
-  },
-);
-
-type PopoverComboboxItemProps = SearchListItemProps;
-
-const PopoverComboboxItem = forwardRef<HTMLDivElement, PopoverComboboxItemProps>(
-  ({ classNames, ...props }, forwardedRef) => {
-    return (
-      <SearchList.Item
-        {...props}
-        classNames={['mli-cardSpacingChrome pli-cardSpacingChrome', classNames]}
-        ref={forwardedRef}
-      />
-    );
-  },
-);
-
-type PopoverComboboxArrowProps = PopoverArrowProps;
-
-const PopoverComboboxArrow = Popover.Arrow;
-
-type PopoverComboboxEmptyProps = SearchListEmptyProps;
-
-const PopoverComboboxEmpty = SearchList.Empty;
-
-export const PopoverCombobox = {
-  Root: PopoverComboboxRoot,
-  Content: PopoverComboboxContent,
-  Trigger: PopoverComboboxTrigger,
-  VirtualTrigger: PopoverComboboxVirtualTrigger,
-  Input: PopoverComboboxInput,
-  List: PopoverComboboxList,
-  Item: PopoverComboboxItem,
-  Arrow: PopoverComboboxArrow,
-  Empty: PopoverComboboxEmpty,
-};
-
-export type {
-  PopoverComboboxRootProps,
-  PopoverComboboxContentProps,
-  PopoverComboboxTriggerProps,
-  PopoverComboboxVirtualTriggerProps,
-  PopoverComboboxInputProps,
-  PopoverComboboxListProps,
-  PopoverComboboxItemProps,
-  PopoverComboboxArrowProps,
-  PopoverComboboxEmptyProps,
-};

package/src/composites/index.ts

@@ -1,5 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-export * from './PopoverCombobox';