@cloudparker/moldex.js 0.0.29 → 0.0.31

package/dist/views/core/text/components/text-country-state/text-country-state.svelte

@@ -1,32 +1,40 @@
-<script lang="ts">import "../../../../../tailwind.css";
-import EasyScriptLoader from "@cloudparker/easy-script-loader-svelte";
-import { BROWSER } from "esm-env";
-let { input } = $props();
-let states = $state([]);
-let state = $state(null);
-let EasyCountryStateData;
-async function init() {
-  if (EasyCountryStateData) {
-    states = EasyCountryStateData.getStates() || [];
-  }
-}
-async function prepare(..._) {
-  if (input) {
-    await init();
-    if (states?.length) {
-      state = states.find((o) => o._id == input);
-    }
-  } else {
-    state = null;
-  }
-}
-function handleScriptLoad(ev) {
-  EasyCountryStateData = ev.detail;
-  init();
-}
-$effect(() => {
-  BROWSER && prepare(input, states);
-});
+<script lang="ts">
+	import '../../../../../tailwind.css';
+	import EasyScriptLoader from '@cloudparker/easy-script-loader-svelte';
+	import { BROWSER } from 'esm-env';
+
+	let { input }: { input: string } = $props();
+
+	let states: any[] = $state([]);
+	let state: any | null = $state(null);
+
+	let EasyCountryStateData: any;
+
+	async function init() {
+		if (EasyCountryStateData) {
+			states = EasyCountryStateData.getStates() || [];
+		}
+	}
+
+	async function prepare(..._: any) {
+		if (input) {
+			await init();
+			if (states?.length) {
+				state = states.find((o) => o._id == input);
+			}
+		} else {
+			state = null;
+		}
+	}
+
+	function handleScriptLoad(ev: CustomEvent) {
+		EasyCountryStateData = ev.detail;
+		init();
+	}
+
+	$effect(() => {
+		BROWSER && prepare(input, states);
+	});
 </script>
 
 <EasyScriptLoader

package/dist/views/core/text/components/text-currency/text-currency.svelte

@@ -1,13 +1,24 @@
-<script lang="ts">import "../../../../../tailwind.css";
-import { BROWSER } from "esm-env";
-let { input, symbol = "$", hasSymbol = true } = $props();
-let value = $state("");
-function prepare(..._) {
-  value = Math.abs(input || 0).toFixed(2);
-}
-$effect(() => {
-  BROWSER && prepare(input);
-});
+<script lang="ts">
+	import '../../../../../tailwind.css';
+	import { BROWSER } from 'esm-env';
+
+	type PropsType = {
+		input: number;
+		symbol: string;
+		hasSymbol: boolean;
+	};
+
+	let { input, symbol = '$', hasSymbol = true }: PropsType = $props();
+
+	let value: string = $state('');
+
+	function prepare(..._: any) {
+		value = Math.abs(input || 0).toFixed(2);
+	}
+
+	$effect(() => {
+		BROWSER && prepare(input);
+	});
 </script>
 
 <span>

package/dist/views/core/text/components/text-date/text-date.svelte

@@ -1,24 +1,36 @@
-<script lang="ts">import "../../../../../tailwind.css";
-import { dateFormat, dateToAgo, toDate } from "../../../../../services";
-import { BROWSER } from "esm-env";
-let { input, format = "DD-MM-YYYY hh:mm a" } = $props();
-let dateString = $state("");
-function prepareDate(..._) {
-  let date;
-  if (input) {
-    date = toDate(input);
-  }
-  if (date) {
-    if (format == "ago") {
-      dateString = dateToAgo(date);
-    } else {
-      dateString = dateFormat(date, format);
-    }
-  }
-}
-$effect(() => {
-  BROWSER && prepareDate(input);
-});
+<script lang="ts">
+	import '../../../../../tailwind.css';
+	import { dateFormat, dateToAgo, toDate } from '../../../../../services';
+
+	import { BROWSER } from 'esm-env';
+
+	type PropsType = {
+		input: Date | number | string | { seconds: number; nanoseconds: number };
+		format?: 'ago' | string;
+	};
+
+	let { input, format = 'DD-MM-YYYY hh:mm a' }: PropsType = $props();
+
+	let dateString: string = $state('');
+
+	function prepareDate(..._: any) {
+		// console.log('date data', data);
+		let date: Date | undefined;
+		if (input) {
+			date = toDate(input);
+		}
+		if (date) {
+			if (format == 'ago') {
+				dateString = dateToAgo(date)!;
+			} else {
+				dateString = dateFormat(date, format)!;
+			}
+		}
+	}
+
+	$effect(() => {
+		BROWSER && prepareDate(input);
+	});
 </script>
 
 <span>

package/dist/views/core/text/components/text-email/text-email.svelte

@@ -1,7 +1,16 @@
-<script lang="ts">import "../../../../../tailwind.css";
-import { ripple } from "../../../../../actions";
-import { Icon, mdiEmailOutline } from "../../../icon";
-let { input, buttonClassName, iconClassName, iconPath = mdiEmailOutline } = $props();
+<script lang="ts">
+	import '../../../../../tailwind.css';
+	import { ripple } from '../../../../../actions';
+	import { Icon, mdiEmailOutline } from '../../../icon';
+	 
+	type PropsType = {
+		input: string;
+		buttonClassName?: string;
+		iconPath?: string;
+		iconClassName?: string;
+	};
+
+	let { input, buttonClassName, iconClassName, iconPath = mdiEmailOutline }: PropsType = $props();
 </script>
 
 <span class="flex items-center">

package/dist/views/core/text/components/text-html/text-html.svelte

@@ -1,5 +1,6 @@
-<script lang="ts">import "../../../../../tailwind.css";
-let { input } = $props();
+<script lang="ts">
+	import '../../../../../tailwind.css';
+	let { input }: { input: string } = $props();
 </script>
 
 <span>

package/dist/views/core/text/components/text-phone/text-phone.svelte

@@ -1,7 +1,16 @@
-<script lang="ts">import { mdiPhone } from "../../../icon";
-import Icon from "../../../icon/components/icon/icon.svelte";
-import "../../../../../tailwind.css";
-let { input, buttonClassName, iconClassName, iconPath = mdiPhone } = $props();
+<script lang="ts">
+	import { mdiPhone } from '../../../icon';
+	import Icon from '../../../icon/components/icon/icon.svelte';
+	import '../../../../../tailwind.css';
+
+	type PropsType = {
+		input: string;
+		buttonClassName?: string;
+		iconPath?: string;
+		iconClassName?: string;
+	};
+
+	let { input, buttonClassName, iconClassName, iconPath = mdiPhone }: PropsType = $props();
 </script>
 
 <span class="flex items-center">

package/dist/views/core/toast/components/toast/toast.svelte

@@ -1,24 +1,47 @@
-<script module lang="ts"></script>
-
-<script lang="ts">import "../../../../../tailwind.css";
-let isPlaced = $state(false);
-let isOpened = $state(false);
-let { id, msg, duration = 3e3, className, children } = $props();
-export function openToast() {
-  isPlaced = true;
-  setTimeout(() => {
-    isOpened = true;
-    setTimeout(() => {
-      closeClose();
-    }, duration);
-  }, 0);
-}
-export function closeClose() {
-  isOpened = false;
-  setTimeout(() => {
-    isPlaced = false;
-  }, 300);
-}
+<script module lang="ts">
+	import type { Snippet } from 'svelte';
+
+	export type ToastPropsType = {
+		id?: string;
+		msg: string;
+		duration?: number;
+		className?: string;
+		children?: Snippet;
+	};
+</script>
+
+<script lang="ts">
+	import '../../../../../tailwind.css';
+
+	let isPlaced: boolean = $state(false);
+	let isOpened: boolean = $state(false);
+
+	let { id, msg, duration = 3000, className, children }: ToastPropsType = $props();
+
+	// export function toggleDialog() {
+	// 	if (isOpened) {
+	// 		closeDialog();
+	// 	} else {
+	// 		openDialog();
+	// 	}
+	// }
+
+	export function openToast() {
+		isPlaced = true;
+		setTimeout(() => {
+			isOpened = true;
+			setTimeout(() => {
+				closeClose();
+			}, duration);
+		}, 0);
+	}
+
+	export function closeClose() {
+		isOpened = false;
+		setTimeout(() => {
+			isPlaced = false;
+		}, 300);
+	}
 </script>
 
 {#if isPlaced}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cloudparker/moldex.js",
-    "version": "0.0.29",
+    "version": "0.0.31",
     "author": "cloudparker.com",
     "license": "MIT",
     "keywords": [