@dxos/react-ui-attention 0.8.4-main.f9ba587 → 0.8.4-main.fd6878d

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-attention",
-  "version": "0.8.4-main.f9ba587",
+  "version": "0.8.4-main.fd6878d",
   "description": "Signifier components and providers for attention system.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -10,11 +10,13 @@
   "type": "module",
   "exports": {
     ".": {
+      "source": "./src/index.ts",
       "types": "./dist/types/src/index.d.ts",
       "browser": "./dist/lib/browser/index.mjs",
       "node": "./dist/lib/node-esm/index.mjs"
     },
     "./testing": {
+      "source": "./src/testing/index.ts",
       "types": "./dist/types/src/testing/index.d.ts",
       "browser": "./dist/lib/browser/testing/index.mjs",
       "node": "./dist/lib/node-esm/testing/index.mjs"
@@ -42,12 +44,12 @@
     "@radix-ui/react-primitive": "2.0.2",
     "@radix-ui/react-slot": "1.1.2",
     "@radix-ui/react-use-controllable-state": "1.1.0",
-    "effect": "3.16.13",
-    "@dxos/invariant": "0.8.4-main.f9ba587",
-    "@dxos/echo-schema": "0.8.4-main.f9ba587",
-    "@dxos/live-object": "0.8.4-main.f9ba587",
-    "@dxos/log": "0.8.4-main.f9ba587",
-    "@dxos/util": "0.8.4-main.f9ba587"
+    "effect": "3.17.7",
+    "@dxos/echo-schema": "0.8.4-main.fd6878d",
+    "@dxos/live-object": "0.8.4-main.fd6878d",
+    "@dxos/invariant": "0.8.4-main.fd6878d",
+    "@dxos/util": "0.8.4-main.fd6878d",
+    "@dxos/log": "0.8.4-main.fd6878d"
   },
   "devDependencies": {
     "@types/react": "~18.2.0",
@@ -55,17 +57,17 @@
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "vite": "5.4.7",
-    "@dxos/react-ui": "0.8.4-main.f9ba587",
-    "@dxos/react-ui-theme": "0.8.4-main.f9ba587",
-    "@dxos/random": "0.8.4-main.f9ba587",
-    "@dxos/storybook-utils": "0.8.4-main.f9ba587"
+    "@dxos/random": "0.8.4-main.fd6878d",
+    "@dxos/react-ui-theme": "0.8.4-main.fd6878d",
+    "@dxos/storybook-utils": "0.8.4-main.fd6878d",
+    "@dxos/react-ui": "0.8.4-main.fd6878d"
   },
   "peerDependencies": {
     "effect": "^3.13.3",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/react-ui": "0.8.4-main.f9ba587",
-    "@dxos/react-ui-theme": "0.8.4-main.f9ba587"
+    "@dxos/react-ui": "0.8.4-main.fd6878d",
+    "@dxos/react-ui-theme": "0.8.4-main.fd6878d"
   },
   "publishConfig": {
     "access": "public"

package/src/attention.test.ts

@@ -2,7 +2,7 @@
 // Copyright 2024 DXOS.org
 //
 
-import { describe, test, expect } from 'vitest';
+import { describe, expect, test } from 'vitest';
 
 import { AttentionManager } from './attention';
 

package/src/attention.ts

@@ -5,7 +5,7 @@
 import { untracked } from '@preact/signals-core';
 import { Schema } from 'effect';
 
-import { live, type Live } from '@dxos/live-object';
+import { type Live, live } from '@dxos/live-object';
 import { ComplexMap } from '@dxos/util';
 
 // NOTE: Chosen from RFC 1738’s `safe` characters: http://www.faqs.org/rfcs/rfc1738.html

package/src/components/AttentionGlyph.tsx

@@ -3,7 +3,7 @@
 //
 
 import { type Primitive } from '@radix-ui/react-primitive';
-import React, { type ComponentPropsWithRef, type CSSProperties, forwardRef, useMemo } from 'react';
+import React, { type CSSProperties, type ComponentPropsWithRef, forwardRef, useMemo } from 'react';
 
 import { Icon, type ThemedClassName } from '@dxos/react-ui';
 import { mx } from '@dxos/react-ui-theme';

package/src/components/AttentionProvider.stories.tsx

@@ -8,9 +8,10 @@ import React from 'react';
 
 import { withTheme } from '@dxos/storybook-utils';
 
-import { useAttentionAttributes } from './AttentionProvider';
 import { withAttention } from '../testing';
 
+import { useAttentionAttributes } from './AttentionProvider';
+
 const Attendable = ({ id }: { id: string }) => {
   const attentionAttrs = useAttentionAttributes(id);
 

package/src/components/AttentionProvider.tsx

@@ -5,12 +5,12 @@
 // NOTE(thure): The following unused imports quell TS2742 (“likely not portable”).
 
 // eslint-disable-next-line unused-imports/no-unused-imports
-import { createContext, type Scope, type CreateScope } from '@radix-ui/react-context';
+import { type CreateScope, type Scope, createContext } from '@radix-ui/react-context';
 import { Primitive } from '@radix-ui/react-primitive';
 import { Slot } from '@radix-ui/react-slot';
-import React, { useMemo, type FocusEvent, type PropsWithChildren, type ComponentPropsWithRef, forwardRef } from 'react';
+import React, { type ComponentPropsWithRef, type FocusEvent, type PropsWithChildren, forwardRef, useMemo } from 'react';
 
-import { useDefaultValue, type ThemedClassName } from '@dxos/react-ui';
+import { type ThemedClassName, useDefaultValue } from '@dxos/react-ui';
 import { mx } from '@dxos/react-ui-theme';
 
 import { ATTENDABLE_PATH_SEPARATOR, type Attention, AttentionManager, getAttendables } from '../attention';

package/src/components/SelectionProvider.tsx

@@ -4,16 +4,16 @@
 
 import { createContext } from '@radix-ui/react-context';
 import { Match } from 'effect';
-import React, { useCallback, useMemo, type PropsWithChildren } from 'react';
+import React, { type PropsWithChildren, useCallback, useMemo } from 'react';
 
 import { useDefaultValue } from '@dxos/react-ui';
 
 import {
-  defaultSelection,
-  SelectionManager,
-  type SelectionResult,
   type Selection,
+  SelectionManager,
   type SelectionMode,
+  type SelectionResult,
+  defaultSelection,
 } from '../selection';
 
 const SELECTION_NAME = 'Selection';

package/src/selection.ts

@@ -3,26 +3,39 @@
 //
 
 import { untracked } from '@preact/signals-core';
-import { Match } from 'effect';
+import { Match, Schema } from 'effect';
 
 import { invariant } from '@dxos/invariant';
-import { live, type Live } from '@dxos/live-object';
+import { type Live, live } from '@dxos/live-object';
 
 // TODO(burdon): Reconcile with @dxos/graph.
 
 export type SelectionMode = 'single' | 'multi' | 'range' | 'multi-range';
 
-export type Selection =
-  | { mode: 'single'; id?: string }
-  | { mode: 'multi'; ids: string[] }
-  | { mode: 'range'; from?: string; to?: string }
-  | { mode: 'multi-range'; ranges: { from: string; to: string }[] };
+export const SelectionSchema = Schema.Union(
+  Schema.Struct({ mode: Schema.Literal('single'), id: Schema.optional(Schema.String) }).pipe(Schema.mutable),
+  Schema.Struct({ mode: Schema.Literal('multi'), ids: Schema.Array(Schema.String).pipe(Schema.mutable) }).pipe(
+    Schema.mutable,
+  ),
+  Schema.Struct({
+    mode: Schema.Literal('range'),
+    from: Schema.optional(Schema.String),
+    to: Schema.optional(Schema.String),
+  }).pipe(Schema.mutable),
+  Schema.Struct({
+    mode: Schema.Literal('multi-range'),
+    ranges: Schema.Array(Schema.Struct({ from: Schema.String, to: Schema.String })).pipe(Schema.mutable),
+  }).pipe(Schema.mutable),
+).pipe(Schema.mutable);
+
+export type Selection = Schema.Schema.Type<typeof SelectionSchema>;
 
 export const defaultSelection = Match.type<SelectionMode>().pipe(
-  Match.when('single', () => ({ mode: 'single' }) as Selection),
-  Match.when('multi', () => ({ mode: 'multi', ids: [] }) as Selection),
-  Match.when('range', () => ({ mode: 'range' }) as Selection),
-  Match.when('multi-range', () => ({ mode: 'multi-range', ranges: [] }) as Selection),
+  Match.withReturnType<Selection>(),
+  Match.when('single', () => ({ mode: 'single' })),
+  Match.when('multi', () => ({ mode: 'multi', ids: [] })),
+  Match.when('range', () => ({ mode: 'range' })),
+  Match.when('multi-range', () => ({ mode: 'multi-range', ranges: [] })),
   Match.exhaustive,
 );
 
@@ -110,7 +123,7 @@ export class SelectionManager {
     untracked(() => {
       const selection = this.getSelection(contextId, 'multi');
       invariant(selection?.mode === 'multi', 'Selection mode is not multi');
-      selection.ids = ids;
+      selection.ids.splice(0, selection.ids.length, ...ids);
     });
   }
 
@@ -127,16 +140,32 @@ export class SelectionManager {
     untracked(() => {
       const selection = this.getSelection(contextId, 'multi-range');
       invariant(selection?.mode === 'multi-range', 'Selection mode is not multi-range');
-      selection.ranges = ranges;
+      selection.ranges.splice(0, selection.ranges.length, ...ranges);
     });
   }
 
   clearSelection(contextId: string): void {
     untracked(() => {
       const selection = this.getSelection(contextId);
-      if (selection) {
-        this._state.selections[contextId] = defaultSelection(selection.mode);
-      }
+      Match.type<Selection | undefined>().pipe(
+        Match.when(undefined, () => {
+          // No-op.
+        }),
+        Match.when({ mode: 'single' }, (s) => {
+          s.id = undefined;
+        }),
+        Match.when({ mode: 'multi' }, (s) => {
+          s.ids.splice(0, s.ids.length);
+        }),
+        Match.when({ mode: 'range' }, (s) => {
+          s.from = undefined;
+          s.to = undefined;
+        }),
+        Match.when({ mode: 'multi-range' }, (s) => {
+          s.ranges.splice(0, s.ranges.length);
+        }),
+        Match.exhaustive,
+      )(selection);
     });
   }
 

package/src/testing/decorators/withAttention.ts

@@ -8,5 +8,5 @@ import { createElement } from 'react';
 import { RootAttentionProvider } from '../../components';
 
 export const withAttention: Decorator = (Story) => {
-  return createElement(RootAttentionProvider, { children: createElement(Story) });
+  return createElement(RootAttentionProvider, {}, createElement(Story));
 };