{
+ DeesContextmenu.openContextMenuWithOptions(eventArg, [
+ {
+ name: 'About',
+ iconName: 'circleInfo',
+ action: async () => {
+ return null;
+ },
+ },
+ ]);
+ }}"
+ >
diff --git a/ts_web/elements/dees-icon.demo.ts b/ts_web/elements/dees-icon.demo.ts
new file mode 100644
index 0000000..c58db3c
--- /dev/null
+++ b/ts_web/elements/dees-icon.demo.ts
@@ -0,0 +1,55 @@
+import { html } from '@design.estate/dees-element';
+
+import { faIcons } from './dees-icon.js';
+
+export const demoFunc = () => html`
+
+
+
-
+ ${Object.keys(faIcons).map(
+ (iconName) => html`
+
+
+`;
diff --git a/ts_web/elements/dees-icon.ts b/ts_web/elements/dees-icon.ts
index fb9ae10..9053853 100644
--- a/ts_web/elements/dees-icon.ts
+++ b/ts_web/elements/dees-icon.ts
@@ -29,6 +29,7 @@ import {
faMessage as faMessageRegular,
faPaste as faPasteRegular,
faSun as faSunRegular,
+ faTrashCan as faTrashCanRegular,
} from '@fortawesome/free-regular-svg-icons';
import {
faArrowRight as faArrowRightSolid,
@@ -57,8 +58,11 @@ import {
faUsers as faUsersSolid,
faShare as faShareSolid,
faSun as faSunSolid,
+ faTrash as faTrashSolid,
+ faTrashCan as faTrashCanSolid,
faXmark as faXmarkSolid,
} from '@fortawesome/free-solid-svg-icons';
+import { demoFunc } from './dees-icon.demo.js';
export const faIcons = {
// normal
@@ -111,6 +115,11 @@ export const faIcons = {
shareSolid: faShareSolid,
sun: faSunRegular,
sunSolid: faSunSolid,
+ trash: faTrashSolid,
+ trashSolid: faTrashSolid,
+ trashCan: faTrashCanRegular,
+ trashCanSolid: faTrashCanSolid,
+ users: faUsersSolid,
xmark: faXmarkSolid,
xmarkSolid: faXmarkSolid,
// brands
@@ -122,7 +131,6 @@ export const faIcons = {
slack: faSlackHash,
tiktok: faTiktok,
twitter: faTwitter,
- users: faUsersSolid,
};
export type TIconKey = keyof typeof faIcons;
@@ -135,24 +143,7 @@ declare global {
@customElement('dees-icon')
export class DeesIcon extends DeesElement {
- public static demo = () => html`
-
+
+
+ `
+ )}
+ ${iconName}
+
-
-
-
-
-
-
-
- `;
+ public static demo = demoFunc;
@property({
type: String