@dxos/react-list 0.1.20 → 0.1.22

package/dist/lib/browser/index.mjs

@@ -2,8 +2,7 @@
 import React2, { useCallback as useCallback2 } from "react";
 import { ObjectModel } from "@dxos/object-model";
 import { useSelection, useSpace } from "@dxos/react-client";
-import { Loading } from "@dxos/react-ui";
-import { useTranslation as useTranslation2 } from "@dxos/react-uikit";
+import { Loading, useTranslation as useTranslation2 } from "@dxos/react-components";
 
 // packages/apps/patterns/react-list/src/model.ts
 var LIST_TYPE = "dxos:type/list";
@@ -13,11 +12,11 @@ var LIST_ITEM_TYPE = "dxos:type/list-item";
 import debounce from "lodash.debounce";
 import { Minus, Plus } from "phosphor-react";
 import React, { useCallback, useMemo, useState as useState2 } from "react";
-import { defaultFocus, Input, useTranslation, getSize, Button, randomString as randomString2, defaultGroup, defaultHover, mx } from "@dxos/react-uikit";
+import { defaultFocus, Input, useTranslation, getSize, Button, randomString as randomString2, defaultGroup, defaultHover, mx } from "@dxos/react-components";
 
 // packages/apps/patterns/react-list/src/hooks/usePropStatefully.ts
 import { useEffect, useRef, useState } from "react";
-import { randomString } from "@dxos/react-uikit";
+import { randomString } from "@dxos/react-components";
 var isEqual = (a, b) => a === b;
 var usePropStatefully = (propsValue, equivalentPredicate) => {
   const [value, setValue] = useState(propsValue);
@@ -503,7 +502,7 @@ var ListLoaded = ({ space, list, listItems: propsListItems }) => {
 };
 var List = ({ spaceKey, itemId }) => {
   var _a;
-  const { t } = useTranslation2("uikit");
+  const { t } = useTranslation2("appkit");
   const space = useSpace(spaceKey);
   const list = ((_a = useSelection(space == null ? void 0 : space.database.select({
     id: itemId

package/dist/lib/browser/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/List/List.tsx", "../../../src/model.ts", "../../../src/components/ListPrimitive/ListPrimitive.tsx", "../../../src/hooks/usePropStatefully.ts"],
-  "sourcesContent": ["//\n// Copyright 2022 DXOS.org\n//\n\nimport React, { useCallback } from 'react';\n\nimport { Item, PublicKey, Space } from '@dxos/client';\nimport { ObjectModel } from '@dxos/object-model';\nimport { useSelection, useSpace } from '@dxos/react-client';\nimport { Loading } from '@dxos/react-ui';\nimport { useTranslation } from '@dxos/react-uikit';\n\nimport { LIST_ITEM_TYPE } from '../../model';\nimport {\n  ListPrimitive,\n  ListAction,\n  ListItems,\n  isListItemChangedAction,\n  isListItemDeletedAction,\n  isListItemCreatedAction,\n  ListItemProps,\n  ListPrimitiveProps\n} from '../ListPrimitive';\n\ninterface ListLoadedProps {\n  space: Space;\n  list: Item<ObjectModel>;\n  listItems: Item<ObjectModel>[];\n}\n\nexport interface ListProps {\n  spaceKey: PublicKey;\n  itemId: Item<ObjectModel>['id'];\n}\n\nconst ListLoaded = ({ space, list, listItems: propsListItems }: ListLoadedProps) => {\n  const listItems = useSelection(list?.select().children().filter({ type: LIST_ITEM_TYPE })) ?? propsListItems;\n\n  const onAction = useCallback(\n    async (action: ListAction) => {\n      if (isListItemDeletedAction(action)) {\n        const subject = space.database.getItem(action.deleted.id);\n        // TODO(thure): use Echo’s native deletion\n        return subject?.model.set('annotations.deleted', true);\n      } else if (isListItemCreatedAction(action)) {\n        // do nothing?\n      } else if (isListItemChangedAction(action)) {\n        const subject = space.database.getItem(action.listItemId);\n        return Promise.all(\n          (Object.keys(action.next) as (keyof ListItemProps)[]).map((prop) => {\n            return subject?.model.set(prop, action.next[prop]);\n          })\n        );\n      } else {\n        return Promise.all(\n          (Object.keys(action.next) as (keyof ListPrimitiveProps)[]).map((prop) => {\n            return list?.model.set(prop, action.next[prop]);\n          })\n        );\n      }\n    },\n    [list, listItems]\n  );\n\n  const createListItemId = useCallback(async () => {\n    const listItem = await space?.database.createItem({\n      model: ObjectModel,\n      type: LIST_ITEM_TYPE,\n      parent: list.id\n    });\n    return listItem.id;\n  }, [space]);\n\n  return (\n    <ListPrimitive\n      {...{\n        id: list.id,\n        title: list.model.get('title') ?? '',\n        description: list.model.get('description') ?? '',\n        items: (listItems ?? [])\n          // TODO(thure): use Echo’s native deletion\n          .filter((item) => !item.model.get('annotations.deleted'))\n          .reduce((acc: ListItems, item) => {\n            acc[item.id] = {\n              title: item.model.get('title'),\n              description: item.model.get('description'),\n              annotations: item.model.get('annotations')\n            };\n            return acc;\n          }, {}),\n        onChangePeriod: 640,\n        onAction,\n        createListItemId\n      }}\n    />\n  );\n};\n\nexport const List = ({ spaceKey, itemId }: ListProps) => {\n  const { t } = useTranslation('uikit');\n\n  const space = useSpace(spaceKey);\n  const list = (useSelection(space?.database.select({ id: itemId })) ?? [])[0];\n  const listItems = useSelection(list?.select().children().filter({ type: LIST_ITEM_TYPE }));\n\n  // TODO(thure): this should become `Suspense` when the above hooks support it\n  return space && list && listItems ? (\n    <ListLoaded {...{ space, list, listItems }} />\n  ) : (\n    <Loading label={t('generic loading label')} />\n  );\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nexport const LIST_TYPE = 'dxos:type/list';\nexport const LIST_ITEM_TYPE = 'dxos:type/list-item';\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport debounce from 'lodash.debounce';\nimport { Minus, Plus } from 'phosphor-react';\nimport React, { ComponentProps, useCallback, useMemo, useState, KeyboardEvent } from 'react';\n\nimport {\n  defaultFocus,\n  Input,\n  useTranslation,\n  getSize,\n  Button,\n  randomString,\n  defaultGroup,\n  defaultHover,\n  mx\n} from '@dxos/react-uikit';\n\nimport { usePropStatefully } from '../../hooks';\n\ntype ListId = string;\ntype ListItemId = string;\n\nexport interface ListItemProps {\n  id: ListItemId;\n  title?: string;\n  description?: string;\n  annotations?: Record<string, string | boolean>;\n}\n\nexport type ListItems = Record<ListItemId, Omit<ListItemProps, 'id'>>;\n\ninterface SharedListActionProps {\n  listId: ListId;\n}\n\ninterface SharedListItemActionProps extends SharedListActionProps {\n  listItemId: ListItemId;\n}\n\nexport interface ListItemChangedAction extends SharedListItemActionProps {\n  next: Partial<ListItemProps>;\n}\n\nexport interface ListChangedAction extends SharedListActionProps {\n  next: Partial<ListPrimitiveProps>;\n}\n\nexport interface ListItemCreatedAction extends SharedListActionProps {\n  created: Pick<ListItemProps, 'id'> & Partial<Omit<ListItemProps, 'id'>>;\n}\n\nexport interface ListItemDeletedAction extends SharedListActionProps {\n  deleted: Pick<ListItemProps, 'id'> & Partial<Omit<ListItemProps, 'id'>>;\n}\n\nexport type ListAction = ListItemChangedAction | ListChangedAction | ListItemCreatedAction | ListItemDeletedAction;\n\nexport const isListItemChangedAction = (o: any): o is ListItemChangedAction => 'listItemId' in o;\nexport const isListItemCreatedAction = (o: any): o is ListItemCreatedAction => 'created' in o;\nexport const isListItemDeletedAction = (o: any): o is ListItemDeletedAction => 'deleted' in o;\n\nexport interface ListPrimitiveProps {\n  id: ListId;\n  title?: string;\n  description?: string;\n}\n\nexport interface ListPrimitiveComponentProps extends ListPrimitiveProps, Omit<ComponentProps<'div'>, 'id'> {\n  items: ListItems;\n  onAction?: (action: ListAction) => void;\n  createListItemId?: () => Promise<ListItemId>;\n  onChangePeriod?: number;\n}\n\nexport interface ListItemPrimitiveComponentProps extends ListItemProps, Omit<ComponentProps<'li'>, 'id' | 'title'> {\n  updateItem: (item: ListItemProps) => void;\n  updateOrder: (id: ListItemId, delta: number) => void;\n  deleteItem: (id: ListItemId) => void;\n  createItem: () => void;\n  orderIndex: number;\n  isLast?: boolean;\n  autoFocus?: boolean;\n}\n\nconst defaultCreateListItemId = async () => randomString(8);\n\nconst ListItemPrimitive = ({\n  id,\n  title: propsTitle,\n  description: propsDescription,\n  annotations: propsAnnotations,\n  updateItem,\n  deleteItem,\n  createItem,\n  updateOrder,\n  orderIndex,\n  isLast,\n  autoFocus\n}: ListItemPrimitiveComponentProps) => {\n  const checkId = `${id}__checkbox`;\n  const labelId = `${id}__title`;\n  const descriptionId = `${id}__description`;\n\n  const { t } = useTranslation('appkit');\n\n  const rejectTextUpdatesWhenFocused = useCallback(\n    (a: string, b: string) => {\n      return document.activeElement?.getAttribute('data-itemid') === id ? true : a === b;\n    },\n    [id]\n  );\n\n  const [title, setTitle, titleSession] = usePropStatefully<string>(propsTitle ?? '', rejectTextUpdatesWhenFocused);\n\n  const [description, _setDescription, _descriptionSession] = usePropStatefully<string>(\n    propsDescription ?? '',\n    rejectTextUpdatesWhenFocused\n  );\n\n  const [annotations, setAnnotations] = useState(propsAnnotations ?? {});\n  const isDone = annotations?.state === 'done';\n\n  const onChangeTitle = useCallback((nextValue: string) => {\n    setTitle(nextValue);\n    updateItem({ id, title: nextValue });\n  }, []);\n\n  const _onChangeDescription = useCallback((nextValue: string) => {\n    _setDescription(nextValue);\n    updateItem({ id, description: nextValue });\n  }, []);\n\n  const _onClickMoveUp = useCallback(() => {\n    updateOrder(id, -1);\n  }, [updateOrder, id]);\n  const _onClickMoveDown = useCallback(() => {\n    updateOrder(id, 1);\n  }, [updateOrder, id]);\n\n  const onChangeCheckbox = useCallback(() => {\n    const nextAnnotations = { ...annotations, state: isDone ? 'init' : 'done' };\n    setAnnotations(nextAnnotations);\n    updateItem({ id, annotations: nextAnnotations });\n  }, [annotations, isDone]);\n\n  const onClickDelete = useCallback(() => {\n    deleteItem(id);\n  }, [deleteItem, id]);\n\n  const onKeyUp = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      switch (e.key) {\n        case 'Enter':\n          if (!e.shiftKey) {\n            if (isLast) {\n              createItem();\n            } else {\n              (\n                document.querySelector(`input[data-orderindex=\"${orderIndex + 1}\"]`) as HTMLElement | undefined\n              )?.focus();\n            }\n          }\n          break;\n        case 'PageDown':\n          (document.querySelector(`input[data-orderindex=\"${orderIndex + 1}\"]`) as HTMLElement | undefined)?.focus();\n          break;\n        case 'PageUp':\n          (document.querySelector(`input[data-orderindex=\"${orderIndex - 1}\"]`) as HTMLElement | undefined)?.focus();\n          break;\n      }\n    },\n    [orderIndex, isLast]\n  );\n\n  const inputSlots = useMemo(\n    () => ({\n      root: { className: 'm-0' },\n      input: {\n        className: 'border-0 rounded',\n        autoFocus: true,\n        'data-orderindex': orderIndex,\n        'data-itemid': id,\n        onKeyUp\n      }\n    }),\n    [orderIndex, id, onKeyUp]\n  );\n\n  return (\n    <li\n      key={id}\n      className='flex items-center gap-2 pli-4 mbe-2'\n      aria-labelledby={labelId}\n      {...(description && { 'aria-describedby': descriptionId })}\n    >\n      <input\n        {...{\n          type: 'checkbox',\n          id: checkId,\n          ...(description && {\n            'aria-describedby': descriptionId\n          }),\n          className: mx(\n            getSize(5),\n            'text-primary-600 bg-neutral-50 rounded-full border-neutral-300 dark:bg-neutral-800 dark:border-neutral-600 cursor-pointer',\n            defaultFocus,\n            defaultHover({})\n          ),\n          onChange: onChangeCheckbox,\n          checked: isDone\n        }}\n      />\n      <label htmlFor={checkId} id={labelId} className='sr-only'>\n        {title}\n      </label>\n      <span id={descriptionId} className='sr-only'>\n        {description}\n      </span>\n      <div role='none' className='grow'>\n        <Input\n          key={titleSession}\n          label={t('list item title label')}\n          placeholder={t('list item title placeholder')}\n          labelVisuallyHidden\n          initialValue={title}\n          onChange={onChangeTitle}\n          slots={inputSlots}\n        />\n        {/* TODO(thure): Re-enable this when descriptions become relevant */}\n        {/* <Input */}\n        {/*  key={descriptionSession} */}\n        {/*  label={t('list item description label')} */}\n        {/*  placeholder={t('list item description placeholder')} */}\n        {/*  labelVisuallyHidden */}\n        {/*  initialValue={description} */}\n        {/*  onChange={onChangeDescription} */}\n        {/*  data-itemid={id} */}\n        {/* /> */}\n      </div>\n      {/* TODO(thure): Restore these, or implement drag & drop, when how best to change order in Echo is clarified. */}\n      {/* <ButtonGroup className='flex flex-col items-stretch'> */}\n      {/*  <Button compact rounding='rounded-bs-md border-be-0' disabled={isFirst} onClick={onClickMoveUp}> */}\n      {/*    <CaretUp /> */}\n      {/*    <span className='sr-only'>{t('move list item up label')}</span> */}\n      {/*  </Button> */}\n      {/*  <Button compact rounding='rounded-be-md' disabled={isLast} onClick={onClickMoveDown}> */}\n      {/*    <CaretDown /> */}\n      {/*    <span className='sr-only'>{t('move list item down label')}</span> */}\n      {/*  </Button> */}\n      {/* </ButtonGroup> */}\n      <Button onClick={onClickDelete} variant='ghost' className='p-1 self-stretch'>\n        <Minus className={getSize(4)} />\n        <span className='sr-only'>{t('delete list item label')}</span>\n      </Button>\n    </li>\n  );\n};\n\nconst itemsEquivalent = (a: ListItems, b: ListItems) => {\n  const aKeys = Object.keys(a);\n  const bKeys = Object.keys(b);\n  for (let i = 0; i < aKeys.length; i++) {\n    const key = aKeys[i];\n    if (key !== bKeys[i] || a[key].title !== b[key].title || a[key].annotations?.state !== b[key].annotations?.state) {\n      return false;\n    }\n  }\n  return true;\n};\n\nexport const ListPrimitive = ({\n  id: listId,\n  title: propsTitle,\n  description: propsDescription,\n  items: propsItems,\n  onAction,\n  createListItemId = defaultCreateListItemId,\n  onChangePeriod = 0,\n  ...divProps\n}: ListPrimitiveComponentProps) => {\n  const { t } = useTranslation('appkit');\n\n  const [creating, setCreating] = useState(false);\n  const [autoFocus, setAutofocus] = useState<string | null>(null);\n\n  const rejectTextUpdatesWhenFocused = useCallback(\n    (a: string, b: string) => {\n      return document.activeElement?.getAttribute('data-itemid') === listId ? true : a === b;\n    },\n    [listId]\n  );\n\n  // Title\n\n  const titleId = `${listId}__title`;\n  const [title, setTitle, titleSession] = usePropStatefully(propsTitle ?? '', rejectTextUpdatesWhenFocused);\n  const propagateTitle = useCallback(\n    (nextValue: string) => {\n      return onAction?.({ listId, next: { title: nextValue } });\n    },\n    [onAction]\n  );\n  const debouncedPropagateTitle = useMemo(() => debounce(propagateTitle, onChangePeriod), [propagateTitle]);\n  const onChangeTitle = useCallback(\n    (nextValue: string) => {\n      setTitle(nextValue);\n      debouncedPropagateTitle(nextValue);\n    },\n    [onAction, listId]\n  );\n\n  // Description\n\n  const descriptionId = `${listId}__description`;\n  const [description, setDescription, _descriptionSession] = usePropStatefully(\n    propsDescription ?? '',\n    rejectTextUpdatesWhenFocused\n  );\n  const propagateDescription = useCallback(\n    (nextValue: string) => onAction?.({ listId, next: { description: nextValue } }),\n    [onAction]\n  );\n  const debouncedPropagateDescription = useMemo(\n    () => debounce(propagateDescription, onChangePeriod),\n    [propagateDescription]\n  );\n  const _onChangeDescription = useCallback(\n    (nextValue: string) => {\n      setDescription(nextValue);\n      debouncedPropagateDescription(nextValue);\n    },\n    [onAction, listId]\n  );\n\n  // Items & order\n\n  const [items, setItems, itemsSession] = usePropStatefully(propsItems ?? {}, itemsEquivalent);\n  const order = Object.keys(items);\n\n  const propagateItem = useCallback(\n    ({ id, ...next }: Pick<ListItemProps, 'id'> & Partial<Omit<ListItemProps, 'id'>>) => {\n      return onAction?.({ listId, listItemId: id, next });\n    },\n    [listId, onAction]\n  );\n  const debouncedPropagateItem = useMemo(() => debounce(propagateItem, onChangePeriod), [propagateItem]);\n  const updateItem = useCallback(\n    ({ id, ...next }: Pick<ListItemProps, 'id'> & Partial<Omit<ListItemProps, 'id'>>) => {\n      setItems(Object.assign(items, { [id]: { ...items[id], ...next } }));\n      'title' in next && debouncedPropagateItem({ id, title: next.title });\n      'description' in next && debouncedPropagateItem({ id, description: next.description });\n      'annotations' in next && onAction?.({ listId, listItemId: id, next: { annotations: next.annotations } });\n    },\n    [items, listId, onAction]\n  );\n\n  const updateOrder = useCallback(\n    (id: ListItemId, delta: number) => {\n      const fromIndex = order.indexOf(id);\n      const toIndex = fromIndex + delta;\n      const nextOrder = Array.from(order);\n      nextOrder.splice(fromIndex, 1);\n      nextOrder.splice(toIndex, 0, id);\n      const nextItems = nextOrder.reduce((acc: ListItems, listItemId) => {\n        acc[listItemId] = items[listItemId];\n        return acc;\n      }, {});\n      setItems(nextItems);\n      onAction?.({ listId, next: {} });\n    },\n    [items, onAction]\n  );\n\n  const deleteItem = useCallback(\n    (id: ListItemId) => {\n      if (items[id]) {\n        const { [id]: deletedItem, ...nextItems } = items;\n        setItems(nextItems);\n        onAction?.({ listId, next: {}, deleted: { id, ...deletedItem } });\n      }\n    },\n    [items, onAction]\n  );\n\n  const createItem = useCallback(() => {\n    setCreating(true);\n    return createListItemId()\n      .then((id) => {\n        const next = {\n          items: { ...items, [id]: {} }\n        };\n        const created = { id };\n        setItems(next.items);\n        setAutofocus(id);\n        onAction?.({ listId, next: {}, created });\n      })\n      .finally(() => setCreating(false));\n  }, [items, createListItemId, onAction]);\n\n  // Render\n\n  const inputSlots = useMemo(\n    () => ({\n      root: { className: 'mli-2 mbs-0 mbe-2' },\n      input: {\n        className: 'border-0 rounded text-xl font-display font-semibold',\n        'data-itemid': listId\n      }\n    }),\n    [listId]\n  );\n\n  return (\n    <div\n      role='group'\n      {...divProps}\n      className={mx(defaultGroup({ elevation: 3, spacing: 'pbs-2 pbe-1' }), divProps.className)}\n      aria-labelledby={titleId}\n      {...(description && { 'aria-describedby': descriptionId })}\n    >\n      <span id={titleId} className='sr-only'>\n        {title}\n      </span>\n      {description && (\n        <span id={descriptionId} className='sr-only'>\n          {description}\n        </span>\n      )}\n      <Input\n        key={titleSession}\n        label={t('list title label')}\n        placeholder={t('list title placeholder')}\n        labelVisuallyHidden\n        initialValue={title}\n        onChange={onChangeTitle}\n        slots={inputSlots}\n      />\n      {/* TODO(thure): Re-enable this when relevant */}\n      {/* <Input */}\n      {/*  key={descriptionSession} */}\n      {/*  label={t('list description label')} */}\n      {/*  placeholder={t('list description placeholder')} */}\n      {/*  labelVisuallyHidden */}\n      {/*  initialValue={description} */}\n      {/*  onChange={onChangeDescription} */}\n      {/*  className='mli-4' */}\n      {/*  data-itemid={listId} */}\n      {/* /> */}\n      <ol className='contents'>\n        {order.map((listItemId, index) => {\n          return (\n            <ListItemPrimitive\n              key={`${itemsSession}__${listItemId}`}\n              orderIndex={index}\n              isLast={index === order.length - 1}\n              {...{ id: listItemId, updateItem, updateOrder, deleteItem, createItem }}\n              {...items[listItemId]}\n              autoFocus={listItemId === autoFocus}\n            />\n          );\n        })}\n      </ol>\n      <div role='none' className='mli-4 mlb-4'>\n        <Button className='is-full' onClick={createItem} disabled={creating}>\n          <Plus className={getSize(5)} />\n          <span className='sr-only'>{t('add list item label')}</span>\n        </Button>\n      </div>\n    </div>\n  );\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport { useEffect, useRef, useState, Dispatch, SetStateAction } from 'react';\n\nimport { randomString } from '@dxos/react-uikit';\n\nconst isEqual = <T>(a: T, b: T) => a === b;\n\n/**\n * @deprecated\n */\nexport const usePropStatefully = <T>(\n  propsValue: T,\n  equivalentPredicate?: (a: T, b: T) => boolean\n): [T, Dispatch<SetStateAction<T>>, string] => {\n  const [value, setValue] = useState<T>(propsValue);\n  const [valueSession, setValueSession] = useState(randomString());\n  const mounted = useRef(false);\n  const predicate = equivalentPredicate ?? isEqual<T>;\n\n  useEffect(() => {\n    if (mounted.current && !predicate(propsValue, value)) {\n      setValue(propsValue);\n      setValueSession(randomString());\n    } else {\n      mounted.current = true;\n    }\n  }, [propsValue]);\n\n  return [value, setValue, valueSession];\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["//\n// Copyright 2022 DXOS.org\n//\n\nimport React, { useCallback } from 'react';\n\nimport { Item, PublicKey, Space } from '@dxos/client';\nimport { ObjectModel } from '@dxos/object-model';\nimport { useSelection, useSpace } from '@dxos/react-client';\nimport { Loading, useTranslation } from '@dxos/react-components';\n\nimport { LIST_ITEM_TYPE } from '../../model';\nimport {\n  ListPrimitive,\n  ListAction,\n  ListItems,\n  isListItemChangedAction,\n  isListItemDeletedAction,\n  isListItemCreatedAction,\n  ListItemProps,\n  ListPrimitiveProps\n} from '../ListPrimitive';\n\ninterface ListLoadedProps {\n  space: Space;\n  list: Item<ObjectModel>;\n  listItems: Item<ObjectModel>[];\n}\n\nexport interface ListProps {\n  spaceKey: PublicKey;\n  itemId: Item<ObjectModel>['id'];\n}\n\nconst ListLoaded = ({ space, list, listItems: propsListItems }: ListLoadedProps) => {\n  const listItems = useSelection(list?.select().children().filter({ type: LIST_ITEM_TYPE })) ?? propsListItems;\n\n  const onAction = useCallback(\n    async (action: ListAction) => {\n      if (isListItemDeletedAction(action)) {\n        const subject = space.database.getItem(action.deleted.id);\n        // TODO(thure): use Echo’s native deletion\n        return subject?.model.set('annotations.deleted', true);\n      } else if (isListItemCreatedAction(action)) {\n        // do nothing?\n      } else if (isListItemChangedAction(action)) {\n        const subject = space.database.getItem(action.listItemId);\n        return Promise.all(\n          (Object.keys(action.next) as (keyof ListItemProps)[]).map((prop) => {\n            return subject?.model.set(prop, action.next[prop]);\n          })\n        );\n      } else {\n        return Promise.all(\n          (Object.keys(action.next) as (keyof ListPrimitiveProps)[]).map((prop) => {\n            return list?.model.set(prop, action.next[prop]);\n          })\n        );\n      }\n    },\n    [list, listItems]\n  );\n\n  const createListItemId = useCallback(async () => {\n    const listItem = await space?.database.createItem({\n      model: ObjectModel,\n      type: LIST_ITEM_TYPE,\n      parent: list.id\n    });\n    return listItem.id;\n  }, [space]);\n\n  return (\n    <ListPrimitive\n      {...{\n        id: list.id,\n        title: list.model.get('title') ?? '',\n        description: list.model.get('description') ?? '',\n        items: (listItems ?? [])\n          // TODO(thure): use Echo’s native deletion\n          .filter((item) => !item.model.get('annotations.deleted'))\n          .reduce((acc: ListItems, item) => {\n            acc[item.id] = {\n              title: item.model.get('title'),\n              description: item.model.get('description'),\n              annotations: item.model.get('annotations')\n            };\n            return acc;\n          }, {}),\n        onChangePeriod: 640,\n        onAction,\n        createListItemId\n      }}\n    />\n  );\n};\n\nexport const List = ({ spaceKey, itemId }: ListProps) => {\n  const { t } = useTranslation('appkit');\n\n  const space = useSpace(spaceKey);\n  const list = (useSelection(space?.database.select({ id: itemId })) ?? [])[0];\n  const listItems = useSelection(list?.select().children().filter({ type: LIST_ITEM_TYPE }));\n\n  // TODO(thure): this should become `Suspense` when the above hooks support it\n  return space && list && listItems ? (\n    <ListLoaded {...{ space, list, listItems }} />\n  ) : (\n    <Loading label={t('generic loading label')} />\n  );\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nexport const LIST_TYPE = 'dxos:type/list';\nexport const LIST_ITEM_TYPE = 'dxos:type/list-item';\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport debounce from 'lodash.debounce';\nimport { Minus, Plus } from 'phosphor-react';\nimport React, { ComponentProps, useCallback, useMemo, useState, KeyboardEvent } from 'react';\n\nimport {\n  defaultFocus,\n  Input,\n  useTranslation,\n  getSize,\n  Button,\n  randomString,\n  defaultGroup,\n  defaultHover,\n  mx\n} from '@dxos/react-components';\n\nimport { usePropStatefully } from '../../hooks';\n\ntype ListId = string;\ntype ListItemId = string;\n\nexport interface ListItemProps {\n  id: ListItemId;\n  title?: string;\n  description?: string;\n  annotations?: Record<string, string | boolean>;\n}\n\nexport type ListItems = Record<ListItemId, Omit<ListItemProps, 'id'>>;\n\ninterface SharedListActionProps {\n  listId: ListId;\n}\n\ninterface SharedListItemActionProps extends SharedListActionProps {\n  listItemId: ListItemId;\n}\n\nexport interface ListItemChangedAction extends SharedListItemActionProps {\n  next: Partial<ListItemProps>;\n}\n\nexport interface ListChangedAction extends SharedListActionProps {\n  next: Partial<ListPrimitiveProps>;\n}\n\nexport interface ListItemCreatedAction extends SharedListActionProps {\n  created: Pick<ListItemProps, 'id'> & Partial<Omit<ListItemProps, 'id'>>;\n}\n\nexport interface ListItemDeletedAction extends SharedListActionProps {\n  deleted: Pick<ListItemProps, 'id'> & Partial<Omit<ListItemProps, 'id'>>;\n}\n\nexport type ListAction = ListItemChangedAction | ListChangedAction | ListItemCreatedAction | ListItemDeletedAction;\n\nexport const isListItemChangedAction = (o: any): o is ListItemChangedAction => 'listItemId' in o;\nexport const isListItemCreatedAction = (o: any): o is ListItemCreatedAction => 'created' in o;\nexport const isListItemDeletedAction = (o: any): o is ListItemDeletedAction => 'deleted' in o;\n\nexport interface ListPrimitiveProps {\n  id: ListId;\n  title?: string;\n  description?: string;\n}\n\nexport interface ListPrimitiveComponentProps extends ListPrimitiveProps, Omit<ComponentProps<'div'>, 'id'> {\n  items: ListItems;\n  onAction?: (action: ListAction) => void;\n  createListItemId?: () => Promise<ListItemId>;\n  onChangePeriod?: number;\n}\n\nexport interface ListItemPrimitiveComponentProps extends ListItemProps, Omit<ComponentProps<'li'>, 'id' | 'title'> {\n  updateItem: (item: ListItemProps) => void;\n  updateOrder: (id: ListItemId, delta: number) => void;\n  deleteItem: (id: ListItemId) => void;\n  createItem: () => void;\n  orderIndex: number;\n  isLast?: boolean;\n  autoFocus?: boolean;\n}\n\nconst defaultCreateListItemId = async () => randomString(8);\n\nconst ListItemPrimitive = ({\n  id,\n  title: propsTitle,\n  description: propsDescription,\n  annotations: propsAnnotations,\n  updateItem,\n  deleteItem,\n  createItem,\n  updateOrder,\n  orderIndex,\n  isLast,\n  autoFocus\n}: ListItemPrimitiveComponentProps) => {\n  const checkId = `${id}__checkbox`;\n  const labelId = `${id}__title`;\n  const descriptionId = `${id}__description`;\n\n  const { t } = useTranslation('appkit');\n\n  const rejectTextUpdatesWhenFocused = useCallback(\n    (a: string, b: string) => {\n      return document.activeElement?.getAttribute('data-itemid') === id ? true : a === b;\n    },\n    [id]\n  );\n\n  const [title, setTitle, titleSession] = usePropStatefully<string>(propsTitle ?? '', rejectTextUpdatesWhenFocused);\n\n  const [description, _setDescription, _descriptionSession] = usePropStatefully<string>(\n    propsDescription ?? '',\n    rejectTextUpdatesWhenFocused\n  );\n\n  const [annotations, setAnnotations] = useState(propsAnnotations ?? {});\n  const isDone = annotations?.state === 'done';\n\n  const onChangeTitle = useCallback((nextValue: string) => {\n    setTitle(nextValue);\n    updateItem({ id, title: nextValue });\n  }, []);\n\n  const _onChangeDescription = useCallback((nextValue: string) => {\n    _setDescription(nextValue);\n    updateItem({ id, description: nextValue });\n  }, []);\n\n  const _onClickMoveUp = useCallback(() => {\n    updateOrder(id, -1);\n  }, [updateOrder, id]);\n  const _onClickMoveDown = useCallback(() => {\n    updateOrder(id, 1);\n  }, [updateOrder, id]);\n\n  const onChangeCheckbox = useCallback(() => {\n    const nextAnnotations = { ...annotations, state: isDone ? 'init' : 'done' };\n    setAnnotations(nextAnnotations);\n    updateItem({ id, annotations: nextAnnotations });\n  }, [annotations, isDone]);\n\n  const onClickDelete = useCallback(() => {\n    deleteItem(id);\n  }, [deleteItem, id]);\n\n  const onKeyUp = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      switch (e.key) {\n        case 'Enter':\n          if (!e.shiftKey) {\n            if (isLast) {\n              createItem();\n            } else {\n              (\n                document.querySelector(`input[data-orderindex=\"${orderIndex + 1}\"]`) as HTMLElement | undefined\n              )?.focus();\n            }\n          }\n          break;\n        case 'PageDown':\n          (document.querySelector(`input[data-orderindex=\"${orderIndex + 1}\"]`) as HTMLElement | undefined)?.focus();\n          break;\n        case 'PageUp':\n          (document.querySelector(`input[data-orderindex=\"${orderIndex - 1}\"]`) as HTMLElement | undefined)?.focus();\n          break;\n      }\n    },\n    [orderIndex, isLast]\n  );\n\n  const inputSlots = useMemo(\n    () => ({\n      root: { className: 'm-0' },\n      input: {\n        className: 'border-0 rounded',\n        autoFocus: true,\n        'data-orderindex': orderIndex,\n        'data-itemid': id,\n        onKeyUp\n      }\n    }),\n    [orderIndex, id, onKeyUp]\n  );\n\n  return (\n    <li\n      key={id}\n      className='flex items-center gap-2 pli-4 mbe-2'\n      aria-labelledby={labelId}\n      {...(description && { 'aria-describedby': descriptionId })}\n    >\n      <input\n        {...{\n          type: 'checkbox',\n          id: checkId,\n          ...(description && {\n            'aria-describedby': descriptionId\n          }),\n          className: mx(\n            getSize(5),\n            'text-primary-600 bg-neutral-50 rounded-full border-neutral-300 dark:bg-neutral-800 dark:border-neutral-600 cursor-pointer',\n            defaultFocus,\n            defaultHover({})\n          ),\n          onChange: onChangeCheckbox,\n          checked: isDone\n        }}\n      />\n      <label htmlFor={checkId} id={labelId} className='sr-only'>\n        {title}\n      </label>\n      <span id={descriptionId} className='sr-only'>\n        {description}\n      </span>\n      <div role='none' className='grow'>\n        <Input\n          key={titleSession}\n          label={t('list item title label')}\n          placeholder={t('list item title placeholder')}\n          labelVisuallyHidden\n          initialValue={title}\n          onChange={onChangeTitle}\n          slots={inputSlots}\n        />\n        {/* TODO(thure): Re-enable this when descriptions become relevant */}\n        {/* <Input */}\n        {/*  key={descriptionSession} */}\n        {/*  label={t('list item description label')} */}\n        {/*  placeholder={t('list item description placeholder')} */}\n        {/*  labelVisuallyHidden */}\n        {/*  initialValue={description} */}\n        {/*  onChange={onChangeDescription} */}\n        {/*  data-itemid={id} */}\n        {/* /> */}\n      </div>\n      {/* TODO(thure): Restore these, or implement drag & drop, when how best to change order in Echo is clarified. */}\n      {/* <ButtonGroup className='flex flex-col items-stretch'> */}\n      {/*  <Button compact rounding='rounded-bs-md border-be-0' disabled={isFirst} onClick={onClickMoveUp}> */}\n      {/*    <CaretUp /> */}\n      {/*    <span className='sr-only'>{t('move list item up label')}</span> */}\n      {/*  </Button> */}\n      {/*  <Button compact rounding='rounded-be-md' disabled={isLast} onClick={onClickMoveDown}> */}\n      {/*    <CaretDown /> */}\n      {/*    <span className='sr-only'>{t('move list item down label')}</span> */}\n      {/*  </Button> */}\n      {/* </ButtonGroup> */}\n      <Button onClick={onClickDelete} variant='ghost' className='p-1 self-stretch'>\n        <Minus className={getSize(4)} />\n        <span className='sr-only'>{t('delete list item label')}</span>\n      </Button>\n    </li>\n  );\n};\n\nconst itemsEquivalent = (a: ListItems, b: ListItems) => {\n  const aKeys = Object.keys(a);\n  const bKeys = Object.keys(b);\n  for (let i = 0; i < aKeys.length; i++) {\n    const key = aKeys[i];\n    if (key !== bKeys[i] || a[key].title !== b[key].title || a[key].annotations?.state !== b[key].annotations?.state) {\n      return false;\n    }\n  }\n  return true;\n};\n\nexport const ListPrimitive = ({\n  id: listId,\n  title: propsTitle,\n  description: propsDescription,\n  items: propsItems,\n  onAction,\n  createListItemId = defaultCreateListItemId,\n  onChangePeriod = 0,\n  ...divProps\n}: ListPrimitiveComponentProps) => {\n  const { t } = useTranslation('appkit');\n\n  const [creating, setCreating] = useState(false);\n  const [autoFocus, setAutofocus] = useState<string | null>(null);\n\n  const rejectTextUpdatesWhenFocused = useCallback(\n    (a: string, b: string) => {\n      return document.activeElement?.getAttribute('data-itemid') === listId ? true : a === b;\n    },\n    [listId]\n  );\n\n  // Title\n\n  const titleId = `${listId}__title`;\n  const [title, setTitle, titleSession] = usePropStatefully(propsTitle ?? '', rejectTextUpdatesWhenFocused);\n  const propagateTitle = useCallback(\n    (nextValue: string) => {\n      return onAction?.({ listId, next: { title: nextValue } });\n    },\n    [onAction]\n  );\n  const debouncedPropagateTitle = useMemo(() => debounce(propagateTitle, onChangePeriod), [propagateTitle]);\n  const onChangeTitle = useCallback(\n    (nextValue: string) => {\n      setTitle(nextValue);\n      debouncedPropagateTitle(nextValue);\n    },\n    [onAction, listId]\n  );\n\n  // Description\n\n  const descriptionId = `${listId}__description`;\n  const [description, setDescription, _descriptionSession] = usePropStatefully(\n    propsDescription ?? '',\n    rejectTextUpdatesWhenFocused\n  );\n  const propagateDescription = useCallback(\n    (nextValue: string) => onAction?.({ listId, next: { description: nextValue } }),\n    [onAction]\n  );\n  const debouncedPropagateDescription = useMemo(\n    () => debounce(propagateDescription, onChangePeriod),\n    [propagateDescription]\n  );\n  const _onChangeDescription = useCallback(\n    (nextValue: string) => {\n      setDescription(nextValue);\n      debouncedPropagateDescription(nextValue);\n    },\n    [onAction, listId]\n  );\n\n  // Items & order\n\n  const [items, setItems, itemsSession] = usePropStatefully(propsItems ?? {}, itemsEquivalent);\n  const order = Object.keys(items);\n\n  const propagateItem = useCallback(\n    ({ id, ...next }: Pick<ListItemProps, 'id'> & Partial<Omit<ListItemProps, 'id'>>) => {\n      return onAction?.({ listId, listItemId: id, next });\n    },\n    [listId, onAction]\n  );\n  const debouncedPropagateItem = useMemo(() => debounce(propagateItem, onChangePeriod), [propagateItem]);\n  const updateItem = useCallback(\n    ({ id, ...next }: Pick<ListItemProps, 'id'> & Partial<Omit<ListItemProps, 'id'>>) => {\n      setItems(Object.assign(items, { [id]: { ...items[id], ...next } }));\n      'title' in next && debouncedPropagateItem({ id, title: next.title });\n      'description' in next && debouncedPropagateItem({ id, description: next.description });\n      'annotations' in next && onAction?.({ listId, listItemId: id, next: { annotations: next.annotations } });\n    },\n    [items, listId, onAction]\n  );\n\n  const updateOrder = useCallback(\n    (id: ListItemId, delta: number) => {\n      const fromIndex = order.indexOf(id);\n      const toIndex = fromIndex + delta;\n      const nextOrder = Array.from(order);\n      nextOrder.splice(fromIndex, 1);\n      nextOrder.splice(toIndex, 0, id);\n      const nextItems = nextOrder.reduce((acc: ListItems, listItemId) => {\n        acc[listItemId] = items[listItemId];\n        return acc;\n      }, {});\n      setItems(nextItems);\n      onAction?.({ listId, next: {} });\n    },\n    [items, onAction]\n  );\n\n  const deleteItem = useCallback(\n    (id: ListItemId) => {\n      if (items[id]) {\n        const { [id]: deletedItem, ...nextItems } = items;\n        setItems(nextItems);\n        onAction?.({ listId, next: {}, deleted: { id, ...deletedItem } });\n      }\n    },\n    [items, onAction]\n  );\n\n  const createItem = useCallback(() => {\n    setCreating(true);\n    return createListItemId()\n      .then((id) => {\n        const next = {\n          items: { ...items, [id]: {} }\n        };\n        const created = { id };\n        setItems(next.items);\n        setAutofocus(id);\n        onAction?.({ listId, next: {}, created });\n      })\n      .finally(() => setCreating(false));\n  }, [items, createListItemId, onAction]);\n\n  // Render\n\n  const inputSlots = useMemo(\n    () => ({\n      root: { className: 'mli-2 mbs-0 mbe-2' },\n      input: {\n        className: 'border-0 rounded text-xl font-display font-semibold',\n        'data-itemid': listId\n      }\n    }),\n    [listId]\n  );\n\n  return (\n    <div\n      role='group'\n      {...divProps}\n      className={mx(defaultGroup({ elevation: 3, spacing: 'pbs-2 pbe-1' }), divProps.className)}\n      aria-labelledby={titleId}\n      {...(description && { 'aria-describedby': descriptionId })}\n    >\n      <span id={titleId} className='sr-only'>\n        {title}\n      </span>\n      {description && (\n        <span id={descriptionId} className='sr-only'>\n          {description}\n        </span>\n      )}\n      <Input\n        key={titleSession}\n        label={t('list title label')}\n        placeholder={t('list title placeholder')}\n        labelVisuallyHidden\n        initialValue={title}\n        onChange={onChangeTitle}\n        slots={inputSlots}\n      />\n      {/* TODO(thure): Re-enable this when relevant */}\n      {/* <Input */}\n      {/*  key={descriptionSession} */}\n      {/*  label={t('list description label')} */}\n      {/*  placeholder={t('list description placeholder')} */}\n      {/*  labelVisuallyHidden */}\n      {/*  initialValue={description} */}\n      {/*  onChange={onChangeDescription} */}\n      {/*  className='mli-4' */}\n      {/*  data-itemid={listId} */}\n      {/* /> */}\n      <ol className='contents'>\n        {order.map((listItemId, index) => {\n          return (\n            <ListItemPrimitive\n              key={`${itemsSession}__${listItemId}`}\n              orderIndex={index}\n              isLast={index === order.length - 1}\n              {...{ id: listItemId, updateItem, updateOrder, deleteItem, createItem }}\n              {...items[listItemId]}\n              autoFocus={listItemId === autoFocus}\n            />\n          );\n        })}\n      </ol>\n      <div role='none' className='mli-4 mlb-4'>\n        <Button className='is-full' onClick={createItem} disabled={creating}>\n          <Plus className={getSize(5)} />\n          <span className='sr-only'>{t('add list item label')}</span>\n        </Button>\n      </div>\n    </div>\n  );\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport { useEffect, useRef, useState, Dispatch, SetStateAction } from 'react';\n\nimport { randomString } from '@dxos/react-components';\n\nconst isEqual = <T>(a: T, b: T) => a === b;\n\n/**\n * @deprecated\n */\nexport const usePropStatefully = <T>(\n  propsValue: T,\n  equivalentPredicate?: (a: T, b: T) => boolean\n): [T, Dispatch<SetStateAction<T>>, string] => {\n  const [value, setValue] = useState<T>(propsValue);\n  const [valueSession, setValueSession] = useState(randomString());\n  const mounted = useRef(false);\n  const predicate = equivalentPredicate ?? isEqual<T>;\n\n  useEffect(() => {\n    if (mounted.current && !predicate(propsValue, value)) {\n      setValue(propsValue);\n      setValueSession(randomString());\n    } else {\n      mounted.current = true;\n    }\n  }, [propsValue]);\n\n  return [value, setValue, valueSession];\n};\n"],
+  "mappings": "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",
   "names": ["React", "useCallback", "ObjectModel", "useSelection", "useSpace", "Loading", "useTranslation", "LIST_TYPE", "LIST_ITEM_TYPE", "debounce", "Minus", "Plus", "React", "useCallback", "useMemo", "useState", "defaultFocus", "Input", "useTranslation", "getSize", "Button", "randomString", "defaultGroup", "defaultHover", "mx", "useEffect", "useRef", "useState", "randomString", "isEqual", "a", "b", "usePropStatefully", "propsValue", "equivalentPredicate", "value", "setValue", "valueSession", "setValueSession", "mounted", "predicate", "current", "isListItemChangedAction", "o", "isListItemCreatedAction", "isListItemDeletedAction", "defaultCreateListItemId", "randomString", "ListItemPrimitive", "id", "title", "propsTitle", "description", "propsDescription", "annotations", "propsAnnotations", "updateItem", "deleteItem", "createItem", "updateOrder", "orderIndex", "isLast", "autoFocus", "checkId", "labelId", "descriptionId", "t", "useTranslation", "rejectTextUpdatesWhenFocused", "useCallback", "a", "b", "document", "activeElement", "getAttribute", "setTitle", "titleSession", "usePropStatefully", "_setDescription", "_descriptionSession", "setAnnotations", "useState", "isDone", "state", "onChangeTitle", "nextValue", "_onChangeDescription", "_onClickMoveUp", "_onClickMoveDown", "onChangeCheckbox", "nextAnnotations", "onClickDelete", "onKeyUp", "e", "key", "shiftKey", "querySelector", "focus", "inputSlots", "useMemo", "root", "className", "input", "li", "aria-labelledby", "type", "mx", "getSize", "defaultFocus", "defaultHover", "onChange", "checked", "label", "htmlFor", "span", "div", "role", "Input", "placeholder", "labelVisuallyHidden", "initialValue", "slots", "Button", "onClick", "variant", "Minus", "itemsEquivalent", "aKeys", "Object", "keys", "bKeys", "i", "length", "ListPrimitive", "listId", "items", "propsItems", "onAction", "createListItemId", "onChangePeriod", "divProps", "creating", "setCreating", "setAutofocus", "titleId", "propagateTitle", "next", "debouncedPropagateTitle", "debounce", "setDescription", "propagateDescription", "debouncedPropagateDescription", "setItems", "itemsSession", "order", "propagateItem", "listItemId", "debouncedPropagateItem", "assign", "delta", "fromIndex", "indexOf", "toIndex", "nextOrder", "Array", "from", "splice", "nextItems", "reduce", "acc", "deletedItem", "deleted", "then", "created", "finally", "defaultGroup", "elevation", "spacing", "ol", "map", "index", "disabled", "Plus", "_extends", "ListLoaded", "space", "list", "listItems", "propsListItems", "useSelection", "select", "children", "filter", "type", "LIST_ITEM_TYPE", "onAction", "useCallback", "action", "isListItemDeletedAction", "subject", "database", "getItem", "deleted", "id", "model", "set", "isListItemCreatedAction", "isListItemChangedAction", "listItemId", "Promise", "all", "Object", "keys", "next", "map", "prop", "createListItemId", "listItem", "createItem", "ObjectModel", "parent", "React", "ListPrimitive", "title", "get", "description", "items", "item", "reduce", "acc", "annotations", "onChangePeriod", "List", "spaceKey", "itemId", "t", "useTranslation", "useSpace", "Loading", "label"]
 }

package/dist/lib/browser/meta.json

@@ -1 +1 @@
-{"inputs":{"packages/apps/patterns/react-list/src/model.ts":{"bytes":632,"imports":[]},"packages/apps/patterns/react-list/src/hooks/usePropStatefully.ts":{"bytes":3183,"imports":[]},"packages/apps/patterns/react-list/src/hooks/index.ts":{"bytes":401,"imports":[{"path":"packages/apps/patterns/react-list/src/hooks/usePropStatefully.ts","kind":"import-statement"}]},"packages/apps/patterns/react-list/src/components/ListPrimitive/ListPrimitive.tsx":{"bytes":46313,"imports":[{"path":"packages/apps/patterns/react-list/src/hooks/index.ts","kind":"import-statement"}]},"packages/apps/patterns/react-list/src/components/ListPrimitive/index.ts":{"bytes":389,"imports":[{"path":"packages/apps/patterns/react-list/src/components/ListPrimitive/ListPrimitive.tsx","kind":"import-statement"}]},"packages/apps/patterns/react-list/src/components/List/List.tsx":{"bytes":12360,"imports":[{"path":"packages/apps/patterns/react-list/src/model.ts","kind":"import-statement"},{"path":"packages/apps/patterns/react-list/src/components/ListPrimitive/index.ts","kind":"import-statement"}]},"packages/apps/patterns/react-list/src/components/List/index.ts":{"bytes":368,"imports":[{"path":"packages/apps/patterns/react-list/src/components/List/List.tsx","kind":"import-statement"}]},"packages/apps/patterns/react-list/src/components/index.ts":{"bytes":368,"imports":[{"path":"packages/apps/patterns/react-list/src/components/List/index.ts","kind":"import-statement"}]},"packages/apps/patterns/react-list/src/index.ts":{"bytes":463,"imports":[{"path":"packages/apps/patterns/react-list/src/components/index.ts","kind":"import-statement"},{"path":"packages/apps/patterns/react-list/src/model.ts","kind":"import-statement"}]}},"outputs":{"packages/apps/patterns/react-list/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":33185},"packages/apps/patterns/react-list/dist/lib/browser/index.mjs":{"imports":[],"exports":["LIST_ITEM_TYPE","LIST_TYPE","List"],"entryPoint":"packages/apps/patterns/react-list/src/index.ts","inputs":{"packages/apps/patterns/react-list/src/components/List/List.tsx":{"bytesInOutput":3223},"packages/apps/patterns/react-list/src/model.ts":{"bytesInOutput":78},"packages/apps/patterns/react-list/src/components/ListPrimitive/ListPrimitive.tsx":{"bytesInOutput":12102},"packages/apps/patterns/react-list/src/hooks/usePropStatefully.ts":{"bytesInOutput":716},"packages/apps/patterns/react-list/src/hooks/index.ts":{"bytesInOutput":0},"packages/apps/patterns/react-list/src/components/ListPrimitive/index.ts":{"bytesInOutput":0},"packages/apps/patterns/react-list/src/components/List/index.ts":{"bytesInOutput":0},"packages/apps/patterns/react-list/src/components/index.ts":{"bytesInOutput":0},"packages/apps/patterns/react-list/src/index.ts":{"bytesInOutput":0}},"bytes":16627}}}
+{"inputs":{"packages/apps/patterns/react-list/src/model.ts":{"bytes":632,"imports":[]},"packages/apps/patterns/react-list/src/hooks/usePropStatefully.ts":{"bytes":3192,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-components","kind":"import-statement","external":true}]},"packages/apps/patterns/react-list/src/hooks/index.ts":{"bytes":401,"imports":[{"path":"packages/apps/patterns/react-list/src/hooks/usePropStatefully.ts","kind":"import-statement","original":"./usePropStatefully"}]},"packages/apps/patterns/react-list/src/components/ListPrimitive/ListPrimitive.tsx":{"bytes":46326,"imports":[{"path":"lodash.debounce","kind":"import-statement","external":true},{"path":"phosphor-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-components","kind":"import-statement","external":true},{"path":"packages/apps/patterns/react-list/src/hooks/index.ts","kind":"import-statement","original":"../../hooks"}]},"packages/apps/patterns/react-list/src/components/ListPrimitive/index.ts":{"bytes":389,"imports":[{"path":"packages/apps/patterns/react-list/src/components/ListPrimitive/ListPrimitive.tsx","kind":"import-statement","original":"./ListPrimitive"}]},"packages/apps/patterns/react-list/src/components/List/List.tsx":{"bytes":12273,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/object-model","kind":"import-statement","external":true},{"path":"@dxos/react-client","kind":"import-statement","external":true},{"path":"@dxos/react-components","kind":"import-statement","external":true},{"path":"packages/apps/patterns/react-list/src/model.ts","kind":"import-statement","original":"../../model"},{"path":"packages/apps/patterns/react-list/src/components/ListPrimitive/index.ts","kind":"import-statement","original":"../ListPrimitive"}]},"packages/apps/patterns/react-list/src/components/List/index.ts":{"bytes":368,"imports":[{"path":"packages/apps/patterns/react-list/src/components/List/List.tsx","kind":"import-statement","original":"./List"}]},"packages/apps/patterns/react-list/src/components/index.ts":{"bytes":368,"imports":[{"path":"packages/apps/patterns/react-list/src/components/List/index.ts","kind":"import-statement","original":"./List"}]},"packages/apps/patterns/react-list/src/index.ts":{"bytes":463,"imports":[{"path":"packages/apps/patterns/react-list/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/apps/patterns/react-list/src/model.ts","kind":"import-statement","original":"./model"}]}},"outputs":{"packages/apps/patterns/react-list/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":33286},"packages/apps/patterns/react-list/dist/lib/browser/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/object-model","kind":"import-statement","external":true},{"path":"@dxos/react-client","kind":"import-statement","external":true},{"path":"@dxos/react-components","kind":"import-statement","external":true},{"path":"lodash.debounce","kind":"import-statement","external":true},{"path":"phosphor-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-components","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-components","kind":"import-statement","external":true}],"exports":["LIST_ITEM_TYPE","LIST_TYPE","List"],"entryPoint":"packages/apps/patterns/react-list/src/index.ts","inputs":{"packages/apps/patterns/react-list/src/components/List/List.tsx":{"bytesInOutput":3196},"packages/apps/patterns/react-list/src/model.ts":{"bytesInOutput":78},"packages/apps/patterns/react-list/src/components/ListPrimitive/ListPrimitive.tsx":{"bytesInOutput":12107},"packages/apps/patterns/react-list/src/hooks/usePropStatefully.ts":{"bytesInOutput":721},"packages/apps/patterns/react-list/src/hooks/index.ts":{"bytesInOutput":0},"packages/apps/patterns/react-list/src/components/ListPrimitive/index.ts":{"bytesInOutput":0},"packages/apps/patterns/react-list/src/components/List/index.ts":{"bytesInOutput":0},"packages/apps/patterns/react-list/src/components/index.ts":{"bytesInOutput":0},"packages/apps/patterns/react-list/src/index.ts":{"bytesInOutput":0}},"bytes":16610}}}

package/dist/types/src/components/List/List.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/List.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,IAAI,EAAE,SAAS,EAAS,MAAM,cAAc,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAuBjD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC;CACjC;AAiED,eAAO,MAAM,IAAI,yBAA0B,SAAS,gBAanD,CAAC"}
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/List.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,IAAI,EAAE,SAAS,EAAS,MAAM,cAAc,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAsBjD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC;CACjC;AAiED,eAAO,MAAM,IAAI,yBAA0B,SAAS,gBAanD,CAAC"}

package/dist/types/src/components/List/List.stories.d.ts

@@ -1,14 +1,17 @@
 import '@dxosTheme';
+import type { StoryFn } from '@storybook/react';
 import { PublicKey } from '@dxos/client';
 import { ListProps } from './List';
 declare const _default: {
-    title: string;
     component: ({ spaceKey, itemId }: ListProps) => JSX.Element;
     argTypes: {};
 };
 export default _default;
-export declare const Default: import("@storybook/react").Story<Omit<ListProps, "spaceKey" | "itemId"> & {
-    spaceKey?: PublicKey | undefined;
-    id?: number | undefined;
-}>;
+export declare const Default: {
+    render: (args: Omit<ListProps, 'itemId' | 'spaceKey'> & {
+        spaceKey?: PublicKey;
+        id?: number;
+    }) => JSX.Element;
+    decorators: ((Story: StoryFn) => JSX.Element)[];
+};
 //# sourceMappingURL=List.stories.d.ts.map

package/dist/types/src/components/List/List.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"List.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/List.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAIpB,OAAO,EAAsB,SAAS,EAAE,MAAM,cAAc,CAAC;AAU7D,OAAO,EAAQ,SAAS,EAAE,MAAM,QAAQ,CAAC;;;;;;AAKzC,wBAIE;AAsBF,eAAO,MAAM,OAAO;;;EAAqC,CAAC"}
+{"version":3,"file":"List.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/List.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AACpB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAIhD,OAAO,EAAsB,SAAS,EAAE,MAAM,cAAc,CAAC;AAS7D,OAAO,EAAQ,SAAS,EAAE,MAAM,QAAQ,CAAC;;;;;AAKzC,wBAGE;AAEF,eAAO,MAAM,OAAO;mBACH,KAAK,SAAS,EAAE,QAAQ,GAAG,UAAU,CAAC,GAAG;QAAE,QAAQ,CAAC,EAAE,SAAS,CAAC;QAAC,EAAE,CAAC,EAAE,MAAM,CAAA;KAAE;yBAqBnF,OAAO;CAwElB,CAAC"}

package/dist/types/src/components/ListPrimitive/ListPrimitive.stories.d.ts

@@ -1,10 +1,31 @@
 import '@dxosTheme';
 import { ListPrimitiveComponentProps } from './ListPrimitive';
 declare const _default: {
-    title: string;
     component: ({ id: listId, title: propsTitle, description: propsDescription, items: propsItems, onAction, createListItemId, onChangePeriod, ...divProps }: ListPrimitiveComponentProps) => JSX.Element;
     argTypes: {};
 };
 export default _default;
-export declare const Default: import("@storybook/react").Story<Omit<ListPrimitiveComponentProps, "item">>;
+export declare const Default: {
+    render: (args: Omit<ListPrimitiveComponentProps, 'item'>) => JSX.Element;
+    args: {
+        id: string;
+        items: {
+            x234567: {
+                title: string;
+            };
+            x345678: {
+                title: string;
+                annotations: {
+                    state: string;
+                };
+            };
+            x456789: {
+                title: string;
+            };
+            x567890: {
+                title: string;
+            };
+        };
+    };
+};
 //# sourceMappingURL=ListPrimitive.stories.d.ts.map

package/dist/types/src/components/ListPrimitive/ListPrimitive.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListPrimitive.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/ListPrimitive/ListPrimitive.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAIpB,OAAO,EAAiB,2BAA2B,EAAE,MAAM,iBAAiB,CAAC;;;;;;AAE7E,wBAIE;AAUF,eAAO,MAAM,OAAO,6EAAwD,CAAC"}
+{"version":3,"file":"ListPrimitive.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/ListPrimitive/ListPrimitive.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAGpB,OAAO,EAAiB,2BAA2B,EAAE,MAAM,iBAAiB,CAAC;;;;;AAE7E,wBAGE;AAEF,eAAO,MAAM,OAAO;mBACH,KAAK,2BAA2B,EAAE,MAAM,CAAC;;;;;;;;;;;;;;;;;;;;;CAyBzD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-list",
-  "version": "0.1.20",
+  "version": "0.1.22",
   "description": "A list editing experience component for DXOS.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -16,22 +16,21 @@
     "lodash.debounce": "^4.0.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "@dxos/client": "0.1.20",
-    "@dxos/config": "0.1.20",
-    "@dxos/object-model": "0.1.20",
-    "@dxos/react-appkit": "0.1.20",
-    "@dxos/react-async": "0.1.20",
-    "@dxos/react-client": "0.1.20",
-    "@dxos/react-ui": "0.1.20",
-    "@dxos/react-uikit": "0.1.20"
+    "@dxos/client": "0.1.22",
+    "@dxos/config": "0.1.22",
+    "@dxos/object-model": "0.1.22",
+    "@dxos/react-appkit": "0.1.22",
+    "@dxos/react-async": "0.1.22",
+    "@dxos/react-client": "0.1.22",
+    "@dxos/react-components": "0.1.22"
   },
   "devDependencies": {
     "@types/lodash.debounce": "^4.0.7",
     "@types/react": "^18.0.21",
     "@types/react-dom": "^18.0.6",
     "phosphor-react": "^1.4.1",
-    "@dxos/async": "0.1.20",
-    "@dxos/debug": "0.1.20"
+    "@dxos/async": "0.1.22",
+    "@dxos/debug": "0.1.22"
   },
   "peerDependencies": {
     "phosphor-react": "^1.4.1"

package/src/components/List/List.stories.tsx

@@ -3,6 +3,7 @@
 //
 
 import '@dxosTheme';
+import type { StoryFn } from '@storybook/react';
 import React, { useMemo, useState } from 'react';
 
 import { Trigger } from '@dxos/async';
@@ -12,113 +13,111 @@ import { raise } from '@dxos/debug';
 import { ObjectModel } from '@dxos/object-model';
 import { useAsyncEffect } from '@dxos/react-async';
 import { ClientProvider, useSelection, useSpace } from '@dxos/react-client';
-import { Loading } from '@dxos/react-uikit';
+import { Loading } from '@dxos/react-components';
 
 import { LIST_TYPE } from '../../model';
-import { templateForComponent } from '../../testing';
 import { List, ListProps } from './List';
 
 // TODO(wittjosiah): @dxos/log.
 const log = console.log;
 
 export default {
-  title: 'react-list/List',
   component: List,
   argTypes: {}
 };
 
-const Template = (args: Omit<ListProps, 'itemId' | 'spaceKey'> & { spaceKey?: PublicKey; id?: number }) => {
-  const space = useSpace(args.spaceKey);
-  const [item] = useSelection(space?.database.select({ type: LIST_TYPE })) ?? [];
-
-  useAsyncEffect(async () => {
-    if (args.id === 0) {
-      await space?.database.createItem({
-        model: ObjectModel,
-        type: LIST_TYPE
-      });
-    }
-  }, [space]);
-
-  return (
-    <main className='max-is-lg mli-auto pli-7 mbs-7'>
-      {item && space ? <List {...args} itemId={item.id} spaceKey={space?.key} /> : <Loading label='Loading…' />}
-    </main>
-  );
-};
-
-export const Default = templateForComponent(Template)({});
-Default.args = {};
-Default.decorators = [
-  // TODO(wittjosiah): Factor out.
-  (Story) => {
-    const n = 2;
-    const clients = useMemo(() => {
-      const testBuilder = new TestBuilder();
-      return [...Array(n)].map(() => new Client({ services: testBuilder.createClientServicesHost() }));
-    }, []);
-
-    const [spaceKey, setSpaceKey] = useState<PublicKey>();
+export const Default = {
+  render: (args: Omit<ListProps, 'itemId' | 'spaceKey'> & { spaceKey?: PublicKey; id?: number }) => {
+    const space = useSpace(args.spaceKey);
+    const [item] = useSelection(space?.database.select({ type: LIST_TYPE })) ?? [];
 
     useAsyncEffect(async () => {
-      await Promise.all(clients.map((client) => client.initialize()));
-      log('initialized');
-
-      await Promise.all(clients.map((client) => client.halo.createProfile()));
-      log('identity created');
-
-      const space = await clients[0].echo.createSpace();
-      log('space created', { space: space.key });
-
-      await Promise.all(
-        clients.slice(1).map(async (client) => {
-          const observable1 = await space.createInvitation({ type: Invitation.Type.INTERACTIVE_TESTING });
-          log('invitation created');
-
-          const observable2 = await client.echo.acceptInvitation(observable1.invitation!);
-          log('invitation accepted');
-
-          const success1 = new Trigger<Invitation>();
-          observable1.subscribe({
-            onSuccess: (invitation) => {
-              success1.wake(invitation);
-              log('invitation success1');
-            },
-            onError: (err) => raise(err)
-          });
-
-          const success2 = new Trigger<Invitation>();
-          observable2.subscribe({
-            onSuccess: (invitation: Invitation) => {
-              success2.wake(invitation);
-              log('invitation success2');
-            },
-            onError: (err: Error) => raise(err)
-          });
-
-          await Promise.all([success1.wait(), success2.wait()]);
-        })
-      );
-
-      setSpaceKey(space.key);
-
-      return () => {
-        void Promise.all(clients.map((client) => client.destroy()));
-      };
-    }, clients);
-
-    if (!spaceKey) {
-      return <Loading label='Loading…' />;
-    }
+      if (args.id === 0) {
+        await space?.database.createItem({
+          model: ObjectModel,
+          type: LIST_TYPE
+        });
+      }
+    }, [space]);
 
     return (
-      <div className='flex'>
-        {clients.map((client, index) => (
-          <ClientProvider key={index} client={client} fallback={<Loading label='Loading…' />}>
-            <Story args={{ spaceKey, id: index }} />
-          </ClientProvider>
-        ))}
-      </div>
+      <main className='max-is-lg mli-auto pli-7 mbs-7'>
+        {item && space ? <List {...args} itemId={item.id} spaceKey={space?.key} /> : <Loading label='Loading…' />}
+      </main>
     );
-  }
-];
+  },
+  decorators: [
+    // TODO(wittjosiah): Factor out.
+    (Story: StoryFn) => {
+      const n = 2;
+      const clients = useMemo(() => {
+        const testBuilder = new TestBuilder();
+        return [...Array(n)].map(() => new Client({ services: testBuilder.createClientServicesHost() }));
+      }, []);
+
+      const [spaceKey, setSpaceKey] = useState<PublicKey>();
+
+      useAsyncEffect(async () => {
+        await Promise.all(clients.map((client) => client.initialize()));
+        log('initialized');
+
+        await Promise.all(clients.map((client) => client.halo.createProfile()));
+        log('identity created');
+
+        const space = await clients[0].echo.createSpace();
+        log('space created', { space: space.key });
+
+        await Promise.all(
+          clients.slice(1).map(async (client) => {
+            const success1 = new Trigger<Invitation>();
+            const success2 = new Trigger<Invitation>();
+
+            const observable1 = space.createInvitation({ type: Invitation.Type.INTERACTIVE_TESTING });
+            log('invitation created');
+            observable1.subscribe({
+              onConnecting: (invitation) => {
+                const observable2 = client.echo.acceptInvitation(invitation);
+                log('invitation accepted');
+
+                observable2.subscribe({
+                  onSuccess: (invitation: Invitation) => {
+                    success2.wake(invitation);
+                    log('invitation success2');
+                  },
+                  onError: (err: Error) => raise(err)
+                });
+              },
+              onSuccess: (invitation) => {
+                success1.wake(invitation);
+                log('invitation success1');
+              },
+              onError: (err) => raise(err)
+            });
+
+            await Promise.all([success1.wait(), success2.wait()]);
+          })
+        );
+
+        setSpaceKey(space.key);
+
+        return () => {
+          void Promise.all(clients.map((client) => client.destroy()));
+        };
+      }, clients);
+
+      if (!spaceKey) {
+        return <Loading label='Loading…' />;
+      }
+
+      return (
+        <div className='flex'>
+          {clients.map((client, index) => (
+            <ClientProvider key={index} client={client} fallback={<Loading label='Loading…' />}>
+              <Story args={{ spaceKey, id: index }} />
+            </ClientProvider>
+          ))}
+        </div>
+      );
+    }
+  ]
+};

package/src/components/List/List.tsx

@@ -7,8 +7,7 @@ import React, { useCallback } from 'react';
 import { Item, PublicKey, Space } from '@dxos/client';
 import { ObjectModel } from '@dxos/object-model';
 import { useSelection, useSpace } from '@dxos/react-client';
-import { Loading } from '@dxos/react-ui';
-import { useTranslation } from '@dxos/react-uikit';
+import { Loading, useTranslation } from '@dxos/react-components';
 
 import { LIST_ITEM_TYPE } from '../../model';
 import {
@@ -97,7 +96,7 @@ const ListLoaded = ({ space, list, listItems: propsListItems }: ListLoadedProps)
 };
 
 export const List = ({ spaceKey, itemId }: ListProps) => {
-  const { t } = useTranslation('uikit');
+  const { t } = useTranslation('appkit');
 
   const space = useSpace(spaceKey);
   const list = (useSelection(space?.database.select({ id: itemId })) ?? [])[0];

package/src/components/ListPrimitive/ListPrimitive.stories.tsx

@@ -5,39 +5,37 @@
 import '@dxosTheme';
 import React from 'react';
 
-import { templateForComponent } from '../../testing';
 import { ListPrimitive, ListPrimitiveComponentProps } from './ListPrimitive';
 
 export default {
-  title: 'react-list/ListPrimitive',
   component: ListPrimitive,
   argTypes: {}
 };
 
-const Template = (args: Omit<ListPrimitiveComponentProps, 'item'>) => {
-  return (
-    <main className='max-is-lg mli-auto pli-7 mbs-7'>
-      <ListPrimitive {...args} />
-    </main>
-  );
-};
-
-export const Default = templateForComponent(Template)({ id: '', items: {} });
-Default.args = {
-  id: 'x123456',
-  items: {
-    x234567: {
-      title: 'Apple'
-    },
-    x345678: {
-      title: 'Grapes',
-      annotations: { state: 'done' }
-    },
-    x456789: {
-      title: 'Banana'
-    },
-    x567890: {
-      title: 'Courgette'
+export const Default = {
+  render: (args: Omit<ListPrimitiveComponentProps, 'item'>) => {
+    return (
+      <main className='max-is-lg mli-auto pli-7 mbs-7'>
+        <ListPrimitive {...args} />
+      </main>
+    );
+  },
+  args: {
+    id: 'x123456',
+    items: {
+      x234567: {
+        title: 'Apple'
+      },
+      x345678: {
+        title: 'Grapes',
+        annotations: { state: 'done' }
+      },
+      x456789: {
+        title: 'Banana'
+      },
+      x567890: {
+        title: 'Courgette'
+      }
     }
   }
 };

package/src/components/ListPrimitive/ListPrimitive.tsx

@@ -16,7 +16,7 @@ import {
   defaultGroup,
   defaultHover,
   mx
-} from '@dxos/react-uikit';
+} from '@dxos/react-components';
 
 import { usePropStatefully } from '../../hooks';
 

package/src/hooks/usePropStatefully.ts

@@ -4,7 +4,7 @@
 
 import { useEffect, useRef, useState, Dispatch, SetStateAction } from 'react';
 
-import { randomString } from '@dxos/react-uikit';
+import { randomString } from '@dxos/react-components';
 
 const isEqual = <T>(a: T, b: T) => a === b;
 

package/dist/types/src/testing/index.d.ts

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

package/dist/types/src/testing/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/testing/index.ts"],"names":[],"mappings":"AAIA,cAAc,wBAAwB,CAAC"}

package/dist/types/src/testing/templateForComponent.d.ts

@@ -1,4 +0,0 @@
-import { Story } from '@storybook/react';
-import React, { FC } from 'react';
-export declare const templateForComponent: <P extends {}>(Component: React.FC<P>) => (props: P) => Story<P>;
-//# sourceMappingURL=templateForComponent.d.ts.map

package/dist/types/src/testing/templateForComponent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"templateForComponent.d.ts","sourceRoot":"","sources":["../../../../src/testing/templateForComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAkB,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAElC,eAAO,MAAM,oBAAoB,kEAQ9B,CAAC"}

package/src/testing/index.ts

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

package/src/testing/templateForComponent.tsx

@@ -1,16 +0,0 @@
-//
-// Copyright 2022 DXOS.org
-//
-
-import { ComponentStory, Story } from '@storybook/react';
-import React, { FC } from 'react';
-
-export const templateForComponent =
-  <P extends {}>(Component: FC<P>) =>
-  (props: P): Story<P> => {
-    const template: ComponentStory<typeof Component> = (args) => <Component {...args} />;
-
-    const story = template.bind({});
-    story.args = props;
-    return story;
-  };