refactor: combobox, select, menu, tabs (#1431)

* chore: wip

* fix: typecheck

* fix: website

* refactor: ux refactor of combobox and related components

* fix: self target

* refactor: menu

* chore: update menu

* chore: update

* docs: add combobox change log

* chore: update

* docs: add typedocs

* fix: website search

* refactor: combobox

* fix: e2e

* refactor: loop -> loopFocus

* fix: e2e

* fix: typecheck and playground

* fix: typecheck

* fix: typecheck

* docs: add changeset

* chore: export and update changeset

.changeset/fluffy-cups-argue.md

@@ -0,0 +1,37 @@
+---
+"@zag-js/combobox": minor
+---
+
+- Add `open` and `open.controlled` property to programmatically control the combobox's open state
+
+- Add new `openOnChange` property to automatically open the combobox when the value changes. Value can be a boolean or a
+  function that returns a boolean.
+
+```jsx
+const [state, send] = useMachine(
+  combobox.machine({
+    // openOnChange: true,
+    openOnChange: ({ inputValue }) => inputValue.length > 2,
+  }),
+)
+```
+
+- Add new `openOnKeypress` property to automatically open the combobox when the arrow keys (up and down) are pressed.
+
+- Add `getSelectionValue` to the combobox's context to allow customizing the input value when an item is selected.
+
+```jsx
+const [state, send] = useMachine(
+  combobox.machine({
+    getSelectionValue({ inputValue, valueAsString }) {
+      return `${inputValue} ${valueAsString}`
+    },
+  }),
+)
+```
+
+- Add new `dismissable` property to determine whether to add the combobox content to the dismissable stack.
+
+- Add `popup` attribute to allow rendering the combobox has a select with input within the content.
+
+- Add `persistFocus` to the item props to determine whether to clear the highlighted item on pointer leave.

.changeset/four-snakes-wonder.md

@@ -0,0 +1,6 @@
+---
+"@zag-js/tags-input": minor
+---
+
+- Rename `allowTagEdit` to `editable`
+- Add `onInputValueChange` to machine context

.changeset/odd-rabbits-mate.md

@@ -0,0 +1,5 @@
+---
+"@zag-js/dialog": minor
+---
+
+Rename `closeOnEscapeKeyDown` to `closeOnEscape`

.changeset/pretty-schools-grab.md

@@ -0,0 +1,5 @@
+---
+"@zag-js/menu": minor
+---
+
+Focus first tabbable element when menu opens. To allow composition with combobox

.changeset/pretty-tips-juggle.md

@@ -0,0 +1,8 @@
+---
+"@zag-js/combobox": minor
+"@zag-js/select": minor
+"@zag-js/menu": minor
+"@zag-js/tabs": minor
+---
+
+Rename `loop` to `loopFocus` to better reflect its purpose

.changeset/sixty-ants-bow.md

@@ -0,0 +1,5 @@
+---
+"@zag-js/select": minor
+---
+
+Remove `selectOnBlur` to prevent accidental selection of options. Prefer explicit selection by user via click or enter key.

.changeset/tough-owls-tickle.md

@@ -0,0 +1,9 @@
+---
+"@zag-js/combobox": minor
+---
+
+- Fix issue where combobox could be composed with tags-input due to the way `selectedItems` and `valueAsString` was
+  computed
+- Remove `selectOnBlur` to prevent accidental selection of options. Prefer explicit selection by user via click or enter
+  key.
+- Update the details provided by `onInputValueChange` to from `details.value` to `details.inputValue`