flowbite-svelte 0.44.1 → 0.44.4

package/dist/sidebars/SidebarDropdownItem.svelte

@@ -13,53 +13,12 @@ export let active = false;
 </li>
 
 <!--
-  @component
-  ## Features
-  [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
-  ## Props
-  @prop aClass: string = 'flex items-center p-2 pl-11 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700';
-  @prop href: string = '';
-  @prop label: string = '';
-  @prop activeClass: string = 'flex items-center p-2 pl-11 text-base font-normal text-gray-900 bg-gray-200 dark:bg-gray-700 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700';
-  @prop active: boolean = false;
-  ## Event
-  - on:blur
-  - on:click
-  - on:focus
-  - on:keydown
-  - on:keypress
-  - on:keyup
-  - on:mouseenter
-  - on:mouseleave
-  - on:mouseover
-  ## Example
-  ```
-  <script>
-    import { page } from '$app/stores';
-    import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, SidebarDropdownWrapper, SidebarDropdownItem } from 'flowbite-svelte';
-    let spanClass = 'flex-1 ml-3 whitespace-nowrap';
-    $: activeUrl = $page.url.pathname
-    $: containPath = ()=>{
-      // add your logic here
-      true
-    }
-  </script>
-  
-  <Sidebar>
-    <SidebarWrapper>
-      <SidebarGroup>
-        <SidebarItem label="Dashboard" active={activeUrl === '/dashboard'} />
-        <SidebarDropdownWrapper label="E-commerce" isOpen={containPath}>
-          <SidebarDropdownItem label="Products" href='/components/products' active={activeUrl === '/components/products'} />
-          <SidebarDropdownItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}/>
-        </SidebarDropdownWrapper>
-        <SidebarDropdownWrapper label="Items">
-          <SidebarDropdownItem label="Item 1" href='/components/item1' active={activeUrl === '/components/item'} />
-          <SidebarDropdownItem label="Item 2" href='/components/item2' active={activeUrl === '/components/billing'} />
-        </SidebarDropdownWrapper>
-      </SidebarGroup>
-    </SidebarWrapper>
-  </Sidebar>
-  ```
-  
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let aClass: string = 'flex items-center p-2 pl-11 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700';
+@prop export let href: string = '';
+@prop export let label: string = '';
+@prop export let activeClass: string = 'flex items-center p-2 pl-11 text-base font-normal text-gray-900 bg-gray-200 dark:bg-gray-700 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700';
+@prop export let active: boolean = false;
 -->

package/dist/sidebars/SidebarDropdownItem.svelte.d.ts

@@ -27,53 +27,13 @@ export type SidebarDropdownItemProps = typeof __propDef.props;
 export type SidebarDropdownItemEvents = typeof __propDef.events;
 export type SidebarDropdownItemSlots = typeof __propDef.slots;
 /**
- * ## Features
- * [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
+ * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop aClass: string = 'flex items-center p-2 pl-11 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700';
- * @prop href: string = '';
- * @prop label: string = '';
- * @prop activeClass: string = 'flex items-center p-2 pl-11 text-base font-normal text-gray-900 bg-gray-200 dark:bg-gray-700 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700';
- * @prop active: boolean = false;
- * ## Event
- * - on:blur
- * - on:click
- * - on:focus
- * - on:keydown
- * - on:keypress
- * - on:keyup
- * - on:mouseenter
- * - on:mouseleave
- * - on:mouseover
- * ## Example
- * ```
- * <script>
- *   import { page } from '$app/stores';
- *   import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, SidebarDropdownWrapper, SidebarDropdownItem } from 'flowbite-svelte';
- *   let spanClass = 'flex-1 ml-3 whitespace-nowrap';
- *   $: activeUrl = $page.url.pathname
- *   $: containPath = ()=>{
- *     // add your logic here
- *     true
- *   }
- * </script>
- *
- * <Sidebar>
- *   <SidebarWrapper>
- *     <SidebarGroup>
- *       <SidebarItem label="Dashboard" active={activeUrl === '/dashboard'} />
- *       <SidebarDropdownWrapper label="E-commerce" isOpen={containPath}>
- *         <SidebarDropdownItem label="Products" href='/components/products' active={activeUrl === '/components/products'} />
- *         <SidebarDropdownItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}/>
- *       </SidebarDropdownWrapper>
- *       <SidebarDropdownWrapper label="Items">
- *         <SidebarDropdownItem label="Item 1" href='/components/item1' active={activeUrl === '/components/item'} />
- *         <SidebarDropdownItem label="Item 2" href='/components/item2' active={activeUrl === '/components/billing'} />
- *       </SidebarDropdownWrapper>
- *     </SidebarGroup>
- *   </SidebarWrapper>
- * </Sidebar>
- * ```
+ * @prop export let aClass: string = 'flex items-center p-2 pl-11 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700';
+ * @prop export let href: string = '';
+ * @prop export let label: string = '';
+ * @prop export let activeClass: string = 'flex items-center p-2 pl-11 text-base font-normal text-gray-900 bg-gray-200 dark:bg-gray-700 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700';
+ * @prop export let active: boolean = false;
  */
 export default class SidebarDropdownItem extends SvelteComponentTyped<SidebarDropdownItemProps, SidebarDropdownItemEvents, SidebarDropdownItemSlots> {
 }

package/dist/sidebars/SidebarDropdownItem.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarDropdownItem.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/sidebars/SidebarDropdownItem.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAuBD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,wBAAwB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC9D,MAAM,MAAM,yBAAyB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAChE,MAAM,MAAM,wBAAwB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgDG;AACH,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,oBAAoB,CAAC,wBAAwB,EAAE,yBAAyB,EAAE,wBAAwB,CAAC;CACnJ"}
+{"version":3,"file":"SidebarDropdownItem.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/sidebars/SidebarDropdownItem.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAuBD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,wBAAwB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC9D,MAAM,MAAM,yBAAyB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAChE,MAAM,MAAM,wBAAwB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE9D;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,oBAAoB,CAAC,wBAAwB,EAAE,yBAAyB,EAAE,wBAAwB,CAAC;CACnJ"}

package/dist/sidebars/SidebarDropdownWrapper.svelte

@@ -53,44 +53,14 @@ const handleDropdown = () => {
 </li>
 
 <!--
-  @component
-  ## Features
-  [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
-  ## Props
-  @prop btnClass: string = 'flex items-center p-2 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700';
-  @prop label: string = '';
-  @prop spanClass: string = 'flex-1 ml-3 text-left whitespace-nowrap';
-  @prop ulClass: string = 'py-2 space-y-2';
-  @prop transitionType: TransitionTypes = 'slide';
-  @prop transitionParams: TransitionParamTypes = {};
-  ## Example
-  ```
-  <script>
-    import { page } from '$app/stores';
-    import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, SidebarDropdownWrapper, SidebarDropdownItem } from 'flowbite-svelte';
-    let spanClass = 'flex-1 ml-3 whitespace-nowrap';
-    $: activeUrl = $page.url.pathname
-    $: containPath = ()=>{
-      // add your logic here
-      true
-    }
-  </script>
-
-  <Sidebar>
-    <SidebarWrapper>
-      <SidebarGroup>
-        <SidebarItem label="Dashboard" active={activeUrl === '/dashboard'} />
-        <SidebarDropdownWrapper label="E-commerce" isOpen={containPath}>
-          <SidebarDropdownItem label="Products" href='/components/products' active={activeUrl === '/components/products'} />
-          <SidebarDropdownItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}/>
-        </SidebarDropdownWrapper>
-        <SidebarDropdownWrapper label="Items">
-          <SidebarDropdownItem label="Item 1" href='/components/item1' active={activeUrl === '/components/item'} />
-          <SidebarDropdownItem label="Item 2" href='/components/item2' active={activeUrl === '/components/billing'} />
-        </SidebarDropdownWrapper>
-      </SidebarGroup>
-    </SidebarWrapper>
-  </Sidebar>
-  ```
-  
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let btnClass: string = 'flex items-center p-2 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700';
+@prop export let label: string = '';
+@prop export let spanClass: string = 'flex-1 ml-3 text-left whitespace-nowrap';
+@prop export let ulClass: string = 'py-2 space-y-2';
+@prop export let transitionType: TransitionTypes = 'slide';
+@prop export let transitionParams: TransitionParamTypes = {};
+@prop export let isOpen = false;
 -->

package/dist/sidebars/SidebarDropdownWrapper.svelte.d.ts

@@ -25,44 +25,15 @@ export type SidebarDropdownWrapperProps = typeof __propDef.props;
 export type SidebarDropdownWrapperEvents = typeof __propDef.events;
 export type SidebarDropdownWrapperSlots = typeof __propDef.slots;
 /**
- * ## Features
- * [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
+ * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop btnClass: string = 'flex items-center p-2 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700';
- * @prop label: string = '';
- * @prop spanClass: string = 'flex-1 ml-3 text-left whitespace-nowrap';
- * @prop ulClass: string = 'py-2 space-y-2';
- * @prop transitionType: TransitionTypes = 'slide';
- * @prop transitionParams: TransitionParamTypes = {};
- * ## Example
- * ```
- * <script>
- *   import { page } from '$app/stores';
- *   import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, SidebarDropdownWrapper, SidebarDropdownItem } from 'flowbite-svelte';
- *   let spanClass = 'flex-1 ml-3 whitespace-nowrap';
- *   $: activeUrl = $page.url.pathname
- *   $: containPath = ()=>{
- *     // add your logic here
- *     true
- *   }
- * </script>
- *
- * <Sidebar>
- *   <SidebarWrapper>
- *     <SidebarGroup>
- *       <SidebarItem label="Dashboard" active={activeUrl === '/dashboard'} />
- *       <SidebarDropdownWrapper label="E-commerce" isOpen={containPath}>
- *         <SidebarDropdownItem label="Products" href='/components/products' active={activeUrl === '/components/products'} />
- *         <SidebarDropdownItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}/>
- *       </SidebarDropdownWrapper>
- *       <SidebarDropdownWrapper label="Items">
- *         <SidebarDropdownItem label="Item 1" href='/components/item1' active={activeUrl === '/components/item'} />
- *         <SidebarDropdownItem label="Item 2" href='/components/item2' active={activeUrl === '/components/billing'} />
- *       </SidebarDropdownWrapper>
- *     </SidebarGroup>
- *   </SidebarWrapper>
- * </Sidebar>
- * ```
+ * @prop export let btnClass: string = 'flex items-center p-2 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700';
+ * @prop export let label: string = '';
+ * @prop export let spanClass: string = 'flex-1 ml-3 text-left whitespace-nowrap';
+ * @prop export let ulClass: string = 'py-2 space-y-2';
+ * @prop export let transitionType: TransitionTypes = 'slide';
+ * @prop export let transitionParams: TransitionParamTypes = {};
+ * @prop export let isOpen = false;
  */
 export default class SidebarDropdownWrapper extends SvelteComponentTyped<SidebarDropdownWrapperProps, SidebarDropdownWrapperEvents, SidebarDropdownWrapperSlots> {
 }

package/dist/sidebars/SidebarDropdownWrapper.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarDropdownWrapper.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/sidebars/SidebarDropdownWrapper.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAGD,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAiEtE,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;CAA+D,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,MAAM,CAAC,OAAO,OAAO,sBAAuB,SAAQ,oBAAoB,CAAC,2BAA2B,EAAE,4BAA4B,EAAE,2BAA2B,CAAC;CAC/J"}
+{"version":3,"file":"SidebarDropdownWrapper.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/sidebars/SidebarDropdownWrapper.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAGD,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAiEtE,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;CAA+D,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;;;;;;;;;;GAUG;AACH,MAAM,CAAC,OAAO,OAAO,sBAAuB,SAAQ,oBAAoB,CAAC,2BAA2B,EAAE,4BAA4B,EAAE,2BAA2B,CAAC;CAC/J"}

package/dist/sidebars/SidebarGroup.svelte

@@ -12,42 +12,10 @@ if (border) {
 </ul>
 
 <!--
-  @component
-  ## Features
-  [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
-  ## Props
-  @prop ulClass: string = 'space-y-2';
-  @prop borderClass: string = 'pt-4 mt-4 border-t border-gray-200 dark:border-gray-700';
-  @prop border: boolean = false;
-
-  ## Example
-  ```
-  <script>
-    import { page } from '$app/stores';
-    import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, SidebarDropdownWrapper, SidebarDropdownItem } from 'flowbite-svelte';
-    let spanClass = 'flex-1 ml-3 whitespace-nowrap';
-    $: activeUrl = $page.url.pathname
-    $: containPath = ()=>{
-      // add your logic here
-      true
-    }
-  </script>
-
-  <Sidebar>
-    <SidebarWrapper>
-      <SidebarGroup>
-        <SidebarItem label="Dashboard" active={activeUrl === '/dashboard'} />
-        <SidebarDropdownWrapper label="E-commerce" isOpen={containPath}>
-          <SidebarDropdownItem label="Products" href='/components/products' active={activeUrl === '/components/products'} />
-          <SidebarDropdownItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}/>
-        </SidebarDropdownWrapper>
-        <SidebarDropdownWrapper label="Items">
-          <SidebarDropdownItem label="Item 1" href='/components/item1' active={activeUrl === '/components/item'} />
-          <SidebarDropdownItem label="Item 2" href='/components/item2' active={activeUrl === '/components/billing'} />
-        </SidebarDropdownWrapper>
-      </SidebarGroup>
-    </SidebarWrapper>
-  </Sidebar>
-  ```
-  
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let ulClass: string = 'space-y-2';
+@prop export let borderClass: string = 'pt-4 mt-4 border-t border-gray-200 dark:border-gray-700';
+@prop export let border: boolean = false;
 -->

package/dist/sidebars/SidebarGroup.svelte.d.ts

@@ -17,42 +17,11 @@ export type SidebarGroupProps = typeof __propDef.props;
 export type SidebarGroupEvents = typeof __propDef.events;
 export type SidebarGroupSlots = typeof __propDef.slots;
 /**
- * ## Features
- * [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
+ * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop ulClass: string = 'space-y-2';
- * @prop borderClass: string = 'pt-4 mt-4 border-t border-gray-200 dark:border-gray-700';
- * @prop border: boolean = false;
- *
- * ## Example
- * ```
- * <script>
- *   import { page } from '$app/stores';
- *   import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, SidebarDropdownWrapper, SidebarDropdownItem } from 'flowbite-svelte';
- *   let spanClass = 'flex-1 ml-3 whitespace-nowrap';
- *   $: activeUrl = $page.url.pathname
- *   $: containPath = ()=>{
- *     // add your logic here
- *     true
- *   }
- * </script>
- *
- * <Sidebar>
- *   <SidebarWrapper>
- *     <SidebarGroup>
- *       <SidebarItem label="Dashboard" active={activeUrl === '/dashboard'} />
- *       <SidebarDropdownWrapper label="E-commerce" isOpen={containPath}>
- *         <SidebarDropdownItem label="Products" href='/components/products' active={activeUrl === '/components/products'} />
- *         <SidebarDropdownItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}/>
- *       </SidebarDropdownWrapper>
- *       <SidebarDropdownWrapper label="Items">
- *         <SidebarDropdownItem label="Item 1" href='/components/item1' active={activeUrl === '/components/item'} />
- *         <SidebarDropdownItem label="Item 2" href='/components/item2' active={activeUrl === '/components/billing'} />
- *       </SidebarDropdownWrapper>
- *     </SidebarGroup>
- *   </SidebarWrapper>
- * </Sidebar>
- * ```
+ * @prop export let ulClass: string = 'space-y-2';
+ * @prop export let borderClass: string = 'pt-4 mt-4 border-t border-gray-200 dark:border-gray-700';
+ * @prop export let border: boolean = false;
  */
 export default class SidebarGroup extends SvelteComponentTyped<SidebarGroupProps, SidebarGroupEvents, SidebarGroupSlots> {
 }

package/dist/sidebars/SidebarGroup.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarGroup.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/sidebars/SidebarGroup.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAuBD,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,oBAAoB,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CACvH"}
+{"version":3,"file":"SidebarGroup.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/sidebars/SidebarGroup.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAuBD,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/sidebars/SidebarItem.svelte

@@ -31,74 +31,13 @@ $: aClass = twMerge(active ? activeClass ?? context.activeClass : nonActiveClass
 </li>
 
 <!--
-  @component
-  ## Features
-  [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
-  ## Props
-  @prop aClass: string = 'flex items-center p-2 text-base font-normal text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700';
-  @prop href: string = '';
-  @prop label: string = '';
-  @prop spanClass: string = 'ml-3';
-  @prop activeClass: string = 'flex items-center p-2 text-base font-normal text-gray-900 bg-gray-200 dark:bg-gray-700 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700';
-  @prop active: boolean = false; 
-
-  ## Example
-  ```
-  <script>
-    import { page } from '$app/stores';
-    import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper } from 'flowbite-svelte';
-    let spanClass = 'flex-1 ml-3 whitespace-nowrap';
-    $: activeUrl = $page.url.pathname
-  </script>
-
-  <Sidebar>
-    <SidebarWrapper>
-      <SidebarGroup>
-        <SidebarItem label="Dashboard">
-        <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="M10.5 6a7.5 7.5 0 107.5 7.5h-7.5V6z" /><path stroke-linecap="round" stroke-linejoin="round" d="M13.5 10.5H21A7.5 7.5 0 0013.5 3v7.5z" /></svg>
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Kanban" {spanClass}>
-          <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="M3.75 6A2.25 2.25 0 016 3.75h2.25A2.25 2.25 0 0110.5 6v2.25a2.25 2.25 0 01-2.25 2.25H6a2.25 2.25 0 01-2.25-2.25V6zM3.75 15.75A2.25 2.25 0 016 13.5h2.25a2.25 2.25 0 012.25 2.25V18a2.25 2.25 0 01-2.25 2.25H6A2.25 2.25 0 013.75 18v-2.25zM13.5 6a2.25 2.25 0 012.25-2.25H18A2.25 2.25 0 0120.25 6v2.25A2.25 2.25 0 0118 10.5h-2.25a2.25 2.25 0 01-2.25-2.25V6zM13.5 15.75a2.25 2.25 0 012.25-2.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-2.25A2.25 2.25 0 0113.5 18v-2.25z" /></svg>
-          </svelte:fragment>
-          <svelte:fragment slot="subtext">
-            <span
-              class="inline-flex justify-center items-center px-2 ml-3 text-sm font-medium text-gray-800 bg-gray-200 rounded-full dark:bg-gray-700 dark:text-gray-300"
-              >Pro</span
-            >
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Inbox" {spanClass}>
-        <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="M9 3.75H6.912a2.25 2.25 0 00-2.15 1.588L2.35 13.177a2.25 2.25 0 00-.1.661V18a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18v-4.162c0-.224-.034-.447-.1-.661L19.24 5.338a2.25 2.25 0 00-2.15-1.588H15M2.25 13.5h3.86a2.25 2.25 0 012.012 1.244l.256.512a2.25 2.25 0 002.013 1.244h3.218a2.25 2.25 0 002.013-1.244l.256-.512a2.25 2.25 0 012.013-1.244h3.859M12 3v8.25m0 0l-3-3m3 3l3-3" /></svg>
-          </svelte:fragment>
-          <svelte:fragment slot="subtext">
-            <span
-              class="inline-flex justify-center items-center p-3 ml-3 w-3 h-3 text-sm font-medium text-blue-600 bg-blue-200 rounded-full dark:bg-blue-900 dark:text-blue-200"
-              >3</span
-            >
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}>
-          <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.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" /></svg>
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Sign In">
-          <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.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75" /></svg>
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Sign Up">
-          <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="M4.5 12a7.5 7.5 0 0015 0m-15 0a7.5 7.5 0 1115 0m-15 0H3m16.5 0H21m-1.5 0H12m-8.457 3.077l1.41-.513m14.095-5.13l1.41-.513M5.106 17.785l1.15-.964m11.49-9.642l1.149-.964M7.501 19.795l.75-1.3m7.5-12.99l.75-1.3m-6.063 16.658l.26-1.477m2.605-14.772l.26-1.477m0 17.726l-.26-1.477M10.698 4.614l-.26-1.477M16.5 19.794l-.75-1.299M7.5 4.205L12 12m6.894 5.785l-1.149-.964M6.256 7.178l-1.15-.964m15.352 8.864l-1.41-.513M4.954 9.435l-1.41-.514M12.002 12l-3.75 6.495" /></svg>
-          </svelte:fragment>
-        </SidebarItem>
-      </SidebarGroup>
-    </SidebarWrapper>
-  </Sidebar>
-  ```
-  
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let href: string = '';
+@prop export let label: string = '';
+@prop export let spanClass: string = 'ml-3';
+@prop export let activeClass: string | undefined = undefined;
+@prop export let nonActiveClass: string | undefined = undefined;
+@prop export let active: boolean = false;
 -->

package/dist/sidebars/SidebarItem.svelte.d.ts

@@ -30,74 +30,14 @@ export type SidebarItemProps = typeof __propDef.props;
 export type SidebarItemEvents = typeof __propDef.events;
 export type SidebarItemSlots = typeof __propDef.slots;
 /**
- * ## Features
- * [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
+ * [Go to docs](https://flowbite-svelte.com/)
  * ## Props
- * @prop aClass: string = 'flex items-center p-2 text-base font-normal text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700';
- * @prop href: string = '';
- * @prop label: string = '';
- * @prop spanClass: string = 'ml-3';
- * @prop activeClass: string = 'flex items-center p-2 text-base font-normal text-gray-900 bg-gray-200 dark:bg-gray-700 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700';
- * @prop active: boolean = false;
- *
- * ## Example
- * ```
- * <script>
- *   import { page } from '$app/stores';
- *   import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper } from 'flowbite-svelte';
- *   let spanClass = 'flex-1 ml-3 whitespace-nowrap';
- *   $: activeUrl = $page.url.pathname
- * </script>
- *
- * <Sidebar>
- *   <SidebarWrapper>
- *     <SidebarGroup>
- *       <SidebarItem label="Dashboard">
- *       <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="M10.5 6a7.5 7.5 0 107.5 7.5h-7.5V6z" /><path stroke-linecap="round" stroke-linejoin="round" d="M13.5 10.5H21A7.5 7.5 0 0013.5 3v7.5z" /></svg>
- *         </svelte:fragment>
- *       </SidebarItem>
- *       <SidebarItem label="Kanban" {spanClass}>
- *         <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="M3.75 6A2.25 2.25 0 016 3.75h2.25A2.25 2.25 0 0110.5 6v2.25a2.25 2.25 0 01-2.25 2.25H6a2.25 2.25 0 01-2.25-2.25V6zM3.75 15.75A2.25 2.25 0 016 13.5h2.25a2.25 2.25 0 012.25 2.25V18a2.25 2.25 0 01-2.25 2.25H6A2.25 2.25 0 013.75 18v-2.25zM13.5 6a2.25 2.25 0 012.25-2.25H18A2.25 2.25 0 0120.25 6v2.25A2.25 2.25 0 0118 10.5h-2.25a2.25 2.25 0 01-2.25-2.25V6zM13.5 15.75a2.25 2.25 0 012.25-2.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-2.25A2.25 2.25 0 0113.5 18v-2.25z" /></svg>
- *         </svelte:fragment>
- *         <svelte:fragment slot="subtext">
- *           <span
- *             class="inline-flex justify-center items-center px-2 ml-3 text-sm font-medium text-gray-800 bg-gray-200 rounded-full dark:bg-gray-700 dark:text-gray-300"
- *             >Pro</span
- *           >
- *         </svelte:fragment>
- *       </SidebarItem>
- *       <SidebarItem label="Inbox" {spanClass}>
- *       <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="M9 3.75H6.912a2.25 2.25 0 00-2.15 1.588L2.35 13.177a2.25 2.25 0 00-.1.661V18a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18v-4.162c0-.224-.034-.447-.1-.661L19.24 5.338a2.25 2.25 0 00-2.15-1.588H15M2.25 13.5h3.86a2.25 2.25 0 012.012 1.244l.256.512a2.25 2.25 0 002.013 1.244h3.218a2.25 2.25 0 002.013-1.244l.256-.512a2.25 2.25 0 012.013-1.244h3.859M12 3v8.25m0 0l-3-3m3 3l3-3" /></svg>
- *         </svelte:fragment>
- *         <svelte:fragment slot="subtext">
- *           <span
- *             class="inline-flex justify-center items-center p-3 ml-3 w-3 h-3 text-sm font-medium text-blue-600 bg-blue-200 rounded-full dark:bg-blue-900 dark:text-blue-200"
- *             >3</span
- *           >
- *         </svelte:fragment>
- *       </SidebarItem>
- *       <SidebarItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}>
- *         <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.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" /></svg>
- *         </svelte:fragment>
- *       </SidebarItem>
- *       <SidebarItem label="Sign In">
- *         <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.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75" /></svg>
- *         </svelte:fragment>
- *       </SidebarItem>
- *       <SidebarItem label="Sign Up">
- *         <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="M4.5 12a7.5 7.5 0 0015 0m-15 0a7.5 7.5 0 1115 0m-15 0H3m16.5 0H21m-1.5 0H12m-8.457 3.077l1.41-.513m14.095-5.13l1.41-.513M5.106 17.785l1.15-.964m11.49-9.642l1.149-.964M7.501 19.795l.75-1.3m7.5-12.99l.75-1.3m-6.063 16.658l.26-1.477m2.605-14.772l.26-1.477m0 17.726l-.26-1.477M10.698 4.614l-.26-1.477M16.5 19.794l-.75-1.299M7.5 4.205L12 12m6.894 5.785l-1.149-.964M6.256 7.178l-1.15-.964m15.352 8.864l-1.41-.513M4.954 9.435l-1.41-.514M12.002 12l-3.75 6.495" /></svg>
- *         </svelte:fragment>
- *       </SidebarItem>
- *     </SidebarGroup>
- *   </SidebarWrapper>
- * </Sidebar>
- * ```
+ * @prop export let href: string = '';
+ * @prop export let label: string = '';
+ * @prop export let spanClass: string = 'ml-3';
+ * @prop export let activeClass: string | undefined = undefined;
+ * @prop export let nonActiveClass: string | undefined = undefined;
+ * @prop export let active: boolean = false;
  */
 export default class SidebarItem extends SvelteComponentTyped<SidebarItemProps, SidebarItemEvents, SidebarItemSlots> {
 }

package/dist/sidebars/SidebarItem.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarItem.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/sidebars/SidebarItem.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AA+CD,QAAA,MAAM,SAAS;;;;;;sBADqL,MAAM,GAAG,SAAS;yBAAmB,MAAM,GAAG,SAAS;;;;;;;;;;;;;;;;;;;CAC7K,CAAC;AAC/E,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACtD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACxD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEtD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqEG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,oBAAoB,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,gBAAgB,CAAC;CACnH"}
+{"version":3,"file":"SidebarItem.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/sidebars/SidebarItem.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AA+CD,QAAA,MAAM,SAAS;;;;;;sBADqL,MAAM,GAAG,SAAS;yBAAmB,MAAM,GAAG,SAAS;;;;;;;;;;;;;;;;;;;CAC7K,CAAC;AAC/E,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACtD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACxD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEtD;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,oBAAoB,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,gBAAgB,CAAC;CACnH"}

package/dist/sidebars/SidebarWrapper.svelte

@@ -7,68 +7,8 @@ export let divClass = 'overflow-y-auto py-4 px-3 bg-gray-50 rounded dark:bg-gray
 </div>
 
 <!--
-  @component
-  ## Features
-  [Go to Sidebar](https://flowbite-svelte.com/docs/components/sidebar)
-  ## Props
-  @prop divClass: string = 'overflow-y-auto py-4 px-3 bg-gray-50 rounded dark:bg-gray-800';
-  ## Example
-  ```
-  <script>
-    import { page } from '$app/stores';
-    import { Sidebar, SidebarGroup, SidebarItem, SidebarWrapper } from 'flowbite-svelte';
-    let spanClass = 'flex-1 ml-3 whitespace-nowrap';
-    $: activeUrl = $page.url.pathname
-  </script>
-
-  <Sidebar>
-    <SidebarWrapper>
-      <SidebarGroup>
-        <SidebarItem label="Dashboard">
-        <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="M10.5 6a7.5 7.5 0 107.5 7.5h-7.5V6z" /><path stroke-linecap="round" stroke-linejoin="round" d="M13.5 10.5H21A7.5 7.5 0 0013.5 3v7.5z" /></svg>
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Kanban" {spanClass}>
-          <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="M3.75 6A2.25 2.25 0 016 3.75h2.25A2.25 2.25 0 0110.5 6v2.25a2.25 2.25 0 01-2.25 2.25H6a2.25 2.25 0 01-2.25-2.25V6zM3.75 15.75A2.25 2.25 0 016 13.5h2.25a2.25 2.25 0 012.25 2.25V18a2.25 2.25 0 01-2.25 2.25H6A2.25 2.25 0 013.75 18v-2.25zM13.5 6a2.25 2.25 0 012.25-2.25H18A2.25 2.25 0 0120.25 6v2.25A2.25 2.25 0 0118 10.5h-2.25a2.25 2.25 0 01-2.25-2.25V6zM13.5 15.75a2.25 2.25 0 012.25-2.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-2.25A2.25 2.25 0 0113.5 18v-2.25z" /></svg>
-          </svelte:fragment>
-          <svelte:fragment slot="subtext">
-            <span
-              class="inline-flex justify-center items-center px-2 ml-3 text-sm font-medium text-gray-800 bg-gray-200 rounded-full dark:bg-gray-700 dark:text-gray-300"
-              >Pro</span
-            >
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Inbox" {spanClass}>
-        <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="M9 3.75H6.912a2.25 2.25 0 00-2.15 1.588L2.35 13.177a2.25 2.25 0 00-.1.661V18a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18v-4.162c0-.224-.034-.447-.1-.661L19.24 5.338a2.25 2.25 0 00-2.15-1.588H15M2.25 13.5h3.86a2.25 2.25 0 012.012 1.244l.256.512a2.25 2.25 0 002.013 1.244h3.218a2.25 2.25 0 002.013-1.244l.256-.512a2.25 2.25 0 012.013-1.244h3.859M12 3v8.25m0 0l-3-3m3 3l3-3" /></svg>
-          </svelte:fragment>
-          <svelte:fragment slot="subtext">
-            <span
-              class="inline-flex justify-center items-center p-3 ml-3 w-3 h-3 text-sm font-medium text-blue-600 bg-blue-200 rounded-full dark:bg-blue-900 dark:text-blue-200"
-              >3</span
-            >
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Sidebar" href='/docs/components/sidebar' active={activeUrl === '/docs/components/sidebar'}>
-          <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.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" /></svg>
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Sign In">
-          <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.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75" /></svg>
-          </svelte:fragment>
-        </SidebarItem>
-        <SidebarItem label="Sign Up">
-          <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="M4.5 12a7.5 7.5 0 0015 0m-15 0a7.5 7.5 0 1115 0m-15 0H3m16.5 0H21m-1.5 0H12m-8.457 3.077l1.41-.513m14.095-5.13l1.41-.513M5.106 17.785l1.15-.964m11.49-9.642l1.149-.964M7.501 19.795l.75-1.3m7.5-12.99l.75-1.3m-6.063 16.658l.26-1.477m2.605-14.772l.26-1.477m0 17.726l-.26-1.477M10.698 4.614l-.26-1.477M16.5 19.794l-.75-1.299M7.5 4.205L12 12m6.894 5.785l-1.149-.964M6.256 7.178l-1.15-.964m15.352 8.864l-1.41-.513M4.954 9.435l-1.41-.514M12.002 12l-3.75 6.495" /></svg>
-          </svelte:fragment>
-        </SidebarItem>
-      </SidebarGroup>
-    </SidebarWrapper>
-  </Sidebar>
-  ```
-  
+@component
+[Go to docs](https://flowbite-svelte.com/)
+## Props
+@prop export let divClass: string = 'overflow-y-auto py-4 px-3 bg-gray-50 rounded dark:bg-gray-800';
 -->