flowbite-svelte 0.44.1 → 0.44.4

package/dist/timeline/TimelineItem.svelte

@@ -102,56 +102,10 @@ const h3Cls = twMerge(order === 'vertical' ? 'flex items-center mb-1 text-lg fon
 </li>
 
 <!--
-  @component
-  ## Features
-  [Go to Timeline](https://flowbite-svelte.com/docs/components/timeline)
-  - Setup
-  - Default timeline
-  - Vertical Timeline
-  - Horizontal Timeline
-  - Activity Log
-  - Grouped timeline
-  ## Props
-  @prop title: string = '';
-  @prop date: string = '';
-  @prop svgCl
-  ## Example
-  ```
-  <script>
-    import { Timeline, TimelineItem, Button } from 'flowbite-svelte';
-  </script>
-  
-  <Timeline>
-    <TimelineItem title="Application UI code in Tailwind CSS" date="February 2022">
-      <p class="mb-4 text-base font-normal text-gray-500 dark:text-gray-400">
-        Get access to over 20+ pages including a dashboard layout, charts, kanban board, calendar,
-        and pre-order E-commerce & Marketing pages.
-      </p>
-      <Button color="alternative"
-        >Learn more<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
-        ></Button>
-    </TimelineItem>
-    <TimelineItem title="Application UI code in Tailwind CSS" date="March 2022">
-      <p class="text-base font-normal text-gray-500 dark:text-gray-400">
-        All of the pages and components are first designed in Figma and we keep a parity between the
-        two versions even as we update the project.
-      </p>
-    </TimelineItem>
-    <TimelineItem title="Application UI code in Tailwind CSS" date="April 2022">
-      <p class="text-base font-normal text-gray-500 dark:text-gray-400">
-        Get started with dozens of web components and interactive elements built on top of Tailwind
-        CSS.
-      </p>
-    </TimelineItem>
-  </Timeline>
-  ```
-  
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let title: string = '';
+@prop export let date: string = '';
+@prop export let svgClass: string = 'w-3 h-3 text-primary-600 dark:text-primary-400';
 -->

package/dist/timeline/TimelineItem.svelte.d.ts

@@ -18,56 +18,11 @@ export type TimelineItemProps = typeof __propDef.props;
 export type TimelineItemEvents = typeof __propDef.events;
 export type TimelineItemSlots = typeof __propDef.slots;
 /**
- * ## Features
- * [Go to Timeline](https://flowbite-svelte.com/docs/components/timeline)
- * - Setup
- * - Default timeline
- * - Vertical Timeline
- * - Horizontal Timeline
- * - Activity Log
- * - Grouped timeline
+ * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop title: string = '';
- * @prop date: string = '';
- * @prop svgCl
- * ## Example
- * ```
- * <script>
- *   import { Timeline, TimelineItem, Button } from 'flowbite-svelte';
- * </script>
- *
- * <Timeline>
- *   <TimelineItem title="Application UI code in Tailwind CSS" date="February 2022">
- *     <p class="mb-4 text-base font-normal text-gray-500 dark:text-gray-400">
- *       Get access to over 20+ pages including a dashboard layout, charts, kanban board, calendar,
- *       and pre-order E-commerce & Marketing pages.
- *     </p>
- *     <Button color="alternative"
- *       >Learn more<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
- *       ></Button>
- *   </TimelineItem>
- *   <TimelineItem title="Application UI code in Tailwind CSS" date="March 2022">
- *     <p class="text-base font-normal text-gray-500 dark:text-gray-400">
- *       All of the pages and components are first designed in Figma and we keep a parity between the
- *       two versions even as we update the project.
- *     </p>
- *   </TimelineItem>
- *   <TimelineItem title="Application UI code in Tailwind CSS" date="April 2022">
- *     <p class="text-base font-normal text-gray-500 dark:text-gray-400">
- *       Get started with dozens of web components and interactive elements built on top of Tailwind
- *       CSS.
- *     </p>
- *   </TimelineItem>
- * </Timeline>
- * ```
+ * @prop export let title: string = '';
+ * @prop export let date: string = '';
+ * @prop export let svgClass: string = 'w-3 h-3 text-primary-600 dark:text-primary-400';
  */
 export default class TimelineItem extends SvelteComponentTyped<TimelineItemProps, TimelineItemEvents, TimelineItemSlots> {
 }

package/dist/timeline/TimelineItem.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimelineItem.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/timeline/TimelineItem.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAoHD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACvD,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACzD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,oBAAoB,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CACvH"}
+{"version":3,"file":"TimelineItem.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/timeline/TimelineItem.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAoHD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACvD,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACzD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEvD;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,oBAAoB,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CACvH"}

package/dist/timeline/TimelineItemHorizontal.svelte

@@ -52,73 +52,20 @@ let aCls = twMerge(aClass, $$props.classA);
 </li>
 
 <!--
-  @component
-  ## Features
-  [Go to Horizontal Timeline](https://flowbite-svelte.com/docs/components/timeline#Horizontal_Timeline)
-  - Setup
-  - Default timeline
-  - Vertical Timeline
-  - Horizontal Timeline
-  - Activity Log
-  - Grouped timeline
-  ## Props
-  @prop title: string;
-  @prop date: string;
-  @prop href: string;
-  @prop text: string;
-  @prop linkname: string;
-  @prop icon: string;  
-  @prop liClass: string;
-  @prop divClass: string;
-  @prop timeClass: string;
-  @prop pClass: string;
-  @prop aClass: string;
-  ## Example
-  ```
-  <script>
-    import { Timeline, TimelineItem } from 'flowbite-svelte';
-  </script>
-  
-  <Timeline order="horizontal">
-    <TimelineItem title="Flowbite Library v1.0.0" date="Released on December 2nd, 2021">
-      <svelte:fragment slot="icon">
-          <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">
-                <svg aria-hidden="true" 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"></path></svg>
-            </div>
-            <div class="hidden sm:flex w-full bg-gray-200 h-0.5 dark:bg-gray-700"></div>
-        </div>
-      </svelte:fragment>
-      <p class="text-base font-normal text-gray-500 dark:text-gray-400">
-        Get started with dozens of web components and interactive elements.
-      </p>
-    </TimelineItem>
-    <TimelineItem title="Flowbite Library v1.2.0" date="Released on December 23th, 2021">
-      <svelte:fragment slot="icon">
-          <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">
-                <svg aria-hidden="true" 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"></path></svg>
-            </div>
-            <div class="hidden sm:flex w-full bg-gray-200 h-0.5 dark:bg-gray-700"></div>
-        </div>
-      </svelte:fragment>
-      <p class="text-base font-normal text-gray-500 dark:text-gray-400">
-        Get started with dozens of web components and interactive elements.
-      </p>
-    </TimelineItem>
-    <TimelineItem title="Flowbite Library v1.3.0" date="Released on January 5th, 2021">
-      <svelte:fragment slot="icon">
-          <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">
-                <svg aria-hidden="true" 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"></path></svg>
-            </div>
-            <div class="hidden sm:flex w-full bg-gray-200 h-0.5 dark:bg-gray-700"></div>
-        </div>
-      </svelte:fragment>
-      <p class="text-base font-normal text-gray-500 dark:text-gray-400">
-        Get started with dozens of web components and interactive elements.
-      </p>
-    </TimelineItem>
-  </Timeline>
-  ```  
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let timelineItems: TimelineItemHorizontalType[];
+@prop export let title: string;
+@prop export let date: string;
+@prop export let href: string;
+@prop export let text: string;
+@prop export let liClass: string = 'relative mb-6 sm:mb-0';
+@prop export let divClass: string = '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';
+@prop export let h3Class: string = 'text-lg font-semibold text-gray-900 dark:text-white';
+@prop export let timeClass: string = 'block mb-2 text-sm font-normal leading-none text-gray-400 dark:text-gray-500';
+@prop export let pClass: string = 'text-base font-normal text-gray-500 dark:text-gray-400';
+@prop export let aClass: string = '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';
+@prop export let linkname: string;
+@prop export let icon: string;
 -->

package/dist/timeline/TimelineItemHorizontal.svelte.d.ts

@@ -24,74 +24,21 @@ export type TimelineItemHorizontalProps = typeof __propDef.props;
 export type TimelineItemHorizontalEvents = typeof __propDef.events;
 export type TimelineItemHorizontalSlots = typeof __propDef.slots;
 /**
- * ## Features
- * [Go to Horizontal Timeline](https://flowbite-svelte.com/docs/components/timeline#Horizontal_Timeline)
- * - Setup
- * - Default timeline
- * - Vertical Timeline
- * - Horizontal Timeline
- * - Activity Log
- * - Grouped timeline
+ * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop title: string;
- * @prop date: string;
- * @prop href: string;
- * @prop text: string;
- * @prop linkname: string;
- * @prop icon: string;
- * @prop liClass: string;
- * @prop divClass: string;
- * @prop timeClass: string;
- * @prop pClass: string;
- * @prop aClass: string;
- * ## Example
- * ```
- * <script>
- *   import { Timeline, TimelineItem } from 'flowbite-svelte';
- * </script>
- *
- * <Timeline order="horizontal">
- *   <TimelineItem title="Flowbite Library v1.0.0" date="Released on December 2nd, 2021">
- *     <svelte:fragment slot="icon">
- *         <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">
- *               <svg aria-hidden="true" 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"></path></svg>
- *           </div>
- *           <div class="hidden sm:flex w-full bg-gray-200 h-0.5 dark:bg-gray-700"></div>
- *       </div>
- *     </svelte:fragment>
- *     <p class="text-base font-normal text-gray-500 dark:text-gray-400">
- *       Get started with dozens of web components and interactive elements.
- *     </p>
- *   </TimelineItem>
- *   <TimelineItem title="Flowbite Library v1.2.0" date="Released on December 23th, 2021">
- *     <svelte:fragment slot="icon">
- *         <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">
- *               <svg aria-hidden="true" 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"></path></svg>
- *           </div>
- *           <div class="hidden sm:flex w-full bg-gray-200 h-0.5 dark:bg-gray-700"></div>
- *       </div>
- *     </svelte:fragment>
- *     <p class="text-base font-normal text-gray-500 dark:text-gray-400">
- *       Get started with dozens of web components and interactive elements.
- *     </p>
- *   </TimelineItem>
- *   <TimelineItem title="Flowbite Library v1.3.0" date="Released on January 5th, 2021">
- *     <svelte:fragment slot="icon">
- *         <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">
- *               <svg aria-hidden="true" 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"></path></svg>
- *           </div>
- *           <div class="hidden sm:flex w-full bg-gray-200 h-0.5 dark:bg-gray-700"></div>
- *       </div>
- *     </svelte:fragment>
- *     <p class="text-base font-normal text-gray-500 dark:text-gray-400">
- *       Get started with dozens of web components and interactive elements.
- *     </p>
- *   </TimelineItem>
- * </Timeline>
- * ```
+ * @prop export let timelineItems: TimelineItemHorizontalType[];
+ * @prop export let title: string;
+ * @prop export let date: string;
+ * @prop export let href: string;
+ * @prop export let text: string;
+ * @prop export let liClass: string = 'relative mb-6 sm:mb-0';
+ * @prop export let divClass: string = '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';
+ * @prop export let h3Class: string = 'text-lg font-semibold text-gray-900 dark:text-white';
+ * @prop export let timeClass: string = 'block mb-2 text-sm font-normal leading-none text-gray-400 dark:text-gray-500';
+ * @prop export let pClass: string = 'text-base font-normal text-gray-500 dark:text-gray-400';
+ * @prop export let aClass: string = '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';
+ * @prop export let linkname: string;
+ * @prop export let icon: string;
  */
 export default class TimelineItemHorizontal extends SvelteComponentTyped<TimelineItemHorizontalProps, TimelineItemHorizontalEvents, TimelineItemHorizontalSlots> {
 }

package/dist/timeline/TimelineItemHorizontal.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimelineItemHorizontal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/timeline/TimelineItemHorizontal.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AA+DD,QAAA,MAAM,SAAS;;;eADwN,MAAM;cAAQ,MAAM;cAAQ,MAAM;cAAQ,MAAM;;;;;;;kBAAyH,MAAM;cAAQ,MAAM;;;;;;CACtV,CAAC;AAC/E,MAAM,MAAM,2BAA2B,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACjE,MAAM,MAAM,4BAA4B,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACnE,MAAM,MAAM,2BAA2B,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqEG;AACH,MAAM,CAAC,OAAO,OAAO,sBAAuB,SAAQ,oBAAoB,CAAC,2BAA2B,EAAE,4BAA4B,EAAE,2BAA2B,CAAC;CAC/J"}
+{"version":3,"file":"TimelineItemHorizontal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/timeline/TimelineItemHorizontal.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AA+DD,QAAA,MAAM,SAAS;;;eADwN,MAAM;cAAQ,MAAM;cAAQ,MAAM;cAAQ,MAAM;;;;;;;kBAAyH,MAAM;cAAQ,MAAM;;;;;;CACtV,CAAC;AAC/E,MAAM,MAAM,2BAA2B,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACjE,MAAM,MAAM,4BAA4B,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACnE,MAAM,MAAM,2BAA2B,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEjE;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,OAAO,OAAO,sBAAuB,SAAQ,oBAAoB,CAAC,2BAA2B,EAAE,4BAA4B,EAAE,2BAA2B,CAAC;CAC/J"}

package/dist/timeline/TimelineItemVertical.svelte

@@ -30,93 +30,13 @@ let timeCls = twMerge(timeClass, $$props.classTime);
 </li>
 
 <!--
-  @component
-  ## Features
-  [Go to Vertical Timeline](https://flowbite-svelte.com/docs/components/timeline#Vertical_Timeline)
-  - Setup
-  - Default timeline
-  - Vertical Timeline
-  - Horizontal Timeline
-  - Activity Log
-  - Grouped timeline
-  ## Props
-  @prop title: string;
-  @prop date: string;
-  @prop liClass: string;
-  @prop spanClass: string;
-  @prop h3Class: string;
-  @prop timeClass: string;
-  ## Example
-  ```
-  <script>
-    import { Timeline, TimelineItem } from 'flowbite-svelte';
-  </script>
-
-  <Timeline order="vertical">
-    <TimelineItem title="Flowbite Application UI v2.0.0" date="Released on January 13th, 2022">
-      <svelte:fragment slot="icon">
-        <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">
-          <svg
-            aria-hidden="true"
-            class="w-3 h-3 text-blue-600 dark:text-blue-400"
-            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>
-        </span>
-      </svelte:fragment>
-      <p class="mb-4 text-base font-normal text-gray-500 dark:text-gray-400">
-        Get access to over 20+ pages including a dashboard layout, charts, kanban board, calendar,
-        and pre-order E-commerce & Marketing pages.
-      </p>
-    </TimelineItem>
-    <TimelineItem title="Flowbite Figma v1.3.0" date="Released on December 7th, 2021">
-      <svelte:fragment slot="icon">
-        <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">
-          <svg
-            aria-hidden="true"
-            class="w-3 h-3 text-blue-600 dark:text-blue-400"
-            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>
-        </span>
-      </svelte:fragment>
-      <p class="text-base font-normal text-gray-500 dark:text-gray-400">
-        All of the pages and components are first designed in Figma and we keep a parity between the
-        two versions even as we update the project.
-      </p>
-    </TimelineItem>
-    <TimelineItem title="Flowbite Library v1.2.2" date="Released on December 2nd, 2021">
-      <svelte:fragment slot="icon">
-        <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">
-          <svg
-            aria-hidden="true"
-            class="w-3 h-3 text-blue-600 dark:text-blue-400"
-            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>
-        </span>
-      </svelte:fragment>
-      <p class="text-base font-normal text-gray-500 dark:text-gray-400">
-        Get started with dozens of web components and interactive elements built on top of Tailwind
-        CSS.
-      </p>
-    </TimelineItem>
-  </Timeline>
-  ```
-  
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let title: string;
+@prop export let date: string;
+@prop export let liClass: string = 'mb-10 ml-6';
+@prop export let spanClass: string = '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';
+@prop export let h3Class: string = 'flex items-center mb-1 text-lg font-semibold text-gray-900 dark:text-white';
+@prop export let timeClass: string = 'block mb-2 text-sm font-normal leading-none text-gray-400 dark:text-gray-500';
 -->

package/dist/timeline/TimelineItemVertical.svelte.d.ts

@@ -21,93 +21,14 @@ export type TimelineItemVerticalProps = typeof __propDef.props;
 export type TimelineItemVerticalEvents = typeof __propDef.events;
 export type TimelineItemVerticalSlots = typeof __propDef.slots;
 /**
- * ## Features
- * [Go to Vertical Timeline](https://flowbite-svelte.com/docs/components/timeline#Vertical_Timeline)
- * - Setup
- * - Default timeline
- * - Vertical Timeline
- * - Horizontal Timeline
- * - Activity Log
- * - Grouped timeline
+ * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop title: string;
- * @prop date: string;
- * @prop liClass: string;
- * @prop spanClass: string;
- * @prop h3Class: string;
- * @prop timeClass: string;
- * ## Example
- * ```
- * <script>
- *   import { Timeline, TimelineItem } from 'flowbite-svelte';
- * </script>
- *
- * <Timeline order="vertical">
- *   <TimelineItem title="Flowbite Application UI v2.0.0" date="Released on January 13th, 2022">
- *     <svelte:fragment slot="icon">
- *       <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">
- *         <svg
- *           aria-hidden="true"
- *           class="w-3 h-3 text-blue-600 dark:text-blue-400"
- *           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>
- *       </span>
- *     </svelte:fragment>
- *     <p class="mb-4 text-base font-normal text-gray-500 dark:text-gray-400">
- *       Get access to over 20+ pages including a dashboard layout, charts, kanban board, calendar,
- *       and pre-order E-commerce & Marketing pages.
- *     </p>
- *   </TimelineItem>
- *   <TimelineItem title="Flowbite Figma v1.3.0" date="Released on December 7th, 2021">
- *     <svelte:fragment slot="icon">
- *       <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">
- *         <svg
- *           aria-hidden="true"
- *           class="w-3 h-3 text-blue-600 dark:text-blue-400"
- *           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>
- *       </span>
- *     </svelte:fragment>
- *     <p class="text-base font-normal text-gray-500 dark:text-gray-400">
- *       All of the pages and components are first designed in Figma and we keep a parity between the
- *       two versions even as we update the project.
- *     </p>
- *   </TimelineItem>
- *   <TimelineItem title="Flowbite Library v1.2.2" date="Released on December 2nd, 2021">
- *     <svelte:fragment slot="icon">
- *       <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">
- *         <svg
- *           aria-hidden="true"
- *           class="w-3 h-3 text-blue-600 dark:text-blue-400"
- *           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>
- *       </span>
- *     </svelte:fragment>
- *     <p class="text-base font-normal text-gray-500 dark:text-gray-400">
- *       Get started with dozens of web components and interactive elements built on top of Tailwind
- *       CSS.
- *     </p>
- *   </TimelineItem>
- * </Timeline>
- * ```
+ * @prop export let title: string;
+ * @prop export let date: string;
+ * @prop export let liClass: string = 'mb-10 ml-6';
+ * @prop export let spanClass: string = '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';
+ * @prop export let h3Class: string = 'flex items-center mb-1 text-lg font-semibold text-gray-900 dark:text-white';
+ * @prop export let timeClass: string = 'block mb-2 text-sm font-normal leading-none text-gray-400 dark:text-gray-500';
  */
 export default class TimelineItemVertical extends SvelteComponentTyped<TimelineItemVerticalProps, TimelineItemVerticalEvents, TimelineItemVerticalSlots> {
 }

package/dist/timeline/TimelineItemVertical.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimelineItemVertical.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/timeline/TimelineItemVertical.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAwCD,QAAA,MAAM,SAAS;;;eAD4H,MAAM;cAAQ,MAAM;;;;;;;;;;;;;CACjF,CAAC;AAC/E,MAAM,MAAM,yBAAyB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC/D,MAAM,MAAM,0BAA0B,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACjE,MAAM,MAAM,yBAAyB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE/D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwFG;AACH,MAAM,CAAC,OAAO,OAAO,oBAAqB,SAAQ,oBAAoB,CAAC,yBAAyB,EAAE,0BAA0B,EAAE,yBAAyB,CAAC;CACvJ"}
+{"version":3,"file":"TimelineItemVertical.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/timeline/TimelineItemVertical.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAwCD,QAAA,MAAM,SAAS;;;eAD4H,MAAM;cAAQ,MAAM;;;;;;;;;;;;;CACjF,CAAC;AAC/E,MAAM,MAAM,yBAAyB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC/D,MAAM,MAAM,0BAA0B,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACjE,MAAM,MAAM,yBAAyB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE/D;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,OAAO,oBAAqB,SAAQ,oBAAoB,CAAC,yBAAyB,EAAE,0BAA0B,EAAE,yBAAyB,CAAC;CACvJ"}

package/dist/toasts/Toast.svelte

@@ -55,41 +55,15 @@ const clsBtnExtraClass = '-mx-1.5 -my-1.5 text-gray-400 hover:text-gray-900 focu
 {/if}
 
 <!--
-  @component
-  ## Features
-  [Go to Toast](https://flowbite-svelte.com/docs/components/toast)
-  - Setup
-  - Default toast
-  - Simple toast
-  - Colors
-  - Icons
-  - Autohide example
-  - Transitions
-  - Blur examples
-  - Fly examples
-  - Undo button
-  - Advanced examples
-  - Toast message
-  - Push notification
-  - Interactive toast
-  - Positioning
-  ## Props
-  @prop simple: boolean = false;
-  @prop position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'none' = 'none';
-  @prop open: boolean = true;
-  @prop divClass: string = 'w-full max-w-xs p-4';
-  @prop defaultIconClass: string = 'inline-flex items-center justify-center flex-shrink-0 w-8 h-8 mr-3';
-  ## Example
-  ```
-  <script>
-    import { Toast } from 'flowbite-svelte';
-  </script>
-  <Toast>
-    <svelte:fragment slot="icon">
-      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"><path stroke-linecap="round" stroke-linejoin="round" d="M15.362 5.214A8.252 8.252 0 0112 21 8.25 8.25 0 016.038 7.048 8.287 8.287 0 009 9.6a8.983 8.983 0 013.361-6.867 8.21 8.21 0 003 2.48z" /><path stroke-linecap="round" stroke-linejoin="round" d="M12 18a3.75 3.75 0 00.495-7.467 5.99 5.99 0 00-1.925 3.546 5.974 5.974 0 01-2.133-1A3.75 3.75 0 0012 18z" />
-      </svg>
-    </svelte:fragment>
-    Dismissable user notification.
-  </Toast>
-  ```
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let simple: boolean = false;
+@prop export let color: 'primary' | 'gray' | 'red' | 'yellow' | 'green' | 'blue' | 'indigo' | 'purple' | 'orange' | 'none' = 'primary';
+@prop export let position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'none' = 'none';
+@prop export let open: boolean = true;
+@prop export let divClass: string = 'w-full max-w-xs p-4 text-gray-500 bg-white shadow dark:text-gray-400 dark:bg-gray-800 gap-3';
+@prop export let defaultIconClass: string = 'w-8 h-8';
+@prop export let contentClass: string = 'w-full text-sm font-normal';
+@prop export let align: boolean = true;
 -->

package/dist/toasts/Toast.svelte.d.ts

@@ -249,42 +249,16 @@ export type ToastProps = typeof __propDef.props;
 export type ToastEvents = typeof __propDef.events;
 export type ToastSlots = typeof __propDef.slots;
 /**
- * ## Features
- * [Go to Toast](https://flowbite-svelte.com/docs/components/toast)
- * - Setup
- * - Default toast
- * - Simple toast
- * - Colors
- * - Icons
- * - Autohide example
- * - Transitions
- * - Blur examples
- * - Fly examples
- * - Undo button
- * - Advanced examples
- * - Toast message
- * - Push notification
- * - Interactive toast
- * - Positioning
+ * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop simple: boolean = false;
- * @prop position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'none' = 'none';
- * @prop open: boolean = true;
- * @prop divClass: string = 'w-full max-w-xs p-4';
- * @prop defaultIconClass: string = 'inline-flex items-center justify-center flex-shrink-0 w-8 h-8 mr-3';
- * ## Example
- * ```
- * <script>
- *   import { Toast } from 'flowbite-svelte';
- * </script>
- * <Toast>
- *   <svelte:fragment slot="icon">
- *     <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"><path stroke-linecap="round" stroke-linejoin="round" d="M15.362 5.214A8.252 8.252 0 0112 21 8.25 8.25 0 016.038 7.048 8.287 8.287 0 009 9.6a8.983 8.983 0 013.361-6.867 8.21 8.21 0 003 2.48z" /><path stroke-linecap="round" stroke-linejoin="round" d="M12 18a3.75 3.75 0 00.495-7.467 5.99 5.99 0 00-1.925 3.546 5.974 5.974 0 01-2.133-1A3.75 3.75 0 0012 18z" />
- *     </svg>
- *   </svelte:fragment>
- *   Dismissable user notification.
- * </Toast>
- * ```
+ * @prop export let simple: boolean = false;
+ * @prop export let color: 'primary' | 'gray' | 'red' | 'yellow' | 'green' | 'blue' | 'indigo' | 'purple' | 'orange' | 'none' = 'primary';
+ * @prop export let position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'none' = 'none';
+ * @prop export let open: boolean = true;
+ * @prop export let divClass: string = 'w-full max-w-xs p-4 text-gray-500 bg-white shadow dark:text-gray-400 dark:bg-gray-800 gap-3';
+ * @prop export let defaultIconClass: string = 'w-8 h-8';
+ * @prop export let contentClass: string = 'w-full text-sm font-normal';
+ * @prop export let align: boolean = true;
  */
 export default class Toast extends SvelteComponentTyped<ToastProps, ToastEvents, ToastSlots> {
 }