flowbite-svelte 0.22.2 → 0.22.3

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.22.3](https://github.com/themesberg/flowbite-svelte/compare/v0.22.2...v0.22.3) (2022-07-21)
+
+
+### Bug Fixes
+
+* for [#165](https://github.com/themesberg/flowbite-svelte/issues/165) and [#170](https://github.com/themesberg/flowbite-svelte/issues/170) and changed $$restProps.class to $$props.class ([99399b8](https://github.com/themesberg/flowbite-svelte/commit/99399b8aebdec68bc5c52641ed768dc601fe36a2))
+
 ### [0.22.2](https://github.com/themesberg/flowbite-svelte/compare/v0.22.1...v0.22.2) (2022-07-21)
 
 

package/dropdowns/Dropdown.svelte

@@ -35,14 +35,7 @@ $: icon = icons[placement.split('-')[0]];
 				{/if}
 			</button>
 		{:else}
-			<Button
-				pill={$$props.pill}
-				outline={$$props.outline}
-				color={$$props.color}
-				size={$$props.size}
-				icon={$$props.icon}
-				gradient={$$props.gradient}
-			>
+			<Button {...$$restProps}>
 				<slot name="label">{label}</slot>
 				{#if arrowIcon}
 					<svelte:component this={icon ?? ChevronDown} class="ml-2 h-4 w-4" />

package/forms/Checkbox.svelte

@@ -30,13 +30,13 @@ $: {
 }
 </script>
 
-<Label class={labelClass(inline, $$restProps.class)} show={!!$$slots.default}>
+<Label class={labelClass(inline, $$props.class)} show={!!$$slots.default}>
 	<input
 		type="checkbox"
 		bind:checked
 		on:click
 		{value}
 		{...$$restProps}
-		class={inputClass(custom, color, true, tinted, $$slots.default || $$restProps.class)}
+		class={inputClass(custom, color, true, tinted, $$slots.default || $$props.class)}
 	/><slot />
 </Label>

package/forms/Radio.svelte

@@ -35,13 +35,13 @@ export let group = '';
 export let value = '';
 </script>
 
-<Label class={labelClass(inline, $$restProps.class)} show={!!$$slots.default}>
+<Label class={labelClass(inline, $$props.class)} show={!!$$slots.default}>
 	<input
 		type="radio"
 		bind:group
 		on:click
 		{value}
 		{...$$restProps}
-		class={inputClass(custom, color, false, tinted, $$slots.default || $$restProps.class)}
+		class={inputClass(custom, color, false, tinted, $$slots.default || $$props.class)}
 	/><slot />
 </Label>

package/forms/SimpleSearch.svelte

@@ -2,9 +2,10 @@
 export let labelClass = 'sr-only';
 export let iconClass = 'w-5 h-5 text-gray-500 dark:text-gray-400';
 export let iconDivClass = 'flex absolute inset-y-0 left-0 items-center pl-3 pointer-events-none';
-export let inputClass = 'bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5  dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500';
+export let inputClass = 'bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500';
 export let btnClass = 'p-2.5 ml-2 text-sm font-medium text-white bg-blue-700 rounded-lg border border-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800';
 export let placeholder = 'Search';
+export let tinted = false;
 </script>
 
 <form class="flex items-center" on:submit>
@@ -23,7 +24,15 @@ export let placeholder = 'Search';
 				/></svg
 			>
 		</div>
-		<input {...$$restProps} type="text" {id} class={inputClass} {placeholder} />
+		<input
+			{...$$restProps}
+			type="text"
+			{id}
+			class="{tinted
+				? 'dark:bg-gray-600 dark:border-gray-500'
+				: ' dark:bg-gray-700 dark:border-gray-600'} {inputClass}"
+			{placeholder}
+		/>
 	</div>
 	<button type="submit" class={btnClass}
 		><svg

package/forms/SimpleSearch.svelte.d.ts

@@ -9,6 +9,7 @@ declare const __propDef: {
         inputClass?: string;
         btnClass?: string;
         placeholder?: string;
+        tinted?: boolean;
     };
     events: {
         submit: SubmitEvent;

package/forms/Toggle.svelte.d.ts

@@ -3,7 +3,7 @@ declare const __propDef: {
     props: {
         [x: string]: any;
         size?: 'small' | 'default' | 'large';
-        value?: string | number;
+        value?: string;
     };
     events: {
         click: MouseEvent;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flowbite-svelte",
-  "version": "0.22.2",
+  "version": "0.22.3",
   "description": "Flowbite components for Svelte",
   "main": "index.js",
   "author": {