diff --git a/packages/components/src/components/button/component.tsx b/packages/components/src/components/button/component.tsx index 6cb75dc08e..68046e0f6c 100644 --- a/packages/components/src/components/button/component.tsx +++ b/packages/components/src/components/button/component.tsx @@ -44,7 +44,7 @@ import { import type { JSX } from '@stencil/core'; import { Component, Element, h, Host, Method, Prop, State, Watch } from '@stencil/core'; -import { stopPropagation, tryToDispatchKoliBriEvent } from '../../utils/events'; +import { /* stopPropagation, */ tryToDispatchKoliBriEvent } from '../../utils/events'; import { nonce } from '../../utils/dev.utils'; import { propagateResetEventToForm, propagateSubmitEventToForm } from '../form/controller'; import { AssociatedInputController } from '../input-adapter-leanup/associated.controller'; @@ -86,17 +86,21 @@ export class KolButtonWc implements ButtonAPI, FocusableElement { }); } else { // Event handling - stopPropagation(event); - tryToDispatchKoliBriEvent('click', this.host, this.state._value); - - // TODO: Static form handling - this.controller.setFormAssociatedValue(this.state._value); - - // Callback - if (typeof this.state._on?.onClick === 'function') { - setEventTarget(event, this.buttonRef); - this.state._on?.onClick(event, this.state._value); - } + // stopPropagation(event); + + setTimeout(() => { + tryToDispatchKoliBriEvent('click', this.host, this.state._value); + + // TODO: Static form handling + this.controller.setFormAssociatedValue(this.state._value); + + // Callback + if (typeof this.state._on?.onClick === 'function') { + setEventTarget(event, this.buttonRef); + this.state._on?.onClick(event, this.state._value); + } + }, 10) + } }; diff --git a/packages/samples/react/src/components/split-button/basic.tsx b/packages/samples/react/src/components/split-button/basic.tsx index 8da3935adf..cebeebf3b3 100644 --- a/packages/samples/react/src/components/split-button/basic.tsx +++ b/packages/samples/react/src/components/split-button/basic.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { ToasterService } from '@public-ui/components'; -import { KolSplitButton } from '@public-ui/react'; +import { KolButton, KolInputText, KolSplitButton } from '@public-ui/react'; import { SampleDescription } from '../SampleDescription'; import type { FC } from 'react'; @@ -32,6 +32,9 @@ export const SplitButtonBasic: FC = () => { Dropdown-Inhalt + + + );