@adobe/data 0.9.39 → 0.9.41

package/references/data-react-pixie/src/{pixie-plugin.ts → state/pixie-plugin.ts}

@@ -1,19 +1,16 @@
 // © 2026 Adobe. MIT License. See /LICENSE for details.
 
 import { Database } from "@adobe/data/ecs";
-import { Boolean, Schema } from "@adobe/data/schema";
+import { Boolean } from "@adobe/data/schema";
 import { Vec2, F32 } from "@adobe/data/math";
-
-export const spriteTypeSchema = { enum: ["bunny", "fox"] } as const satisfies Schema;
-export type SpriteType = Schema.ToType<typeof spriteTypeSchema>;
-
-export type FilterType = "none" | "sepia" | "blur" | "vintage" | "night";
+import type { FilterType } from "../types/filter-type";
+import { SpriteType } from "../types/sprite-type/sprite-type";
 
 export const pixiePlugin = Database.Plugin.create({
   components: {
     position: Vec2.schema,
     rotation: F32.schema,
-    sprite: spriteTypeSchema,
+    sprite: SpriteType.schema,
     hovered: Boolean.schema,
     active: Boolean.schema,
   },

package/references/data-react-pixie/src/state/use-pixie-database.ts

@@ -0,0 +1,6 @@
+// © 2026 Adobe. MIT License. See /LICENSE for details.
+
+import { useDatabase as useDatabaseHook } from "@adobe/data-react";
+import { pixiePlugin } from "./pixie-plugin";
+
+export const usePixieDatabase = () => useDatabaseHook(pixiePlugin);

package/references/data-react-pixie/src/types/filter-type.ts

@@ -0,0 +1,3 @@
+// © 2026 Adobe. MIT License. See /LICENSE for details.
+
+export type FilterType = "none" | "sepia" | "blur" | "vintage" | "night";

package/references/data-react-pixie/src/types/sprite-type/image.ts

@@ -0,0 +1,14 @@
+// © 2026 Adobe. MIT License. See /LICENSE for details.
+
+import { Schema } from "@adobe/data/schema";
+import { schema } from "./schema";
+
+import bunnyUrl from "./bunny.png";
+import foxUrl from "./fox.png";
+
+type SpriteType = Schema.ToType<typeof schema>;
+
+export const image = {
+  bunny: bunnyUrl,
+  fox: foxUrl,
+} as const satisfies Record<SpriteType, string>;

package/references/data-react-pixie/src/types/sprite-type/public.ts

@@ -0,0 +1,4 @@
+// © 2026 Adobe. MIT License. See /LICENSE for details.
+
+export { schema } from "./schema";
+export { image } from "./image";

package/references/data-react-pixie/src/types/sprite-type/schema.ts

@@ -0,0 +1,5 @@
+// © 2026 Adobe. MIT License. See /LICENSE for details.
+
+import { Schema } from "@adobe/data/schema";
+
+export const schema = { enum: ["bunny", "fox"] } as const satisfies Schema;

package/references/data-react-pixie/src/types/sprite-type/sprite-type.ts

@@ -0,0 +1,7 @@
+// © 2026 Adobe. MIT License. See /LICENSE for details.
+
+import { Schema } from "@adobe/data/schema";
+import { schema } from "./schema";
+
+export type SpriteType = Schema.ToType<typeof schema>;
+export * as SpriteType from "./public";

package/references/data-lit-todo/package.json

@@ -1,30 +0,0 @@
-{
-  "name": "data-lit-todo",
-  "version": "0.9.39",
-  "description": "Todo sample app demonstrating @adobe/data with Lit",
-  "type": "module",
-  "private": true,
-  "scripts": {
-    "build": "vite build",
-    "dev": "vite",
-    "publish-public": "true"
-  },
-  "dependencies": {
-    "@adobe/data": "workspace:*",
-    "@adobe/data-lit": "workspace:*",
-    "@spectrum-web-components/action-button": "^1.7.0",
-    "@spectrum-web-components/action-group": "^1.7.0",
-    "@spectrum-web-components/button": "^1.7.0",
-    "@spectrum-web-components/card": "^1.7.0",
-    "@spectrum-web-components/checkbox": "^1.7.0",
-    "@spectrum-web-components/icons-workflow": "^1.7.0",
-    "@spectrum-web-components/styles": "^1.7.0",
-    "@spectrum-web-components/theme": "^1.7.0",
-    "lit": "^3.3.1"
-  },
-  "devDependencies": {
-    "typescript": "^5.8.3",
-    "vite": "^6.4.0",
-    "vitest": "^1.6.0"
-  }
-}

package/references/data-lit-todo/src/elements/todo-list/todo-list-presentation.ts

@@ -1,22 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import type { Entity } from "@adobe/data/ecs";
-import { html } from 'lit';
-import { repeat } from 'lit/directives/repeat.js';
-import '@spectrum-web-components/action-button/sp-action-button.js';
-import '../todo-row/todo-row.js';
-
-type RenderArgs = {
-  todos: readonly Entity[];
-};
-
-export function render(args: RenderArgs) {
-  return html`
-    <div class="todo-list">
-      ${repeat(
-    args.todos,
-    todo => todo,
-    (todo, index) => html` <data-todo-row .entity=${todo} .index=${index}></data-todo-row> `
-  )}
-    </div>
-  `;
-}

package/references/data-lit-todo/src/elements/todo-list/todo-list.css.ts

@@ -1,12 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-
-import { css } from 'lit';
-
-export const styles = css`
-    .todo-list {
-        display: flex;
-        flex-direction: column;
-        position: relative;
-        user-select: none;
-    }
-`; 

package/references/data-lit-todo/src/elements/todo-list/todo-list.ts

@@ -1,45 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import * as presentation from './todo-list-presentation.js';
-import { styles } from './todo-list.css.js';
-import { customElement } from 'lit/decorators.js';
-import { css } from 'lit';
-
-import { useObservableValues } from "@adobe/data-lit";
-import { TodoElement } from '../../todo-element.js';
-import '../todo-row/todo-row.js';
-
-export const tagName = 'data-todo-list';
-
-declare global {
-  interface HTMLElementTagNameMap {
-    [tagName]: TodoList;
-  }
-}
-
-@customElement(tagName)
-export class TodoList extends TodoElement {
-  static styles = [
-    styles,
-    css`
-      :host {
-        display: block;
-        height: 100%;
-        width: 100%;
-        overflow-y: auto;
-        position: relative;
-      }
-    `
-  ];
-
-  render() {
-    const values = useObservableValues(() => ({
-      todos: this.service.dependentState.allTodos,
-    }));
-
-    if (!values) return;
-
-    return presentation.render({
-      ...values,
-    });
-  }
-}

package/references/data-lit-todo/src/elements/todo-row/todo-row-presentation.ts

@@ -1,68 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import { html } from 'lit';
-
-import { useDragTransaction } from "@adobe/data-lit";
-import '@spectrum-web-components/action-button/sp-action-button.js';
-import '@spectrum-web-components/checkbox/sp-checkbox.js';
-import '@spectrum-web-components/icons-workflow/icons/sp-icon-delete.js';
-
-// Temporarily disable localization for the sample
-// import { Localized, Unlocalized } from '../../../../services/locale-service/locale-service.js';
-import { DragTodoFunction, Todo } from '../../services/state-service/todo-state-service.js';
-
-const TODO_ROW_HEIGHT = 56;
-
-// Simplified localization for sample - using static strings
-const localizedStrings = {
-  deleteTodo: 'Delete',
-  toggleComplete: 'Toggle complete',
-} as const;
-
-type RenderArgs = {
-  localized: typeof localizedStrings;
-  todo: Todo;
-  toggleComplete: () => void;
-  deleteTodo: () => void;
-  dragTodo: DragTodoFunction;
-  index: number;
-};
-
-export function render(args: RenderArgs) {
-  const { localized, todo, toggleComplete, deleteTodo, index, dragTodo } = args;
-
-  useDragTransaction({
-    transaction: dragTodo,
-    update: (value) => {
-      if (value.type === 'move') {
-        return {
-          todo: todo.id,
-          dragPosition: value.delta[1],
-        };
-      } else if (value.type === 'end') {
-        const finalIndex = index + Math.round(value.position[1] / TODO_ROW_HEIGHT);
-        return {
-          todo: todo.id,
-          dragPosition: index,
-          finalIndex,
-        };
-      }
-    },
-  }, [dragTodo, todo.id, index]);
-
-  const dragging = todo.dragPosition !== null;
-  const position = index * TODO_ROW_HEIGHT + (todo.dragPosition ?? 0);
-
-  return html`
-    <div
-      class="todo-row ${dragging ? 'dragging' : ''}"
-      style="height: ${TODO_ROW_HEIGHT}px; position: absolute; top: ${position}px; left: 0; right: 0;">
-      <sp-checkbox @change=${toggleComplete} title=${localized.toggleComplete} ?checked=${todo.complete}> </sp-checkbox>
-
-      <span class="todo-name"> ${index}: ${todo.name} </span>
-
-      <sp-action-button @click=${deleteTodo} quiet title=${localized.deleteTodo}>
-        <sp-icon-delete slot="icon"></sp-icon-delete>
-      </sp-action-button>
-    </div>
-  `;
-}

package/references/data-lit-todo/src/elements/todo-row/todo-row.css.ts

@@ -1,49 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import { css } from 'lit';
-
-export const styles = css`
-  :host {
-    display: block;
-  }
-
-  .todo-row {
-    --todo-row-height: 56px;
-    box-sizing: border-box;
-    display: flex;
-    align-items: center;
-    gap: var(--spectrum-spacing-200);
-    padding: var(--spectrum-spacing-200) var(--spectrum-spacing-300);
-    border-bottom: 1px solid var(--spectrum-gray-200);
-    min-height: var(--todo-row-height);
-    height: var(--todo-row-height);
-    contain: layout paint style;            /* or at least paint/layout */
-    content-visibility: auto;               /* skip offscreen work: https://developer.mozilla.org/en-US/docs/Web/CSS/content-visibility */
-    contain-intrinsic-size: 500px var(--todo-row-height);     /* reserve space so auto can skip paint: https://developer.mozilla.org/en-US/docs/Web/CSS/contain-intrinsic-size */
-    transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
-  }
-
-  .todo-row.dragging {
-    background-color: var(--spectrum-gray-100);
-    z-index: 100;
-    box-shadow: 0 0 10px var(--spectrum-gray-300);
-  }
-
-  .todo-row:hover {
-    background-color: var(--spectrum-gray-100);
-  }
-
-  .todo-name {
-    flex: 1;
-    font-size: var(--spectrum-font-size-100);
-    line-height: var(--spectrum-line-height-100);
-    color: var(--spectrum-gray-800);
-  }
-
-  sp-checkbox {
-    flex-shrink: 0;
-  }
-
-  sp-action-button {
-    flex-shrink: 0;
-  }
-`; 

package/references/data-lit-todo/src/elements/todo-row/todo-row.ts

@@ -1,46 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import * as presentation from './todo-row-presentation.js';
-import { styles } from './todo-row.css.js';
-import type { Entity } from "@adobe/data/ecs";
-import { customElement, property } from 'lit/decorators.js';
-
-import { useObservableValues } from "@adobe/data-lit";
-import { TodoElement } from '../../todo-element.js';
-
-export const tagName = 'data-todo-row';
-
-declare global {
-  interface HTMLElementTagNameMap {
-    [tagName]: TodoRow;
-  }
-}
-
-@customElement(tagName)
-export class TodoRow extends TodoElement {
-  static styles = styles;
-
-  @property({ type: Number })
-  entity!: Entity;
-
-  @property({ type: Number })
-  index!: number;
-
-  render() {
-    const localized = { toggleComplete: 'Toggle complete', deleteTodo: 'Delete' } as const;
-    const values = useObservableValues(() => ({
-      todo: this.service.state.observe.entity(this.entity, this.service.state.archetypes.Todo),
-    }));
-
-    if (!values || !values.todo) return;
-
-    return presentation.render({
-      ...values,
-      localized,
-      todo: values.todo,
-      toggleComplete: () => this.service.state.transactions.toggleComplete(this.entity),
-      deleteTodo: () => this.service.state.transactions.deleteTodo(this.entity),
-      dragTodo: this.service.state.transactions.dragTodo,
-      index: this.index,
-    });
-  }
-}

package/references/data-lit-todo/src/elements/todo-toolbar/index.ts

@@ -1,2 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-export * from './todo-toolbar.js';

package/references/data-lit-todo/src/elements/todo-toolbar/todo-toolbar-presentation.ts

@@ -1,55 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import { html } from 'lit';
-
-import '../todo-undo-redo/index.js';
-import '@spectrum-web-components/action-button/sp-action-button.js';
-
-// Temporarily disable localization for the sample
-// import { Localized, Unlocalized } from '../../../../services/locale-service/locale-service.js';
-
-// Simplified localization for sample - using static strings
-const localizedStrings = {
-  add1Todo: 'Add 1 Todo',
-  add10Todos: 'Add 10 Todos',
-  add1000Todos: 'Add 1000 Todos',
-  clearCompleted: 'Clear Completed',
-  toggleAll: 'Toggle All',
-  todoCount: 'todos',
-  completedCount: 'completed',
-} as const;
-
-type RenderArgs = {
-  localized: typeof localizedStrings;
-  todoCount: number;
-  completedCount: number;
-  isGenerating: boolean;
-  createBulkTodos: (count: number) => void;
-  clearCompleted: () => void;
-  toggleAll: () => void;
-};
-
-export function render(args: RenderArgs) {
-  const { localized, todoCount, completedCount, isGenerating, createBulkTodos, clearCompleted, toggleAll } = args;
-
-  return html`
-    <div class="todo-toolbar">
-      <div class="toolbar-left">
-        <data-todo-undo-redo></data-todo-undo-redo>
-        <sp-action-button @click=${toggleAll} ?disabled=${isGenerating} quiet> ${localized.toggleAll} </sp-action-button>
-      </div>
-
-      <div class="toolbar-center">
-        <sp-action-button @click=${() => createBulkTodos(1)} ?disabled=${isGenerating}> ${localized.add1Todo} </sp-action-button>
-        <sp-action-button @click=${() => createBulkTodos(10)} ?disabled=${isGenerating}> ${localized.add10Todos} </sp-action-button>
-        <sp-action-button @click=${() => createBulkTodos(1000)} ?disabled=${isGenerating}> ${localized.add1000Todos} </sp-action-button>
-      </div>
-
-      <div class="toolbar-right">
-        <sp-action-button @click=${clearCompleted} ?disabled=${completedCount === 0 || isGenerating} quiet>
-          ${localized.clearCompleted}
-        </sp-action-button>
-        <span class="todo-stats"> ${completedCount} / ${todoCount} </span>
-      </div>
-    </div>
-  `;
-}

package/references/data-lit-todo/src/elements/todo-toolbar/todo-toolbar.css.ts

@@ -1,34 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import { css } from 'lit';
-
-export const styles = css`
-  .todo-toolbar {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: var(--spectrum-spacing-200) var(--spectrum-spacing-300);
-    background-color: var(--spectrum-gray-100);
-    border-bottom: 1px solid var(--spectrum-gray-300);
-    gap: var(--spectrum-spacing-200);
-  }
-
-  .toolbar-left,
-  .toolbar-center,
-  .toolbar-right {
-    display: flex;
-    align-items: center;
-    gap: var(--spectrum-spacing-100);
-  }
-
-  .toolbar-center {
-    flex: 1;
-    justify-content: center;
-  }
-
-  .todo-stats {
-    font-size: var(--spectrum-font-size-100);
-    color: var(--spectrum-gray-600);
-    margin-left: var(--spectrum-spacing-200);
-    width: 100px;
-  }
-`; 

package/references/data-lit-todo/src/elements/todo-toolbar/todo-toolbar.ts

@@ -1,62 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import * as presentation from './todo-toolbar-presentation.js';
-import { styles } from './todo-toolbar.css.js';
-import { Observe } from "@adobe/data/observe";
-import { customElement } from 'lit/decorators.js';
-import { css } from 'lit';
-
-import { useObservableValues } from "@adobe/data-lit";
-import { TodoElement } from '../../todo-element.js';
-
-export const tagName = 'data-todo-toolbar';
-
-declare global {
-  interface HTMLElementTagNameMap {
-    [tagName]: TodoToolbar;
-  }
-}
-
-@customElement(tagName)
-export class TodoToolbar extends TodoElement {
-  static styles = [
-    styles,
-    css`
-      :host {
-        display: block;
-        flex-shrink: 0;
-        width: 100%;
-      }
-    `
-  ];
-
-  render() {
-    const localized = {
-      add1Todo: 'Add 1 Todo',
-      add10Todos: 'Add 10 Todos',
-      add1000Todos: 'Add 1000 Todos',
-      clearCompleted: 'Clear Completed',
-      toggleAll: 'Toggle All',
-      todoCount: 'todos',
-      completedCount: 'completed',
-    } as const;
-    const values = useObservableValues(() => ({
-      completedCount: Observe.withMap(this.service.dependentState.completeTodos, (todos: unknown) => (todos as { length: number }).length),
-      todoCount: Observe.withMap(this.service.dependentState.allTodos, (todos: unknown) => (todos as { length: number }).length),
-    }));
-
-    if (!values) return;
-
-    return presentation.render({
-      ...values,
-      localized,
-      isGenerating: false,
-      createBulkTodos: this.service.state.transactions.createBulkTodos,
-      clearCompleted: () => {
-        // Placeholder - would need to implement this transaction
-      },
-      toggleAll: () => {
-        // Placeholder - would need to implement this transaction
-      },
-    });
-  }
-}

package/references/data-lit-todo/src/elements/todo-undo-redo/todo-undo-redo-presentation.ts

@@ -1,41 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import { html } from 'lit';
-
-import '@spectrum-web-components/action-button/sp-action-button.js';
-import '@spectrum-web-components/action-group/sp-action-group.js';
-import '@spectrum-web-components/icons-workflow/icons/sp-icon-redo.js';
-import '@spectrum-web-components/icons-workflow/icons/sp-icon-undo.js';
-
-// Temporarily disable localization for the sample
-// import { Localized, Unlocalized } from '../../../../services/locale-service/locale-service.js';
-
-// Simplified localization for sample - using static strings
-const localizedStrings = {
-  undo: 'Undo',
-  redo: 'Redo',
-} as const;
-
-type RenderArgs = {
-  localized: typeof localizedStrings;
-  hasUndo: boolean;
-  hasRedo: boolean;
-  undo: () => void;
-  redo: () => void;
-};
-
-export function render(args: RenderArgs) {
-  const { localized, hasUndo, hasRedo, undo, redo } = args;
-
-  return html`
-    <sp-action-group>
-      <sp-action-button @click=${undo} ?disabled=${!hasUndo} quiet>
-        <sp-icon-undo slot="icon"></sp-icon-undo>
-        ${localized.undo}
-      </sp-action-button>
-      <sp-action-button @click=${redo} ?disabled=${!hasRedo} quiet>
-        <sp-icon-redo slot="icon"></sp-icon-redo>
-        ${localized.redo}
-      </sp-action-button>
-    </sp-action-group>
-  `;
-}

package/references/data-lit-todo/src/elements/todo-undo-redo/todo-undo-redo.css.ts

@@ -1,12 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import { css } from 'lit';
-
-export const styles = css`
-  sp-action-group {
-    gap: var(--spectrum-global-dimension-size-100);
-  }
-
-  sp-action-button {
-    min-width: var(--spectrum-global-dimension-size-300);
-  }
-`;

package/references/data-lit-todo/src/elements/todo-undo-redo/todo-undo-redo.ts

@@ -1,37 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import * as presentation from './todo-undo-redo-presentation.js';
-import { styles } from './todo-undo-redo.css.js';
-import { customElement } from 'lit/decorators.js';
-
-import { useObservableValues } from "@adobe/data-lit";
-import { TodoElement } from '../../todo-element.js';
-
-export const tagName = 'data-todo-undo-redo';
-
-declare global {
-  interface HTMLElementTagNameMap {
-    [tagName]: TodoUndoRedo;
-  }
-}
-
-@customElement(tagName)
-export class TodoUndoRedo extends TodoElement {
-  static styles = styles;
-
-  render() {
-    const localized = { undo: 'Undo', redo: 'Redo' } as const;
-    const values = useObservableValues(() => ({
-      hasUndo: this.service.undoRedo.undoEnabled,
-      hasRedo: this.service.undoRedo.redoEnabled,
-    }));
-
-    if (!values) return;
-
-    return presentation.render({
-      ...values,
-      localized,
-      undo: this.service.undoRedo.undo,
-      redo: this.service.undoRedo.redo,
-    });
-  }
-}

package/references/data-lit-todo/src/index.ts

@@ -1,9 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-
-export type { SampleMetadata, Sample } from "./sample-types.js";
-
-import type { Sample } from "./sample-types.js";
-import { todoSample } from "./todo-sample.js";
-import "./todo-host.js"; // Ensure todo-host is registered
-
-export const samples: readonly Sample[] = [todoSample];

package/references/data-lit-todo/src/main.ts

@@ -1,29 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-
-import "@spectrum-web-components/theme/sp-theme.js";
-import "@spectrum-web-components/theme/theme-light.js";
-import "@spectrum-web-components/theme/scale-medium.js";
-import "@spectrum-web-components/styles/all-medium-light.css";
-import { samples } from "./index.js";
-
-const app = document.getElementById("app");
-if (app) {
-  app.innerHTML = samples
-    .map(
-      (s) =>
-        `<div style="margin-bottom: 1rem;">
-          <h2>${s.title}</h2>
-          <p>${s.description}</p>
-          <div id="sample-${s.id}"></div>
-        </div>`
-    )
-    .join("");
-
-  samples.forEach((s) => {
-    const container = document.getElementById(`sample-${s.id}`);
-    if (container) {
-      const el = document.createElement(s.elementTag);
-      container.appendChild(el);
-    }
-  });
-}

package/references/data-lit-todo/src/sample-types.ts

@@ -1,14 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-
-export interface SampleMetadata {
-  readonly id: string;
-  readonly title: string;
-  readonly description: string;
-  readonly category: string;
-  readonly difficulty: "beginner" | "intermediate" | "advanced";
-  readonly features: readonly string[];
-}
-
-export interface Sample extends SampleMetadata {
-  readonly elementTag: string;
-}

package/references/data-lit-todo/src/services/dependent-state-service/create-dependent-state-service.ts

@@ -1,8 +0,0 @@
-// © 2026 Adobe. MIT License. See /LICENSE for details.
-import { applyArg } from "@adobe/data/functions";
-
-import * as dependentState from './dependent-state/index.js';
-
-import { TodoCoreService } from '../main-service/todo-main-service.js';
-
-export const createDependentStateService = (service: TodoCoreService) => applyArg(service, dependentState);