@llui/components 0.4.10 → 0.5.1

package/dist/components/image-cropper.js.map

@@ -1 +1 @@
-{"version":3,"file":"image-cropper.js","sourceRoot":"","sources":["../../src/components/image-cropper.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Send } from '@llui/dom'\nimport { useContext, tagSend } from '@llui/dom'\nimport { LocaleContext } from '../locale.js'\nimport type { Locale } from '../locale.js'\n\n/**\n * Image cropper — select a rectangular crop region over an image,\n * optionally constrained to an aspect ratio. The machine tracks the\n * image's natural dimensions, the crop rectangle, and in-progress\n * drag/resize state. The view layer wires pointer events on the crop\n * box and its resize handles.\n *\n * Coordinates are in image-native pixels (0..naturalWidth, 0..naturalHeight).\n * The consumer converts to display pixels using the image's rendered size.\n */\n\nexport type ResizeHandle = 'n' | 's' | 'e' | 'w' | 'ne' | 'nw' | 'se' | 'sw'\n\nexport interface CropRect {\n  x: number\n  y: number\n  width: number\n  height: number\n}\n\nexport interface ImageCropperState {\n  /** Natural dimensions of the source image. */\n  image: { width: number; height: number }\n  crop: CropRect\n  /** Constrain the crop to this aspect ratio (width / height), or null to free-form. */\n  aspectRatio: number | null\n  minSize: number\n  dragging: boolean\n  resizing: ResizeHandle | null\n  disabled: boolean\n}\n\nexport type ImageCropperMsg =\n  /** @humanOnly */\n  | { type: 'setImage'; width: number; height: number }\n  /** @intent(\"Set the crop rectangle (x/y/width/height in image-native pixels)\") */\n  | { type: 'setCrop'; crop: CropRect }\n  /** @intent(\"Lock the crop to a specific aspect ratio (width/height), or null for free-form\") */\n  | { type: 'setAspectRatio'; ratio: number | null }\n  /** @humanOnly */\n  | { type: 'dragStart' }\n  /** @humanOnly */\n  | { type: 'dragMove'; dx: number; dy: number }\n  /** @humanOnly */\n  | { type: 'dragEnd' }\n  /** @humanOnly */\n  | { type: 'resizeStart'; handle: ResizeHandle }\n  /** @humanOnly */\n  | { type: 'resizeMove'; dx: number; dy: number }\n  /** @humanOnly */\n  | { type: 'resizeEnd' }\n  /** @intent(\"Reset the crop to a default selection (full image or aspect-fit)\") */\n  | { type: 'reset' }\n  /** @intent(\"Set the crop to a maximum-area centered selection\") */\n  | { type: 'centerFill' }\n\nexport interface ImageCropperInit {\n  image?: { width: number; height: number }\n  crop?: CropRect\n  aspectRatio?: number | null\n  minSize?: number\n  disabled?: boolean\n}\n\nfunction clamp(v: number, min: number, max: number): number {\n  return Math.max(min, Math.min(max, v))\n}\n\nfunction clampCrop(crop: CropRect, image: { width: number; height: number }): CropRect {\n  const width = clamp(crop.width, 0, image.width)\n  const height = clamp(crop.height, 0, image.height)\n  const x = clamp(crop.x, 0, image.width - width)\n  const y = clamp(crop.y, 0, image.height - height)\n  return { x, y, width, height }\n}\n\nfunction enforceAspectRatio(crop: CropRect, ratio: number | null): CropRect {\n  if (ratio === null) return crop\n  // Keep width; compute height from ratio.\n  const height = crop.width / ratio\n  return { ...crop, height }\n}\n\n/**\n * Compute the largest centered crop that fits `image` while respecting the\n * aspect ratio (if any).\n */\nexport function centerFill(\n  image: { width: number; height: number },\n  aspectRatio: number | null,\n): CropRect {\n  if (aspectRatio === null) {\n    return { x: 0, y: 0, width: image.width, height: image.height }\n  }\n  const imgRatio = image.width / image.height\n  let width: number, height: number\n  if (aspectRatio > imgRatio) {\n    width = image.width\n    height = width / aspectRatio\n  } else {\n    height = image.height\n    width = height * aspectRatio\n  }\n  return {\n    x: (image.width - width) / 2,\n    y: (image.height - height) / 2,\n    width,\n    height,\n  }\n}\n\nexport function init(opts: ImageCropperInit = {}): ImageCropperState {\n  const image = opts.image ?? { width: 0, height: 0 }\n  const aspectRatio = opts.aspectRatio ?? null\n  const crop = opts.crop ?? centerFill(image, aspectRatio)\n  return {\n    image,\n    crop: clampCrop(crop, image),\n    aspectRatio,\n    minSize: opts.minSize ?? 20,\n    dragging: false,\n    resizing: null,\n    disabled: opts.disabled ?? false,\n  }\n}\n\nfunction applyResize(\n  state: ImageCropperState,\n  dx: number,\n  dy: number,\n  handle: ResizeHandle,\n): ImageCropperState {\n  let { x, y, width, height } = state.crop\n  if (handle.includes('e')) width += dx\n  if (handle.includes('w')) {\n    width -= dx\n    x += dx\n  }\n  if (handle.includes('s')) height += dy\n  if (handle.includes('n')) {\n    height -= dy\n    y += dy\n  }\n  // Aspect ratio: if set, let the axis with the bigger delta drive the\n  // other, keeping the handle's corner anchored.\n  if (state.aspectRatio !== null) {\n    const isHoriz = handle === 'e' || handle === 'w'\n    const isVert = handle === 'n' || handle === 's'\n    if (isHoriz) {\n      const newHeight = width / state.aspectRatio\n      // Keep vertical center.\n      y = state.crop.y + (state.crop.height - newHeight) / 2\n      height = newHeight\n    } else if (isVert) {\n      const newWidth = height * state.aspectRatio\n      x = state.crop.x + (state.crop.width - newWidth) / 2\n      width = newWidth\n    } else {\n      // Corner: use the axis with the larger pointer delta (expressed in\n      // width-equivalent units) to drive the other. This keeps the thumb\n      // tracking the pointer linearly instead of snapping to whichever\n      // current dimension happens to match the aspect ratio closer.\n      const dw = width - state.crop.width\n      const dh = height - state.crop.height\n      const dhAsDw = dh * state.aspectRatio\n      if (Math.abs(dw) >= Math.abs(dhAsDw)) {\n        // Width leads; derive height, re-anchor top if resizing from north.\n        height = width / state.aspectRatio\n        if (handle.includes('n')) y = state.crop.y + (state.crop.height - height)\n      } else {\n        // Height leads; derive width, re-anchor left if resizing from west.\n        width = height * state.aspectRatio\n        if (handle.includes('w')) x = state.crop.x + (state.crop.width - width)\n      }\n    }\n  }\n  // Enforce min size + clamp to image.\n  if (width < state.minSize) width = state.minSize\n  if (height < state.minSize) height = state.minSize\n  return { ...state, crop: clampCrop({ x, y, width, height }, state.image) }\n}\n\nexport function update(\n  state: ImageCropperState,\n  msg: ImageCropperMsg,\n): [ImageCropperState, never[]] {\n  if (state.disabled && msg.type !== 'setImage' && msg.type !== 'reset') {\n    return [state, []]\n  }\n  switch (msg.type) {\n    case 'setImage': {\n      const image = { width: msg.width, height: msg.height }\n      const crop = centerFill(image, state.aspectRatio)\n      return [{ ...state, image, crop }, []]\n    }\n    case 'setCrop':\n      return [{ ...state, crop: clampCrop(msg.crop, state.image) }, []]\n    case 'setAspectRatio': {\n      const next = enforceAspectRatio(state.crop, msg.ratio)\n      return [{ ...state, aspectRatio: msg.ratio, crop: clampCrop(next, state.image) }, []]\n    }\n    case 'dragStart':\n      return [{ ...state, dragging: true }, []]\n    case 'dragMove': {\n      if (!state.dragging) return [state, []]\n      const crop = {\n        ...state.crop,\n        x: state.crop.x + msg.dx,\n        y: state.crop.y + msg.dy,\n      }\n      return [{ ...state, crop: clampCrop(crop, state.image) }, []]\n    }\n    case 'dragEnd':\n      return [{ ...state, dragging: false }, []]\n    case 'resizeStart':\n      return [{ ...state, resizing: msg.handle }, []]\n    case 'resizeMove':\n      if (state.resizing === null) return [state, []]\n      return [applyResize(state, msg.dx, msg.dy, state.resizing), []]\n    case 'resizeEnd':\n      return [{ ...state, resizing: null }, []]\n    case 'reset':\n    case 'centerFill':\n      return [{ ...state, crop: centerFill(state.image, state.aspectRatio) }, []]\n  }\n}\n\nexport interface ImageCropperParts<S> {\n  root: {\n    'data-scope': 'image-cropper'\n    'data-part': 'root'\n    'data-dragging': (s: S) => '' | undefined\n    'data-resizing': (s: S) => '' | undefined\n    'data-disabled': (s: S) => '' | undefined\n  }\n  image: {\n    'data-scope': 'image-cropper'\n    'data-part': 'image'\n    onLoad: (e: Event) => void\n    draggable: false\n  }\n  cropBox: {\n    'data-scope': 'image-cropper'\n    'data-part': 'crop-box'\n    style: (s: S) => string\n    onPointerDown: (e: PointerEvent) => void\n  }\n  resizeHandle: (handle: ResizeHandle) => {\n    'data-scope': 'image-cropper'\n    'data-part': 'resize-handle'\n    'data-handle': ResizeHandle\n    onPointerDown: (e: PointerEvent) => void\n  }\n  resetTrigger: {\n    type: 'button'\n    'aria-label': string | ((s: S) => string)\n    'data-scope': 'image-cropper'\n    'data-part': 'reset-trigger'\n    onClick: (e: MouseEvent) => void\n  }\n}\n\nexport interface ConnectOptions {\n  resetLabel?: string\n}\n\nexport function connect<S>(\n  get: (s: S) => ImageCropperState,\n  send: Send<ImageCropperMsg>,\n  opts: ConnectOptions = {},\n): ImageCropperParts<S> {\n  const locale = useContext<S, Locale>(LocaleContext)\n  return {\n    root: {\n      'data-scope': 'image-cropper',\n      'data-part': 'root',\n      'data-dragging': (s) => (get(s).dragging ? '' : undefined),\n      'data-resizing': (s) => (get(s).resizing !== null ? '' : undefined),\n      'data-disabled': (s) => (get(s).disabled ? '' : undefined),\n    },\n    image: {\n      'data-scope': 'image-cropper',\n      'data-part': 'image',\n      onLoad: tagSend(send, ['setImage'], (e) => {\n        const img = e.target as HTMLImageElement\n        send({ type: 'setImage', width: img.naturalWidth, height: img.naturalHeight })\n      }),\n      draggable: false,\n    },\n    cropBox: {\n      'data-scope': 'image-cropper',\n      'data-part': 'crop-box',\n      style: (s) => {\n        const st = get(s)\n        if (st.image.width === 0 || st.image.height === 0) return 'display:none;'\n        // Express as percentages so the crop box scales with the rendered image.\n        const xp = (st.crop.x / st.image.width) * 100\n        const yp = (st.crop.y / st.image.height) * 100\n        const wp = (st.crop.width / st.image.width) * 100\n        const hp = (st.crop.height / st.image.height) * 100\n        return `left:${xp}%;top:${yp}%;width:${wp}%;height:${hp}%;`\n      },\n      onPointerDown: tagSend(send, ['dragStart'], () => send({ type: 'dragStart' })),\n    },\n    resizeHandle: (handle: ResizeHandle) => ({\n      'data-scope': 'image-cropper',\n      'data-part': 'resize-handle',\n      'data-handle': handle,\n      onPointerDown: tagSend(send, ['resizeStart'], () => send({ type: 'resizeStart', handle })),\n    }),\n    resetTrigger: {\n      type: 'button',\n      'aria-label': opts.resetLabel ?? ((s: S) => locale(s).imageCropper.reset),\n      'data-scope': 'image-cropper',\n      'data-part': 'reset-trigger',\n      onClick: tagSend(send, ['reset'], () => send({ type: 'reset' })),\n    },\n  }\n}\n\nexport const imageCropper = { init, update, connect, centerFill }\n"]}
+{"version":3,"file":"image-cropper.js","sourceRoot":"","sources":["../../src/components/image-cropper.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Send, Signal } from '@llui/dom'\nimport { useContext, tagSend } from '@llui/dom'\nimport { LocaleContext } from '../locale.js'\n\n/**\n * Image cropper — select a rectangular crop region over an image,\n * optionally constrained to an aspect ratio. The machine tracks the\n * image's natural dimensions, the crop rectangle, and in-progress\n * drag/resize state. The view layer wires pointer events on the crop\n * box and its resize handles.\n *\n * Coordinates are in image-native pixels (0..naturalWidth, 0..naturalHeight).\n * The consumer converts to display pixels using the image's rendered size.\n */\n\nexport type ResizeHandle = 'n' | 's' | 'e' | 'w' | 'ne' | 'nw' | 'se' | 'sw'\n\nexport interface CropRect {\n  x: number\n  y: number\n  width: number\n  height: number\n}\n\nexport interface ImageCropperState {\n  /** Natural dimensions of the source image. */\n  image: { width: number; height: number }\n  crop: CropRect\n  /** Constrain the crop to this aspect ratio (width / height), or null to free-form. */\n  aspectRatio: number | null\n  minSize: number\n  dragging: boolean\n  resizing: ResizeHandle | null\n  disabled: boolean\n}\n\nexport type ImageCropperMsg =\n  /** @humanOnly */\n  | { type: 'setImage'; width: number; height: number }\n  /** @intent(\"Set the crop rectangle (x/y/width/height in image-native pixels)\") */\n  | { type: 'setCrop'; crop: CropRect }\n  /** @intent(\"Lock the crop to a specific aspect ratio (width/height), or null for free-form\") */\n  | { type: 'setAspectRatio'; ratio: number | null }\n  /** @humanOnly */\n  | { type: 'dragStart' }\n  /** @humanOnly */\n  | { type: 'dragMove'; dx: number; dy: number }\n  /** @humanOnly */\n  | { type: 'dragEnd' }\n  /** @humanOnly */\n  | { type: 'resizeStart'; handle: ResizeHandle }\n  /** @humanOnly */\n  | { type: 'resizeMove'; dx: number; dy: number }\n  /** @humanOnly */\n  | { type: 'resizeEnd' }\n  /** @intent(\"Reset the crop to a default selection (full image or aspect-fit)\") */\n  | { type: 'reset' }\n  /** @intent(\"Set the crop to a maximum-area centered selection\") */\n  | { type: 'centerFill' }\n\nexport interface ImageCropperInit {\n  image?: { width: number; height: number }\n  crop?: CropRect\n  aspectRatio?: number | null\n  minSize?: number\n  disabled?: boolean\n}\n\nfunction clamp(v: number, min: number, max: number): number {\n  return Math.max(min, Math.min(max, v))\n}\n\nfunction clampCrop(crop: CropRect, image: { width: number; height: number }): CropRect {\n  const width = clamp(crop.width, 0, image.width)\n  const height = clamp(crop.height, 0, image.height)\n  const x = clamp(crop.x, 0, image.width - width)\n  const y = clamp(crop.y, 0, image.height - height)\n  return { x, y, width, height }\n}\n\nfunction enforceAspectRatio(crop: CropRect, ratio: number | null): CropRect {\n  if (ratio === null) return crop\n  // Keep width; compute height from ratio.\n  const height = crop.width / ratio\n  return { ...crop, height }\n}\n\n/**\n * Compute the largest centered crop that fits `image` while respecting the\n * aspect ratio (if any).\n */\nexport function centerFill(\n  image: { width: number; height: number },\n  aspectRatio: number | null,\n): CropRect {\n  if (aspectRatio === null) {\n    return { x: 0, y: 0, width: image.width, height: image.height }\n  }\n  const imgRatio = image.width / image.height\n  let width: number, height: number\n  if (aspectRatio > imgRatio) {\n    width = image.width\n    height = width / aspectRatio\n  } else {\n    height = image.height\n    width = height * aspectRatio\n  }\n  return {\n    x: (image.width - width) / 2,\n    y: (image.height - height) / 2,\n    width,\n    height,\n  }\n}\n\nexport function init(opts: ImageCropperInit = {}): ImageCropperState {\n  const image = opts.image ?? { width: 0, height: 0 }\n  const aspectRatio = opts.aspectRatio ?? null\n  const crop = opts.crop ?? centerFill(image, aspectRatio)\n  return {\n    image,\n    crop: clampCrop(crop, image),\n    aspectRatio,\n    minSize: opts.minSize ?? 20,\n    dragging: false,\n    resizing: null,\n    disabled: opts.disabled ?? false,\n  }\n}\n\nfunction applyResize(\n  state: ImageCropperState,\n  dx: number,\n  dy: number,\n  handle: ResizeHandle,\n): ImageCropperState {\n  let { x, y, width, height } = state.crop\n  if (handle.includes('e')) width += dx\n  if (handle.includes('w')) {\n    width -= dx\n    x += dx\n  }\n  if (handle.includes('s')) height += dy\n  if (handle.includes('n')) {\n    height -= dy\n    y += dy\n  }\n  // Aspect ratio: if set, let the axis with the bigger delta drive the\n  // other, keeping the handle's corner anchored.\n  if (state.aspectRatio !== null) {\n    const isHoriz = handle === 'e' || handle === 'w'\n    const isVert = handle === 'n' || handle === 's'\n    if (isHoriz) {\n      const newHeight = width / state.aspectRatio\n      // Keep vertical center.\n      y = state.crop.y + (state.crop.height - newHeight) / 2\n      height = newHeight\n    } else if (isVert) {\n      const newWidth = height * state.aspectRatio\n      x = state.crop.x + (state.crop.width - newWidth) / 2\n      width = newWidth\n    } else {\n      // Corner: use the axis with the larger pointer delta (expressed in\n      // width-equivalent units) to drive the other. This keeps the thumb\n      // tracking the pointer linearly instead of snapping to whichever\n      // current dimension happens to match the aspect ratio closer.\n      const dw = width - state.crop.width\n      const dh = height - state.crop.height\n      const dhAsDw = dh * state.aspectRatio\n      if (Math.abs(dw) >= Math.abs(dhAsDw)) {\n        // Width leads; derive height, re-anchor top if resizing from north.\n        height = width / state.aspectRatio\n        if (handle.includes('n')) y = state.crop.y + (state.crop.height - height)\n      } else {\n        // Height leads; derive width, re-anchor left if resizing from west.\n        width = height * state.aspectRatio\n        if (handle.includes('w')) x = state.crop.x + (state.crop.width - width)\n      }\n    }\n  }\n  // Enforce min size + clamp to image.\n  if (width < state.minSize) width = state.minSize\n  if (height < state.minSize) height = state.minSize\n  return { ...state, crop: clampCrop({ x, y, width, height }, state.image) }\n}\n\nexport function update(\n  state: ImageCropperState,\n  msg: ImageCropperMsg,\n): [ImageCropperState, never[]] {\n  if (state.disabled && msg.type !== 'setImage' && msg.type !== 'reset') {\n    return [state, []]\n  }\n  switch (msg.type) {\n    case 'setImage': {\n      const image = { width: msg.width, height: msg.height }\n      const crop = centerFill(image, state.aspectRatio)\n      return [{ ...state, image, crop }, []]\n    }\n    case 'setCrop':\n      return [{ ...state, crop: clampCrop(msg.crop, state.image) }, []]\n    case 'setAspectRatio': {\n      const next = enforceAspectRatio(state.crop, msg.ratio)\n      return [{ ...state, aspectRatio: msg.ratio, crop: clampCrop(next, state.image) }, []]\n    }\n    case 'dragStart':\n      return [{ ...state, dragging: true }, []]\n    case 'dragMove': {\n      if (!state.dragging) return [state, []]\n      const crop = {\n        ...state.crop,\n        x: state.crop.x + msg.dx,\n        y: state.crop.y + msg.dy,\n      }\n      return [{ ...state, crop: clampCrop(crop, state.image) }, []]\n    }\n    case 'dragEnd':\n      return [{ ...state, dragging: false }, []]\n    case 'resizeStart':\n      return [{ ...state, resizing: msg.handle }, []]\n    case 'resizeMove':\n      if (state.resizing === null) return [state, []]\n      return [applyResize(state, msg.dx, msg.dy, state.resizing), []]\n    case 'resizeEnd':\n      return [{ ...state, resizing: null }, []]\n    case 'reset':\n    case 'centerFill':\n      return [{ ...state, crop: centerFill(state.image, state.aspectRatio) }, []]\n  }\n}\n\nexport interface ImageCropperParts {\n  root: {\n    'data-scope': 'image-cropper'\n    'data-part': 'root'\n    'data-dragging': Signal<'' | undefined>\n    'data-resizing': Signal<'' | undefined>\n    'data-disabled': Signal<'' | undefined>\n  }\n  image: {\n    'data-scope': 'image-cropper'\n    'data-part': 'image'\n    onLoad: (e: Event) => void\n    draggable: false\n  }\n  cropBox: {\n    'data-scope': 'image-cropper'\n    'data-part': 'crop-box'\n    style: Signal<string>\n    onPointerDown: (e: PointerEvent) => void\n  }\n  resizeHandle: (handle: ResizeHandle) => {\n    'data-scope': 'image-cropper'\n    'data-part': 'resize-handle'\n    'data-handle': ResizeHandle\n    onPointerDown: (e: PointerEvent) => void\n  }\n  resetTrigger: {\n    type: 'button'\n    'aria-label': string\n    'data-scope': 'image-cropper'\n    'data-part': 'reset-trigger'\n    onClick: (e: MouseEvent) => void\n  }\n}\n\nexport interface ConnectOptions {\n  resetLabel?: string\n}\n\nexport function connect(\n  state: Signal<ImageCropperState>,\n  send: Send<ImageCropperMsg>,\n  opts: ConnectOptions = {},\n): ImageCropperParts {\n  const locale = useContext(LocaleContext)\n  return {\n    root: {\n      'data-scope': 'image-cropper',\n      'data-part': 'root',\n      'data-dragging': state.map((st) => (st.dragging ? '' : undefined)),\n      'data-resizing': state.map((st) => (st.resizing !== null ? '' : undefined)),\n      'data-disabled': state.map((st) => (st.disabled ? '' : undefined)),\n    },\n    image: {\n      'data-scope': 'image-cropper',\n      'data-part': 'image',\n      onLoad: tagSend(send, ['setImage'], (e) => {\n        const img = e.target as HTMLImageElement\n        send({ type: 'setImage', width: img.naturalWidth, height: img.naturalHeight })\n      }),\n      draggable: false,\n    },\n    cropBox: {\n      'data-scope': 'image-cropper',\n      'data-part': 'crop-box',\n      style: state.map((st) => {\n        if (st.image.width === 0 || st.image.height === 0) return 'display:none;'\n        // Express as percentages so the crop box scales with the rendered image.\n        const xp = (st.crop.x / st.image.width) * 100\n        const yp = (st.crop.y / st.image.height) * 100\n        const wp = (st.crop.width / st.image.width) * 100\n        const hp = (st.crop.height / st.image.height) * 100\n        return `left:${xp}%;top:${yp}%;width:${wp}%;height:${hp}%;`\n      }),\n      onPointerDown: tagSend(send, ['dragStart'], () => send({ type: 'dragStart' })),\n    },\n    resizeHandle: (handle: ResizeHandle) => ({\n      'data-scope': 'image-cropper',\n      'data-part': 'resize-handle',\n      'data-handle': handle,\n      onPointerDown: tagSend(send, ['resizeStart'], () => send({ type: 'resizeStart', handle })),\n    }),\n    resetTrigger: {\n      type: 'button',\n      'aria-label': opts.resetLabel ?? locale.imageCropper.reset,\n      'data-scope': 'image-cropper',\n      'data-part': 'reset-trigger',\n      onClick: tagSend(send, ['reset'], () => send({ type: 'reset' })),\n    },\n  }\n}\n\nexport const imageCropper = { init, update, connect, centerFill }\n"]}

package/dist/components/in-view.d.ts

@@ -1,4 +1,4 @@
-import type { Send } from '@llui/dom';
+import type { Send, Signal } from '@llui/dom';
 /**
  * In View — tracks whether an element is visible in the viewport
  * using IntersectionObserver.
@@ -10,10 +10,10 @@ import type { Send } from '@llui/dom';
  * scroll-triggered animations.
  *
  * ```ts
- * const parts = inView.connect<State>(s => s.iv, sendIv, { id: 'hero' })
+ * const parts = inView.connect(state.map((s) => s.iv), sendIv, { id: 'hero' })
  *
  * view: () => [
- *   div({ ...parts.root, class: (s) => s.iv.visible ? 'fade-in' : '' }, [
+ *   div({ ...parts.root, class: state.map((s) => (s.iv.visible ? 'fade-in' : '')) }, [
  *     // content that animates on scroll
  *   ]),
  * ]
@@ -34,17 +34,17 @@ export type InViewMsg = {
 };
 export declare function init(): InViewState;
 export declare function update(state: InViewState, msg: InViewMsg): [InViewState, never[]];
-export interface InViewParts<S> {
+export interface InViewParts {
     root: {
         'data-scope': 'in-view';
         'data-part': 'root';
-        'data-state': (s: S) => 'visible' | 'hidden';
+        'data-state': Signal<'visible' | 'hidden'>;
     };
 }
 export interface ConnectOptions {
     id: string;
 }
-export declare function connect<S>(get: (s: S) => InViewState, _send: Send<InViewMsg>, _opts: ConnectOptions): InViewParts<S>;
+export declare function connect(state: Signal<InViewState>, _send: Send<InViewMsg>, _opts: ConnectOptions): InViewParts;
 export interface ObserverOptions {
     threshold?: number;
     rootMargin?: string;

package/dist/components/in-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"in-view.d.ts","sourceRoot":"","sources":["../../src/components/in-view.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAErC;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAA;AAE7D,wBAAgB,IAAI,IAAI,WAAW,CAElC;AAED,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,SAAS,GAAG,CAAC,WAAW,EAAE,KAAK,EAAE,CAAC,CAOjF;AAED,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,IAAI,EAAE;QACJ,YAAY,EAAE,SAAS,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,YAAY,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,SAAS,GAAG,QAAQ,CAAA;KAC7C,CAAA;CACF;AAED,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAA;CACX;AAED,wBAAgB,OAAO,CAAC,CAAC,EACvB,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,WAAW,EAC1B,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,EACtB,KAAK,EAAE,cAAc,GACpB,WAAW,CAAC,CAAC,CAAC,CAQhB;AAED,MAAM,WAAW,eAAe;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,CAAC,EAAE,OAAO,CAAA;CACf;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAC5B,EAAE,EAAE,OAAO,EACX,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,EACrB,IAAI,GAAE,eAAoB,GACzB,MAAM,IAAI,CAuBZ;AAED,eAAO,MAAM,MAAM;;;;;CAA4C,CAAA"}
+{"version":3,"file":"in-view.d.ts","sourceRoot":"","sources":["../../src/components/in-view.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAE7C;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAA;AAE7D,wBAAgB,IAAI,IAAI,WAAW,CAElC;AAED,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,SAAS,GAAG,CAAC,WAAW,EAAE,KAAK,EAAE,CAAC,CAOjF;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE;QACJ,YAAY,EAAE,SAAS,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,YAAY,EAAE,MAAM,CAAC,SAAS,GAAG,QAAQ,CAAC,CAAA;KAC3C,CAAA;CACF;AAED,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAA;CACX;AAED,wBAAgB,OAAO,CACrB,KAAK,EAAE,MAAM,CAAC,WAAW,CAAC,EAC1B,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,EACtB,KAAK,EAAE,cAAc,GACpB,WAAW,CAQb;AAED,MAAM,WAAW,eAAe;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,CAAC,EAAE,OAAO,CAAA;CACf;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAC5B,EAAE,EAAE,OAAO,EACX,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,EACrB,IAAI,GAAE,eAAoB,GACzB,MAAM,IAAI,CAuBZ;AAED,eAAO,MAAM,MAAM;;;;;CAA4C,CAAA"}

package/dist/components/in-view.js

@@ -9,12 +9,12 @@ export function update(state, msg) {
             return state.visible ? [{ visible: false }, []] : [state, []];
     }
 }
-export function connect(get, _send, _opts) {
+export function connect(state, _send, _opts) {
     return {
         root: {
             'data-scope': 'in-view',
             'data-part': 'root',
-            'data-state': (s) => (get(s).visible ? 'visible' : 'hidden'),
+            'data-state': state.map((s) => (s.visible ? 'visible' : 'hidden')),
         },
     };
 }

package/dist/components/in-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"in-view.js","sourceRoot":"","sources":["../../src/components/in-view.ts"],"names":[],"mappings":"AAkCA,MAAM,UAAU,IAAI;IAClB,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAA;AAC3B,CAAC;AAED,MAAM,UAAU,MAAM,CAAC,KAAkB,EAAE,GAAc;IACvD,QAAQ,GAAG,CAAC,IAAI,EAAE,CAAC;QACjB,KAAK,OAAO;YACV,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAA;QAC9D,KAAK,OAAO;YACV,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;IACjE,CAAC;AACH,CAAC;AAcD,MAAM,UAAU,OAAO,CACrB,GAA0B,EAC1B,KAAsB,EACtB,KAAqB;IAErB,OAAO;QACL,IAAI,EAAE;YACJ,YAAY,EAAE,SAAS;YACvB,WAAW,EAAE,MAAM;YACnB,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC;SAC7D;KACF,CAAA;AACH,CAAC;AAQD;;;;;;;;GAQG;AACH,MAAM,UAAU,cAAc,CAC5B,EAAW,EACX,IAAqB,EACrB,OAAwB,EAAE;IAE1B,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACvC,CAAC,OAAO,EAAE,EAAE;QACV,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;YAC5B,IAAI,KAAK,CAAC,cAAc,EAAE,CAAC;gBACzB,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAA;gBACvB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;oBACd,QAAQ,CAAC,UAAU,EAAE,CAAA;oBACrB,OAAM;gBACR,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAA;YACzB,CAAC;QACH,CAAC;IACH,CAAC,EACD;QACE,SAAS,EAAE,IAAI,CAAC,SAAS,IAAI,CAAC;QAC9B,UAAU,EAAE,IAAI,CAAC,UAAU,IAAI,KAAK;KACrC,CACF,CAAA;IAED,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,CAAA;IACpB,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAA;AACpC,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,CAAA","sourcesContent":["import type { Send } from '@llui/dom'\n\n/**\n * In View — tracks whether an element is visible in the viewport\n * using IntersectionObserver.\n *\n * State machine: `{ visible: false }` → enter → `{ visible: true }` → leave → …\n *\n * With `once: true`, the observer disconnects after the first enter,\n * keeping `visible: true` permanently. Useful for lazy-load and\n * scroll-triggered animations.\n *\n * ```ts\n * const parts = inView.connect<State>(s => s.iv, sendIv, { id: 'hero' })\n *\n * view: () => [\n *   div({ ...parts.root, class: (s) => s.iv.visible ? 'fade-in' : '' }, [\n *     // content that animates on scroll\n *   ]),\n * ]\n * ```\n *\n * Wire up the observer in `onMount`:\n * ```ts\n * onMount((el) => inView.createObserver(el, sendIv, { threshold: 0.5, once: true }))\n * ```\n */\n\nexport interface InViewState {\n  visible: boolean\n}\n\nexport type InViewMsg = { type: 'enter' } | { type: 'leave' }\n\nexport function init(): InViewState {\n  return { visible: false }\n}\n\nexport function update(state: InViewState, msg: InViewMsg): [InViewState, never[]] {\n  switch (msg.type) {\n    case 'enter':\n      return state.visible ? [state, []] : [{ visible: true }, []]\n    case 'leave':\n      return state.visible ? [{ visible: false }, []] : [state, []]\n  }\n}\n\nexport interface InViewParts<S> {\n  root: {\n    'data-scope': 'in-view'\n    'data-part': 'root'\n    'data-state': (s: S) => 'visible' | 'hidden'\n  }\n}\n\nexport interface ConnectOptions {\n  id: string\n}\n\nexport function connect<S>(\n  get: (s: S) => InViewState,\n  _send: Send<InViewMsg>,\n  _opts: ConnectOptions,\n): InViewParts<S> {\n  return {\n    root: {\n      'data-scope': 'in-view',\n      'data-part': 'root',\n      'data-state': (s) => (get(s).visible ? 'visible' : 'hidden'),\n    },\n  }\n}\n\nexport interface ObserverOptions {\n  threshold?: number\n  rootMargin?: string\n  once?: boolean\n}\n\n/**\n * Create an IntersectionObserver for the given element. Returns a cleanup\n * function that disconnects the observer.\n *\n * Call this inside `onMount`:\n * ```ts\n * onMount((el) => inView.createObserver(el, send, { once: true }))\n * ```\n */\nexport function createObserver(\n  el: Element,\n  send: Send<InViewMsg>,\n  opts: ObserverOptions = {},\n): () => void {\n  const observer = new IntersectionObserver(\n    (entries) => {\n      for (const entry of entries) {\n        if (entry.isIntersecting) {\n          send({ type: 'enter' })\n          if (opts.once) {\n            observer.disconnect()\n            return\n          }\n        } else {\n          send({ type: 'leave' })\n        }\n      }\n    },\n    {\n      threshold: opts.threshold ?? 0,\n      rootMargin: opts.rootMargin ?? '0px',\n    },\n  )\n\n  observer.observe(el)\n  return () => observer.disconnect()\n}\n\nexport const inView = { init, update, connect, createObserver }\n"]}
+{"version":3,"file":"in-view.js","sourceRoot":"","sources":["../../src/components/in-view.ts"],"names":[],"mappings":"AAkCA,MAAM,UAAU,IAAI;IAClB,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAA;AAC3B,CAAC;AAED,MAAM,UAAU,MAAM,CAAC,KAAkB,EAAE,GAAc;IACvD,QAAQ,GAAG,CAAC,IAAI,EAAE,CAAC;QACjB,KAAK,OAAO;YACV,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAA;QAC9D,KAAK,OAAO;YACV,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;IACjE,CAAC;AACH,CAAC;AAcD,MAAM,UAAU,OAAO,CACrB,KAA0B,EAC1B,KAAsB,EACtB,KAAqB;IAErB,OAAO;QACL,IAAI,EAAE;YACJ,YAAY,EAAE,SAAS;YACvB,WAAW,EAAE,MAAM;YACnB,YAAY,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;SACnE;KACF,CAAA;AACH,CAAC;AAQD;;;;;;;;GAQG;AACH,MAAM,UAAU,cAAc,CAC5B,EAAW,EACX,IAAqB,EACrB,OAAwB,EAAE;IAE1B,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACvC,CAAC,OAAO,EAAE,EAAE;QACV,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;YAC5B,IAAI,KAAK,CAAC,cAAc,EAAE,CAAC;gBACzB,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAA;gBACvB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;oBACd,QAAQ,CAAC,UAAU,EAAE,CAAA;oBACrB,OAAM;gBACR,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAA;YACzB,CAAC;QACH,CAAC;IACH,CAAC,EACD;QACE,SAAS,EAAE,IAAI,CAAC,SAAS,IAAI,CAAC;QAC9B,UAAU,EAAE,IAAI,CAAC,UAAU,IAAI,KAAK;KACrC,CACF,CAAA;IAED,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,CAAA;IACpB,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAA;AACpC,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,CAAA","sourcesContent":["import type { Send, Signal } from '@llui/dom'\n\n/**\n * In View — tracks whether an element is visible in the viewport\n * using IntersectionObserver.\n *\n * State machine: `{ visible: false }` → enter → `{ visible: true }` → leave → …\n *\n * With `once: true`, the observer disconnects after the first enter,\n * keeping `visible: true` permanently. Useful for lazy-load and\n * scroll-triggered animations.\n *\n * ```ts\n * const parts = inView.connect(state.map((s) => s.iv), sendIv, { id: 'hero' })\n *\n * view: () => [\n *   div({ ...parts.root, class: state.map((s) => (s.iv.visible ? 'fade-in' : '')) }, [\n *     // content that animates on scroll\n *   ]),\n * ]\n * ```\n *\n * Wire up the observer in `onMount`:\n * ```ts\n * onMount((el) => inView.createObserver(el, sendIv, { threshold: 0.5, once: true }))\n * ```\n */\n\nexport interface InViewState {\n  visible: boolean\n}\n\nexport type InViewMsg = { type: 'enter' } | { type: 'leave' }\n\nexport function init(): InViewState {\n  return { visible: false }\n}\n\nexport function update(state: InViewState, msg: InViewMsg): [InViewState, never[]] {\n  switch (msg.type) {\n    case 'enter':\n      return state.visible ? [state, []] : [{ visible: true }, []]\n    case 'leave':\n      return state.visible ? [{ visible: false }, []] : [state, []]\n  }\n}\n\nexport interface InViewParts {\n  root: {\n    'data-scope': 'in-view'\n    'data-part': 'root'\n    'data-state': Signal<'visible' | 'hidden'>\n  }\n}\n\nexport interface ConnectOptions {\n  id: string\n}\n\nexport function connect(\n  state: Signal<InViewState>,\n  _send: Send<InViewMsg>,\n  _opts: ConnectOptions,\n): InViewParts {\n  return {\n    root: {\n      'data-scope': 'in-view',\n      'data-part': 'root',\n      'data-state': state.map((s) => (s.visible ? 'visible' : 'hidden')),\n    },\n  }\n}\n\nexport interface ObserverOptions {\n  threshold?: number\n  rootMargin?: string\n  once?: boolean\n}\n\n/**\n * Create an IntersectionObserver for the given element. Returns a cleanup\n * function that disconnects the observer.\n *\n * Call this inside `onMount`:\n * ```ts\n * onMount((el) => inView.createObserver(el, send, { once: true }))\n * ```\n */\nexport function createObserver(\n  el: Element,\n  send: Send<InViewMsg>,\n  opts: ObserverOptions = {},\n): () => void {\n  const observer = new IntersectionObserver(\n    (entries) => {\n      for (const entry of entries) {\n        if (entry.isIntersecting) {\n          send({ type: 'enter' })\n          if (opts.once) {\n            observer.disconnect()\n            return\n          }\n        } else {\n          send({ type: 'leave' })\n        }\n      }\n    },\n    {\n      threshold: opts.threshold ?? 0,\n      rootMargin: opts.rootMargin ?? '0px',\n    },\n  )\n\n  observer.observe(el)\n  return () => observer.disconnect()\n}\n\nexport const inView = { init, update, connect, createObserver }\n"]}

package/dist/components/listbox.d.ts

@@ -1,4 +1,4 @@
-import type { Send } from '@llui/dom';
+import type { Send, Signal } from '@llui/dom';
 /**
  * Listbox — a list of selectable options. Supports single and multiple
  * selection, keyboard navigation (arrows, Home, End), typeahead, and
@@ -76,15 +76,15 @@ export interface ListboxInit {
 }
 export declare function init(opts?: ListboxInit): ListboxState;
 export declare function update(state: ListboxState, msg: ListboxMsg): [ListboxState, never[]];
-export interface ListboxItemParts<S> {
+export interface ListboxItemParts {
     root: {
         role: 'option';
         id: string;
-        'aria-selected': (s: S) => boolean;
-        'aria-disabled': (s: S) => 'true' | undefined;
-        'data-state': (s: S) => 'selected' | undefined;
-        'data-highlighted': (s: S) => '' | undefined;
-        'data-disabled': (s: S) => '' | undefined;
+        'aria-selected': Signal<boolean>;
+        'aria-disabled': Signal<'true' | undefined>;
+        'data-state': Signal<'selected' | undefined>;
+        'data-highlighted': Signal<'' | undefined>;
+        'data-disabled': Signal<'' | undefined>;
         'data-scope': 'listbox';
         'data-part': 'item';
         'data-value': string;
@@ -93,26 +93,26 @@ export interface ListboxItemParts<S> {
         onPointerMove: (e: PointerEvent) => void;
     };
 }
-export interface ListboxParts<S> {
+export interface ListboxParts {
     root: {
         role: 'listbox';
-        'aria-owns': (s: S) => string | undefined;
-        'aria-multiselectable': (s: S) => 'true' | undefined;
-        'aria-disabled': (s: S) => 'true' | undefined;
-        'aria-activedescendant': (s: S) => string | undefined;
-        tabIndex: (s: S) => number;
+        'aria-owns': Signal<string | undefined>;
+        'aria-multiselectable': Signal<'true' | undefined>;
+        'aria-disabled': Signal<'true' | undefined>;
+        'aria-activedescendant': Signal<string | undefined>;
+        tabIndex: Signal<number>;
         id: string;
         'data-scope': 'listbox';
         'data-part': 'root';
-        'data-disabled': (s: S) => '' | undefined;
+        'data-disabled': Signal<'' | undefined>;
         onKeyDown: (e: KeyboardEvent) => void;
     };
-    item: (value: string, index: number) => ListboxItemParts<S>;
+    item: (value: string, index: number) => ListboxItemParts;
 }
 export interface ConnectOptions {
     id: string;
 }
-export declare function connect<S>(get: (s: S) => ListboxState, send: Send<ListboxMsg>, opts: ConnectOptions): ListboxParts<S>;
+export declare function connect(state: Signal<ListboxState>, send: Send<ListboxMsg>, opts: ConnectOptions): ListboxParts;
 export declare const listbox: {
     init: typeof init;
     update: typeof update;

package/dist/components/listbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"listbox.d.ts","sourceRoot":"","sources":["../../src/components/listbox.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"listbox.d.ts","sourceRoot":"","sources":["../../src/components/listbox.ts"],"names":[],"mappings":"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"}

package/dist/components/listbox.js

@@ -106,29 +106,29 @@ export function update(state, msg) {
         }
     }
 }
-export function connect(get, send, opts) {
+export function connect(state, send, opts) {
     const rootId = `${opts.id}:root`;
     const itemId = (index) => `${opts.id}:item:${index}`;
     return {
         root: {
             role: 'listbox',
-            'aria-owns': (s) => {
-                const items = get(s).items;
+            'aria-owns': state.map((s) => {
+                const items = s.items;
                 if (items.length === 0)
                     return undefined;
                 return items.map((_, i) => itemId(i)).join(' ');
-            },
-            'aria-multiselectable': (s) => (get(s).selectionMode === 'multiple' ? 'true' : undefined),
-            'aria-disabled': (s) => (get(s).disabled ? 'true' : undefined),
-            'aria-activedescendant': (s) => {
-                const idx = get(s).highlightedIndex;
+            }),
+            'aria-multiselectable': state.map((s) => s.selectionMode === 'multiple' ? 'true' : undefined),
+            'aria-disabled': state.map((s) => (s.disabled ? 'true' : undefined)),
+            'aria-activedescendant': state.map((s) => {
+                const idx = s.highlightedIndex;
                 return idx === null ? undefined : itemId(idx);
-            },
-            tabIndex: (s) => (get(s).disabled ? -1 : 0),
+            }),
+            tabIndex: state.map((s) => (s.disabled ? -1 : 0)),
             id: rootId,
             'data-scope': 'listbox',
             'data-part': 'root',
-            'data-disabled': (s) => (get(s).disabled ? '' : undefined),
+            'data-disabled': state.map((s) => (s.disabled ? '' : undefined)),
             onKeyDown: tagSend(send, [
                 'highlightNext',
                 'highlightPrev',
@@ -170,11 +170,11 @@ export function connect(get, send, opts) {
             root: {
                 role: 'option',
                 id: itemId(index),
-                'aria-selected': (s) => get(s).value.includes(value),
-                'aria-disabled': (s) => (get(s).disabledItems.includes(value) ? 'true' : undefined),
-                'data-state': (s) => (get(s).value.includes(value) ? 'selected' : undefined),
-                'data-highlighted': (s) => (get(s).highlightedIndex === index ? '' : undefined),
-                'data-disabled': (s) => (get(s).disabledItems.includes(value) ? '' : undefined),
+                'aria-selected': state.map((s) => s.value.includes(value)),
+                'aria-disabled': state.map((s) => (s.disabledItems.includes(value) ? 'true' : undefined)),
+                'data-state': state.map((s) => (s.value.includes(value) ? 'selected' : undefined)),
+                'data-highlighted': state.map((s) => (s.highlightedIndex === index ? '' : undefined)),
+                'data-disabled': state.map((s) => (s.disabledItems.includes(value) ? '' : undefined)),
                 'data-scope': 'listbox',
                 'data-part': 'item',
                 'data-value': value,

package/dist/components/listbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"listbox.js","sourceRoot":"","sources":["../../src/components/listbox.ts"],"names":[],"mappings":"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","sourcesContent":["import { tagSend } from '@llui/dom'\nimport type { Send } from '@llui/dom'\nimport {\n  typeaheadAccumulate,\n  typeaheadMatchByItems,\n  isTypeaheadKey,\n  TYPEAHEAD_TIMEOUT_MS,\n} from '../utils/typeahead.js'\n\n/**\n * Listbox — a list of selectable options. Supports single and multiple\n * selection, keyboard navigation (arrows, Home, End), typeahead, and\n * disabled items. Renders as `role=\"listbox\"` with `role=\"option\"` items.\n */\n\nexport type SelectionMode = 'single' | 'multiple'\n\nexport interface ListboxState {\n  value: string[]\n  items: string[]\n  disabledItems: string[]\n  disabled: boolean\n  selectionMode: SelectionMode\n  highlightedIndex: number | null\n  typeahead: string\n  typeaheadExpiresAt: number\n}\n\nexport type ListboxMsg =\n  /** @intent(\"Pick the option with the given value (toggles in multi-select)\") */\n  | { type: 'select'; value: string }\n  /** @intent(\"Replace the selected values with the provided list\") */\n  | { type: 'setValue'; value: string[] }\n  /** @intent(\"Clear all selected values\") */\n  | { type: 'clear' }\n  /** @humanOnly */\n  | { type: 'highlight'; index: number | null }\n  /** @humanOnly */\n  | { type: 'highlightNext' }\n  /** @humanOnly */\n  | { type: 'highlightPrev' }\n  /** @humanOnly */\n  | { type: 'highlightFirst' }\n  /** @humanOnly */\n  | { type: 'highlightLast' }\n  /** @intent(\"Pick the currently-highlighted option\") */\n  | { type: 'selectHighlighted' }\n  /** @humanOnly */\n  | { type: 'setItems'; items: string[]; disabled?: string[] }\n  /** @humanOnly */\n  | { type: 'typeahead'; char: string; now: number }\n\nexport interface ListboxInit {\n  value?: string[]\n  items?: string[]\n  disabledItems?: string[]\n  disabled?: boolean\n  selectionMode?: SelectionMode\n}\n\nexport function init(opts: ListboxInit = {}): ListboxState {\n  return {\n    value: opts.value ?? [],\n    items: opts.items ?? [],\n    disabledItems: opts.disabledItems ?? [],\n    disabled: opts.disabled ?? false,\n    selectionMode: opts.selectionMode ?? 'single',\n    highlightedIndex: null,\n    typeahead: '',\n    typeaheadExpiresAt: 0,\n  }\n}\n\nfunction nextEnabledIndex(\n  items: string[],\n  disabled: string[],\n  from: number | null,\n  delta: 1 | -1,\n): number | null {\n  if (items.length === 0) return null\n  const start = from === null ? (delta === 1 ? -1 : items.length) : from\n  const n = items.length\n  for (let i = 1; i <= n; i++) {\n    const idx = (start + delta * i + n * n) % n\n    if (!disabled.includes(items[idx]!)) return idx\n  }\n  return null\n}\n\nfunction firstEnabledIndex(items: string[], disabled: string[]): number | null {\n  for (let i = 0; i < items.length; i++) {\n    if (!disabled.includes(items[i]!)) return i\n  }\n  return null\n}\n\nfunction lastEnabledIndex(items: string[], disabled: string[]): number | null {\n  for (let i = items.length - 1; i >= 0; i--) {\n    if (!disabled.includes(items[i]!)) return i\n  }\n  return null\n}\n\nfunction applySelection(state: ListboxState, value: string): string[] {\n  if (state.disabledItems.includes(value)) return state.value\n  if (state.selectionMode === 'single') return [value]\n  // multiple\n  const isActive = state.value.includes(value)\n  return isActive ? state.value.filter((v) => v !== value) : [...state.value, value]\n}\n\nexport function update(state: ListboxState, msg: ListboxMsg): [ListboxState, never[]] {\n  if (state.disabled) return [state, []]\n  switch (msg.type) {\n    case 'select':\n      return [{ ...state, value: applySelection(state, msg.value) }, []]\n    case 'setValue':\n      return [{ ...state, value: msg.value }, []]\n    case 'clear':\n      return [{ ...state, value: [] }, []]\n    case 'highlight':\n      return [{ ...state, highlightedIndex: msg.index }, []]\n    case 'highlightNext': {\n      const to = nextEnabledIndex(state.items, state.disabledItems, state.highlightedIndex, 1)\n      return [{ ...state, highlightedIndex: to }, []]\n    }\n    case 'highlightPrev': {\n      const to = nextEnabledIndex(state.items, state.disabledItems, state.highlightedIndex, -1)\n      return [{ ...state, highlightedIndex: to }, []]\n    }\n    case 'highlightFirst':\n      return [\n        { ...state, highlightedIndex: firstEnabledIndex(state.items, state.disabledItems) },\n        [],\n      ]\n    case 'highlightLast':\n      return [\n        { ...state, highlightedIndex: lastEnabledIndex(state.items, state.disabledItems) },\n        [],\n      ]\n    case 'selectHighlighted': {\n      if (state.highlightedIndex === null) return [state, []]\n      const v = state.items[state.highlightedIndex]\n      if (v === undefined) return [state, []]\n      return [{ ...state, value: applySelection(state, v) }, []]\n    }\n    case 'setItems': {\n      const disabled = msg.disabled ?? state.disabledItems\n      // Preserve only values still in the items list and not disabled\n      const value = state.value.filter((v) => msg.items.includes(v) && !disabled.includes(v))\n      return [{ ...state, items: msg.items, disabledItems: disabled, value }, []]\n    }\n    case 'typeahead': {\n      const acc = typeaheadAccumulate(state.typeahead, msg.char, msg.now, state.typeaheadExpiresAt)\n      const match = typeaheadMatchByItems(\n        state.items,\n        state.disabledItems,\n        acc,\n        state.highlightedIndex,\n      )\n      return [\n        {\n          ...state,\n          typeahead: acc,\n          typeaheadExpiresAt: msg.now + TYPEAHEAD_TIMEOUT_MS,\n          highlightedIndex: match ?? state.highlightedIndex,\n        },\n        [],\n      ]\n    }\n  }\n}\n\nexport interface ListboxItemParts<S> {\n  root: {\n    role: 'option'\n    id: string\n    'aria-selected': (s: S) => boolean\n    'aria-disabled': (s: S) => 'true' | undefined\n    'data-state': (s: S) => 'selected' | undefined\n    'data-highlighted': (s: S) => '' | undefined\n    'data-disabled': (s: S) => '' | undefined\n    'data-scope': 'listbox'\n    'data-part': 'item'\n    'data-value': string\n    'data-index': string\n    onClick: (e: MouseEvent) => void\n    onPointerMove: (e: PointerEvent) => void\n  }\n}\n\nexport interface ListboxParts<S> {\n  root: {\n    role: 'listbox'\n    'aria-owns': (s: S) => string | undefined\n    'aria-multiselectable': (s: S) => 'true' | undefined\n    'aria-disabled': (s: S) => 'true' | undefined\n    'aria-activedescendant': (s: S) => string | undefined\n    tabIndex: (s: S) => number\n    id: string\n    'data-scope': 'listbox'\n    'data-part': 'root'\n    'data-disabled': (s: S) => '' | undefined\n    onKeyDown: (e: KeyboardEvent) => void\n  }\n  item: (value: string, index: number) => ListboxItemParts<S>\n}\n\nexport interface ConnectOptions {\n  id: string\n}\n\nexport function connect<S>(\n  get: (s: S) => ListboxState,\n  send: Send<ListboxMsg>,\n  opts: ConnectOptions,\n): ListboxParts<S> {\n  const rootId = `${opts.id}:root`\n  const itemId = (index: number): string => `${opts.id}:item:${index}`\n\n  return {\n    root: {\n      role: 'listbox',\n      'aria-owns': (s) => {\n        const items = get(s).items\n        if (items.length === 0) return undefined\n        return items.map((_, i) => itemId(i)).join(' ')\n      },\n      'aria-multiselectable': (s) => (get(s).selectionMode === 'multiple' ? 'true' : undefined),\n      'aria-disabled': (s) => (get(s).disabled ? 'true' : undefined),\n      'aria-activedescendant': (s) => {\n        const idx = get(s).highlightedIndex\n        return idx === null ? undefined : itemId(idx)\n      },\n      tabIndex: (s) => (get(s).disabled ? -1 : 0),\n      id: rootId,\n      'data-scope': 'listbox',\n      'data-part': 'root',\n      'data-disabled': (s) => (get(s).disabled ? '' : undefined),\n      onKeyDown: tagSend(\n        send,\n        [\n          'highlightNext',\n          'highlightPrev',\n          'highlightFirst',\n          'highlightLast',\n          'selectHighlighted',\n          'typeahead',\n        ],\n        (e) => {\n          switch (e.key) {\n            case 'ArrowDown':\n              e.preventDefault()\n              send({ type: 'highlightNext' })\n              return\n            case 'ArrowUp':\n              e.preventDefault()\n              send({ type: 'highlightPrev' })\n              return\n            case 'Home':\n              e.preventDefault()\n              send({ type: 'highlightFirst' })\n              return\n            case 'End':\n              e.preventDefault()\n              send({ type: 'highlightLast' })\n              return\n            case 'Enter':\n            case ' ':\n              e.preventDefault()\n              send({ type: 'selectHighlighted' })\n              return\n            default:\n              if (isTypeaheadKey(e)) {\n                send({ type: 'typeahead', char: e.key, now: Date.now() })\n              }\n          }\n        },\n      ),\n    },\n    item: (value: string, index: number): ListboxItemParts<S> => ({\n      root: {\n        role: 'option',\n        id: itemId(index),\n        'aria-selected': (s) => get(s).value.includes(value),\n        'aria-disabled': (s) => (get(s).disabledItems.includes(value) ? 'true' : undefined),\n        'data-state': (s) => (get(s).value.includes(value) ? 'selected' : undefined),\n        'data-highlighted': (s) => (get(s).highlightedIndex === index ? '' : undefined),\n        'data-disabled': (s) => (get(s).disabledItems.includes(value) ? '' : undefined),\n        'data-scope': 'listbox',\n        'data-part': 'item',\n        'data-value': value,\n        'data-index': String(index),\n        onClick: tagSend(send, ['select'], () => send({ type: 'select', value })),\n        onPointerMove: tagSend(send, ['highlight'], () => send({ type: 'highlight', index })),\n      },\n    }),\n  }\n}\n\nexport const listbox = { init, update, connect }\n"]}
+{"version":3,"file":"listbox.js","sourceRoot":"","sources":["../../src/components/listbox.ts"],"names":[],"mappings":"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","sourcesContent":["import { tagSend } from '@llui/dom'\nimport type { Send, Signal } from '@llui/dom'\nimport {\n  typeaheadAccumulate,\n  typeaheadMatchByItems,\n  isTypeaheadKey,\n  TYPEAHEAD_TIMEOUT_MS,\n} from '../utils/typeahead.js'\n\n/**\n * Listbox — a list of selectable options. Supports single and multiple\n * selection, keyboard navigation (arrows, Home, End), typeahead, and\n * disabled items. Renders as `role=\"listbox\"` with `role=\"option\"` items.\n */\n\nexport type SelectionMode = 'single' | 'multiple'\n\nexport interface ListboxState {\n  value: string[]\n  items: string[]\n  disabledItems: string[]\n  disabled: boolean\n  selectionMode: SelectionMode\n  highlightedIndex: number | null\n  typeahead: string\n  typeaheadExpiresAt: number\n}\n\nexport type ListboxMsg =\n  /** @intent(\"Pick the option with the given value (toggles in multi-select)\") */\n  | { type: 'select'; value: string }\n  /** @intent(\"Replace the selected values with the provided list\") */\n  | { type: 'setValue'; value: string[] }\n  /** @intent(\"Clear all selected values\") */\n  | { type: 'clear' }\n  /** @humanOnly */\n  | { type: 'highlight'; index: number | null }\n  /** @humanOnly */\n  | { type: 'highlightNext' }\n  /** @humanOnly */\n  | { type: 'highlightPrev' }\n  /** @humanOnly */\n  | { type: 'highlightFirst' }\n  /** @humanOnly */\n  | { type: 'highlightLast' }\n  /** @intent(\"Pick the currently-highlighted option\") */\n  | { type: 'selectHighlighted' }\n  /** @humanOnly */\n  | { type: 'setItems'; items: string[]; disabled?: string[] }\n  /** @humanOnly */\n  | { type: 'typeahead'; char: string; now: number }\n\nexport interface ListboxInit {\n  value?: string[]\n  items?: string[]\n  disabledItems?: string[]\n  disabled?: boolean\n  selectionMode?: SelectionMode\n}\n\nexport function init(opts: ListboxInit = {}): ListboxState {\n  return {\n    value: opts.value ?? [],\n    items: opts.items ?? [],\n    disabledItems: opts.disabledItems ?? [],\n    disabled: opts.disabled ?? false,\n    selectionMode: opts.selectionMode ?? 'single',\n    highlightedIndex: null,\n    typeahead: '',\n    typeaheadExpiresAt: 0,\n  }\n}\n\nfunction nextEnabledIndex(\n  items: string[],\n  disabled: string[],\n  from: number | null,\n  delta: 1 | -1,\n): number | null {\n  if (items.length === 0) return null\n  const start = from === null ? (delta === 1 ? -1 : items.length) : from\n  const n = items.length\n  for (let i = 1; i <= n; i++) {\n    const idx = (start + delta * i + n * n) % n\n    if (!disabled.includes(items[idx]!)) return idx\n  }\n  return null\n}\n\nfunction firstEnabledIndex(items: string[], disabled: string[]): number | null {\n  for (let i = 0; i < items.length; i++) {\n    if (!disabled.includes(items[i]!)) return i\n  }\n  return null\n}\n\nfunction lastEnabledIndex(items: string[], disabled: string[]): number | null {\n  for (let i = items.length - 1; i >= 0; i--) {\n    if (!disabled.includes(items[i]!)) return i\n  }\n  return null\n}\n\nfunction applySelection(state: ListboxState, value: string): string[] {\n  if (state.disabledItems.includes(value)) return state.value\n  if (state.selectionMode === 'single') return [value]\n  // multiple\n  const isActive = state.value.includes(value)\n  return isActive ? state.value.filter((v) => v !== value) : [...state.value, value]\n}\n\nexport function update(state: ListboxState, msg: ListboxMsg): [ListboxState, never[]] {\n  if (state.disabled) return [state, []]\n  switch (msg.type) {\n    case 'select':\n      return [{ ...state, value: applySelection(state, msg.value) }, []]\n    case 'setValue':\n      return [{ ...state, value: msg.value }, []]\n    case 'clear':\n      return [{ ...state, value: [] }, []]\n    case 'highlight':\n      return [{ ...state, highlightedIndex: msg.index }, []]\n    case 'highlightNext': {\n      const to = nextEnabledIndex(state.items, state.disabledItems, state.highlightedIndex, 1)\n      return [{ ...state, highlightedIndex: to }, []]\n    }\n    case 'highlightPrev': {\n      const to = nextEnabledIndex(state.items, state.disabledItems, state.highlightedIndex, -1)\n      return [{ ...state, highlightedIndex: to }, []]\n    }\n    case 'highlightFirst':\n      return [\n        { ...state, highlightedIndex: firstEnabledIndex(state.items, state.disabledItems) },\n        [],\n      ]\n    case 'highlightLast':\n      return [\n        { ...state, highlightedIndex: lastEnabledIndex(state.items, state.disabledItems) },\n        [],\n      ]\n    case 'selectHighlighted': {\n      if (state.highlightedIndex === null) return [state, []]\n      const v = state.items[state.highlightedIndex]\n      if (v === undefined) return [state, []]\n      return [{ ...state, value: applySelection(state, v) }, []]\n    }\n    case 'setItems': {\n      const disabled = msg.disabled ?? state.disabledItems\n      // Preserve only values still in the items list and not disabled\n      const value = state.value.filter((v) => msg.items.includes(v) && !disabled.includes(v))\n      return [{ ...state, items: msg.items, disabledItems: disabled, value }, []]\n    }\n    case 'typeahead': {\n      const acc = typeaheadAccumulate(state.typeahead, msg.char, msg.now, state.typeaheadExpiresAt)\n      const match = typeaheadMatchByItems(\n        state.items,\n        state.disabledItems,\n        acc,\n        state.highlightedIndex,\n      )\n      return [\n        {\n          ...state,\n          typeahead: acc,\n          typeaheadExpiresAt: msg.now + TYPEAHEAD_TIMEOUT_MS,\n          highlightedIndex: match ?? state.highlightedIndex,\n        },\n        [],\n      ]\n    }\n  }\n}\n\nexport interface ListboxItemParts {\n  root: {\n    role: 'option'\n    id: string\n    'aria-selected': Signal<boolean>\n    'aria-disabled': Signal<'true' | undefined>\n    'data-state': Signal<'selected' | undefined>\n    'data-highlighted': Signal<'' | undefined>\n    'data-disabled': Signal<'' | undefined>\n    'data-scope': 'listbox'\n    'data-part': 'item'\n    'data-value': string\n    'data-index': string\n    onClick: (e: MouseEvent) => void\n    onPointerMove: (e: PointerEvent) => void\n  }\n}\n\nexport interface ListboxParts {\n  root: {\n    role: 'listbox'\n    'aria-owns': Signal<string | undefined>\n    'aria-multiselectable': Signal<'true' | undefined>\n    'aria-disabled': Signal<'true' | undefined>\n    'aria-activedescendant': Signal<string | undefined>\n    tabIndex: Signal<number>\n    id: string\n    'data-scope': 'listbox'\n    'data-part': 'root'\n    'data-disabled': Signal<'' | undefined>\n    onKeyDown: (e: KeyboardEvent) => void\n  }\n  item: (value: string, index: number) => ListboxItemParts\n}\n\nexport interface ConnectOptions {\n  id: string\n}\n\nexport function connect(\n  state: Signal<ListboxState>,\n  send: Send<ListboxMsg>,\n  opts: ConnectOptions,\n): ListboxParts {\n  const rootId = `${opts.id}:root`\n  const itemId = (index: number): string => `${opts.id}:item:${index}`\n\n  return {\n    root: {\n      role: 'listbox',\n      'aria-owns': state.map((s) => {\n        const items = s.items\n        if (items.length === 0) return undefined\n        return items.map((_, i) => itemId(i)).join(' ')\n      }),\n      'aria-multiselectable': state.map((s) =>\n        s.selectionMode === 'multiple' ? 'true' : undefined,\n      ),\n      'aria-disabled': state.map((s) => (s.disabled ? 'true' : undefined)),\n      'aria-activedescendant': state.map((s) => {\n        const idx = s.highlightedIndex\n        return idx === null ? undefined : itemId(idx)\n      }),\n      tabIndex: state.map((s) => (s.disabled ? -1 : 0)),\n      id: rootId,\n      'data-scope': 'listbox',\n      'data-part': 'root',\n      'data-disabled': state.map((s) => (s.disabled ? '' : undefined)),\n      onKeyDown: tagSend(\n        send,\n        [\n          'highlightNext',\n          'highlightPrev',\n          'highlightFirst',\n          'highlightLast',\n          'selectHighlighted',\n          'typeahead',\n        ],\n        (e) => {\n          switch (e.key) {\n            case 'ArrowDown':\n              e.preventDefault()\n              send({ type: 'highlightNext' })\n              return\n            case 'ArrowUp':\n              e.preventDefault()\n              send({ type: 'highlightPrev' })\n              return\n            case 'Home':\n              e.preventDefault()\n              send({ type: 'highlightFirst' })\n              return\n            case 'End':\n              e.preventDefault()\n              send({ type: 'highlightLast' })\n              return\n            case 'Enter':\n            case ' ':\n              e.preventDefault()\n              send({ type: 'selectHighlighted' })\n              return\n            default:\n              if (isTypeaheadKey(e)) {\n                send({ type: 'typeahead', char: e.key, now: Date.now() })\n              }\n          }\n        },\n      ),\n    },\n    item: (value: string, index: number): ListboxItemParts => ({\n      root: {\n        role: 'option',\n        id: itemId(index),\n        'aria-selected': state.map((s) => s.value.includes(value)),\n        'aria-disabled': state.map((s) => (s.disabledItems.includes(value) ? 'true' : undefined)),\n        'data-state': state.map((s) => (s.value.includes(value) ? 'selected' : undefined)),\n        'data-highlighted': state.map((s) => (s.highlightedIndex === index ? '' : undefined)),\n        'data-disabled': state.map((s) => (s.disabledItems.includes(value) ? '' : undefined)),\n        'data-scope': 'listbox',\n        'data-part': 'item',\n        'data-value': value,\n        'data-index': String(index),\n        onClick: tagSend(send, ['select'], () => send({ type: 'select', value })),\n        onPointerMove: tagSend(send, ['highlight'], () => send({ type: 'highlight', index })),\n      },\n    }),\n  }\n}\n\nexport const listbox = { init, update, connect }\n"]}

package/dist/components/marquee.d.ts

@@ -1,4 +1,4 @@
-import type { Send } from '@llui/dom';
+import type { Send, Signal } from '@llui/dom';
 /**
  * Marquee — continuously-scrolling content. The state machine tracks
  * play/pause + direction + speed; the scrolling itself is driven by CSS
@@ -69,15 +69,15 @@ export declare function update(state: MarqueeState, msg: MarqueeMsg): [MarqueeSt
 export declare function cssAnimationDirection(direction: MarqueeDirection): 'normal' | 'reverse';
 /** Returns 'horizontal' or 'vertical' based on direction. */
 export declare function axis(direction: MarqueeDirection): 'horizontal' | 'vertical';
-export interface MarqueeParts<S> {
+export interface MarqueeParts {
     root: {
         'data-scope': 'marquee';
         'data-part': 'root';
-        'data-running': (s: S) => '' | undefined;
-        'data-direction': (s: S) => MarqueeDirection;
-        'data-axis': (s: S) => 'horizontal' | 'vertical';
-        'data-disabled': (s: S) => '' | undefined;
-        style: (s: S) => string;
+        'data-running': Signal<'' | undefined>;
+        'data-direction': Signal<MarqueeDirection>;
+        'data-axis': Signal<'horizontal' | 'vertical'>;
+        'data-disabled': Signal<'' | undefined>;
+        style: Signal<string>;
         onMouseEnter: (e: MouseEvent) => void;
         onMouseLeave: (e: MouseEvent) => void;
     };
@@ -86,7 +86,7 @@ export interface MarqueeParts<S> {
         'data-part': 'content';
     };
 }
-export declare function connect<S>(get: (s: S) => MarqueeState, send: Send<MarqueeMsg>): MarqueeParts<S>;
+export declare function connect(state: Signal<MarqueeState>, send: Send<MarqueeMsg>): MarqueeParts;
 export declare const marquee: {
     init: typeof init;
     update: typeof update;

package/dist/components/marquee.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"marquee.d.ts","sourceRoot":"","sources":["../../src/components/marquee.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"marquee.d.ts","sourceRoot":"","sources":["../../src/components/marquee.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAE7C;;;;;;;;;;GAUG;AAEH,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,MAAM,CAAA;AAE/D,MAAM,WAAW,YAAY;IAC3B;;sCAEkC;IAClC,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,EAAE,gBAAgB,CAAA;IAC3B,6DAA6D;IAC7D,WAAW,EAAE,MAAM,CAAA;IACnB,YAAY,EAAE,OAAO,CAAA;IACrB,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,MAAM,MAAM,UAAU;AACpB,8CAA8C;AAC5C;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE;AAClB,6CAA6C;GAC3C;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE;AACnB,+DAA+D;GAC7D;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE;AACpB,iBAAiB;GACf;IAAE,IAAI,EAAE,YAAY,CAAA;CAAE;AACxB,iBAAiB;GACf;IAAE,IAAI,EAAE,aAAa,CAAA;CAAE;AACzB,kEAAkE;GAChE;IAAE,IAAI,EAAE,cAAc,CAAC;IAAC,SAAS,EAAE,gBAAgB,CAAA;CAAE;AACvD,uEAAuE;GACrE;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAA;AAEhD,MAAM,WAAW,WAAW;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,gBAAgB,CAAA;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,wBAAgB,IAAI,CAAC,IAAI,GAAE,WAAgB,GAAG,YAAY,CASzD;AAED,2DAA2D;AAC3D,wBAAgB,SAAS,CAAC,KAAK,EAAE,YAAY,GAAG,OAAO,CAItD;AAED,wBAAgB,MAAM,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,UAAU,GAAG,CAAC,YAAY,EAAE,KAAK,EAAE,CAAC,CAkBpF;AAED,wFAAwF;AACxF,wBAAgB,qBAAqB,CAAC,SAAS,EAAE,gBAAgB,GAAG,QAAQ,GAAG,SAAS,CAEvF;AAED,6DAA6D;AAC7D,wBAAgB,IAAI,CAAC,SAAS,EAAE,gBAAgB,GAAG,YAAY,GAAG,UAAU,CAE3E;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE;QACJ,YAAY,EAAE,SAAS,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,cAAc,EAAE,MAAM,CAAC,EAAE,GAAG,SAAS,CAAC,CAAA;QACtC,gBAAgB,EAAE,MAAM,CAAC,gBAAgB,CAAC,CAAA;QAC1C,WAAW,EAAE,MAAM,CAAC,YAAY,GAAG,UAAU,CAAC,CAAA;QAC9C,eAAe,EAAE,MAAM,CAAC,EAAE,GAAG,SAAS,CAAC,CAAA;QACvC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAA;QACrB,YAAY,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;QACrC,YAAY,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;KACtC,CAAA;IACD,OAAO,EAAE;QACP,YAAY,EAAE,SAAS,CAAA;QACvB,WAAW,EAAE,SAAS,CAAA;KACvB,CAAA;CACF;AAED,wBAAgB,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,GAAG,YAAY,CAyBzF;AAED,eAAO,MAAM,OAAO;;;;;;;CAAoE,CAAA"}

package/dist/components/marquee.js

@@ -45,21 +45,18 @@ export function cssAnimationDirection(direction) {
 export function axis(direction) {
     return direction === 'up' || direction === 'down' ? 'vertical' : 'horizontal';
 }
-export function connect(get, send) {
+export function connect(state, send) {
     return {
         root: {
             'data-scope': 'marquee',
             'data-part': 'root',
-            'data-running': (s) => (isRunning(get(s)) ? '' : undefined),
-            'data-direction': (s) => get(s).direction,
-            'data-axis': (s) => axis(get(s).direction),
-            'data-disabled': (s) => (get(s).disabled ? '' : undefined),
-            style: (s) => {
-                const st = get(s);
-                return (`--marquee-duration:${st.durationSec}s;` +
-                    `--marquee-direction:${cssAnimationDirection(st.direction)};` +
-                    `--marquee-playstate:${isRunning(st) ? 'running' : 'paused'};`);
-            },
+            'data-running': state.map((s) => (isRunning(s) ? '' : undefined)),
+            'data-direction': state.map((s) => s.direction),
+            'data-axis': state.map((s) => axis(s.direction)),
+            'data-disabled': state.map((s) => (s.disabled ? '' : undefined)),
+            style: state.map((st) => `--marquee-duration:${st.durationSec}s;` +
+                `--marquee-direction:${cssAnimationDirection(st.direction)};` +
+                `--marquee-playstate:${isRunning(st) ? 'running' : 'paused'};`),
             // Always fire hover messages; the reducer no-ops unless
             // state.pauseOnHover is true.
             onMouseEnter: tagSend(send, ['hoverPause'], () => send({ type: 'hoverPause' })),

package/dist/components/marquee.js.map

@@ -1 +1 @@
-{"version":3,"file":"marquee.js","sourceRoot":"","sources":["../../src/components/marquee.ts"],"names":[],"mappings":"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","sourcesContent":["import { tagSend } from '@llui/dom'\nimport type { Send } from '@llui/dom'\n\n/**\n * Marquee — continuously-scrolling content. The state machine tracks\n * play/pause + direction + speed; the scrolling itself is driven by CSS\n * animations or JS requestAnimationFrame (the consumer owns that).\n *\n * Expose the active state via CSS custom properties the consumer reads\n * in their stylesheet:\n *   --marquee-duration: {N}s\n *   --marquee-direction: 'normal' | 'reverse'\n *   --marquee-playstate: 'running' | 'paused'\n */\n\nexport type MarqueeDirection = 'left' | 'right' | 'up' | 'down'\n\nexport interface MarqueeState {\n  /** User-intended running state (what play/pause/toggle set). The actual\n   *  effective state is derived via `isRunning()` — it combines this with\n   *  `hovered` + `pauseOnHover`. */\n  running: boolean\n  direction: MarqueeDirection\n  /** Duration of one full loop in seconds. Larger = slower. */\n  durationSec: number\n  pauseOnHover: boolean\n  hovered: boolean\n  disabled: boolean\n}\n\nexport type MarqueeMsg =\n  /** @intent(\"Resume the marquee scrolling\") */\n  | { type: 'play' }\n  /** @intent(\"Pause the marquee scrolling\") */\n  | { type: 'pause' }\n  /** @intent(\"Toggle the marquee between playing and paused\") */\n  | { type: 'toggle' }\n  /** @humanOnly */\n  | { type: 'hoverPause' }\n  /** @humanOnly */\n  | { type: 'hoverResume' }\n  /** @intent(\"Change the scroll direction (left/right/up/down)\") */\n  | { type: 'setDirection'; direction: MarqueeDirection }\n  /** @intent(\"Change the loop duration in seconds (larger = slower)\") */\n  | { type: 'setDuration'; durationSec: number }\n\nexport interface MarqueeInit {\n  running?: boolean\n  direction?: MarqueeDirection\n  durationSec?: number\n  pauseOnHover?: boolean\n  disabled?: boolean\n}\n\nexport function init(opts: MarqueeInit = {}): MarqueeState {\n  return {\n    running: opts.running ?? true,\n    direction: opts.direction ?? 'left',\n    durationSec: opts.durationSec ?? 20,\n    pauseOnHover: opts.pauseOnHover ?? false,\n    hovered: false,\n    disabled: opts.disabled ?? false,\n  }\n}\n\n/** Derived: whether the marquee is currently animating. */\nexport function isRunning(state: MarqueeState): boolean {\n  if (!state.running || state.disabled) return false\n  if (state.pauseOnHover && state.hovered) return false\n  return true\n}\n\nexport function update(state: MarqueeState, msg: MarqueeMsg): [MarqueeState, never[]] {\n  if (state.disabled) return [state, []]\n  switch (msg.type) {\n    case 'play':\n      return [{ ...state, running: true }, []]\n    case 'pause':\n      return [{ ...state, running: false }, []]\n    case 'toggle':\n      return [{ ...state, running: !state.running }, []]\n    case 'hoverPause':\n      return [{ ...state, hovered: true }, []]\n    case 'hoverResume':\n      return [{ ...state, hovered: false }, []]\n    case 'setDirection':\n      return [{ ...state, direction: msg.direction }, []]\n    case 'setDuration':\n      return [{ ...state, durationSec: Math.max(0, msg.durationSec) }, []]\n  }\n}\n\n/** Returns 'normal' (left/up) or 'reverse' (right/down) for CSS animation-direction. */\nexport function cssAnimationDirection(direction: MarqueeDirection): 'normal' | 'reverse' {\n  return direction === 'right' || direction === 'down' ? 'reverse' : 'normal'\n}\n\n/** Returns 'horizontal' or 'vertical' based on direction. */\nexport function axis(direction: MarqueeDirection): 'horizontal' | 'vertical' {\n  return direction === 'up' || direction === 'down' ? 'vertical' : 'horizontal'\n}\n\nexport interface MarqueeParts<S> {\n  root: {\n    'data-scope': 'marquee'\n    'data-part': 'root'\n    'data-running': (s: S) => '' | undefined\n    'data-direction': (s: S) => MarqueeDirection\n    'data-axis': (s: S) => 'horizontal' | 'vertical'\n    'data-disabled': (s: S) => '' | undefined\n    style: (s: S) => string\n    onMouseEnter: (e: MouseEvent) => void\n    onMouseLeave: (e: MouseEvent) => void\n  }\n  content: {\n    'data-scope': 'marquee'\n    'data-part': 'content'\n  }\n}\n\nexport function connect<S>(get: (s: S) => MarqueeState, send: Send<MarqueeMsg>): MarqueeParts<S> {\n  return {\n    root: {\n      'data-scope': 'marquee',\n      'data-part': 'root',\n      'data-running': (s) => (isRunning(get(s)) ? '' : undefined),\n      'data-direction': (s) => get(s).direction,\n      'data-axis': (s) => axis(get(s).direction),\n      'data-disabled': (s) => (get(s).disabled ? '' : undefined),\n      style: (s) => {\n        const st = get(s)\n        return (\n          `--marquee-duration:${st.durationSec}s;` +\n          `--marquee-direction:${cssAnimationDirection(st.direction)};` +\n          `--marquee-playstate:${isRunning(st) ? 'running' : 'paused'};`\n        )\n      },\n      // Always fire hover messages; the reducer no-ops unless\n      // state.pauseOnHover is true.\n      onMouseEnter: tagSend(send, ['hoverPause'], () => send({ type: 'hoverPause' })),\n      onMouseLeave: tagSend(send, ['hoverResume'], () => send({ type: 'hoverResume' })),\n    },\n    content: {\n      'data-scope': 'marquee',\n      'data-part': 'content',\n    },\n  }\n}\n\nexport const marquee = { init, update, connect, isRunning, cssAnimationDirection, axis }\n"]}
+{"version":3,"file":"marquee.js","sourceRoot":"","sources":["../../src/components/marquee.ts"],"names":[],"mappings":"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","sourcesContent":["import { tagSend } from '@llui/dom'\nimport type { Send, Signal } from '@llui/dom'\n\n/**\n * Marquee — continuously-scrolling content. The state machine tracks\n * play/pause + direction + speed; the scrolling itself is driven by CSS\n * animations or JS requestAnimationFrame (the consumer owns that).\n *\n * Expose the active state via CSS custom properties the consumer reads\n * in their stylesheet:\n *   --marquee-duration: {N}s\n *   --marquee-direction: 'normal' | 'reverse'\n *   --marquee-playstate: 'running' | 'paused'\n */\n\nexport type MarqueeDirection = 'left' | 'right' | 'up' | 'down'\n\nexport interface MarqueeState {\n  /** User-intended running state (what play/pause/toggle set). The actual\n   *  effective state is derived via `isRunning()` — it combines this with\n   *  `hovered` + `pauseOnHover`. */\n  running: boolean\n  direction: MarqueeDirection\n  /** Duration of one full loop in seconds. Larger = slower. */\n  durationSec: number\n  pauseOnHover: boolean\n  hovered: boolean\n  disabled: boolean\n}\n\nexport type MarqueeMsg =\n  /** @intent(\"Resume the marquee scrolling\") */\n  | { type: 'play' }\n  /** @intent(\"Pause the marquee scrolling\") */\n  | { type: 'pause' }\n  /** @intent(\"Toggle the marquee between playing and paused\") */\n  | { type: 'toggle' }\n  /** @humanOnly */\n  | { type: 'hoverPause' }\n  /** @humanOnly */\n  | { type: 'hoverResume' }\n  /** @intent(\"Change the scroll direction (left/right/up/down)\") */\n  | { type: 'setDirection'; direction: MarqueeDirection }\n  /** @intent(\"Change the loop duration in seconds (larger = slower)\") */\n  | { type: 'setDuration'; durationSec: number }\n\nexport interface MarqueeInit {\n  running?: boolean\n  direction?: MarqueeDirection\n  durationSec?: number\n  pauseOnHover?: boolean\n  disabled?: boolean\n}\n\nexport function init(opts: MarqueeInit = {}): MarqueeState {\n  return {\n    running: opts.running ?? true,\n    direction: opts.direction ?? 'left',\n    durationSec: opts.durationSec ?? 20,\n    pauseOnHover: opts.pauseOnHover ?? false,\n    hovered: false,\n    disabled: opts.disabled ?? false,\n  }\n}\n\n/** Derived: whether the marquee is currently animating. */\nexport function isRunning(state: MarqueeState): boolean {\n  if (!state.running || state.disabled) return false\n  if (state.pauseOnHover && state.hovered) return false\n  return true\n}\n\nexport function update(state: MarqueeState, msg: MarqueeMsg): [MarqueeState, never[]] {\n  if (state.disabled) return [state, []]\n  switch (msg.type) {\n    case 'play':\n      return [{ ...state, running: true }, []]\n    case 'pause':\n      return [{ ...state, running: false }, []]\n    case 'toggle':\n      return [{ ...state, running: !state.running }, []]\n    case 'hoverPause':\n      return [{ ...state, hovered: true }, []]\n    case 'hoverResume':\n      return [{ ...state, hovered: false }, []]\n    case 'setDirection':\n      return [{ ...state, direction: msg.direction }, []]\n    case 'setDuration':\n      return [{ ...state, durationSec: Math.max(0, msg.durationSec) }, []]\n  }\n}\n\n/** Returns 'normal' (left/up) or 'reverse' (right/down) for CSS animation-direction. */\nexport function cssAnimationDirection(direction: MarqueeDirection): 'normal' | 'reverse' {\n  return direction === 'right' || direction === 'down' ? 'reverse' : 'normal'\n}\n\n/** Returns 'horizontal' or 'vertical' based on direction. */\nexport function axis(direction: MarqueeDirection): 'horizontal' | 'vertical' {\n  return direction === 'up' || direction === 'down' ? 'vertical' : 'horizontal'\n}\n\nexport interface MarqueeParts {\n  root: {\n    'data-scope': 'marquee'\n    'data-part': 'root'\n    'data-running': Signal<'' | undefined>\n    'data-direction': Signal<MarqueeDirection>\n    'data-axis': Signal<'horizontal' | 'vertical'>\n    'data-disabled': Signal<'' | undefined>\n    style: Signal<string>\n    onMouseEnter: (e: MouseEvent) => void\n    onMouseLeave: (e: MouseEvent) => void\n  }\n  content: {\n    'data-scope': 'marquee'\n    'data-part': 'content'\n  }\n}\n\nexport function connect(state: Signal<MarqueeState>, send: Send<MarqueeMsg>): MarqueeParts {\n  return {\n    root: {\n      'data-scope': 'marquee',\n      'data-part': 'root',\n      'data-running': state.map((s) => (isRunning(s) ? '' : undefined)),\n      'data-direction': state.map((s) => s.direction),\n      'data-axis': state.map((s) => axis(s.direction)),\n      'data-disabled': state.map((s) => (s.disabled ? '' : undefined)),\n      style: state.map(\n        (st) =>\n          `--marquee-duration:${st.durationSec}s;` +\n          `--marquee-direction:${cssAnimationDirection(st.direction)};` +\n          `--marquee-playstate:${isRunning(st) ? 'running' : 'paused'};`,\n      ),\n      // Always fire hover messages; the reducer no-ops unless\n      // state.pauseOnHover is true.\n      onMouseEnter: tagSend(send, ['hoverPause'], () => send({ type: 'hoverPause' })),\n      onMouseLeave: tagSend(send, ['hoverResume'], () => send({ type: 'hoverResume' })),\n    },\n    content: {\n      'data-scope': 'marquee',\n      'data-part': 'content',\n    },\n  }\n}\n\nexport const marquee = { init, update, connect, isRunning, cssAnimationDirection, axis }\n"]}