flowbite-svelte 0.36.5 → 0.37.1

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

@@ -17,6 +17,59 @@ declare const __propDef: {
 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
+ * ## Props
+ * @prop title: string = '';
+ * @prop date: string = '';
+ * @prop customDiv: string = '';
+ * @prop customTimeClass: string = '';
+ * ## 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>
+ * ```
+ */
 export default class TimelineItem extends SvelteComponentTyped<TimelineItemProps, TimelineItemEvents, TimelineItemSlots> {
 }
 export {};

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;AAmHD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAAwC,CAAC;AACxD,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,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;AAqHD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAAwC,CAAC;AACxD,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,oBAAoB,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CACvH"}

package/dist/timeline/TimelineItemHorizontal.svelte

@@ -48,3 +48,70 @@ export let icon;
       ></a>
   {/if}
 </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;  
+  ## 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>
+  ```  
+-->

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

@@ -16,6 +16,71 @@ declare const __propDef: {
 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
+ * ## Props
+ * @prop title: string;
+ * @prop date: string;
+ * @prop href: string;
+ * @prop text: string;
+ * @prop linkname: string;
+ * @prop icon: 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>
+ * ```
+ */
 export default class TimelineItemHorizontal extends SvelteComponentTyped<TimelineItemHorizontalProps, TimelineItemHorizontalEvents, TimelineItemHorizontalSlots> {
 }
 export {};

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;AAsCD,QAAA,MAAM,SAAS;;eADoG,MAAM;cAAQ,MAAM;cAAQ,MAAM;cAAQ,MAAM;kBAAY,MAAM;cAAQ,MAAM;;;;;;CAC5I,CAAC;AACxD,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,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;AAwCD,QAAA,MAAM,SAAS;;eADoG,MAAM;cAAQ,MAAM;cAAQ,MAAM;cAAQ,MAAM;kBAAY,MAAM;cAAQ,MAAM;;;;;;CAC5I,CAAC;AACxD,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgEG;AACH,MAAM,CAAC,OAAO,OAAO,sBAAuB,SAAQ,oBAAoB,CAAC,2BAA2B,EAAE,4BAA4B,EAAE,2BAA2B,CAAC;CAC/J"}

package/dist/timeline/TimelineItemVertical.svelte

@@ -30,3 +30,91 @@ export let date;
   <time class="block mb-2 text-sm font-normal leading-none text-gray-400 dark:text-gray-500">{date}</time>
   <slot />
 </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;
+  ## 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>
+  ```
+  
+-->

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

@@ -15,6 +15,91 @@ declare const __propDef: {
 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
+ * ## Props
+ * @prop title: string;
+ * @prop date: 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>
+ * ```
+ */
 export default class TimelineItemVertical extends SvelteComponentTyped<TimelineItemVerticalProps, TimelineItemVerticalEvents, TimelineItemVerticalSlots> {
 }
 export {};

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;AA0BD,QAAA,MAAM,SAAS;;eADwC,MAAM;cAAQ,MAAM;;;;;;;;;CACpB,CAAC;AACxD,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,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;AA4BD,QAAA,MAAM,SAAS;;eADwC,MAAM;cAAQ,MAAM;;;;;;;;;CACpB,CAAC;AACxD,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,MAAM,CAAC,OAAO,OAAO,oBAAqB,SAAQ,oBAAoB,CAAC,yBAAyB,EAAE,0BAA0B,EAAE,yBAAyB,CAAC;CACvJ"}

package/dist/toasts/Toast.svelte

@@ -41,3 +41,43 @@ $: iconClass = classNames(defaultIconClass);
     </div>
   </Frame>
 {/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
+  - Extra content
+  - 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>
+  ```
+-->

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

@@ -259,6 +259,44 @@ declare const __propDef: {
 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
+ * - Extra content
+ * - 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>
+ * ```
+ */
 export default class Toast extends SvelteComponentTyped<ToastProps, ToastEvents, ToastSlots> {
 }
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"Toast.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/toasts/Toast.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAoED,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAwC,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEhD,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,oBAAoB,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CAC3F"}
+{"version":3,"file":"Toast.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/toasts/Toast.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAsED,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAwC,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,oBAAoB,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CAC3F"}

package/dist/toolbar/Toolbar.svelte

@@ -30,3 +30,30 @@ $: separatorsClass = classNames($separators && 'sm:divide-x', divideColors[color
   </div>
   <slot name="end" />
 </Frame>
+
+<!--
+  @component
+  ## Features
+  [Go to Toolbar](https://flowbite-svelte.com/docs/utilities/toolbar)
+  - Setup
+  - Default toolbar
+  - Colored toolbars
+  - Toolbar with groups
+  - WYSIWYG Editor
+  - Comment box
+  ## Props
+  @prop color: ToolbarColorType = 'dark';
+  @prop embedded: boolean = false;
+  ## Example
+  ```
+  <script>
+    import { Toolbar, ToolbarButton, ToolbarGroup } from 'flowbite-svelte';
+  </script>
+  
+  <Toolbar>
+    <ToolbarButton><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="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" /></svg></ToolbarButton>
+    <ToolbarButton><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="M3.75 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 013.75 9.375v-4.5zM3.75 14.625c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5a1.125 1.125 0 01-1.125-1.125v-4.5zM13.5 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 0113.5 9.375v-4.5z" /><path stroke-linecap="round" stroke-linejoin="round" d="M6.75 6.75h.75v.75h-.75v-.75zM6.75 16.5h.75v.75h-.75v-.75zM16.5 6.75h.75v.75h-.75v-.75zM13.5 13.5h.75v.75h-.75v-.75zM13.5 19.5h.75v.75h-.75v-.75zM19.5 13.5h.75v.75h-.75v-.75zM19.5 19.5h.75v.75h-.75v-.75zM16.5 16.5h.75v.75h-.75v-.75z" /></svg></ToolbarButton>
+    <ToolbarButton><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="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75" /></svg></ToolbarButton>
+  </Toolbar>
+  ```
+-->

package/dist/toolbar/Toolbar.svelte.d.ts

@@ -255,6 +255,31 @@ declare const __propDef: {
 export type ToolbarProps = typeof __propDef.props;
 export type ToolbarEvents = typeof __propDef.events;
 export type ToolbarSlots = typeof __propDef.slots;
+/**
+ * ## Features
+ * [Go to Toolbar](https://flowbite-svelte.com/docs/utilities/toolbar)
+ * - Setup
+ * - Default toolbar
+ * - Colored toolbars
+ * - Toolbar with groups
+ * - WYSIWYG Editor
+ * - Comment box
+ * ## Props
+ * @prop color: ToolbarColorType = 'dark';
+ * @prop embedded: boolean = false;
+ * ## Example
+ * ```
+ * <script>
+ *   import { Toolbar, ToolbarButton, ToolbarGroup } from 'flowbite-svelte';
+ * </script>
+ *
+ * <Toolbar>
+ *   <ToolbarButton><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="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" /></svg></ToolbarButton>
+ *   <ToolbarButton><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="M3.75 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 013.75 9.375v-4.5zM3.75 14.625c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5a1.125 1.125 0 01-1.125-1.125v-4.5zM13.5 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 0113.5 9.375v-4.5z" /><path stroke-linecap="round" stroke-linejoin="round" d="M6.75 6.75h.75v.75h-.75v-.75zM6.75 16.5h.75v.75h-.75v-.75zM16.5 6.75h.75v.75h-.75v-.75zM13.5 13.5h.75v.75h-.75v-.75zM13.5 19.5h.75v.75h-.75v-.75zM19.5 13.5h.75v.75h-.75v-.75zM19.5 19.5h.75v.75h-.75v-.75zM16.5 16.5h.75v.75h-.75v-.75z" /></svg></ToolbarButton>
+ *   <ToolbarButton><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="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75" /></svg></ToolbarButton>
+ * </Toolbar>
+ * ```
+ */
 export default class Toolbar extends SvelteComponentTyped<ToolbarProps, ToolbarEvents, ToolbarSlots> {
 }
 export {};

package/dist/toolbar/Toolbar.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/toolbar/Toolbar.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAsDD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAvCJ,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAC1F,OAAO;;;;;;;;;CAsCkC,CAAC;AACxD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAClD,MAAM,MAAM,aAAa,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACpD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAElD,MAAM,CAAC,OAAO,OAAO,OAAQ,SAAQ,oBAAoB,CAAC,YAAY,EAAE,aAAa,EAAE,YAAY,CAAC;CACnG"}
+{"version":3,"file":"Toolbar.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/toolbar/Toolbar.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAwDD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAzCJ,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAC1F,OAAO;;;;;;;;;CAwCkC,CAAC;AACxD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAClD,MAAM,MAAM,aAAa,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACpD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAElD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,CAAC,OAAO,OAAO,OAAQ,SAAQ,oBAAoB,CAAC,YAAY,EAAE,aAAa,EAAE,YAAY,CAAC;CACnG"}

package/dist/toolbar/ToolbarButton.svelte

@@ -46,3 +46,33 @@ const svgSizes = {
     <slot svgSize={svgSizes[size]} />
   </button>
 {/if}
+
+<!--
+  @component
+  ## Features
+  [Go to Toolbar](https://flowbite-svelte.com/docs/utilities/toolbar)
+  - Setup
+  - Default toolbar
+  - Colored toolbars
+  - Toolbar with groups
+  - WYSIWYG Editor
+  - Comment box
+  ## Props
+  @prop color: ToolbarButtonType = 'default';
+  @prop name: string | undefined = undefined;
+  @prop ariaLabel: string | undefined = undefined;
+  @prop size: 'xs' | 'sm' | 'md' | 'lg' = 'md';
+  @prop href: string | undefined = undefined;
+  ## Example
+  ```
+  <script>
+    import { Toolbar, ToolbarButton, ToolbarGroup } from 'flowbite-svelte';
+  </script>
+
+  <Toolbar>
+    <ToolbarButton><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="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" /></svg></ToolbarButton>
+    <ToolbarButton><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="M3.75 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 013.75 9.375v-4.5zM3.75 14.625c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5a1.125 1.125 0 01-1.125-1.125v-4.5zM13.5 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 0113.5 9.375v-4.5z" /><path stroke-linecap="round" stroke-linejoin="round" d="M6.75 6.75h.75v.75h-.75v-.75zM6.75 16.5h.75v.75h-.75v-.75zM16.5 6.75h.75v.75h-.75v-.75zM13.5 13.5h.75v.75h-.75v-.75zM13.5 19.5h.75v.75h-.75v-.75zM19.5 13.5h.75v.75h-.75v-.75zM19.5 19.5h.75v.75h-.75v-.75zM16.5 16.5h.75v.75h-.75v-.75z" /></svg></ToolbarButton>
+    <ToolbarButton><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="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75" /></svg></ToolbarButton>
+  </Toolbar>
+  ```
+-->