diff --git a/ts_web/00_commitinfo_data.ts b/ts_web/00_commitinfo_data.ts
index 467038a..2aae417 100644
--- a/ts_web/00_commitinfo_data.ts
+++ b/ts_web/00_commitinfo_data.ts
@@ -3,6 +3,6 @@
*/
export const commitinfo = {
name: '@design.estate/dees-catalog',
- version: '1.0.228',
+ version: '1.0.229',
description: 'website for lossless.com'
}
diff --git a/ts_web/elements/dees-chips.demo.ts b/ts_web/elements/dees-chips.demo.ts
index 86bec92..235f955 100644
--- a/ts_web/elements/dees-chips.demo.ts
+++ b/ts_web/elements/dees-chips.demo.ts
@@ -1,28 +1,40 @@
import { html } from '@design.estate/dees-element';
export const demoFunc = () => html`
-
-
-
+
+
+
+
+
+
`;
diff --git a/ts_web/elements/dees-chips.ts b/ts_web/elements/dees-chips.ts
index d6a1bd6..6f7af50 100644
--- a/ts_web/elements/dees-chips.ts
+++ b/ts_web/elements/dees-chips.ts
@@ -70,9 +70,10 @@ export class DeesChips extends DeesElement {
color: #fff;
border-radius: 40px;
margin-right: 4px;
- margin-bottom: 8px;
+ margin-bottom: 4px;
position: relative;
overflow: hidden;
+ box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
}
.chip:hover {
diff --git a/ts_web/elements/dees-contextmenu.ts b/ts_web/elements/dees-contextmenu.ts
index 2df56ff..bffcd1d 100644
--- a/ts_web/elements/dees-contextmenu.ts
+++ b/ts_web/elements/dees-contextmenu.ts
@@ -27,7 +27,42 @@ export class DeesContextmenu extends DeesElement {
public static demo = demoFunc
// STATIC
+ // This will store all the accumulated menu items
+ public static contextMenuDeactivated = false;
+ public static accumulatedMenuItems: plugins.tsclass.website.IMenuItem[] = [];
+
+ // Add a global event listener for the right-click context menu
+ public static initializeGlobalListener() {
+ document.addEventListener('contextmenu', (event: MouseEvent) => {
+ if (this.contextMenuDeactivated) {
+ return;
+ }
+ event.preventDefault();
+
+ // Get the target element of the right-click
+ let target: EventTarget | null = event.target;
+
+ // Clear previously accumulated items
+ DeesContextmenu.accumulatedMenuItems = [];
+
+ // Traverse up the DOM tree to accumulate menu items
+ while (target) {
+ if ((target as any).getContextMenuItems) {
+ DeesContextmenu.accumulatedMenuItems.push(...(target as any).getContextMenuItems());
+ }
+ target = (target as Node).parentNode;
+ }
+
+ // Open the context menu with the accumulated items
+ DeesContextmenu.openContextMenuWithOptions(event, DeesContextmenu.accumulatedMenuItems);
+ });
+ }
+
+ // allows opening of a contextmenu with options
public static async openContextMenuWithOptions(eventArg: MouseEvent, menuItemsArg: plugins.tsclass.website.IMenuItem[]) {
+ if (this.contextMenuDeactivated) {
+ return;
+ }
eventArg.preventDefault();
eventArg.stopPropagation();
const contextMenu = new DeesContextmenu();
@@ -49,6 +84,7 @@ export class DeesContextmenu extends DeesElement {
contextMenu.style.transform = 'scale(1,1)';
}
+ // INSTANCE
@property({
type: Array,
})
@@ -59,6 +95,9 @@ export class DeesContextmenu extends DeesElement {
super();
}
+ /**
+ * STATIC STYLES
+ */
public static styles = [
cssManager.defaultStyles,
css`
@@ -115,10 +154,11 @@ export class DeesContextmenu extends DeesElement {
})}
${this.menuItems.length === 0 ? html`
` : html``}
@@ -144,3 +184,5 @@ export class DeesContextmenu extends DeesElement {
this.parentElement.removeChild(this);
}
}
+
+DeesContextmenu.initializeGlobalListener();
diff --git a/ts_web/elements/dees-table.ts b/ts_web/elements/dees-table.ts
index 2ae3e7f..90713f8 100644
--- a/ts_web/elements/dees-table.ts
+++ b/ts_web/elements/dees-table.ts
@@ -61,8 +61,8 @@ export interface ITableAction {
}
export interface ITableActionDataArg {
- item: T,
- table: DeesTable,
+ item: T;
+ table: DeesTable;
}
export type TDisplayFunction = (itemArg: T) => object;
@@ -396,6 +396,8 @@ export class DeesTable extends DeesElement {
+
+
${this.data.length > 0
@@ -524,10 +526,11 @@ export class DeesTable extends DeesElement {
${this.getActionsForType('inRow').map(
(actionArg) => html` actionArg.actionFunc({
- item: itemArg,
- table: this,
- })}
+ @click=${() =>
+ actionArg.actionFunc({
+ item: itemArg,
+ table: this,
+ })}
>
${actionArg.iconName
? html`
@@ -584,8 +587,7 @@ export class DeesTable extends DeesElement {
`;
}
- public async firstUpdated() {
- }
+ public async firstUpdated() {}
public async updated(changedProperties: Map): Promise {
super.updated(changedProperties);
@@ -609,7 +611,8 @@ export class DeesTable extends DeesElement {
// Get computed width
const width = window.getComputedStyle(cell).width;
if (cell.textContent.includes('Actions')) {
- const neededWidth = this.dataActions.filter(actionArg => actionArg.type.includes('inRow')).length * 35;
+ const neededWidth =
+ this.dataActions.filter((actionArg) => actionArg.type.includes('inRow')).length * 35;
cell.style.width = `${Math.max(neededWidth, 68)}px`;
} else {
cell.style.width = width;
@@ -620,7 +623,7 @@ export class DeesTable extends DeesElement {
});
await done.promise;
}
- }
+ };
if (cells[cells.length - 1].textContent.includes('Actions')) {
await handleColumnByIndex(cells.length - 1, true);