I'm trying to create a custom UserSelect component that extends Select and needs to add a data-state-path attribute to the wrapper element for JavaScript interaction.
The problem: When I try to access $this->getStatePath() in setUp() or in a closure passed to extraAttributes(), I get:
Typed property Filament\Schemas\Components\Component::$container must not be accessed before initialization
What I've tried:
class UserSelect extends Select
{
protected function setUp(): void
{
parent::setUp();
// Attempt 1: Direct - fails during setUp
$this->extraAttributes([
'data-state-path' => $this->getStatePath(), // Error: container not initialized
]);
// Attempt 2: Closure - still fails
$this->extraAttributes(function () {
return [
'data-state-path' => $this->getStatePath(), // Same error
];
});
}
}
What I need: A way to add data-state-path="{statePath}" to the component's wrapper div so JavaScript can read it.
Use case: I'm building a paste handler that intercepts paste events on multi-select user fields and needs to know the state path to call a Livewire method that updates the field's value.
Is there a lifecycle hook or method that runs after the container is initialized where I can safely access getStatePath()? Or is there a different approach for this in v4?