Why Alpine Headless component Disclosure doesn't have 'open()' function ?

[joffreypersia]

Hi,

I am reading the doc here: https://alpinejs.dev/component/headless-disclosure/docs
and I don't understand why there are only two properties :

isOpen | A boolean used to determine whether or not the disclosure is currently open
close | A method used to programatically close the disclosure

I would be interested to have an open(), too. I was forced to rewrite the function by hand and never use the disclosure element properly because of the lack of properties.

Like having a default state Open or Close at load (to avoid the transition of opening the disclosure when the page loads) and having the possibility to open or close a disclosure with JS without simulating a dumb click.

Why Caleb? 😅

[ekwoka]

You can use model on it to sync it with an external value.

It is curious that open and toggle aren't exposed.

[joffreypersia]

Thank you @ekwoka but I am not sure how it can solve my problem. Maybe can you give me an example ? Thank you

[ekwoka]

sure. This would default to open and have separate controls.

<div x-data="{ isOpen: true }">
  <div x-disclosure x-model="isOpen">
    <button @click="isOpen = false">close</button>
    <button @click="isOpen = true">open</button>
  </div>
 </div>

(lots of things missing, just to demonstrate the use of x-model)