Skip to content
Snippets Groups Projects
Commit 23ec1570 authored by OZGCloud's avatar OZGCloud
Browse files

OZG-6102 rename popup button selector

parent 75b01026
Branches
Tags
No related merge requests found
...@@ -9,7 +9,6 @@ import { twMerge } from 'tailwind-merge'; ...@@ -9,7 +9,6 @@ import { twMerge } from 'tailwind-merge';
imports: [CommonModule, CdkTrapFocus], imports: [CommonModule, CdkTrapFocus],
template: `<div class="relative w-fit"> template: `<div class="relative w-fit">
<button <button
class="w-fit outline-2 outline-offset-2 outline-focus"
[ngClass]="[twMerge('w-fit outline-2 outline-offset-2 outline-focus', buttonClass)]" [ngClass]="[twMerge('w-fit outline-2 outline-offset-2 outline-focus', buttonClass)]"
(click)="togglePopup()" (click)="togglePopup()"
[attr.aria-expanded]="isPopupOpen" [attr.aria-expanded]="isPopupOpen"
...@@ -18,11 +17,11 @@ import { twMerge } from 'tailwind-merge'; ...@@ -18,11 +17,11 @@ import { twMerge } from 'tailwind-merge';
data-test-id="popup-button" data-test-id="popup-button"
#button #button
> >
<ng-content select="[button]" /> <ng-content select="[button-content]" />
</button> </button>
<ul <ul
*ngIf="isPopupOpen" *ngIf="isPopupOpen"
class="max-h-120 animate-fadeIn absolute min-w-44 max-w-80 overflow-y-auto rounded shadow-lg shadow-grayborder focus:outline-none" class="absolute max-h-120 min-w-44 max-w-80 animate-fadeIn overflow-y-auto rounded shadow-lg shadow-grayborder focus:outline-none"
[ngClass]="alignTo === 'left' ? 'right-0' : 'left-0'" [ngClass]="alignTo === 'left' ? 'right-0' : 'left-0'"
role="dialog" role="dialog"
aria-modal="true" aria-modal="true"
......
...@@ -43,7 +43,7 @@ export const Default: Story = { ...@@ -43,7 +43,7 @@ export const Default: Story = {
render: (args) => ({ render: (args) => ({
props: args, props: args,
template: `<ods-popup ${argsToTemplate(args)}> template: `<ods-popup ${argsToTemplate(args)}>
<ods-user-icon button /> <ods-user-icon button-content />
<ods-popup-list-item caption="Lorem" /> <ods-popup-list-item caption="Lorem" />
<ods-popup-list-item caption="Ipsum" /> <ods-popup-list-item caption="Ipsum" />
<ods-popup-list-item caption="Dolor" /> <ods-popup-list-item caption="Dolor" />
...@@ -55,7 +55,7 @@ export const LongText: Story = { ...@@ -55,7 +55,7 @@ export const LongText: Story = {
render: (args) => ({ render: (args) => ({
props: args, props: args,
template: `<ods-popup ${argsToTemplate(args)}> template: `<ods-popup ${argsToTemplate(args)}>
<p button>Trigger popup</p> <p button-content>Trigger popup</p>
<ods-popup-list-item caption="Lorem" /> <ods-popup-list-item caption="Lorem" />
<ods-popup-list-item caption="Lorem ipsum dolor sit amet" /> <ods-popup-list-item caption="Lorem ipsum dolor sit amet" />
</ods-popup>`, </ods-popup>`,
...@@ -66,7 +66,7 @@ export const ItemsWithIcons: Story = { ...@@ -66,7 +66,7 @@ export const ItemsWithIcons: Story = {
render: (args) => ({ render: (args) => ({
props: args, props: args,
template: `<ods-popup ${argsToTemplate(args)}> template: `<ods-popup ${argsToTemplate(args)}>
<p button>Trigger popup</p> <p button-content>Trigger popup</p>
<ods-popup-list-item caption="Lorem"> <ods-popup-list-item caption="Lorem">
<ods-save-icon icon size="small" /> <ods-save-icon icon size="small" />
</ods-popup-list-item> </ods-popup-list-item>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment