DEV: use custom trigger for sidebar more section (#31285)

This uses the new `triggerComponent` functionality to implement a button
without the default `DButton` component classes, which helps themes
avoid applying unintentional styling.
This commit is contained in:
Kris 2025-02-11 15:46:37 -05:00 committed by GitHub
parent 24b2e353a4
commit 4dc47fae44
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 18 additions and 11 deletions

View File

@ -6,10 +6,9 @@ import { action } from "@ember/object";
import { service } from "@ember/service";
import { isEmpty } from "@ember/utils";
import DropdownMenu from "discourse/components/dropdown-menu";
import icon from "discourse/helpers/d-icon";
import { i18n } from "discourse-i18n";
import DMenu from "float-kit/components/d-menu";
import MoreSectionLink from "./more-section-link";
import MoreSectionTrigger from "./more-section-trigger";
import SectionLinkButton from "./section-link-button";
export default class SidebarMoreSectionLinks extends Component {
@ -84,21 +83,14 @@ export default class SidebarMoreSectionLinks extends Component {
<li class="sidebar-section-link-wrapper">
<DMenu
@triggerClass="btn-transparent sidebar-section-link sidebar-more-section-links-details-summary sidebar-row --link-button"
@triggerClass="sidebar-section-link sidebar-more-section-links-details-summary sidebar-row --link-button"
@modalForMobile={{true}}
@autofocus={{true}}
@placement="bottom"
@inline={{true}}
@identifier="sidebar-more-section"
@triggerComponent={{MoreSectionTrigger}}
>
<:trigger>
<span class="sidebar-section-link-prefix icon">
{{icon "ellipsis-vertical"}}
</span>
<span class="sidebar-section-link-content-text">
{{i18n "sidebar.more"}}
</span>
</:trigger>
<:content as |menu|>
<DropdownMenu as |dropdown|>

View File

@ -0,0 +1,15 @@
import icon from "discourse/helpers/d-icon";
import { i18n } from "discourse-i18n";
const MoreSectionTrigger = <template>
<button ...attributes type="button" class="sidebar-section-link sidebar-row">
<span class="sidebar-section-link-prefix icon">
{{icon "ellipsis-vertical"}}
</span>
<span class="sidebar-section-link-content-text">
{{i18n "sidebar.more"}}
</span>
</button>
</template>;
export default MoreSectionTrigger;