svelte component

App.svelte

<script>
	import Greet from "./Greet.svelte";
	
	let config4Pants = {
		name: "Pants",
		greeting: "What's up!"
	},
	config4Son = {
		name: "Son",
		greeting: "Sup?"
	}	
</script>

<Greet />
<Greet {...config4Pants} />
<Greet name="Bro" greeting="Top of the morn to ya" />
<Greet {...config4Son} />

Greet.svelte

<script>
	let marks = "!?",
	    name = "homie", 
      	    greeting = "How's it hangin",
	    defaultMark = ".",	 
	    // FIXME: functionalize
	    mark = marks.split('').find(function(mark){
		var substr = greeting.substring(greeting.length - 1, greeting.length),
		    isMark = substr === mark;	
		if (isMark) {
		    return substr;
		}
	    }) || defaultMark,
	    markSection = mark !== defaultMark ? greeting.slice(greeting[0], greeting.length - 1) : undefined,
	    rawGreeting = markSection || greeting;
	
	export {name, greeting, rawGreeting, mark};
</script>


<p>
	{rawGreeting}, {name}{mark}
</p>