flowbite-svelte 0.15.20 → 0.15.23

package/alerts/BorderAlert.svelte

@@ -1,79 +0,0 @@
-<script>export let color = 'blue';
-export let alertId = 'alert-border-1';
-export let closeBtn = false;
-let hidden = false;
-const handleHide = () => {
-    hidden = !hidden;
-};
-let divClass;
-let svgClass;
-let slotClass;
-let buttonClass;
-if (color === 'blue') {
-    divClass = 'flex p-4 mb-4 bg-blue-100 border-t-4 border-blue-500 dark:bg-blue-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-blue-700';
-    slotClass = 'ml-3 text-sm font-medium text-blue-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-blue-100 text-blue-500 rounded-lg focus:ring-2 focus:ring-blue-400 p-1.5 hover:bg-blue-200 inline-flex h-8 w-8 dark:bg-blue-200 dark:text-blue-600 dark:hover:bg-blue-300';
-}
-else if (color === 'gray') {
-    divClass = 'flex p-4 mb-4 bg-gray-100 border-t-4 border-gray-500 dark:bg-gray-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-gray-700';
-    slotClass = 'ml-3 text-sm font-medium text-gray-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-gray-100 text-gray-500 rounded-lg focus:ring-2 focus:ring-gray-400 p-1.5 hover:bg-gray-200 inline-flex h-8 w-8 dark:bg-gray-200 dark:text-gray-600 dark:hover:bg-gray-300';
-}
-else if (color === 'red') {
-    divClass = 'flex p-4 mb-4 bg-red-100 border-t-4 border-red-500 dark:bg-red-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-red-700';
-    slotClass = 'ml-3 text-sm font-medium text-red-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-red-100 text-red-500 rounded-lg focus:ring-2 focus:ring-red-400 p-1.5 hover:bg-red-200 inline-flex h-8 w-8 dark:bg-red-200 dark:text-red-600 dark:hover:bg-red-300';
-}
-else if (color === 'yellow') {
-    divClass = 'flex p-4 mb-4 bg-yellow-100 border-t-4 border-yellow-500 dark:bg-yellow-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-yellow-700';
-    slotClass = 'ml-3 text-sm font-medium text-yellow-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-yellow-100 text-yellow-500 rounded-lg focus:ring-2 focus:ring-yellow-400 p-1.5 hover:bg-yellow-200 inline-flex h-8 w-8 dark:bg-yellow-200 dark:text-yellow-600 dark:hover:bg-yellow-300';
-}
-else if (color === 'green') {
-    divClass = 'flex p-4 mb-4 bg-green-100 border-t-4 border-green-500 dark:bg-green-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-green-700';
-    slotClass = 'ml-3 text-sm font-medium text-green-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-green-100 text-green-500 rounded-lg focus:ring-2 focus:ring-green-400 p-1.5 hover:bg-green-200 inline-flex h-8 w-8 dark:bg-green-200 dark:text-green-600 dark:hover:bg-green-300';
-}
-else if (color === 'indigo') {
-    divClass = 'flex p-4 mb-4 bg-indigo-100 border-t-4 border-indigo-500 dark:bg-indigo-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-indigo-700';
-    slotClass = 'ml-3 text-sm font-medium text-indigo-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-indigo-100 text-indigo-500 rounded-lg focus:ring-2 focus:ring-indigo-400 p-1.5 hover:bg-indigo-200 inline-flex h-8 w-8 dark:bg-indigo-200 dark:text-indigo-600 dark:hover:bg-indigo-300';
-}
-else if (color === 'purple') {
-    divClass = 'flex p-4 mb-4 bg-purple-100 border-t-4 border-purple-500 dark:bg-purple-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-purple-700';
-    slotClass = 'ml-3 text-sm font-medium text-purple-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-purple-100 text-purple-500 rounded-lg focus:ring-2 focus:ring-purple-400 p-1.5 hover:bg-purple-200 inline-flex h-8 w-8 dark:bg-purple-200 dark:text-purple-600 dark:hover:bg-purple-300';
-}
-else if (color === 'pink') {
-    divClass = 'flex p-4 mb-4 bg-pink-100 border-t-4 border-pink-500 dark:bg-pink-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-pink-700';
-    slotClass = 'ml-3 text-sm font-medium text-pink-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-pink-100 text-pink-500 rounded-lg focus:ring-2 focus:ring-pink-400 p-1.5 hover:bg-pink-200 inline-flex h-8 w-8 dark:bg-pink-200 dark:text-pink-600 dark:hover:bg-pink-300';
-}
-else {
-    divClass = 'flex p-4 mb-4 bg-blue-100 border-t-4 border-blue-500 dark:bg-blue-200';
-    svgClass = 'flex-shrink-0 w-5 h-5 text-blue-700';
-    slotClass = 'ml-3 text-sm font-medium text-blue-700';
-    buttonClass = 'ml-auto -mx-1.5 -my-1.5 bg-gray-100 text-gray-500 rounded-lg focus:ring-2 focus:ring-gray-400 p-1.5 hover:bg-gray-200 inline-flex h-8 w-8 dark:bg-gray-200 dark:text-gray-600 dark:hover:bg-gray-300';
-}
-</script>
-
-<div id={alertId} class:hidden class={divClass} role="alert">
-	<svg class={svgClass} fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd" /></svg>
-	<div class={slotClass}>
-		<slot />
-	</div>
-	{#if closeBtn}
-		<button on:click={handleHide} type="button" class={buttonClass} aria-label="Close">
-			<span class="sr-only">Dismiss</span>
-			<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" /></svg>
-		</button>
-	{/if}
-</div>

package/alerts/BorderAlert.svelte.d.ts

@@ -1,21 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Colors } from '../types';
-declare const __propDef: {
-    props: {
-        color?: Colors;
-        alertId?: string;
-        closeBtn?: boolean;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export declare type BorderAlertProps = typeof __propDef.props;
-export declare type BorderAlertEvents = typeof __propDef.events;
-export declare type BorderAlertSlots = typeof __propDef.slots;
-export default class BorderAlert extends SvelteComponentTyped<BorderAlertProps, BorderAlertEvents, BorderAlertSlots> {
-}
-export {};

package/alerts/InfoAlert.svelte

@@ -1,120 +0,0 @@
-<script>export let color = 'blue';
-export let alertId = 'alert-additional-content-1';
-export let infoLink = undefined;
-export let closeBtn = false;
-let hidden = false;
-const handleHide = () => {
-    hidden = !hidden;
-};
-let divClass;
-let svgClass;
-let slotClass;
-let buttonClass;
-if (color === 'blue') {
-    divClass = 'p-4 mb-4 bg-blue-100 rounded-lg dark:bg-blue-200';
-    svgClass = 'mr-2 w-5 h-5 text-blue-700 dark:text-blue-800';
-    slotClass = 'mt-2 mb-4 text-sm text-blue-700 dark:text-blue-800';
-    buttonClass =
-        'text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-blue-800 dark:hover:bg-blue-900';
-}
-else if (color === 'gray') {
-    divClass = 'p-4 mb-4 bg-gray-100 rounded-lg dark:bg-gray-200';
-    svgClass = 'mr-2 w-5 h-5 text-gray-700 dark:text-gray-800';
-    slotClass = 'mt-2 mb-4 text-sm text-gray-700 dark:text-gray-800';
-    buttonClass =
-        'text-white bg-gray-700 hover:bg-gray-800 focus:ring-4 focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-gray-800 dark:hover:bg-gray-900';
-}
-else if (color === 'red') {
-    divClass = 'p-4 mb-4 bg-red-100 rounded-lg dark:bg-red-200';
-    svgClass = 'mr-2 w-5 h-5 text-red-700 dark:text-red-800';
-    slotClass = 'mt-2 mb-4 text-sm text-red-700 dark:text-red-800';
-    buttonClass =
-        'text-white bg-red-700 hover:bg-red-800 focus:ring-4 focus:ring-red-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-red-800 dark:hover:bg-red-900';
-}
-else if (color === 'yellow') {
-    divClass = 'p-4 mb-4 bg-yellow-100 rounded-lg dark:bg-yellow-200';
-    svgClass = 'mr-2 w-5 h-5 text-yellow-700 dark:text-yellow-800';
-    slotClass = 'mt-2 mb-4 text-sm text-yellow-700 dark:text-yellow-800';
-    buttonClass =
-        'text-white bg-yellow-700 hover:bg-yellow-800 focus:ring-4 focus:ring-yellow-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-yellow-800 dark:hover:bg-yellow-900';
-}
-else if (color === 'green') {
-    divClass = 'p-4 mb-4 bg-green-100 rounded-lg dark:bg-green-200';
-    svgClass = 'mr-2 w-5 h-5 text-green-700 dark:text-green-800';
-    slotClass = 'mt-2 mb-4 text-sm text-green-700 dark:text-green-800';
-    buttonClass =
-        'text-white bg-green-700 hover:bg-green-800 focus:ring-4 focus:ring-green-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-green-800 dark:hover:bg-green-900';
-}
-else if (color === 'indigo') {
-    divClass = 'p-4 mb-4 bg-indigo-100 rounded-lg dark:bg-indigo-200';
-    svgClass = 'mr-2 w-5 h-5 text-indigo-700 dark:text-indigo-800';
-    slotClass = 'mt-2 mb-4 text-sm text-indigo-700 dark:text-indigo-800';
-    buttonClass =
-        'text-white bg-indigo-700 hover:bg-indigo-800 focus:ring-4 focus:ring-indigo-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-indigo-800 dark:hover:bg-indigo-900';
-}
-else if (color === 'purple') {
-    divClass = 'p-4 mb-4 bg-purple-100 rounded-lg dark:bg-purple-200';
-    svgClass = 'mr-2 w-5 h-5 text-purple-700 dark:text-purple-800';
-    slotClass = 'mt-2 mb-4 text-sm text-purple-700 dark:text-purple-800';
-    buttonClass =
-        'text-white bg-purple-700 hover:bg-purple-800 focus:ring-4 focus:ring-purple-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-purple-800 dark:hover:bg-purple-900';
-}
-else if (color === 'pink') {
-    divClass = 'p-4 mb-4 bg-pink-100 rounded-lg dark:bg-pink-200';
-    svgClass = 'mr-2 w-5 h-5 text-pink-700 dark:text-pink-800';
-    slotClass = 'mt-2 mb-4 text-sm text-pink-700 dark:text-pink-800';
-    buttonClass =
-        'text-white bg-pink-700 hover:bg-pink-800 focus:ring-4 focus:ring-pink-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-pink-800 dark:hover:bg-pink-900';
-}
-else {
-    divClass = 'p-4 mb-4 bg-blue-100 rounded-lg dark:bg-blue-200';
-    svgClass = 'mr-2 w-5 h-5 text-blue-700 dark:text-blue-800';
-    slotClass = 'mt-2 mb-4 text-sm text-blue-700 dark:text-blue-800';
-    buttonClass =
-        'text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-blue-800 dark:hover:bg-blue-900';
-}
-</script>
-
-<div id={alertId} class:hidden class={divClass} role="alert">
-	<div class="flex items-center">
-		<svg class={svgClass} fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"
-			><path
-				fill-rule="evenodd"
-				d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z"
-				clip-rule="evenodd"
-			/></svg
-		>
-		<h3 class="text-lg font-medium text-{color}-700 dark:text-{color}-800">
-			<slot name="header">No header was provided</slot>
-		</h3>
-	</div>
-	<div class={slotClass}>
-		<slot>No content was provided.</slot>
-	</div>
-	<div class="flex">
-		{#if infoLink}
-			<button
-				type="button"
-				class="text-white bg-{color}-700 hover:bg-{color}-800 focus:ring-4 focus:ring-{color}-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center inline-flex items-center dark:bg-{color}-800 dark:hover:bg-{color}-900"
-			>
-				<svg
-					class="-ml-0.5 mr-2 h-4 w-4"
-					fill="currentColor"
-					viewBox="0 0 20 20"
-					xmlns="http://www.w3.org/2000/svg"
-					><path d="M10 12a2 2 0 100-4 2 2 0 000 4z" /><path
-						fill-rule="evenodd"
-						d="M.458 10C1.732 5.943 5.522 3 10 3s8.268 2.943 9.542 7c-1.274 4.057-5.064 7-9.542 7S1.732 14.057.458 10zM14 10a4 4 0 11-8 0 4 4 0 018 0z"
-						clip-rule="evenodd"
-					/></svg
-				>
-				<a href={infoLink} rel="external">View more</a>
-			</button>
-		{/if}
-		{#if closeBtn}
-			<button on:click={handleHide} type="button" class={buttonClass} aria-label="Close">
-				Dismiss
-			</button>
-		{/if}
-	</div>
-</div>

package/alerts/InfoAlert.svelte.d.ts

@@ -1,23 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Colors } from '../types';
-declare const __propDef: {
-    props: {
-        color?: Colors;
-        alertId?: string;
-        infoLink?: string;
-        closeBtn?: boolean;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        header: {};
-        default: {};
-    };
-};
-export declare type InfoAlertProps = typeof __propDef.props;
-export declare type InfoAlertEvents = typeof __propDef.events;
-export declare type InfoAlertSlots = typeof __propDef.slots;
-export default class InfoAlert extends SvelteComponentTyped<InfoAlertProps, InfoAlertEvents, InfoAlertSlots> {
-}
-export {};