@refraction-ui/astro 0.17.0 → 0.17.2

package/dist/accordion/accordion.ts

@@ -0,0 +1,155 @@
+/**
+ * @refraction-ui/accordion — headless accordion (disclosure) state machine.
+ *
+ * Owns the *behavior* of an accordion: which item(s) are open, the single vs
+ * multiple expansion modes, and the collapsible toggle rule. It has NO UI
+ * opinion — React/Astro adapters subscribe to the store and render the parts.
+ */
+
+/** Expansion mode: one item open at a time, or any number. */
+export type AccordionType = 'single' | 'multiple'
+
+/** Open item id (`single`) or ids (`multiple`). */
+export type AccordionValue = string | string[]
+
+/** Options for {@link createAccordion}. */
+export interface AccordionConfig {
+  /** Expansion mode (default `'single'`). */
+  type?: AccordionType
+  /** When `type="single"`, allows the open item to be toggled fully closed. */
+  collapsible?: boolean
+  /** Controlled open item(s). Pair with `onValueChange`. */
+  value?: AccordionValue
+  /** Uncontrolled initial open item(s). */
+  defaultValue?: AccordionValue
+  /** Called whenever the open item(s) change. */
+  onValueChange?: (value: AccordionValue) => void
+}
+
+/** Snapshot of the store. Returned by `getState()`; treat as immutable. */
+export interface AccordionState {
+  type: AccordionType
+  collapsible: boolean
+  /** Current open item id (`single`) or ids (`multiple`). */
+  value: AccordionValue
+}
+
+/** The framework-agnostic store. React/Astro adapters wrap this. */
+export interface AccordionAPI {
+  /** Current immutable snapshot */
+  getState(): AccordionState
+  /** Subscribe to changes; returns an unsubscribe fn (suits useSyncExternalStore) */
+  subscribe(listener: () => void): () => void
+  /** Toggle an item open/closed per the type/collapsible rules */
+  toggleItem(itemValue: string): void
+  /** Whether an item is currently open */
+  isOpen(itemValue: string): boolean
+  /** Sync a controlled value into the store (adapters call when the prop changes) */
+  setValue(value: AccordionValue): void
+  /** Update options after creation (adapters keep props in sync) */
+  setOptions(options: {
+    type?: AccordionType
+    collapsible?: boolean
+    onValueChange?: (value: AccordionValue) => void
+  }): void
+}
+
+/** Pure open-state check shared by every adapter. */
+export function isItemOpen(state: AccordionState, itemValue: string): boolean {
+  return state.type === 'single'
+    ? state.value === itemValue
+    : Array.isArray(state.value) && state.value.includes(itemValue)
+}
+
+/** Shallow value equality (arrays compared item-by-item, order-sensitive). */
+function valueEquals(a: AccordionValue, b: AccordionValue): boolean {
+  if (Array.isArray(a) && Array.isArray(b)) {
+    return a.length === b.length && a.every((v, i) => v === b[i])
+  }
+  return a === b
+}
+
+/**
+ * createAccordion — headless accordion store.
+ *
+ * Supports controlled (`value`) and uncontrolled (`defaultValue`) usage.
+ * `single` mode holds one open item id (`''` when all closed); `multiple`
+ * holds an array of open ids. In `single` mode, re-toggling the open item
+ * closes it only when `collapsible` is set.
+ */
+export function createAccordion(config: AccordionConfig = {}): AccordionAPI {
+  let type: AccordionType = config.type ?? 'single'
+  let collapsible: boolean = config.collapsible ?? false
+  let onValueChange = config.onValueChange
+
+  let uncontrolledValue: AccordionValue =
+    config.defaultValue ?? (type === 'multiple' ? [] : '')
+  let controlledValue: AccordionValue | undefined = config.value
+
+  const listeners = new Set<() => void>()
+  let snapshot: AccordionState = buildSnapshot()
+
+  function currentValue(): AccordionValue {
+    return controlledValue !== undefined ? controlledValue : uncontrolledValue
+  }
+
+  function buildSnapshot(): AccordionState {
+    return { type, collapsible, value: currentValue() }
+  }
+
+  function emit(): void {
+    snapshot = buildSnapshot()
+    for (const l of listeners) l()
+  }
+
+  const api: AccordionAPI = {
+    getState() {
+      return snapshot
+    },
+
+    subscribe(listener) {
+      listeners.add(listener)
+      return () => listeners.delete(listener)
+    },
+
+    toggleItem(itemValue) {
+      const value = currentValue()
+      let next: AccordionValue
+      if (type === 'single') {
+        next = value === itemValue && collapsible ? '' : itemValue
+      } else {
+        const arrValue = Array.isArray(value) ? value : []
+        next = arrValue.includes(itemValue)
+          ? arrValue.filter((v) => v !== itemValue)
+          : [...arrValue, itemValue]
+      }
+      if (controlledValue === undefined) {
+        if (valueEquals(uncontrolledValue, next)) return
+        uncontrolledValue = next
+      }
+      onValueChange?.(next)
+      emit()
+    },
+
+    isOpen(itemValue) {
+      return isItemOpen(snapshot, itemValue)
+    },
+
+    setValue(value) {
+      if (controlledValue !== undefined && valueEquals(controlledValue, value)) return
+      controlledValue = value
+      emit()
+    },
+
+    setOptions(options) {
+      const prevType = type
+      const prevCollapsible = collapsible
+      if (options.type !== undefined) type = options.type
+      if (options.collapsible !== undefined) collapsible = options.collapsible
+      if (options.onValueChange !== undefined) onValueChange = options.onValueChange
+      if (type !== prevType || collapsible !== prevCollapsible) emit()
+    },
+  }
+
+  return api
+}

package/dist/accordion/index.ts

@@ -1 +1,9 @@
-export {}
+export { createAccordion, isItemOpen } from './accordion.js'
+
+export type {
+  AccordionType,
+  AccordionValue,
+  AccordionConfig,
+  AccordionState,
+  AccordionAPI,
+} from './accordion.js'

package/dist/analytics/analytics-manager.ts

@@ -64,6 +64,9 @@ export function createAnalytics(config: AnalyticsConfig): Analytics {
   const sampleRate = config.sampleRate ?? 1
   const batchSize = config.batchSize ?? 20
   const flushIntervalMs = config.flushIntervalMs ?? 10_000
+  // Injection boundary: ambient time/randomness default here; inject `now`/`random` for determinism.
+  const now = config.now ?? (() => new Date())
+  const random = config.random ?? (() => Math.random())
 
   const session = createSession(config.session)
   const identity = createIdentity(config.identity)
@@ -86,6 +89,8 @@ export function createAnalytics(config: AnalyticsConfig): Analytics {
       createHttpSink({
         endpoint: config.endpoint,
         writeKey: config.writeKey ?? '',
+        // One clock for the whole manager: the auto sink stamps sentAt with it too.
+        now,
       }),
     )
   }
@@ -203,7 +208,7 @@ export function createAnalytics(config: AnalyticsConfig): Analytics {
   function sampled(): boolean {
     if (sampleRate >= 1) return true
     if (sampleRate <= 0) return false
-    return Math.random() < sampleRate
+    return random() < sampleRate
   }
 
   function enqueue(ev: AnalyticsEvent): void {
@@ -238,7 +243,7 @@ export function createAnalytics(config: AnalyticsConfig): Analytics {
       userId: identity.userId(),
       sessionId,
       context: buildContext(opts?.context, childCtx),
-      timestamp: opts?.timestamp ?? new Date().toISOString(),
+      timestamp: opts?.timestamp ?? now().toISOString(),
       schemaVersion: SCHEMA_VERSION,
       ...fields,
     }

package/dist/analytics/http-sink.ts

@@ -113,6 +113,8 @@ export function createHttpSink(options: HttpSinkOptions): AnalyticsSink {
   const base = endpoint.replace(/\/+$/, '')
   const url = `${base}/v${SCHEMA_VERSION}/batch`
   const authHeader = `Basic ${base64(`${writeKey}:`)}`
+  // Injection boundary: `sentAt` defaults to ambient time; inject `now` for determinism.
+  const now = options.now ?? (() => new Date())
 
   const resolveFetch = (): typeof fetch => {
     if (options.fetchImpl) return options.fetchImpl
@@ -137,7 +139,7 @@ export function createHttpSink(options: HttpSinkOptions): AnalyticsSink {
   function envelope(batch: AnalyticsEvent[]) {
     return {
       batch,
-      sentAt: new Date().toISOString(),
+      sentAt: now().toISOString(),
       batchId: uuidv4(),
     }
   }

package/dist/analytics/types.ts

@@ -187,6 +187,8 @@ export interface HttpSinkOptions {
   maxBatchBytes?: number
   /** Soft per-event byte cap (Segment ≈ 32KB). Default 32_000. */
   maxEventBytes?: number
+  /** Clock for the batch `sentAt` stamp. Default: ambient `new Date()` — inject for deterministic tests. */
+  now?: () => Date
 }
 
 /** `createAnalytics` configuration. */
@@ -222,6 +224,10 @@ export interface AnalyticsConfig {
   batchSize?: number
   /** Auto-flush interval in ms (prod). Default 10_000. */
   flushIntervalMs?: number
+  /** Clock for default event timestamps. Default: ambient `new Date()` — inject for deterministic tests/SSR. */
+  now?: () => Date
+  /** RNG for sample-rate decisions. Default: ambient `Math.random` — inject for deterministic tests. */
+  random?: () => number
 }
 
 /** Options accepted by every top-level call. */

package/dist/astro-location-selector/LocationSelector.astro

@@ -0,0 +1,56 @@
+---
+import { createLocationSelector } from '../location-selector/index.ts'
+import { cn } from '../shared/index.ts'
+
+export interface Props {
+  defaultCountry?: string
+  defaultLanguage?: string
+  className?: string
+}
+
+const {
+  defaultCountry = 'US',
+  defaultLanguage = 'en',
+  className
+} = Astro.props
+
+const api = createLocationSelector({
+  defaultCountry,
+  defaultLanguage
+})
+---
+
+<div class={cn('flex flex-col gap-4 sm:flex-row', className)}>
+  <div class="flex flex-col gap-1.5 flex-1">
+    <label for={api.countryProps.id} class="text-sm font-medium">Country</label>
+    <select
+      id={api.countryProps.id}
+      name={api.countryProps.name}
+      class="flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+    >
+      {api.countries.map((c: any) => {
+        const value = c.code || c.id || c;
+        const label = c.name || c.label || c;
+        return (
+          <option value={value} selected={value === defaultCountry}>{label}</option>
+        )
+      })}
+    </select>
+  </div>
+  <div class="flex flex-col gap-1.5 flex-1">
+    <label for={api.languageProps.id} class="text-sm font-medium">Language</label>
+    <select
+      id={api.languageProps.id}
+      name={api.languageProps.name}
+      class="flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+    >
+      {api.languages.map((l: any) => {
+        const value = l.code || l.id || l;
+        const label = l.name || l.label || l;
+        return (
+          <option value={value} selected={value === defaultLanguage}>{label}</option>
+        )
+      })}
+    </select>
+  </div>
+</div>

package/dist/astro-location-selector/LocationSelector.stories.ts

@@ -0,0 +1,15 @@
+import Component from './LocationSelector.astro'
+
+const meta = {
+  title: 'Astro/LocationSelector',
+  component: Component,
+}
+
+export default meta
+
+export const Default = {
+  args: {
+    defaultCountry: 'Example defaultCountry',
+    defaultLanguage: 'Example defaultLanguage'
+  }
+}

package/dist/astro-location-selector/index.ts

@@ -0,0 +1 @@
+export { default as LocationSelector } from './LocationSelector.astro'

package/dist/calendar/calendar.ts

@@ -18,6 +18,8 @@ export interface CalendarProps {
   maxDate?: Date
   /** Specific dates to disable */
   disabledDates?: Date[]
+  /** Reference "today" for isToday/aria-current. Default: ambient `new Date()` — inject to avoid SSR/CSR hydration mismatch. */
+  today?: Date
 }
 
 export interface CalendarDay {
@@ -52,9 +54,9 @@ export interface CalendarAPI {
   /** Select a date */
   select(date: Date): void
   /** ARIA attributes for the calendar grid */
-  ariaProps: Partial<AccessibilityProps> & Record<string, unknown>
+  ariaProps: Partial<AccessibilityProps> & Record<string, string | number | boolean>
   /** Get ARIA attributes for a specific day cell */
-  getDayAriaProps(day: CalendarDay): Partial<AccessibilityProps> & Record<string, unknown>
+  getDayAriaProps(day: CalendarDay): Partial<AccessibilityProps> & Record<string, string | number | boolean>
   /** Generated IDs */
   ids: {
     grid: string
@@ -89,9 +91,11 @@ export function createCalendar(props: CalendarProps = {}): CalendarAPI {
     minDate,
     maxDate,
     disabledDates = [],
+    today: injectedToday,
   } = props
 
-  const today = new Date()
+  // Injection boundary: ambient "today" is the default; inject `today` so SSR and client agree.
+  const today = injectedToday ?? new Date()
 
   // Determine selected date
   const selectedDate = controlledValue ?? defaultValue
@@ -167,18 +171,19 @@ export function createCalendar(props: CalendarProps = {}): CalendarAPI {
     }
   }
 
-  const ariaProps: Partial<AccessibilityProps> & Record<string, unknown> = {
+  const ariaProps: Partial<AccessibilityProps> & Record<string, string | number | boolean> = {
     role: 'grid',
     'aria-labelledby': labelId,
     id: gridId,
   }
 
-  function getDayAriaProps(day: CalendarDay): Partial<AccessibilityProps> & Record<string, unknown> {
+  function getDayAriaProps(day: CalendarDay): Partial<AccessibilityProps> & Record<string, string | number | boolean> {
     return {
       role: 'gridcell',
       'aria-selected': day.isSelected,
       'aria-disabled': day.isDisabled,
-      'aria-current': day.isToday ? ('date' as const) : undefined,
+      // Key absent (not undefined) when not today — the ARIA record type excludes undefined.
+      ...(day.isToday ? { 'aria-current': 'date' as const } : {}),
       'aria-label': `${DAY_NAMES[day.date.getDay()]}, ${day.date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' })}`,
     }
   }

package/dist/call-controls/call-controls.ts

@@ -1,5 +1,3 @@
-import type { AccessibilityProps } from '../shared/index.ts'
-
 /** Visual/semantic tone of a call control button. */
 export type CallControlTone = 'default' | 'active' | 'destructive'
 
@@ -33,7 +31,7 @@ export interface CallControlsProps {
 
 export interface CallControlsAPI {
   /** ARIA attributes to spread on the toolbar element (`role="toolbar"`). */
-  ariaProps: Partial<AccessibilityProps>
+  ariaProps: Record<string, string | number | boolean>
   /** Data attributes for styling hooks. */
   dataAttributes: Record<string, string>
 }
@@ -66,7 +64,7 @@ export function controlTone(
  * attributes; adapters spread these onto their container element.
  */
 export function createCallControls(_props: CallControlsProps = {}): CallControlsAPI {
-  const ariaProps: Partial<AccessibilityProps> = {
+  const ariaProps: Record<string, string | number | boolean> = {
     role: 'toolbar',
     'aria-label': 'Call controls',
   }

package/dist/carousel/carousel.ts

@@ -0,0 +1,45 @@
+/**
+ * @refraction-ui/carousel — headless "carousel" store.
+ *
+ * Honest note: despite the name, this component is an expand/collapse panel
+ * set (an accordion in disguise) — that is the behavior the React adapter and
+ * the docs site demo (single/multiple open panels, collapsible toggles). The
+ * state machine is therefore shared with `@refraction-ui/accordion` rather
+ * than duplicated. A real slide-navigation carousel (active index, next/prev)
+ * would be a different core; this package keeps the shipped behavior.
+ */
+import {
+  createAccordion,
+  isItemOpen,
+  type AccordionAPI,
+  type AccordionConfig,
+  type AccordionState,
+  type AccordionType,
+  type AccordionValue,
+} from '../accordion/index.ts'
+
+/** Expansion mode: one item open at a time, or any number. */
+export type CarouselType = AccordionType
+
+/** Open item id (`single`) or ids (`multiple`). */
+export type CarouselValue = AccordionValue
+
+/** Options for {@link createCarousel}. Mirrors {@link AccordionConfig}. */
+export interface CarouselConfig extends AccordionConfig {}
+
+/** Snapshot of the store. Returned by `getState()`; treat as immutable. */
+export interface CarouselState extends AccordionState {}
+
+/** The framework-agnostic store. React/Astro adapters wrap this. */
+export type CarouselAPI = AccordionAPI
+
+/**
+ * createCarousel — headless expand/collapse panel store. This is the
+ * accordion state machine under the carousel name; see the package note.
+ */
+export function createCarousel(config: CarouselConfig = {}): CarouselAPI {
+  return createAccordion(config)
+}
+
+/** Pure open-state check shared by every adapter. */
+export { isItemOpen }

package/dist/carousel/index.ts

@@ -1 +1,9 @@
-export {}
+export { createCarousel, isItemOpen } from './carousel.js'
+
+export type {
+  CarouselType,
+  CarouselValue,
+  CarouselConfig,
+  CarouselState,
+  CarouselAPI,
+} from './carousel.js'

package/dist/command-input/command-input.ts

@@ -97,10 +97,10 @@ export class CommandInput {
       const matchedTrigger = this.options.triggers.find((t) => t.char === char);
 
       if (matchedTrigger) {
-        const isStartOfWord = i === 0 || /\\s/.test(rawText[i - 1]);
+        const isStartOfWord = i === 0 || /\s/.test(rawText[i - 1]);
         if (isStartOfWord) {
           const commandText = rawText.slice(i + 1, cursorPosition);
-          if (!/\\s/.test(commandText)) {
+          if (!/\s/.test(commandText)) {
             let isValid = true;
             if (matchedTrigger.pattern) {
               isValid = matchedTrigger.pattern.test(commandText);
@@ -118,7 +118,7 @@ export class CommandInput {
         break;
       }
       
-      if (/\\s/.test(char)) {
+      if (/\s/.test(char)) {
         break;
       }
     }
@@ -130,8 +130,8 @@ export class CommandInput {
       return;
     }
 
-    const triggerChars = this.options.triggers.map((t) => t.char.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&'));
-    const patternStr = `(^|\\\\s)(${triggerChars.join('|')})([^\\\\s]*)`;
+    const triggerChars = this.options.triggers.map((t) => t.char.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'));
+    const patternStr = `(^|\\s)(${triggerChars.join('|')})([^\\s]*)`;
     const regex = new RegExp(patternStr, 'g');
     
     let currentIndex = 0;

package/dist/conversation/conversation.ts

@@ -33,6 +33,8 @@ export function createConversation(config: ConversationConfig = {}): Conversatio
   const assistant = config.assistant ?? DEFAULT_ASSISTANT
   const currentUser = config.currentUser ?? DEFAULT_USER
   const generateTitle = config.generateTitle ?? defaultGenerateTitle
+  // Injection boundary: ambient time is the default; inject `now` for deterministic timestamps.
+  const now = config.now ?? (() => new Date())
 
   let transport = config.transport
   let threadingMode: ThreadingMode = config.threadingMode ?? 'inline'
@@ -87,7 +89,7 @@ export function createConversation(config: ConversationConfig = {}): Conversatio
 
   function touch(conversationId: string): void {
     const c = conversations.get(conversationId)
-    if (c) conversations.set(conversationId, { ...c, updatedAt: new Date() })
+    if (c) conversations.set(conversationId, { ...c, updatedAt: now() })
   }
 
   function ensureActiveConversation(opts?: SendOptions): string {
@@ -103,12 +105,12 @@ export function createConversation(config: ConversationConfig = {}): Conversatio
     opts: { title?: string; metadata?: Record<string, unknown> },
     id?: string,
   ): Conversation {
-    const now = new Date()
+    const timestamp = now()
     const conversation: Conversation = {
       id: id ?? generateId('rfr-conv'),
       title: opts.title ?? DEFAULT_TITLE,
-      createdAt: now,
-      updatedAt: now,
+      createdAt: timestamp,
+      updatedAt: timestamp,
       metadata: opts.metadata,
     }
     conversations.set(conversation.id, conversation)
@@ -294,7 +296,7 @@ export function createConversation(config: ConversationConfig = {}): Conversatio
         role: 'user',
         author: currentUser,
         content: trimmed,
-        timestamp: new Date(),
+        timestamp: now(),
         status: 'sent',
         parentId,
         replyToId,
@@ -323,7 +325,7 @@ export function createConversation(config: ConversationConfig = {}): Conversatio
         role: 'assistant',
         author: assistant,
         content: '',
-        timestamp: new Date(),
+        timestamp: now(),
         status: 'streaming',
         parentId,
       }
@@ -350,7 +352,7 @@ export function createConversation(config: ConversationConfig = {}): Conversatio
         role: 'assistant',
         author: assistant,
         content: '',
-        timestamp: new Date(),
+        timestamp: now(),
         status: 'streaming',
         parentId,
       }

package/dist/conversation/types.ts

@@ -170,6 +170,8 @@ export interface ConversationConfig {
   generateTitle?: (firstMessage: string) => string
   /** Threading mode (default 'inline') */
   threadingMode?: ThreadingMode
+  /** Clock for conversation/message timestamps. Default: ambient `new Date()` — inject for deterministic SSR/tests. */
+  now?: () => Date
 }
 
 /** Options for a single `sendMessage`. */

package/dist/date-picker/date-picker.ts

@@ -26,6 +26,8 @@ export interface DatePickerProps {
   onOpenChange?: (open: boolean) => void
   /** The currently displayed month (controlled) */
   currentMonth?: Date
+  /** Reference "today" for isToday/aria-current and time defaults. Default: ambient `new Date()` — inject to avoid SSR/CSR hydration mismatch. */
+  today?: Date
 }
 
 export interface DatePickerState {
@@ -149,7 +151,8 @@ export function createDatePicker(props: DatePickerProps = {}): DatePickerAPI {
     onOpenChange,
   } = props
 
-  const today = new Date()
+  // Injection boundary: ambient "today" is the default; inject `today` so SSR and client agree.
+  const today = props.today ?? new Date()
   let internalOpen = controlledOpen ?? defaultOpen
   let currentMonth = props.currentMonth ?? (value ? startOfMonth(value) : startOfMonth(today))
   let view: DatePickerView = 'calendar'
@@ -230,14 +233,14 @@ export function createDatePicker(props: DatePickerProps = {}): DatePickerAPI {
 
   function setHours(h: number): void {
     if (h < 0 || h > 23) return
-    const newDate = value ? new Date(value) : new Date()
+    const newDate = value ? new Date(value) : new Date(today.getTime())
     newDate.setHours(h)
     onChange?.(newDate)
   }
 
   function setMinutes(m: number): void {
     if (m < 0 || m > 59) return
-    const newDate = value ? new Date(value) : new Date()
+    const newDate = value ? new Date(value) : new Date(today.getTime())
     newDate.setMinutes(m)
     onChange?.(newDate)
   }

package/dist/device-frame/device-frame.ts

@@ -1,5 +1,3 @@
-import type { AccessibilityProps } from '../shared/index.ts'
-
 export type DeviceType = 'iphone' | 'ipad' | 'android-phone' | 'android-tablet'
 export type DeviceOrientation = 'portrait' | 'landscape'
 
@@ -27,7 +25,7 @@ export interface DeviceFrameAPI {
   /** Computed dimensions for the device */
   dimensions: DeviceDimensions
   /** ARIA attributes for the device frame */
-  ariaProps: Partial<AccessibilityProps> & Record<string, unknown>
+  ariaProps: Record<string, string | number | boolean>
   /** Data attributes for styling hooks */
   dataAttributes: Record<string, string>
 }
@@ -92,7 +90,7 @@ export function createDeviceFrame(props: DeviceFrameProps): DeviceFrameAPI {
     homeIndicator: spec.homeIndicator,
   }
 
-  const ariaProps: Partial<AccessibilityProps> & Record<string, unknown> = {
+  const ariaProps: Record<string, string | number | boolean> = {
     role: 'img',
     'aria-label': `${DEVICE_LABELS[device]} device frame in ${orientation} orientation`,
   }

package/dist/emoji-picker/emoji-picker.ts

@@ -1,4 +1,3 @@
-import type { AccessibilityProps } from '../shared/index.ts'
 import { generateId } from '../shared/index.ts'
 import {
   EMOJI_DATA,
@@ -39,7 +38,7 @@ export interface EmojiPickerAPI {
   /** Category tabs with labels */
   categoryTabs: { category: EmojiCategory; label: string; emoji: string }[]
   /** ARIA props for the picker container */
-  ariaProps: Partial<AccessibilityProps> & Record<string, unknown>
+  ariaProps: Record<string, string | number | boolean>
   /** ARIA props for the search input */
   searchInputProps: Record<string, unknown>
   /** Get ARIA props for an emoji button */
@@ -118,7 +117,7 @@ export function createEmojiPicker(props: EmojiPickerProps = {}): EmojiPickerAPI
     emoji: CATEGORY_ICONS[cat],
   }))
 
-  const ariaProps: Partial<AccessibilityProps> & Record<string, unknown> = {
+  const ariaProps: Record<string, string | number | boolean> = {
     role: 'dialog',
     'aria-labelledby': labelId,
     id: containerId,

package/dist/footer/footer.ts

@@ -13,6 +13,8 @@ export interface FooterProps {
   copyright?: string
   socialLinks?: SocialLink[]
   columns?: FooterColumn[]
+  /** Year for the default copyrightText. Default: ambient current year — inject to avoid year-boundary SSR/CSR mismatch. */
+  year?: number
 }
 
 export interface FooterAPI {
@@ -22,7 +24,8 @@ export interface FooterAPI {
 
 export function createFooter(props: FooterProps = {}): FooterAPI {
   const { copyright } = props
-  const year = new Date().getFullYear()
+  // Injection boundary: ambient year is the default; inject `year` so SSR and client agree.
+  const year = props.year ?? new Date().getFullYear()
   const copyrightText = copyright ?? `© ${year} All rights reserved.`
 
   return {