diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/components/button-with-dropdown/button-with-dropdown.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/components/button-with-dropdown/button-with-dropdown.element.ts deleted file mode 100644 index c4db6b771a..0000000000 --- a/src/Umbraco.Web.UI.Client/src/packages/core/components/button-with-dropdown/button-with-dropdown.element.ts +++ /dev/null @@ -1,88 +0,0 @@ -import { - InterfaceColor, - InterfaceLook, - PopoverPlacement, - UUIPopoverElement, - UUISymbolExpandElement, -} from '@umbraco-cms/backoffice/external/uui'; -import { css, html, LitElement, customElement, property, query } from '@umbraco-cms/backoffice/external/lit'; - -// TODO: maybe this should go to UI library? It's a common pattern -// TODO: consider not using this, but instead use dropdown, which is more generic shared component of backoffice. (this is at the movement only used in Log Viewer) -@customElement('umb-button-with-dropdown') -export class UmbButtonWithDropdownElement extends LitElement { - @property() - label = ''; - - @property() - open = false; - - @property() - look: InterfaceLook = 'default'; - - @property() - color: InterfaceColor = 'default'; - - @property() - placement: PopoverPlacement = 'bottom-start'; - - @property({ type: Boolean }) - compact = false; - - @query('#symbol-expand') - symbolExpand!: UUISymbolExpandElement; - - @query('#popover') - popover!: UUIPopoverElement; - - openPopover() { - this.open = true; - this.popover.open = true; - this.symbolExpand.open = true; - } - - closePopover() { - this.open = false; - this.popover.open = false; - this.symbolExpand.open = false; - } - - #togglePopover() { - this.open ? this.closePopover() : this.openPopover(); - } - - render() { - return html` - - - - - -
- -
-
- `; - } - - static styles = [ - css` - uui-symbol-expand { - margin-left: var(--uui-size-space-3); - } - `, - ]; -} - -declare global { - interface HTMLElementTagNameMap { - 'umb-button-with-dropdown': UmbButtonWithDropdownElement; - } -} diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/components/button-with-dropdown/button-with-dropdown.stories.ts b/src/Umbraco.Web.UI.Client/src/packages/core/components/button-with-dropdown/button-with-dropdown.stories.ts deleted file mode 100644 index 7a52a8a1c9..0000000000 --- a/src/Umbraco.Web.UI.Client/src/packages/core/components/button-with-dropdown/button-with-dropdown.stories.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Meta, Story } from '@storybook/web-components'; -import { UmbButtonWithDropdownElement } from './button-with-dropdown.element.js'; -import { html } from '@umbraco-cms/backoffice/external/lit'; - -export default { - title: 'Components/Button with dropdown', - component: 'umb-button-with-dropdown', - id: 'umb-button-with-dropdown', -} as Meta; - -export const AAAOverview: Story = () => html` - Open me -
I am a dropdown
-
`; -AAAOverview.storyName = 'Overview'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/components/index.ts b/src/Umbraco.Web.UI.Client/src/packages/core/components/index.ts index afd973ce91..1fd80d6f7e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/components/index.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/components/index.ts @@ -3,7 +3,6 @@ export * from './backoffice-modal-container/backoffice-modal-container.element.js'; export * from './backoffice-notification-container/backoffice-notification-container.element.js'; export * from './body-layout/body-layout.element.js'; -export * from './button-with-dropdown/button-with-dropdown.element.js'; // TODO: delete this and change usage to umb-dropdown export * from './code-block/index.js'; export * from './input-date/index.js'; export * from './input-dropdown/index.js';