divhunt 2.0.5 → 2.0.6

package/addons/render/elements/front/items/self/form/field/field.css

@@ -1,96 +0,0 @@
-/* Base */
-.e-2109a6b9 > .holder
-{
-	display: flex;
-	align-items: flex-start;
-	justify-content: space-between;
-	gap: var(--dh-spacing-l);
-	padding: var(--dh-spacing-m);
-}
-
-.e-2109a6b9 > .holder > .info
-{
-	display: flex;
-	flex-direction: column;
-	gap: var(--dh-spacing-x);
-	flex: 1;
-	min-width: 0;
-}
-
-.e-2109a6b9 > .holder > .info > label
-{
-	font-size: var(--dh-size-m);
-	font-weight: 500;
-	color: var(--dh-text-1);
-	line-height: 1.3;
-}
-
-.e-2109a6b9 > .holder > .info > p
-{
-	margin: 0;
-	font-size: var(--dh-size-s);
-	color: var(--dh-text-2);
-	line-height: 1.4;
-}
-
-.e-2109a6b9 > .holder > .input
-{
-	flex-shrink: 0;
-	min-width: 200px;
-	max-width: 280px;
-	width: 100%;
-}
-
-/* Variants - Border */
-.e-2109a6b9 > .holder[variant*="border-bottom"]
-{
-	border-bottom: 1px solid var(--dh-bg-2-border);
-}
-
-.e-2109a6b9 > .holder[variant*="border-bottom"]:last-child
-{
-	border-bottom: none;
-}
-
-/* Sizes */
-.e-2109a6b9 > .holder[variant*="size-s"]
-{
-	padding: var(--dh-spacing-s);
-}
-
-.e-2109a6b9 > .holder[variant*="size-s"] > .info > label
-{
-	font-size: var(--dh-size-s);
-}
-
-.e-2109a6b9 > .holder[variant*="size-s"] > .info > p
-{
-	font-size: var(--dh-size-x);
-}
-
-.e-2109a6b9 > .holder[variant*="size-s"] > .input
-{
-	min-width: 160px;
-	max-width: 220px;
-}
-
-.e-2109a6b9 > .holder[variant*="size-l"]
-{
-	padding: var(--dh-spacing-l);
-}
-
-.e-2109a6b9 > .holder[variant*="size-l"] > .info > label
-{
-	font-size: var(--dh-size-l);
-}
-
-.e-2109a6b9 > .holder[variant*="size-l"] > .info > p
-{
-	font-size: var(--dh-size-m);
-}
-
-.e-2109a6b9 > .holder[variant*="size-l"] > .input
-{
-	min-width: 240px;
-	max-width: 320px;
-}

package/addons/render/elements/front/items/self/form/field/field.js

@@ -1,39 +0,0 @@
-import elements from '#elements/load.js';
-
-elements.ItemAdd({
-	id: 'form-field',
-	icon: 'space_dashboard',
-	name: 'Form Field',
-	description: 'Form field row with label and description on left, input slot on right.',
-	category: 'Form',
-	author: 'Divhunt',
-	config: {
-		label: {
-			type: 'string',
-			value: 'Field Label'
-		},
-		description: {
-			type: 'string',
-			value: ''
-		},
-		variant: {
-			type: 'array',
-			value: [],
-			options: ['border-bottom', 'size-s', 'size-m', 'size-l']
-		}
-	},
-	render: function()
-	{
-		return `
-			<div class="holder" :variant="variant.join(' ')">
-				<div class="info">
-					<label dh-if="label">{{ label }}</label>
-					<p dh-if="description">{{ description }}</p>
-				</div>
-				<div class="input">
-					<slot name="input"></slot>
-				</div>
-			</div>
-		`;
-	}
-});

package/addons/render/elements/front/items/self/form/input/input.css

@@ -1,111 +0,0 @@
-/* Base */
-.e-68d95774 > .holder
-{
-    width: 100%;
-    padding: 0 var(--dh-spacing-m);
-    border-radius: var(--dh-radius-m);
-    border: none;
-    background: transparent;
-    transition: all 0.2s;
-    outline: none;
-    color: var(--dh-text-1);
-}
-
-.e-68d95774 > .holder::placeholder
-{
-    color: var(--dh-text-2);
-}
-
-.e-68d95774 > .holder:disabled
-{
-    opacity: 0.5;
-    cursor: not-allowed;
-}
-
-/* Variants - Background */
-.e-68d95774 > .holder[variant*="bg-1"]
-{
-    background: var(--dh-bg-1);
-}
-
-.e-68d95774 > .holder[variant*="bg-1"]:hover
-{
-    background: var(--dh-bg-1-hover);
-}
-
-.e-68d95774 > .holder[variant*="bg-2"]
-{
-    background: var(--dh-bg-2);
-}
-
-.e-68d95774 > .holder[variant*="bg-2"]:hover
-{
-    background: var(--dh-bg-2-hover);
-}
-
-.e-68d95774 > .holder[variant*="bg-3"]
-{
-    background: var(--dh-bg-3);
-}
-
-.e-68d95774 > .holder[variant*="bg-3"]:hover
-{
-    background: var(--dh-bg-3-hover);
-}
-
-.e-68d95774 > .holder[variant*="bg-4"]
-{
-    background: var(--dh-bg-4);
-}
-
-.e-68d95774 > .holder[variant*="bg-4"]:hover
-{
-    background: var(--dh-bg-4-hover);
-}
-
-/* Variants - Border */
-.e-68d95774 > .holder[variant*="border-full"]
-{
-    border: 1px solid var(--dh-bg-2-border);
-}
-
-.e-68d95774 > .holder[variant*="bg-1"][variant*="border-full"]
-{
-    border: 1px solid var(--dh-bg-1-border);
-}
-
-.e-68d95774 > .holder[variant*="bg-2"][variant*="border-full"]
-{
-    border: 1px solid var(--dh-bg-2-border);
-}
-
-.e-68d95774 > .holder[variant*="bg-3"][variant*="border-full"]
-{
-    border: 1px solid var(--dh-bg-3-border);
-}
-
-.e-68d95774 > .holder[variant*="bg-4"][variant*="border-full"]
-{
-    border: 1px solid var(--dh-bg-4-border);
-}
-
-.e-68d95774 > .holder[variant*="border-full"]:focus
-{
-    border-color: var(--dh-brand);
-}
-
-/* Sizes */
-.e-68d95774 > .holder[size="s"]
-{
-    height: var(--dh-height-s);
-}
-
-.e-68d95774 > .holder[size="m"]
-{
-    height: var(--dh-height-m);
-}
-
-.e-68d95774 > .holder[size="l"]
-{
-    height: var(--dh-height-l);
-}

package/addons/render/elements/front/items/self/form/input/input.js

@@ -1,78 +0,0 @@
-import elements from '#elements/load.js';
-
-elements.ItemAdd({
-    id: 'input',
-    icon: 'input',
-    name: 'Input',
-    description: 'Text input field with variant support, placeholder, validation, and built-in error states. Supports all standard input types.',
-    category: 'Form',
-    author: 'Divhunt',
-    config: {
-        value: {
-            type: 'string'
-        },
-        name: {
-            type: 'string'
-        },
-        type: {
-            type: 'string',
-            value: 'text'
-        },
-        placeholder: {
-            type: 'string'
-        },
-        maxLength: {
-            type: 'number'
-        },
-        disabled: {
-            type: 'boolean'
-        },
-        readonly: {
-            type: 'boolean'
-        },
-        variant: {
-            type: 'array',
-            value: ['bg-2', 'border-full'],
-            options: ['bg-1', 'bg-2', 'bg-3', 'bg-4', 'border-full']
-        },
-        size: {
-            type: 'string',
-            value: 'm',
-            options: ['s', 'm', 'l']
-        },
-        onInput: {
-            type: 'function'
-        },
-        onChange: {
-            type: 'function'
-        },
-        onFocus: {
-            type: 'function'
-        },
-        onBlur: {
-            type: 'function'
-        }
-    },
-    render: function()
-    {
-        return `
-            <input
-                class="holder"
-                :variant="variant.join(' ')"
-                :size="size"
-                :value="value"
-                :type="type"
-                :placeholder="placeholder"
-                :name="name"
-                :maxlength="maxLength"
-                :disabled="disabled"
-                :readonly="readonly"
-                autocomplete="off"
-                dh-input="onInput"
-                dh-change="onChange"
-                dh-focus="onFocus"
-                dh-blur="onBlur"
-            />
-        `;
-    }
-});

package/addons/render/elements/front/items/self/form/input/styles/base.css

@@ -1,26 +0,0 @@
-.r538212a9 > .holder
-{
-    position: relative;
-}
-
-.r538212a9 input
-{
-    width: 100%;
-    padding: 0 var(--dh-spacing-m);
-    border-radius: var(--dh-radius-m);
-    border: 1px solid;
-    background: transparent;
-    transition: all 0.2s ease;
-    outline: none;
-}
-
-.r538212a9 input::placeholder
-{
-    color: var(--dh-text-2);
-}
-
-.r538212a9 input:disabled
-{
-    opacity: 0.5;
-    cursor: not-allowed;
-}

package/addons/render/elements/front/items/self/form/input/styles/sizes.css

@@ -1,15 +0,0 @@
-/* Sizes */
-.r538212a9 > .holder[size="s"] input
-{
-    height: var(--dh-height-s);
-}
-
-.r538212a9 > .holder[size="m"] input
-{
-    height: var(--dh-height-m);
-}
-
-.r538212a9 > .holder[size="l"] input
-{
-    height: var(--dh-height-l);
-}

package/addons/render/elements/front/items/self/form/input/styles/variants.css

@@ -1,98 +0,0 @@
-/* Variants */
-.r538212a9 > .holder[variant="transparent"] input
-{
-    background: transparent;
-    border-color: transparent;
-    padding: 0;
-}
-
-.r538212a9 > .holder[variant="transparent"] input:hover
-{
-    background: transparent;
-}
-
-.r538212a9 > .holder[variant="transparent"] input:focus
-{
-    border-color: transparent;
-}
-
-.r538212a9 > .holder[variant="border"] input
-{
-    background: transparent;
-    border-color: var(--dh-bg-1-border);
-}
-
-.r538212a9 > .holder[variant="border"] input:hover
-{
-    background: transparent;
-    border-color: var(--dh-bg-2-border);
-}
-
-.r538212a9 > .holder[variant="border"] input:focus
-{
-    border-color: var(--dh-brand);
-}
-
-.r538212a9 > .holder[variant="bg-1"] input
-{
-    background: var(--dh-bg-1);
-    border-color: var(--dh-bg-1-border);
-}
-
-.r538212a9 > .holder[variant="bg-1"] input:hover
-{
-    background: var(--dh-bg-1-hover);
-}
-
-.r538212a9 > .holder[variant="bg-1"] input:focus
-{
-    border-color: var(--dh-brand);
-}
-
-.r538212a9 > .holder[variant="bg-2"] input
-{
-    background: var(--dh-bg-2);
-    border-color: var(--dh-bg-2-border);
-}
-
-.r538212a9 > .holder[variant="bg-2"] input:hover
-{
-    background: var(--dh-bg-2-hover);
-}
-
-.r538212a9 > .holder[variant="bg-2"] input:focus
-{
-    border-color: var(--dh-brand);
-}
-
-.r538212a9 > .holder[variant="bg-3"] input
-{
-    background: var(--dh-bg-3);
-    border-color: var(--dh-bg-3-border);
-}
-
-.r538212a9 > .holder[variant="bg-3"] input:hover
-{
-    background: var(--dh-bg-3-hover);
-}
-
-.r538212a9 > .holder[variant="bg-3"] input:focus
-{
-    border-color: var(--dh-brand);
-}
-
-.r538212a9 > .holder[variant="bg-4"] input
-{
-    background: var(--dh-bg-4);
-    border-color: var(--dh-bg-4-border);
-}
-
-.r538212a9 > .holder[variant="bg-4"] input:hover
-{
-    background: var(--dh-bg-4-hover);
-}
-
-.r538212a9 > .holder[variant="bg-4"] input:focus
-{
-    border-color: var(--dh-brand);
-}

package/addons/render/elements/front/items/self/form/radio/radio.js

@@ -1,57 +0,0 @@
-import elements from '#elements/load.js';
-
-elements.ItemAdd({
-    id: 'radio',
-    icon: 'radio_button_checked',
-    name: 'Radio',
-    description: 'Radio button input with custom styling, group support, and multiple size options for different form contexts.',
-    category: 'Form',
-    author: 'Divhunt',
-    config: {
-        name: {
-            type: 'string'
-        },
-        value: {
-            type: 'string'
-        },
-        checked: {
-            type: 'boolean'
-        },
-        disabled: {
-            type: 'boolean'
-        },
-        variant: {
-            type: 'array',
-            value: ['bg-1'],
-            options: ['transparent', 'border', 'bg-1', 'bg-2', 'bg-3', 'bg-4']
-        },
-        size: {
-            type: 'string',
-            value: 'm',
-            options: ['s', 'm', 'l']
-        },
-        onChange: {
-            type: 'function'
-        },
-        onClick: {
-            type: 'function'
-        }
-    },
-    render: function()
-    {
-        return `
-            <div class="holder" :variant="variant.join(' ')" :size="size">
-                <input
-                    type="radio"
-                    :name="name"
-                    :value="value"
-                    :checked="checked"
-                    :disabled="disabled"
-                    dh-change="onChange"
-                    dh-click="onClick"
-                />
-                <span class="radio-mark"></span>
-            </div>
-        `;
-    }
-});

package/addons/render/elements/front/items/self/form/radio/styles/base.css

@@ -1,48 +0,0 @@
-.r53095678 > .holder
-{
-    position: relative;
-    display: inline-flex;
-    align-items: center;
-    cursor: pointer;
-}
-
-.r53095678 input[type="radio"]
-{
-    position: absolute;
-    opacity: 0;
-    cursor: pointer;
-    width: 100%;
-    height: 100%;
-    z-index: 1;
-}
-
-.r53095678 .radio-mark
-{
-    display: block;
-    border-radius: 50%;
-    border: 1px solid;
-    transition: all 0.2s ease;
-    position: relative;
-}
-
-.r53095678 .radio-mark::after
-{
-    content: '';
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%) scale(0);
-    border-radius: 50%;
-    transition: all 0.2s ease;
-}
-
-.r53095678 input[type="radio"]:checked ~ .radio-mark::after
-{
-    transform: translate(-50%, -50%) scale(1);
-}
-
-.r53095678 input[type="radio"]:disabled ~ .radio-mark
-{
-    opacity: 0.5;
-    cursor: not-allowed;
-}

package/addons/render/elements/front/items/self/form/radio/styles/sizes.css

@@ -1,36 +0,0 @@
-/* Sizes */
-.r53095678 > .holder[size="s"] .radio-mark
-{
-    width: 16px;
-    height: 16px;
-}
-
-.r53095678 > .holder[size="s"] .radio-mark::after
-{
-    width: 6px;
-    height: 6px;
-}
-
-.r53095678 > .holder[size="m"] .radio-mark
-{
-    width: 20px;
-    height: 20px;
-}
-
-.r53095678 > .holder[size="m"] .radio-mark::after
-{
-    width: 8px;
-    height: 8px;
-}
-
-.r53095678 > .holder[size="l"] .radio-mark
-{
-    width: 24px;
-    height: 24px;
-}
-
-.r53095678 > .holder[size="l"] .radio-mark::after
-{
-    width: 10px;
-    height: 10px;
-}