@cloudparker/moldex.js 4.1.7 → 4.1.8

package/dist/views/extra/fields/country-combobox-field.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { ComboboxFieldProps, InputFieldProps } from '../../core';
+type Props = {
+    value?: any;
+};
+type $$ComponentProps = ComboboxFieldProps & InputFieldProps & Props;
+declare const CountryComboboxField: import("svelte").Component<$$ComponentProps, {}, "value">;
+type CountryComboboxField = ReturnType<typeof CountryComboboxField>;
+export default CountryComboboxField;

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

@@ -0,0 +1,6 @@
+import CountryComboboxField from "./fields/country-combobox-field.svelte";
+import TextCountry from "./texts/text-country.svelte";
+import TextCountryState from "./texts/text-country-state.svelte";
+import CountryLoader from "./loaders/country-loader.svelte";
+export * from './types';
+export { CountryComboboxField, TextCountry, CountryLoader, TextCountryState, };

package/dist/views/extra/index.js

@@ -0,0 +1,6 @@
+import CountryComboboxField from "./fields/country-combobox-field.svelte";
+import TextCountry from "./texts/text-country.svelte";
+import TextCountryState from "./texts/text-country-state.svelte";
+import CountryLoader from "./loaders/country-loader.svelte";
+export * from './types';
+export { CountryComboboxField, TextCountry, CountryLoader, TextCountryState, };

package/dist/views/extra/loaders/country-loader.svelte

@@ -0,0 +1,38 @@
+ 
+<script lang="ts">
+	import EasyScriptLoader from '@cloudparker/easy-script-loader-svelte';
+	import type { Snippet } from 'svelte';
+	import type { Country } from '../types';
+
+	type Props = {
+		countries?: Country[];
+		onLoad?: (countries?: Country[]) => void;
+		children?: Snippet;
+	};
+
+	let { countries = $bindable([]), onLoad, children }: Props = $props();
+
+	let EasyCountryData: any;
+
+	export async function loadCountries() {
+		if (EasyCountryData) {
+			countries = EasyCountryData.getCountries();
+			onLoad && onLoad(countries);
+		}
+	}
+
+	function handleCountriesLoaded(lib: any) {
+		EasyCountryData = lib;
+		loadCountries();
+	}
+</script>
+
+<EasyScriptLoader
+	scriptUrl="https://cdn.jsdelivr.net/gh/paramanandapradhan/easy-countrydata@main/dist/index.js"
+	scriptName="EasyCountryData"
+	onLoad={handleCountriesLoaded}
+/>
+
+{#if children}
+	{@render children()}
+{/if}

package/dist/views/extra/loaders/country-loader.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { Snippet } from 'svelte';
+import type { Country } from '../types';
+type Props = {
+    countries?: Country[];
+    onLoad?: (countries?: Country[]) => void;
+    children?: Snippet;
+};
+declare const CountryLoader: import("svelte").Component<Props, {
+    loadCountries: () => Promise<void>;
+}, "countries">;
+type CountryLoader = ReturnType<typeof CountryLoader>;
+export default CountryLoader;

package/dist/views/extra/texts/text-country-state.svelte

@@ -0,0 +1,48 @@
+<script lang="ts">
+	import EasyScriptLoader from '@cloudparker/easy-script-loader-svelte';
+	import { BROWSER } from 'esm-env';
+	import { mount, onMount } from 'svelte';
+
+	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();
+	}
+
+	onMount(() => {
+		prepare(input, states);
+	});
+</script>
+
+<EasyScriptLoader
+	scriptName="EasyCountryStateData"
+	scriptUrl="https://cdn.jsdelivr.net/gh/paramanandapradhan/easy-country-state-data@main/dist/index.js"
+	onLoad={handleScriptLoad}
+/>
+
+{#if state}
+	<span> {state?.name || ''} </span>
+{/if}

package/dist/views/extra/texts/text-country-state.svelte.d.ts

@@ -0,0 +1,6 @@
+type $$ComponentProps = {
+    input: string;
+};
+declare const TextCountryState: import("svelte").Component<$$ComponentProps, {}, "">;
+type TextCountryState = ReturnType<typeof TextCountryState>;
+export default TextCountryState;

package/dist/views/extra/texts/text-country.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+	import CountryLoader  from '../loaders/country-loader.svelte';
+	import type { Country } from '../types';
+
+	type Props = {
+		input?: string;
+	};
+
+	let { input }: Props = $props();
+
+	let countries: Country[] = $state([]);
+
+	let country = $derived.by(() => {
+		if (input && countries?.length) {
+			return countries.find((c) => c.isoCode == input);
+		}
+	});
+</script>
+
+<CountryLoader bind:countries>
+    {country?.name || ''}
+</CountryLoader>

package/dist/views/extra/texts/text-country.svelte.d.ts

@@ -0,0 +1,6 @@
+type Props = {
+    input?: string;
+};
+declare const TextCountry: import("svelte").Component<Props, {}, "">;
+type TextCountry = ReturnType<typeof TextCountry>;
+export default TextCountry;

package/dist/views/extra/types.d.ts

@@ -0,0 +1,5 @@
+export type Country = {
+    isoCode: string;
+    dialCode: string;
+    name: string;
+};

package/dist/views/extra/types.js

@@ -0,0 +1 @@
+export {};

package/dist/views/index.d.ts

@@ -0,0 +1,2 @@
+export * from './core/index.js';
+export * from './extra/index.js';

package/dist/views/index.js

@@ -0,0 +1,2 @@
+export * from './core/index.js';
+export * from './extra/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cloudparker/moldex.js",
-    "version": "4.1.7",
+    "version": "4.1.8",
     "keywords": [
         "svelte"
     ],
@@ -12,6 +12,7 @@
         }
     },
     "files": [
+        "dist",
         "src/lib",
         "!src/lib/**/*.test.*",
         "!src/lib/**/*.spec.*"