flowbite-svelte 0.11.1 → 0.12.2

package/timelines/Group.svelte.d.ts

@@ -0,0 +1,20 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        divClass?: string;
+        timeClass?: string;
+        date: Date | string;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export declare type GroupProps = typeof __propDef.props;
+export declare type GroupEvents = typeof __propDef.events;
+export declare type GroupSlots = typeof __propDef.slots;
+export default class Group extends SvelteComponentTyped<GroupProps, GroupEvents, GroupSlots> {
+}
+export {};

package/timelines/GroupItem.svelte

@@ -0,0 +1,49 @@
+<script >export let timelines;
+</script>
+
+{#each timelines as { title, src, alt, isPrivate, href, comment }}
+	<li>
+		<a {href} class="block items-center p-3 sm:flex hover:bg-gray-100 dark:hover:bg-gray-700">
+			<img class="mr-3 mb-3 w-12 h-12 rounded-full sm:mb-0" {src} {alt} />
+			<div class="text-gray-600 dark:text-gray-400">
+				<div class="text-base font-normal">
+					{@html title}
+				</div>
+				{#if comment}
+					<div class="text-sm font-normal">{comment}</div>
+				{/if}
+				<span class="inline-flex items-center text-xs font-normal text-gray-500 dark:text-gray-400">
+					{#if isPrivate}
+						<svg
+							class="mr-1 w-3 h-3"
+							fill="currentColor"
+							viewBox="0 0 20 20"
+							xmlns="http://www.w3.org/2000/svg"
+							><path
+								fill-rule="evenodd"
+								d="M3.707 2.293a1 1 0 00-1.414 1.414l14 14a1 1 0 001.414-1.414l-1.473-1.473A10.014 10.014 0 0019.542 10C18.268 5.943 14.478 3 10 3a9.958 9.958 0 00-4.512 1.074l-1.78-1.781zm4.261 4.26l1.514 1.515a2.003 2.003 0 012.45 2.45l1.514 1.514a4 4 0 00-5.478-5.478z"
+								clip-rule="evenodd"
+							/><path
+								d="M12.454 16.697L9.75 13.992a4 4 0 01-3.742-3.741L2.335 6.578A9.98 9.98 0 00.458 10c1.274 4.057 5.065 7 9.542 7 .847 0 1.669-.105 2.454-.303z"
+							/></svg
+						>
+						Private
+					{:else}
+						<svg
+							class="mr-1 w-3 h-3"
+							fill="currentColor"
+							viewBox="0 0 20 20"
+							xmlns="http://www.w3.org/2000/svg"
+							><path
+								fill-rule="evenodd"
+								d="M4.083 9h1.946c.089-1.546.383-2.97.837-4.118A6.004 6.004 0 004.083 9zM10 2a8 8 0 100 16 8 8 0 000-16zm0 2c-.076 0-.232.032-.465.262-.238.234-.497.623-.737 1.182-.389.907-.673 2.142-.766 3.556h3.936c-.093-1.414-.377-2.649-.766-3.556-.24-.56-.5-.948-.737-1.182C10.232 4.032 10.076 4 10 4zm3.971 5c-.089-1.546-.383-2.97-.837-4.118A6.004 6.004 0 0115.917 9h-1.946zm-2.003 2H8.032c.093 1.414.377 2.649.766 3.556.24.56.5.948.737 1.182.233.23.389.262.465.262.076 0 .232-.032.465-.262.238-.234.498-.623.737-1.182.389-.907.673-2.142.766-3.556zm1.166 4.118c.454-1.147.748-2.572.837-4.118h1.946a6.004 6.004 0 01-2.783 4.118zm-6.268 0C6.412 13.97 6.118 12.546 6.03 11H4.083a6.004 6.004 0 002.783 4.118z"
+								clip-rule="evenodd"
+							/></svg
+						>
+						Public
+					{/if}
+				</span>
+			</div>
+		</a>
+	</li>
+{/each}

package/timelines/GroupItem.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponentTyped } from "svelte";
+import type { GroupTimelineType } from '../types';
+declare const __propDef: {
+    props: {
+        timelines: GroupTimelineType[];
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type GroupItemProps = typeof __propDef.props;
+export declare type GroupItemEvents = typeof __propDef.events;
+export declare type GroupItemSlots = typeof __propDef.slots;
+export default class GroupItem extends SvelteComponentTyped<GroupItemProps, GroupItemEvents, GroupItemSlots> {
+}
+export {};

package/timelines/TimelineItemHorizontal.svelte

@@ -1,13 +1,27 @@
 <script >export let timelineItems;
 </script>
 
-{#each timelineItems as { date, title, text, href, linkname, icon }}
+{#each timelineItems as { date, title, text, icon }}
 	<li class="relative mb-6 sm:mb-0">
 		<div class="flex items-center">
 			<div
 				class="flex z-10 justify-center items-center w-6 h-6 bg-blue-200 rounded-full ring-0 ring-white dark:bg-blue-900 sm:ring-8 dark:ring-gray-900 shrink-0"
 			>
-				{icon}
+				{#if icon}
+					<svelte:component this={icon} className="h-4 w-4" />
+				{:else}
+					<svg
+						class="w-3 h-3 text-blue-600 dark:text-blue-300"
+						fill="currentColor"
+						viewBox="0 0 20 20"
+						xmlns="http://www.w3.org/2000/svg"
+						><path
+							fill-rule="evenodd"
+							d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
+							clip-rule="evenodd"
+						/></svg
+					>
+				{/if}
 			</div>
 			<div class="hidden sm:flex w-full bg-gray-200 h-0.5 dark:bg-gray-700" />
 		</div>
@@ -19,24 +33,6 @@
 			<p class="text-base font-normal text-gray-500 dark:text-gray-400">
 				{text}
 			</p>
-			{#if href}
-				<a
-					{href}
-					class="inline-flex items-center py-2 px-4 text-sm font-medium text-gray-900 bg-white rounded-lg border border-gray-200 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-4 focus:outline-none focus:ring-gray-200 focus:text-blue-700 dark:bg-gray-800 dark:text-gray-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700 dark:focus:ring-gray-700"
-					>{linkname}
-					<svg
-						class="ml-2 w-3 h-3"
-						fill="currentColor"
-						viewBox="0 0 20 20"
-						xmlns="http://www.w3.org/2000/svg"
-						><path
-							fill-rule="evenodd"
-							d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z"
-							clip-rule="evenodd"
-						/></svg
-					></a
-				>
-			{/if}
 		</div>
 	</li>
 {/each}

package/timelines/TimelineItemHorizontal.svelte.d.ts

@@ -1,8 +1,8 @@
 import { SvelteComponentTyped } from "svelte";
-import type { TimelineItemType } from '../types';
+import type { TimelineItemHorizontalType } from '../types';
 declare const __propDef: {
     props: {
-        timelineItems: TimelineItemType[];
+        timelineItems: TimelineItemHorizontalType[];
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/timelines/TimelineItemVertical.svelte

@@ -6,7 +6,21 @@
 		<span
 			class="flex absolute -left-3 justify-center items-center w-6 h-6 bg-blue-200 rounded-full ring-8 ring-white dark:ring-gray-900 dark:bg-blue-900"
 		>
-			<svelte:component this={icon} className="h-4 w-4" />
+			{#if icon}
+				<svelte:component this={icon} className="h-4 w-4" />
+			{:else}
+				<svg
+					class="w-3 h-3 text-blue-600 dark:text-blue-300"
+					fill="currentColor"
+					viewBox="0 0 20 20"
+					xmlns="http://www.w3.org/2000/svg"
+					><path
+						fill-rule="evenodd"
+						d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
+						clip-rule="evenodd"
+					/></svg
+				>
+			{/if}
 		</span>
 
 		<h3 class="flex items-center mb-1 text-lg font-semibold text-gray-900 dark:text-white">

package/types.d.ts

@@ -43,18 +43,28 @@ export interface TabType {
     href: string;
     rel?: string;
 }
+export interface IconTabType {
+    name: string;
+    active: boolean;
+    href: string;
+    rel?: string;
+    icon?: typeof SvelteComponent;
+}
 export interface InteractiveTabType {
     name: string;
     id: number;
     content: string | typeof SvelteComponent;
 }
+export interface TabHeadType {
+    name: string;
+    id: number;
+}
 export interface PillTabType {
     name: string;
     selected: boolean;
     href: string;
 }
 export interface NavbarType {
-    id: number;
     name: string;
     href: string;
     rel?: string;
@@ -121,8 +131,33 @@ export interface TimelineItemType {
 export interface TimelineItemVerticalType {
     date: Date | string;
     title: string;
-    icon: typeof SvelteComponent;
+    icon?: typeof SvelteComponent;
     href?: string;
     linkname?: string;
     text?: HTMLElement | string;
 }
+export interface TimelineItemHorizontalType {
+    date: Date | string;
+    title: string;
+    icon?: typeof SvelteComponent;
+    text?: HTMLElement | string;
+}
+export interface ActivityType {
+    title: HTMLElement | string;
+    date: Date | string;
+    src: string;
+    alt: string;
+    text?: HTMLElement | string;
+}
+export interface GroupTimelineType {
+    title: string | HTMLElement;
+    src: string;
+    alt: string;
+    href?: string;
+    isPrivate?: boolean;
+    comment?: string | HTMLElement;
+}
+export interface PageType {
+    pageNum: number;
+    href: string;
+}