@ark-ui/vue@3.3.1

Fixed

• Combobox: Exported missing ComboboxList component.

@ark-ui/solid@3.2.2

Fixed

• Combobox: Exported missing ComboboxList component.

@ark-ui/react@3.2.1

Fixed

• Combobox: Exported missing ComboboxList component.

@ark-ui/vue@3.3.0

Added

• All Components: Introduced the Provider component for easier access to internal machine
  APIs, improving component composition. See the example below:

<script setup lang="ts">
import { Avatar, useAvatar } from '@ark-ui/vue'

const avatar = useAvatar({
  onStatusChange: (e) => console.log('status changed', e),
})
</script>

<template>
  <Avatar.RootProvider :value="avatar">
    <Avatar.Fallback>PA</Avatar.Fallback>
    <Avatar.Image src="https://i.pravatar.cc/3000" alt="avatar" />
  </Avatar.RootProvider>
</template>

@ark-ui/solid@3.2.1

Fixed

• Resolved an issue where the component context could be undefined in some components.

@ark-ui/solid@3.2.0

Added

• All Components: Introduced the Provider component for easier access to internal machine
  APIs, improving component composition. See the example below:

import { Avatar, useAvatar } from '@ark-ui/solid'

export const Example = () => {
  const avatar = useAvatar({
    onStatusChange: (e) => console.log('status changed', e),
  })

  return (
    <Avatar.RootProvider value={avatar}>
      <Avatar.Fallback>PA</Avatar.Fallback>
      <Avatar.Image src="https://i.pravatar.cc/300" alt="avatar" />
    </Avatar.RootProvider>
  )
}

@ark-ui/react@3.2.0

Added

• All Components: Introduced the Provider component for easier access to internal machine
  APIs, improving component composition. See the example below:

import { Avatar, useAvatar } from '@ark-ui/react'

export const Provider = () => {
  const avatar = useAvatar({
    onStatusChange: (e) => console.log('status changed', e),
  })

  return (
    <Avatar.RootProvider value={avatar}>
      <Avatar.Fallback>PA</Avatar.Fallback>
      <Avatar.Image src="https://i.pravatar.cc/300" alt="avatar" />
    </Avatar.RootProvider>
  )
}

@ark-ui/vue@3.2.0

Added

• Select, Combobox: Added support for generics.

You can now use generics with Select and Combobox components to ensure type safety and improved development experience.

<script setup lang="ts">
import { Combobox } from '@ark-ui/vue'
import { ref } from 'vue'

interface Pokemon {
  id: string
  name: string
  url: string
}

const items = ref<Pokemon[]>([])
</script>

<template>
  <Combobox.Root 
    :items="items" 
    :item-to-value="(item) => item.id"  
    @highlight-change="e => console.log(e.highlightedItem?.name)"
  />
</template>

@ark-ui/vue@3.1.0

Added

• Editable: Supported textarea as the input element in edit mode.

Fixed

• Select: Fixed an issue where changing the label of a collection item did not trigger a change
  event.
• Popover:
  • Implemented autoFocus to determine whether the popover should autofocus on open:
    • When true, the first focusable element or the content is focused.
    • When false, the content is focused.
  • Fixed an issue where the page scroll resets on opening the popover.

@ark-ui/solid@3.1.0

Added

• Editable: Supported textarea as the input element in edit mode.

Fixed

• Fixed an issue where spreading readOnly: false adds the readonly attribute on editable
  elements, making them uneditable.

• Factory: Fixed an issue where the ark factory was incorretly adding the parent ref to the
  child component.

• Select: Fixed an issue where changing the label of a collection item did not trigger a change
  event.

• Popover:

  • Implemented autoFocus to determine whether the popover should autofocus on open:
    • When true, the first focusable element or the content is focused.
    • When false, the content is focused.
  • Fixed an issue where the page scroll resets on opening the popover.

• DatePicker: Fixed an issue in range mode where calendar close unexpectedly when hovering on a
  day quickly.