Skip to content

Commit

Permalink
feat(alerts): remove hello-goodbye
Browse files Browse the repository at this point in the history
Consumers can use auto-animate instead
  • Loading branch information
tobyzerner committed Nov 6, 2023
1 parent bb9b0ce commit 8e6583a
Show file tree
Hide file tree
Showing 2 changed files with 3 additions and 38 deletions.
21 changes: 0 additions & 21 deletions src/alerts/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -62,10 +62,6 @@ type AlertOptions = {
// If -1, the alert will not automatically disappear.
// If undefined, the default value will be used.
duration?: number;

// Whether or not to animate the alert in, using a hello-goodbye transition.
// Defaults to true.
animate?: boolean;
};

// The `key` and `duration` options can also be specified as [data-*] attributes
Expand All @@ -90,23 +86,6 @@ ui-alerts {
flex-direction: column-reverse;
align-items: flex-end;
}

/* Transitions can be applied to alerts using hello-goodbye */
@media (prefers-reduced-motion: no-preference) {
ui-alerts > .enter-active,
ui-alerts > .leave-active,
ui-alerts > .move {
transition: all 0.5s;
}

ui-alerts > .enter-from {
transform: translateY(-100%);
}

ui-alerts > .leave-to {
opacity: 0;
}
}
```

## Further Reading
Expand Down
20 changes: 3 additions & 17 deletions src/alerts/alerts.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,6 @@
import { hello, goodbye, move } from 'hello-goodbye';

export type AlertOptions = {
key?: string;
duration?: number;
animate?: boolean;
};

export default class AlertsElement extends HTMLElement {
Expand Down Expand Up @@ -42,7 +39,7 @@ export default class AlertsElement extends HTMLElement {
}

for (const child of this.children) {
this.show(child as HTMLElement, { animate: false });
this.show(child as HTMLElement);
}
}

Expand All @@ -54,16 +51,7 @@ export default class AlertsElement extends HTMLElement {
el.dataset.key = key;

if (!this.contains(el)) {
if (options.animate === false) {
this.append(el);
} else {
move(this.children, () => {
this.append(el);
hello(el);
});
}
} else {
hello(el);
this.append(el);
}

this.added.add(el);
Expand Down Expand Up @@ -105,9 +93,7 @@ export default class AlertsElement extends HTMLElement {

this.added.delete(elOrKey);

move(this.children, () =>
goodbye(elOrKey).then(() => elOrKey.remove())
);
elOrKey.remove();

this.clearTimeout(elOrKey);
}
Expand Down

0 comments on commit 8e6583a

Please sign in to comment.