divhunt 2.0.5 → 2.0.6

package/addons/render/elements/front/items/self/data/table/table.css

@@ -1,153 +0,0 @@
-/* Base */
-.e-696e3b78 > .holder
-{
-	display: flex;
-	flex-direction: column;
-	background: var(--dh-bg-1);
-	border-radius: var(--dh-radius-l);
-	overflow: hidden;
-}
-
-/* Header */
-.e-696e3b78 > .holder > .header
-{
-	display: flex;
-	background: var(--dh-bg-2);
-	border-bottom: 1px solid var(--dh-bg-2-border);
-}
-
-.e-696e3b78 > .holder > .header > .cell
-{
-	display: flex;
-	align-items: center;
-	gap: var(--dh-spacing-x);
-	padding: var(--dh-spacing-m);
-	flex: 1;
-	min-width: 0;
-	font-weight: 600;
-	font-size: var(--dh-size-s);
-	color: var(--dh-text-2);
-	text-transform: uppercase;
-	letter-spacing: 0.5px;
-	user-select: none;
-}
-
-.e-696e3b78 > .holder > .header > .cell > .sort-icon
-{
-	font-size: 18px;
-	opacity: 0.5;
-	cursor: pointer;
-	transition: opacity 0.2s ease;
-}
-
-.e-696e3b78 > .holder > .header > .cell:hover > .sort-icon
-{
-	opacity: 1;
-}
-
-/* Body */
-.e-696e3b78 > .holder > .body
-{
-	display: flex;
-	flex-direction: column;
-}
-
-.e-696e3b78 > .holder > .body > .row
-{
-	display: flex;
-	border-bottom: 1px solid var(--dh-bg-2-border);
-	transition: background 0.2s ease;
-}
-
-.e-696e3b78 > .holder > .body > .row:last-child
-{
-	border-bottom: none;
-}
-
-.e-696e3b78 > .holder > .body > .row > .cell
-{
-	display: flex;
-	align-items: center;
-	padding: var(--dh-spacing-m);
-	flex: 1;
-	min-width: 0;
-	font-size: var(--dh-size-m);
-	color: var(--dh-text-1);
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}
-
-/* Variants - Size */
-.e-696e3b78 > .holder[variant*="size-s"] > .header > .cell,
-.e-696e3b78 > .holder[variant*="size-s"] > .body > .row > .cell
-{
-	padding: var(--dh-spacing-s) var(--dh-spacing-m);
-	font-size: var(--dh-size-s);
-}
-
-.e-696e3b78 > .holder[variant*="size-l"] > .header > .cell,
-.e-696e3b78 > .holder[variant*="size-l"] > .body > .row > .cell
-{
-	padding: var(--dh-spacing-l) var(--dh-spacing-m);
-}
-
-/* Variants - Border */
-.e-696e3b78 > .holder[variant*="border"]
-{
-	border: 1px solid var(--dh-bg-2-border);
-}
-
-/* Variants - Background */
-.e-696e3b78 > .holder[variant*="bg-1"] { background: var(--dh-bg-1); }
-.e-696e3b78 > .holder[variant*="bg-2"] { background: var(--dh-bg-2); }
-.e-696e3b78 > .holder[variant*="bg-3"] { background: var(--dh-bg-3); }
-
-.e-696e3b78 > .holder[variant*="bg-2"] > .header { background: var(--dh-bg-3); }
-.e-696e3b78 > .holder[variant*="bg-3"] > .header { background: var(--dh-bg-4); }
-
-/* Variants - Striped */
-.e-696e3b78 > .holder[variant*="striped"] > .body > .row:nth-child(even)
-{
-	background: var(--dh-bg-2);
-}
-
-/* Variants - Hover */
-.e-696e3b78 > .holder[variant*="hover"] > .body > .row
-{
-	cursor: pointer;
-}
-
-.e-696e3b78 > .holder[variant*="hover"] > .body > .row:hover
-{
-	background: var(--dh-bg-2);
-}
-
-.e-696e3b78 > .holder[variant*="striped"][variant*="hover"] > .body > .row:hover
-{
-	background: var(--dh-bg-3);
-}
-
-/* Variants - Compact */
-.e-696e3b78 > .holder[variant*="compact"] > .header > .cell,
-.e-696e3b78 > .holder[variant*="compact"] > .body > .row > .cell
-{
-	padding: var(--dh-spacing-s) var(--dh-spacing-m);
-}
-
-.e-696e3b78 > .holder[variant*="compact"] > .body > .row > .cell
-{
-	font-size: var(--dh-size-s);
-}
-
-/* Empty State */
-.e-696e3b78 > .holder > .body:empty::after
-{
-	content: 'No data available';
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	padding: var(--dh-spacing-l);
-	color: var(--dh-text-2);
-	font-size: var(--dh-size-m);
-}

package/addons/render/elements/front/items/self/data/table/table.js

@@ -1,106 +0,0 @@
-import elements from '#elements/load.js';
-
-elements.ItemAdd({
-	id: 'table',
-	icon: 'table_chart',
-	name: 'Table',
-	description: 'Data table with columns, rows, sorting, and row actions. Supports dynamic column definitions and custom cell rendering.',
-	category: 'Data',
-	author: 'Divhunt',
-	config: {
-		columns: {
-			type: 'array',
-			value: [
-				{ id: 'name', label: 'Name' },
-				{ id: 'email', label: 'Email' },
-				{ id: 'role', label: 'Role' },
-				{ id: 'status', label: 'Status' }
-			]
-		},
-		rows: {
-			type: 'array',
-			value: [
-				{ name: 'John Doe', email: 'john@example.com', role: 'Admin', status: 'Active' },
-				{ name: 'Jane Smith', email: 'jane@example.com', role: 'Editor', status: 'Active' },
-				{ name: 'Bob Wilson', email: 'bob@example.com', role: 'Viewer', status: 'Inactive' }
-			]
-		},
-		variant: {
-			type: 'array',
-			value: ['border', 'hover', 'size-m'],
-			options: ['border', 'bg-1', 'bg-2', 'bg-3', 'striped', 'compact', 'hover', 'size-s', 'size-m', 'size-l']
-		},
-		sortable: {
-			type: 'boolean',
-			value: false
-		},
-		onRowClick: {
-			type: 'function'
-		},
-		onSort: {
-			type: 'function'
-		}
-	},
-	render: function()
-	{
-		this.sortColumn = null;
-		this.sortDirection = 'asc';
-
-		this.handleSort = (column) =>
-		{
-			if (!this.sortable) return;
-
-			if (this.sortColumn === column.id)
-			{
-				this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';
-			}
-			else
-			{
-				this.sortColumn = column.id;
-				this.sortDirection = 'asc';
-			}
-
-			if (this.onSort)
-			{
-				this.onSort({ column: column.id, direction: this.sortDirection });
-			}
-		};
-
-		this.handleRowClick = (row, index) =>
-		{
-			if (this.onRowClick)
-			{
-				this.onRowClick({ row, index });
-			}
-		};
-
-		this.getSortIcon = (columnId) =>
-		{
-			if (this.sortColumn !== columnId) return 'unfold_more';
-			return this.sortDirection === 'asc' ? 'expand_less' : 'expand_more';
-		};
-
-		this.getCellValue = (row, columnId) =>
-		{
-			return row[columnId] !== undefined ? row[columnId] : '';
-		};
-
-		return `
-			<div class="holder" :variant="variant.join(' ')">
-				<div class="header">
-					<div dh-for="column in columns" class="cell" :style="column.width ? 'width:' + column.width : ''" dh-click="handleSort(column)">
-						<span class="label">{{ column.label }}</span>
-						<i dh-if="sortable" class="icon sort-icon">{{ getSortIcon(column.id) }}</i>
-					</div>
-				</div>
-				<div class="body">
-					<div dh-for="row, index in rows" class="row" dh-click="handleRowClick(row, index)">
-						<div dh-for="column in columns" class="cell" :style="column.width ? 'width:' + column.width : ''">
-							{{ getCellValue(row, column.id) }}
-						</div>
-					</div>
-				</div>
-			</div>
-		`;
-	}
-});

package/addons/render/elements/front/items/self/data/timeline/timeline.css

@@ -1,127 +0,0 @@
-/* Base */
-.e-338c43a9 > .holder
-{
-	display: flex;
-	flex-direction: column;
-}
-
-.e-338c43a9 > .holder > .item
-{
-	display: flex;
-	gap: var(--dh-spacing-l);
-	position: relative;
-	padding-bottom: calc(var(--dh-spacing-l) * 2);
-}
-
-.e-338c43a9 > .holder > .item:last-child
-{
-	padding-bottom: 0;
-}
-
-.e-338c43a9 > .holder > .item::before
-{
-	content: '';
-	position: absolute;
-	left: 20px;
-	top: 44px;
-	bottom: 0;
-	width: 2px;
-	background: var(--dh-bg-4);
-}
-
-.e-338c43a9 > .holder > .item:last-child::before
-{
-	display: none;
-}
-
-.e-338c43a9 > .holder > .item > .marker
-{
-	flex-shrink: 0;
-	width: 40px;
-	height: 40px;
-	border-radius: 50%;
-	background: var(--dh-brand);
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	position: relative;
-	z-index: 1;
-}
-
-.e-338c43a9 > .holder > .item > .marker > .icon
-{
-	font-size: 20px;
-	color: white;
-}
-
-.e-338c43a9 > .holder > .item > .content
-{
-	flex: 1;
-	padding-top: var(--dh-spacing-x);
-}
-
-.e-338c43a9 > .holder > .item > .content > .title
-{
-	font-size: var(--dh-size-m);
-	font-weight: 700;
-	color: var(--dh-text-1);
-	margin: 0 0 var(--dh-spacing-x) 0;
-}
-
-.e-338c43a9 > .holder > .item > .content > .description
-{
-	font-size: var(--dh-size-s);
-	color: var(--dh-text-2);
-	line-height: 1.6;
-	margin: 0 0 var(--dh-spacing-x) 0;
-}
-
-.e-338c43a9 > .holder > .item > .content > .date
-{
-	font-size: 11px;
-	color: var(--dh-text-2);
-	font-weight: 600;
-}
-
-/* Variants - Colors */
-.e-338c43a9 > .holder[variant*="brand"] > .item > .marker
-{
-	background: var(--dh-brand);
-}
-
-.e-338c43a9 > .holder[variant*="blue"] > .item > .marker
-{
-	background: var(--dh-blue);
-}
-
-.e-338c43a9 > .holder[variant*="red"] > .item > .marker
-{
-	background: var(--dh-red);
-}
-
-.e-338c43a9 > .holder[variant*="orange"] > .item > .marker
-{
-	background: var(--dh-orange);
-}
-
-.e-338c43a9 > .holder[variant*="green"] > .item > .marker
-{
-	background: var(--dh-green);
-}
-
-/* Variants - Alternate */
-.e-338c43a9 > .holder[variant*="alternate"] > .item:nth-child(even)
-{
-	flex-direction: row-reverse;
-}
-
-.e-338c43a9 > .holder[variant*="alternate"] > .item:nth-child(even) > .content
-{
-	text-align: right;
-}
-
-.e-338c43a9 > .holder[variant*="alternate"] > .item:nth-child(even)::before
-{
-	left: auto;
-	right: 20px;
-}

package/addons/render/elements/front/items/self/data/timeline/timeline.js

@@ -1,57 +0,0 @@
-import elements from '#elements/load.js';
-
-elements.ItemAdd({
-	id: 'timeline',
-	icon: 'timeline',
-	name: 'Timeline',
-	description: 'Vertical timeline for displaying events, history, or progress.',
-	category: 'Data',
-	author: 'Divhunt',
-	config: {
-		items: {
-			type: 'array',
-			value: [
-				{
-					icon: 'check_circle',
-					title: 'Project Started',
-					description: 'Initial project setup and planning completed',
-					date: 'Jan 15, 2024'
-				},
-				{
-					icon: 'code',
-					title: 'Development Phase',
-					description: 'Core features implemented and tested',
-					date: 'Feb 20, 2024'
-				},
-				{
-					icon: 'rocket_launch',
-					title: 'Launch',
-					description: 'Product successfully launched to production',
-					date: 'Mar 10, 2024'
-				}
-			]
-		},
-		variant: {
-			type: 'array',
-			value: ['brand'],
-			options: ['brand', 'blue', 'red', 'orange', 'green', 'alternate']
-		}
-	},
-	render: function()
-	{
-		return `
-			<div class="holder" :variant="variant.join(' ')">
-				<div dh-for="item in items" class="item">
-					<div class="marker">
-						<i class="icon">{{ item.icon }}</i>
-					</div>
-					<div class="content">
-						<h4 class="title">{{ item.title }}</h4>
-						<p dh-if="item.description" class="description">{{ item.description }}</p>
-						<span dh-if="item.date" class="date">{{ item.date }}</span>
-					</div>
-				</div>
-			</div>
-		`;
-	}
-});

package/addons/render/elements/front/items/self/feedback/alert/alert.css

@@ -1,258 +0,0 @@
-/* Base */
-.e-68678906 > .holder
-{
-	display: flex;
-	align-items: flex-start;
-	gap: var(--dh-spacing-m);
-	padding: var(--dh-spacing-m);
-	border-radius: var(--dh-radius-m);
-	border: 1px solid;
-	background: var(--dh-brand-opacity);
-	border-color: var(--dh-brand-border);
-	color: var(--dh-text-1);
-	position: relative;
-}
-
-.e-68678906 > .holder > .icon
-{
-	font-size: 20px;
-	color: var(--dh-brand);
-	flex-shrink: 0;
-	margin-top: 2px;
-}
-
-.e-68678906 > .holder > .content
-{
-	flex: 1;
-	display: flex;
-	flex-direction: column;
-	gap: var(--dh-spacing-x);
-	min-width: 0;
-}
-
-.e-68678906 > .holder > .content > .title
-{
-	font-weight: 600;
-	font-size: var(--dh-size-m);
-	color: var(--dh-text-1);
-}
-
-.e-68678906 > .holder > .content > .text
-{
-	font-size: var(--dh-size-s);
-	color: var(--dh-text-2);
-	line-height: 1.5;
-}
-
-.e-68678906 > .holder > .close
-{
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 24px;
-	height: 24px;
-	border: none;
-	background: transparent;
-	color: var(--dh-text-2);
-	cursor: pointer;
-	border-radius: var(--dh-radius-s);
-	transition: all 0.2s ease;
-	flex-shrink: 0;
-	padding: 0;
-}
-
-.e-68678906 > .holder > .close:hover
-{
-	background: var(--dh-bg-2-opacity);
-	color: var(--dh-text-1);
-}
-
-.e-68678906 > .holder > .close > .icon
-{
-	font-size: 18px;
-}
-
-/* Variants - Colors */
-.e-68678906 > .holder[variant*="brand"]
-{
-	background: var(--dh-brand-opacity);
-	border-color: var(--dh-brand-border);
-}
-
-.e-68678906 > .holder[variant*="brand"] > .icon
-{
-	color: var(--dh-brand);
-}
-
-.e-68678906 > .holder[variant*="blue"]
-{
-	background: var(--dh-blue-opacity);
-	border-color: var(--dh-blue-border);
-}
-
-.e-68678906 > .holder[variant*="blue"] > .icon
-{
-	color: var(--dh-blue);
-}
-
-.e-68678906 > .holder[variant*="red"]
-{
-	background: var(--dh-red-opacity);
-	border-color: var(--dh-red-border);
-}
-
-.e-68678906 > .holder[variant*="red"] > .icon
-{
-	color: var(--dh-red);
-}
-
-.e-68678906 > .holder[variant*="orange"]
-{
-	background: var(--dh-orange-opacity);
-	border-color: var(--dh-orange-border);
-}
-
-.e-68678906 > .holder[variant*="orange"] > .icon
-{
-	color: var(--dh-orange);
-}
-
-.e-68678906 > .holder[variant*="green"]
-{
-	background: var(--dh-green-opacity);
-	border-color: var(--dh-green-border);
-}
-
-.e-68678906 > .holder[variant*="green"] > .icon
-{
-	color: var(--dh-green);
-}
-
-/* Variants - Border */
-.e-68678906 > .holder[variant*="border"]
-{
-	background: transparent;
-}
-
-/* Variants - Animation */
-@keyframes bounce
-{
-	0%, 100%
-	{
-		transform: translateX(0);
-	}
-	25%
-	{
-		transform: translateX(-10px);
-	}
-	50%
-	{
-		transform: translateX(0);
-	}
-	75%
-	{
-		transform: translateX(-5px);
-	}
-}
-
-.e-68678906 > .holder[variant*="animate-bounce"]
-{
-	animation: bounce 1s ease-in-out;
-}
-
-/* Variants - Sizes */
-.e-68678906 > .holder[variant*="size-s"]
-{
-	padding: var(--dh-spacing-s);
-	gap: var(--dh-spacing-s);
-}
-
-.e-68678906 > .holder[variant*="size-s"] > .icon
-{
-	font-size: 16px;
-}
-
-.e-68678906 > .holder[variant*="size-s"] > .content > .title
-{
-	font-size: var(--dh-size-s);
-}
-
-.e-68678906 > .holder[variant*="size-s"] > .content > .text
-{
-	font-size: 12px;
-}
-
-.e-68678906 > .holder[variant*="size-s"] > .close
-{
-	width: 20px;
-	height: 20px;
-}
-
-.e-68678906 > .holder[variant*="size-s"] > .close > .icon
-{
-	font-size: 16px;
-}
-
-.e-68678906 > .holder[variant*="size-m"]
-{
-	padding: var(--dh-spacing-m);
-	gap: var(--dh-spacing-m);
-}
-
-.e-68678906 > .holder[variant*="size-m"] > .icon
-{
-	font-size: 20px;
-}
-
-.e-68678906 > .holder[variant*="size-m"] > .content > .title
-{
-	font-size: var(--dh-size-m);
-}
-
-.e-68678906 > .holder[variant*="size-m"] > .content > .text
-{
-	font-size: var(--dh-size-s);
-}
-
-.e-68678906 > .holder[variant*="size-m"] > .close
-{
-	width: 24px;
-	height: 24px;
-}
-
-.e-68678906 > .holder[variant*="size-m"] > .close > .icon
-{
-	font-size: 18px;
-}
-
-.e-68678906 > .holder[variant*="size-l"]
-{
-	padding: var(--dh-spacing-l);
-	gap: var(--dh-spacing-l);
-}
-
-.e-68678906 > .holder[variant*="size-l"] > .icon
-{
-	font-size: 24px;
-}
-
-.e-68678906 > .holder[variant*="size-l"] > .content > .title
-{
-	font-size: var(--dh-size-l);
-}
-
-.e-68678906 > .holder[variant*="size-l"] > .content > .text
-{
-	font-size: var(--dh-size-m);
-}
-
-.e-68678906 > .holder[variant*="size-l"] > .close
-{
-	width: 28px;
-	height: 28px;
-}
-
-.e-68678906 > .holder[variant*="size-l"] > .close > .icon
-{
-	font-size: 20px;
-}