@cloudparker/moldex.js 4.1.7 → 4.1.8

package/dist/views/core/icon/services/icon-path-service.d.ts

@@ -0,0 +1,23 @@
+export declare const mdiArrowLeft = "M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z";
+export declare const mdiAttachment = "M7.5,18A5.5,5.5 0 0,1 2,12.5A5.5,5.5 0 0,1 7.5,7H18A4,4 0 0,1 22,11A4,4 0 0,1 18,15H9.5A2.5,2.5 0 0,1 7,12.5A2.5,2.5 0 0,1 9.5,10H17V11.5H9.5A1,1 0 0,0 8.5,12.5A1,1 0 0,0 9.5,13.5H18A2.5,2.5 0 0,0 20.5,11A2.5,2.5 0 0,0 18,8.5H7.5A4,4 0 0,0 3.5,12.5A4,4 0 0,0 7.5,16.5H17V18H7.5Z";
+export declare const mdiBellOutline = "M10 21H14C14 22.1 13.1 23 12 23S10 22.1 10 21M21 19V20H3V19L5 17V11C5 7.9 7 5.2 10 4.3V4C10 2.9 10.9 2 12 2S14 2.9 14 4V4.3C17 5.2 19 7.9 19 11V17L21 19M17 11C17 8.2 14.8 6 12 6S7 8.2 7 11V18H17V11Z";
+export declare const mdiCheckCircle = "M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z";
+export declare const mdiCheckCircleOutline = "M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M12 20C7.59 20 4 16.41 4 12S7.59 4 12 4 20 7.59 20 12 16.41 20 12 20M16.59 7.58L10 14.17L7.41 11.59L6 13L10 17L18 9L16.59 7.58Z";
+export declare const mdiChevronDown = "M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z";
+export declare const mdiChevronLeft = "M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z";
+export declare const mdiChevronRight = "M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z";
+export declare const mdiClose = "M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z";
+export declare const mdiContentCopy = "M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z";
+export declare const mdiEmailOutline = "M22 6C22 4.9 21.1 4 20 4H4C2.9 4 2 4.9 2 6V18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V6M20 6L12 11L4 6H20M20 18H4V8L12 13L20 8V18Z";
+export declare const mdiEyeOffOutline = "M2,5.27L3.28,4L20,20.72L18.73,22L15.65,18.92C14.5,19.3 13.28,19.5 12,19.5C7,19.5 2.73,16.39 1,12C1.69,10.24 2.79,8.69 4.19,7.46L2,5.27M12,9A3,3 0 0,1 15,12C15,12.35 14.94,12.69 14.83,13L11,9.17C11.31,9.06 11.65,9 12,9M12,4.5C17,4.5 21.27,7.61 23,12C22.18,14.08 20.79,15.88 19,17.19L17.58,15.76C18.94,14.82 20.06,13.54 20.82,12C19.17,8.64 15.76,6.5 12,6.5C10.91,6.5 9.84,6.68 8.84,7L7.3,5.47C8.74,4.85 10.33,4.5 12,4.5M3.18,12C4.83,15.36 8.24,17.5 12,17.5C12.69,17.5 13.37,17.43 14,17.29L11.72,15C10.29,14.85 9.15,13.71 9,12.28L5.6,8.87C4.61,9.72 3.78,10.78 3.18,12Z";
+export declare const mdiEyeOutline = "M12,9A3,3 0 0,1 15,12A3,3 0 0,1 12,15A3,3 0 0,1 9,12A3,3 0 0,1 12,9M12,4.5C17,4.5 21.27,7.61 23,12C21.27,16.39 17,19.5 12,19.5C7,19.5 2.73,16.39 1,12C2.73,7.61 7,4.5 12,4.5M3.18,12C4.83,15.36 8.24,17.5 12,17.5C15.76,17.5 19.17,15.36 20.82,12C19.17,8.64 15.76,6.5 12,6.5C8.24,6.5 4.83,8.64 3.18,12Z";
+export declare const mdiFlowerTulip = "M3,13A9,9 0 0,0 12,22A9,9 0 0,0 3,13M12,22A9,9 0 0,0 21,13A9,9 0 0,0 12,22M18,3V8A6,6 0 0,1 12,14A6,6 0 0,1 6,8V3C6.74,3 7.47,3.12 8.16,3.39C8.71,3.62 9.2,3.96 9.61,4.39L12,2L14.39,4.39C14.8,3.96 15.29,3.62 15.84,3.39C16.53,3.12 17.26,3 18,3Z";
+export declare const mdiMagnify = "M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z";
+export declare const mdiMenu = "M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z";
+export declare const mdiPageFirst = "M18.41,16.59L13.82,12L18.41,7.41L17,6L11,12L17,18L18.41,16.59M6,6H8V18H6V6Z";
+export declare const mdiPageLast = "M5.59,7.41L10.18,12L5.59,16.59L7,18L13,12L7,6L5.59,7.41M16,6H18V18H16V6Z";
+export declare const mdiPhone = "M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L15.41,15.18C15.69,14.9 16.08,14.82 16.43,14.93C17.55,15.3 18.75,15.5 20,15.5A1,1 0 0,1 21,16.5V20A1,1 0 0,1 20,21A17,17 0 0,1 3,4A1,1 0 0,1 4,3H7.5A1,1 0 0,1 8.5,4C8.5,5.25 8.7,6.45 9.07,7.57C9.18,7.92 9.1,8.31 8.82,8.59L6.62,10.79Z";
+export declare const mdiSquare = "M3,3V21H21V3";
+export declare const mdiUnfoldMoreHorizontal = "M12,18.17L8.83,15L7.42,16.41L12,21L16.59,16.41L15.17,15M12,5.83L15.17,9L16.58,7.59L12,3L7.41,7.59L8.83,9L12,5.83Z";
+export declare const mdiOpenInNew = "M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z";
+export declare const mdiDotsHorizontal = "M16,12A2,2 0 0,1 18,10A2,2 0 0,1 20,12A2,2 0 0,1 18,14A2,2 0 0,1 16,12M10,12A2,2 0 0,1 12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12M4,12A2,2 0 0,1 6,10A2,2 0 0,1 8,12A2,2 0 0,1 6,14A2,2 0 0,1 4,12Z";

package/dist/views/core/icon/services/icon-path-service.js

@@ -0,0 +1,24 @@
+// MDI
+export const mdiArrowLeft = "M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z";
+export const mdiAttachment = "M7.5,18A5.5,5.5 0 0,1 2,12.5A5.5,5.5 0 0,1 7.5,7H18A4,4 0 0,1 22,11A4,4 0 0,1 18,15H9.5A2.5,2.5 0 0,1 7,12.5A2.5,2.5 0 0,1 9.5,10H17V11.5H9.5A1,1 0 0,0 8.5,12.5A1,1 0 0,0 9.5,13.5H18A2.5,2.5 0 0,0 20.5,11A2.5,2.5 0 0,0 18,8.5H7.5A4,4 0 0,0 3.5,12.5A4,4 0 0,0 7.5,16.5H17V18H7.5Z";
+export const mdiBellOutline = 'M10 21H14C14 22.1 13.1 23 12 23S10 22.1 10 21M21 19V20H3V19L5 17V11C5 7.9 7 5.2 10 4.3V4C10 2.9 10.9 2 12 2S14 2.9 14 4V4.3C17 5.2 19 7.9 19 11V17L21 19M17 11C17 8.2 14.8 6 12 6S7 8.2 7 11V18H17V11Z';
+export const mdiCheckCircle = "M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z";
+export const mdiCheckCircleOutline = "M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M12 20C7.59 20 4 16.41 4 12S7.59 4 12 4 20 7.59 20 12 16.41 20 12 20M16.59 7.58L10 14.17L7.41 11.59L6 13L10 17L18 9L16.59 7.58Z";
+export const mdiChevronDown = 'M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z';
+export const mdiChevronLeft = "M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z";
+export const mdiChevronRight = "M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z";
+export const mdiClose = "M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z";
+export const mdiContentCopy = "M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z";
+export const mdiEmailOutline = "M22 6C22 4.9 21.1 4 20 4H4C2.9 4 2 4.9 2 6V18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V6M20 6L12 11L4 6H20M20 18H4V8L12 13L20 8V18Z";
+export const mdiEyeOffOutline = "M2,5.27L3.28,4L20,20.72L18.73,22L15.65,18.92C14.5,19.3 13.28,19.5 12,19.5C7,19.5 2.73,16.39 1,12C1.69,10.24 2.79,8.69 4.19,7.46L2,5.27M12,9A3,3 0 0,1 15,12C15,12.35 14.94,12.69 14.83,13L11,9.17C11.31,9.06 11.65,9 12,9M12,4.5C17,4.5 21.27,7.61 23,12C22.18,14.08 20.79,15.88 19,17.19L17.58,15.76C18.94,14.82 20.06,13.54 20.82,12C19.17,8.64 15.76,6.5 12,6.5C10.91,6.5 9.84,6.68 8.84,7L7.3,5.47C8.74,4.85 10.33,4.5 12,4.5M3.18,12C4.83,15.36 8.24,17.5 12,17.5C12.69,17.5 13.37,17.43 14,17.29L11.72,15C10.29,14.85 9.15,13.71 9,12.28L5.6,8.87C4.61,9.72 3.78,10.78 3.18,12Z";
+export const mdiEyeOutline = "M12,9A3,3 0 0,1 15,12A3,3 0 0,1 12,15A3,3 0 0,1 9,12A3,3 0 0,1 12,9M12,4.5C17,4.5 21.27,7.61 23,12C21.27,16.39 17,19.5 12,19.5C7,19.5 2.73,16.39 1,12C2.73,7.61 7,4.5 12,4.5M3.18,12C4.83,15.36 8.24,17.5 12,17.5C15.76,17.5 19.17,15.36 20.82,12C19.17,8.64 15.76,6.5 12,6.5C8.24,6.5 4.83,8.64 3.18,12Z";
+export const mdiFlowerTulip = "M3,13A9,9 0 0,0 12,22A9,9 0 0,0 3,13M12,22A9,9 0 0,0 21,13A9,9 0 0,0 12,22M18,3V8A6,6 0 0,1 12,14A6,6 0 0,1 6,8V3C6.74,3 7.47,3.12 8.16,3.39C8.71,3.62 9.2,3.96 9.61,4.39L12,2L14.39,4.39C14.8,3.96 15.29,3.62 15.84,3.39C16.53,3.12 17.26,3 18,3Z";
+export const mdiMagnify = "M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z";
+export const mdiMenu = "M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z";
+export const mdiPageFirst = "M18.41,16.59L13.82,12L18.41,7.41L17,6L11,12L17,18L18.41,16.59M6,6H8V18H6V6Z";
+export const mdiPageLast = "M5.59,7.41L10.18,12L5.59,16.59L7,18L13,12L7,6L5.59,7.41M16,6H18V18H16V6Z";
+export const mdiPhone = "M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L15.41,15.18C15.69,14.9 16.08,14.82 16.43,14.93C17.55,15.3 18.75,15.5 20,15.5A1,1 0 0,1 21,16.5V20A1,1 0 0,1 20,21A17,17 0 0,1 3,4A1,1 0 0,1 4,3H7.5A1,1 0 0,1 8.5,4C8.5,5.25 8.7,6.45 9.07,7.57C9.18,7.92 9.1,8.31 8.82,8.59L6.62,10.79Z";
+export const mdiSquare = "M3,3V21H21V3";
+export const mdiUnfoldMoreHorizontal = "M12,18.17L8.83,15L7.42,16.41L12,21L16.59,16.41L15.17,15M12,5.83L15.17,9L16.58,7.59L12,3L7.41,7.59L8.83,9L12,5.83Z";
+export const mdiOpenInNew = "M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z";
+export const mdiDotsHorizontal = "M16,12A2,2 0 0,1 18,10A2,2 0 0,1 20,12A2,2 0 0,1 18,14A2,2 0 0,1 16,12M10,12A2,2 0 0,1 12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12M4,12A2,2 0 0,1 6,10A2,2 0 0,1 8,12A2,2 0 0,1 6,14A2,2 0 0,1 4,12Z";

package/dist/views/core/index.d.ts

@@ -0,0 +1,16 @@
+export * from './button/index.js';
+export * from './common/index.js';
+export * from './dialog/index.js';
+export * from './drawer/index.js';
+export * from './icon/index.js';
+export * from './input/index.js';
+export * from './navbar/index.js';
+export * from './no-data/index.js';
+export * from './pagination/index.js';
+export * from './progressbar/index.js';
+export * from './ruler/index.js';
+export * from './sidebar/index.js';
+export * from './screen-detector/index.js';
+export * from './spinner/index.js';
+export * from './text/index.js';
+export * from './toast/index.js';

package/dist/views/core/index.js

@@ -0,0 +1,16 @@
+export * from './button/index.js';
+export * from './common/index.js';
+export * from './dialog/index.js';
+export * from './drawer/index.js';
+export * from './icon/index.js';
+export * from './input/index.js';
+export * from './navbar/index.js';
+export * from './no-data/index.js';
+export * from './pagination/index.js';
+export * from './progressbar/index.js';
+export * from './ruler/index.js';
+export * from './sidebar/index.js';
+export * from './screen-detector/index.js';
+export * from './spinner/index.js';
+export * from './text/index.js';
+export * from './toast/index.js';

package/dist/views/core/input/components/checkbox-field/checkbox-field.svelte

@@ -0,0 +1,83 @@
+<script lang="ts">
+	type CheckboxPropsType = {
+		className?: string;
+		containerClassName?: string;
+		desc?: string;
+		descClassName?: string;
+		id?: string;
+		label?: string;
+		labelClassName?: string;
+		name?: string;
+		onChange?: (value: boolean) => void;
+		position?: 'left' | 'right';
+		value?: boolean;
+	};
+
+	let {
+		className,
+		containerClassName,
+		desc,
+		descClassName,
+		id,
+		label,
+		labelClassName,
+		name,
+		onChange,
+		position = 'left',
+		value = $bindable(false)
+	}: CheckboxPropsType = $props();
+
+	let inputRef: HTMLInputElement | null = $state(null);
+
+	export function getElement() {
+		return inputRef;
+	}
+
+	export function select() {
+		return inputRef && (inputRef as HTMLInputElement).select();
+	}
+
+	function handleChange(ev: Event) {
+		if (onChange) {
+			onChange(value);
+		}
+	}
+</script>
+
+{#snippet labelSnippet()}
+	<div class="text-sm leading-6 mx-4 flex-grow">
+		<div class="font-medium text-sm text-neutral-900 dark:text-neutral-100 {labelClassName}">
+			{label || ''}
+		</div>
+		<div class="text-xs text-neutral-500 dark:text-neutral-500 {descClassName}">{desc || ''}</div>
+	</div>
+{/snippet}
+<div class=" {containerClassName}">
+	<label for={id || name} class="flex items-center cursor-pointer select-none">
+		{#if position == 'right'}
+			{@render labelSnippet()}
+		{/if}
+		<input
+			bind:this={inputRef}
+			bind:checked={value}
+			id={id || name}
+			aria-describedby="comments-description"
+			name={name || id}
+			type="checkbox"
+			class="h-6 w-6 appearance-none cursor-pointer rounded color-primary hover:color-primary bg-neutral-200 dark:bg-neutral-700 dark:checked:bg-primary checked:bg-primary checked:focus:bg-primary checked:hover:bg-primary focus:ring-primary focus:shadow-primary outline-primary border-neutral-300 dark:border-neutral-600 {className}"
+			onchange={(ev) => handleChange(ev)}
+		/>
+		{#if position == 'left'}
+			{@render labelSnippet()}
+		{/if}
+	</label>
+</div>
+
+<style>
+	[type='checkbox']:checked {
+		background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
+		background-size: 100% 100%;
+		background-position: center;
+		background-repeat: no-repeat;
+	}
+</style>

package/dist/views/core/input/components/checkbox-field/checkbox-field.svelte.d.ts

@@ -0,0 +1,19 @@
+type CheckboxPropsType = {
+    className?: string;
+    containerClassName?: string;
+    desc?: string;
+    descClassName?: string;
+    id?: string;
+    label?: string;
+    labelClassName?: string;
+    name?: string;
+    onChange?: (value: boolean) => void;
+    position?: 'left' | 'right';
+    value?: boolean;
+};
+declare const CheckboxField: import("svelte").Component<CheckboxPropsType, {
+    getElement: () => HTMLInputElement;
+    select: () => void;
+}, "value">;
+type CheckboxField = ReturnType<typeof CheckboxField>;
+export default CheckboxField;

package/dist/views/core/input/components/color-field/color-field.svelte

@@ -0,0 +1,135 @@
+<script lang="ts">
+	import { ripple } from '../../../../../actions/ripple.js';
+	import { colorToHex, isValidHexColor } from '../../../../../services/index.js';
+	import Icon from '../../../icon/components/icon/icon.svelte';
+	import { mdiSquare } from '../../../icon/index.js';
+	import type { InputFieldProps } from '../../types';
+	import InputField  from '../input-field/input-field.svelte';
+
+	let {
+		id,
+		name,
+		size,
+		appearance,
+		value = $bindable('#000000'),
+		...props
+	}: InputFieldProps & { value?: string } = $props();
+
+	let colorRef: HTMLInputElement;
+
+	let btnIconSizeClassName: string = $derived.by(() => {
+		let className = '';
+		if (size) {
+			switch (size) {
+				case 'lg':
+					className = '!h-7 !w-7';
+					break;
+				case 'md':
+					className = '!h-6 !w-6';
+					break;
+				case 'sm':
+					className = '!h-5 !w-5';
+					break;
+				case 'xs':
+					className = '!h-4 !w-4';
+					break;
+			}
+		}
+		return className;
+	});
+
+	let btnRoundedClassName: string = $derived.by(() => {
+		if (!appearance || appearance == 'normal') {
+			return 'rounded-tr-lg rounded-br-lg';
+		}
+		return '';
+	});
+
+	let colorValue: string = $derived.by(() => {
+		if (isValidHexColor(value)) {
+			return  value;
+		}
+		return '#000000';
+	});
+
+	let inputRef: any | null = $state(null);
+
+	export function focus() {
+		inputRef?.focus();
+	}
+
+	export function getElement() {
+		return inputRef;
+	}
+
+	export function select() {
+		return inputRef && inputRef.select();
+	}
+
+	function handleColorBtnClick() {
+		if (colorRef) {
+			colorRef.click();
+		}
+	}
+
+	function handleColorPickerChange(ev: any) {
+		let input: HTMLInputElement = ev?.target;
+		if (input) {
+			value = input.value;
+		}
+	}
+
+	$effect(() => {
+		if (isValidHexColor(value)) {
+			if (colorRef) {
+				colorRef.value = colorToHex(value);
+			}
+		}
+	});
+</script>
+
+{#snippet colorButton()}
+	<button
+		id="btn-color-picker-{name || id}"
+		type="button"
+		class="h-full px-2 hover:bg-neutral-100 focus:outline-primary dark:hover:bg-neutral-900 {btnRoundedClassName}"
+		use:ripple
+		onclick={handleColorBtnClick}
+	>
+		<Icon path={mdiSquare} color={colorValue} className=" {btnIconSizeClassName} " />
+	</button>
+{/snippet}
+
+<div class="relative">
+	<InputField
+		{...props}
+		type="text"
+		{id}
+		{name}
+		bind:this={inputRef}
+		className="pr-8 {props?.className}"
+		rightSnippet={colorButton}
+		maxlength={9}
+		bind:value={value as string}
+	/>
+
+	<input
+		class="color-input"
+		type="color"
+		placeholder=" "
+		bind:this={colorRef}
+		tabindex={-1}
+		oninput={handleColorPickerChange}
+	/>
+</div>
+
+<style>
+	.color-input {
+		position: absolute;
+		opacity: 0;
+		left: 0;
+		bottom: 0;
+		right: 0;
+		height: 1px;
+	}
+</style>

package/dist/views/core/input/components/color-field/color-field.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { InputFieldProps } from '../../types';
+type $$ComponentProps = InputFieldProps & {
+    value?: string;
+};
+declare const ColorField: import("svelte").Component<$$ComponentProps, {
+    focus: () => void;
+    getElement: () => any;
+    select: () => any;
+}, "value">;
+type ColorField = ReturnType<typeof ColorField>;
+export default ColorField;