@sierra-95/svelte-scaffold 1.2.22 → 1.2.23

package/dist/Core/components/{Form/Button → Button}/default/button.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { CircularProgress, buttonRipple } from '../../../../../index.js';
+	import { CircularProgress, buttonRipple } from '../../../../index.js';
 
 	type _variant = 'contained' | 'outlined';
 	type _color = 'primary' | 'warning' | 'error' | 'none';

package/dist/Core/components/{Form/Button → Button}/theme/theme.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
     import './theme.css';
     import { onMount } from 'svelte';
-    import {theme} from '../../../../../index.js';
+    import {theme} from '../../../../index.js';
 
     let isDark = false;
 

package/dist/Core/components/Form/Form/form.svelte

@@ -1,14 +1,9 @@
 <script lang="ts">
-    import {Carousel} from '../../../../index.js';
-
     const {
         children,
         maxWidth = '500px',
         formBackground = 'white',
         pageBackground = 'var(--primary-bg)',
-        images = [],
-        period = 5000,
-        carouselButtonColor = 'white',
         tailwindCss = '',
     } = $props();
 
@@ -16,7 +11,6 @@
 </script>
 
 <main id="karakal-form" style="background-color: {pageBackground};">
-    <Carousel images={images} period={period} buttonColor={carouselButtonColor}/>
     <div class={`form-container ${tailwindCss}`} style="background-color: {formBackground}; max-width: {maxWidth};">
         {@render children()} 
     </div>

package/dist/Core/components/Form/Form/form.svelte.d.ts

@@ -3,9 +3,6 @@ declare const Form: import("svelte").Component<{
     maxWidth?: string;
     formBackground?: string;
     pageBackground?: string;
-    images?: any[];
-    period?: number;
-    carouselButtonColor?: string;
     tailwindCss?: string;
 }, {}, "">;
 type Form = ReturnType<typeof Form>;

package/dist/Core/components/{others → Form/Input}/Previews/Audio/audio.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import {ButtonTimes, fileInputStore, ButtonSelect, removeFileForMedia, toggleSelectForMedia} from '../../../../../index.js'
+    import {ButtonTimes, fileInputStore, ButtonSelect, removeFileForMedia, toggleSelectForMedia} from '../../../../../../index.js'
     export let media;
     export let buttonTimes = false;
     export let urlsOnly = true;

package/dist/Core/components/{others → Form/Input}/Previews/Document/documents.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import {ButtonTimes,ButtonSelect, fileInputStore, removeFileForMedia, toggleSelectForMedia} from '../../../../../index.js'
+    import {ButtonTimes,ButtonSelect, fileInputStore, removeFileForMedia, toggleSelectForMedia} from '../../../../../../index.js'
     export let media;
     export let buttonTimes = false;
     export let urlsOnly = true;

package/dist/Core/components/{others → Form/Input}/Previews/GenericFile/genericFile.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import {ButtonTimes,ButtonSelect, fileInputStore, removeFileForMedia, toggleSelectForMedia} from '../../../../../index.js'
+    import {ButtonTimes,ButtonSelect, fileInputStore, removeFileForMedia, toggleSelectForMedia} from '../../../../../../index.js'
     import Generic from '../generic.svelte';
     export let media;
     export let buttonTimes = false;

package/dist/Core/components/{others → Form/Input}/Previews/Image/image.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import {ButtonTimes, fileInputStore, ButtonSelect, getPreviewUrlForMedia, toggleSelectForMedia, removeFileForMedia, IMAGE_MIME_TYPES_PREVIEW} from '../../../../../index.js'
+    import {ButtonTimes, fileInputStore, ButtonSelect, getPreviewUrlForMedia, toggleSelectForMedia, removeFileForMedia, IMAGE_MIME_TYPES_PREVIEW} from '../../../../../../index.js'
     import Generic from '../generic.svelte';
     
     export let media;

package/dist/Core/components/{others → Form/Input}/Previews/Video/video.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import {ButtonTimes, fileInputStore, ButtonSelect, getPreviewUrlForMedia, toggleSelectForMedia, removeFileForMedia} from '../../../../../index.js'
+    import {ButtonTimes, fileInputStore, ButtonSelect, getPreviewUrlForMedia, toggleSelectForMedia, removeFileForMedia} from '../../../../../../index.js'
     
     export let media;
     export let buttonTimes = false;

package/dist/Core/components/Form/Table/table.svelte

@@ -0,0 +1,118 @@
+<script lang="ts">
+	import type { SvelteComponent } from "svelte";
+
+  type TableCell = {
+    content: string | (() => string) | SvelteComponent;
+    colspan?: number;
+    rowspan?: number;
+    class?: string;
+  };
+  
+  type TableRow = TableCell[];
+
+  type TableProps = {
+    title?: {
+      name: string;
+      fontSize?: string;
+      fontWeight?: string;
+      color?: string;
+    };
+    table:{
+      headers: string[];
+      rows: TableRow[];
+      striped?: boolean;
+      stripeColor?: string;
+      fontSize?: string;
+      borderSize?: string;
+      borderColor?: string;
+    }
+  };
+
+  const defaultTitle = {
+    name: '',
+    fontSize: "1.25rem",
+    fontWeight: "bold",
+    color: "var(--text-primary)"
+  };
+
+  const defaultTable = {
+    headers: [],
+    rows: [],
+    striped: true,
+    fontSize: "0.875rem",
+    borderSize: "1px",
+    borderColor: "var(--border)"
+  };
+  
+  const props: TableProps = $props();
+
+  const title = $derived({
+    ...defaultTitle,
+    ...props.title
+  });
+
+  const table = $derived({
+    ...defaultTable,
+    ...props.table
+  });
+
+  const stripeColor = "var(--background-secondary)";
+</script>
+
+<style>
+  #sierra-table table {
+    table-layout: auto;
+    width: 100%;
+    text-align: left;
+  }
+  #sierra-table thead {
+    font-size: 0.75rem;
+    text-transform: uppercase;
+  }
+  #sierra-table th,
+  #sierra-table td {
+    padding: 0.75rem;
+  }
+  #sierra-table h2{
+    margin-bottom: 1rem;
+
+  }
+</style>
+
+<main id="sierra-table" style="width: 100%;">
+  {#if title.name}
+    <h2>{title.name}</h2>
+  {/if}
+  <table style="font-size: {table.fontSize};">
+    <thead>
+      <tr>
+        {#each table.headers as header}
+          <th style="border: {table.borderSize} solid {table.borderColor};">{header}</th>
+        {/each}
+      </tr>
+    </thead>
+
+    <tbody>
+      {#each table.rows as row, i}
+        <tr
+          style="{table.striped && i % 2 === 1 ? `background-color: ${stripeColor}` : ''}"
+        >
+          {#each row as cell}
+            <td
+              class={`${cell.class || ''}`}
+              style="border: {table.borderSize} solid {table.borderColor};"
+              colspan={cell.colspan || 1}
+              rowspan={cell.rowspan || 1}
+            >
+              {#if typeof cell.content === 'function'}
+                {@html cell.content()}
+              {:else}
+                {@html cell.content}
+              {/if}
+            </td>
+          {/each}
+        </tr>
+      {/each}
+    </tbody>
+  </table>
+</main>

package/dist/Core/components/Form/Table/table.svelte.d.ts

@@ -0,0 +1,28 @@
+import { SvelteComponent } from "svelte";
+type TableCell = {
+    content: string | (() => string) | SvelteComponent;
+    colspan?: number;
+    rowspan?: number;
+    class?: string;
+};
+type TableRow = TableCell[];
+type TableProps = {
+    title?: {
+        name: string;
+        fontSize?: string;
+        fontWeight?: string;
+        color?: string;
+    };
+    table: {
+        headers: string[];
+        rows: TableRow[];
+        striped?: boolean;
+        stripeColor?: string;
+        fontSize?: string;
+        borderSize?: string;
+        borderColor?: string;
+    };
+};
+declare const Table: import("svelte").Component<TableProps, {}, "">;
+type Table = ReturnType<typeof Table>;
+export default Table;

package/dist/Core/components/Menus/DropdownContainer/dropdown.svelte

@@ -10,6 +10,7 @@
         width = 'auto',
         open = $bindable(true), 
         dropdownTrigger = null,
+        zIndex = 5,
         children = null,
     } = $props();
 
@@ -75,7 +76,6 @@
         box-shadow: var(--box-shadow);
         min-width: 5px;
         min-height: 5px;
-        z-index: 5;
     }
 </style>
 
@@ -94,6 +94,7 @@
             style="
                 transform-origin: top; top: {top}; width: {width};
                 left: {dropdownStyle.left}; right: {dropdownStyle.right};
+                z-index: {zIndex};
             "
         >{@render children?.()}
         </div>

package/dist/Core/components/Menus/DropdownContainer/dropdown.svelte.d.ts

@@ -3,6 +3,7 @@ declare const Dropdown: import("svelte").Component<{
     width?: string;
     open?: boolean;
     dropdownTrigger?: any;
+    zIndex?: number;
     children?: any;
 }, {}, "open">;
 type Dropdown = ReturnType<typeof Dropdown>;

package/dist/Core/components/Menus/{Hamburger → HamburgerMenu}/hamburger.svelte

@@ -4,18 +4,18 @@
 
 
     let {
-        zIndex = 40,
         barWidth = "30px",
         barHeight = "3px",
         barColor = "black",
         barBorderRadius = "5px",
         barSpacing = "5px",
+        menuZIndex = 40,
         menuTextColor = "black",
         menuBackgroundColor = "white",
-        buttonTimesColor = "currentColor",
-        LogoWidth = "100px",
-        companyLogo = "",
+        menuLogoUrl = "",
+        menuLogoWidth = "100px",
         menuOpen = $bindable(false),
+        buttonTimesColor = "currentColor",
         children = null,
     } = $props();
 
@@ -38,10 +38,10 @@
         id="sierra-hamburger-menu"
         in:fly={{ y: -100, duration: 300 }}
         out:fly={{ y: -100, duration: 300 }}
-        style="background-color: {menuBackgroundColor}; color: {menuTextColor}; z-index: {zIndex};"
+        style="background-color: {menuBackgroundColor}; color: {menuTextColor}; z-index: {menuZIndex};"
     >
         <div style="height: 40px; justify-content: space-between; align-items: center; display: flex; padding: 0 20px; margin-top: 20px;">
-            <img src={companyLogo} alt="Logo" style="width: {LogoWidth};"/>
+            <img src={menuLogoUrl} alt="Logo" style="width: {menuLogoWidth};"/>
             <ButtonTimes width="50px" height="100%" absolute={false} iconSize="18px" onclick={toggleMenu} iconColor={buttonTimesColor}/>
         </div>
         {@render children?.()}

package/dist/Core/components/Menus/{Hamburger → HamburgerMenu}/hamburger.svelte.d.ts

@@ -1,16 +1,16 @@
 declare const Hamburger: import("svelte").Component<{
-    zIndex?: number;
     barWidth?: string;
     barHeight?: string;
     barColor?: string;
     barBorderRadius?: string;
     barSpacing?: string;
+    menuZIndex?: number;
     menuTextColor?: string;
     menuBackgroundColor?: string;
-    buttonTimesColor?: string;
-    LogoWidth?: string;
-    companyLogo?: string;
+    menuLogoUrl?: string;
+    menuLogoWidth?: string;
     menuOpen?: boolean;
+    buttonTimesColor?: string;
     children?: any;
 }, {}, "menuOpen">;
 type Hamburger = ReturnType<typeof Hamburger>;

package/dist/Core/components/Menus/MenuItem/menuItem.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
     const {
         icon = '',
+        url = '',
         active = false,
         disabled = false,
         iconSize = '20px',
-        iconGap = '20px',
+        iconGap = '15px',
         iconBg = 'var(--primary-bg)',
         rounded = '0px',
         children = null,
@@ -42,5 +43,9 @@
         <i style="font-size: {iconSize}; color: {iconBg}" 
         class="fa {icon}"></i>
     {/if}
-    <h4 style="margin-left: {icon ? iconGap : '0'};">{@render children?.()}</h4>
+
+    {#if url}
+        <img style="width: {iconSize};" src={url} alt="Logo"/>
+    {/if}
+    <h4 style="margin-left: {icon || url ? iconGap : '0'};">{@render children?.()}</h4>
 </div>

package/dist/Core/components/Menus/MenuItem/menuItem.svelte.d.ts

@@ -1,5 +1,6 @@
 declare const MenuItem: import("svelte").Component<{
     icon?: string;
+    url?: string;
     active?: boolean;
     disabled?: boolean;
     iconSize?: string;

package/dist/Core/components/others/{Modal → popups/Modal}/modal.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { modalStore, Button, Backdrop, Wrapper, resetModalStore} from '../../../../index.js';
+  import { modalStore, Button, Backdrop, Wrapper, resetModalStore} from '../../../../../index.js';
   import { onMount } from 'svelte';
 
   function close() {

package/dist/Modules/Layout/Header/header.svelte

@@ -1,27 +1,48 @@
 <script lang="ts">
-  import {layoutStore, ButtonHamburger} from '../../../index.js';
+  import {layoutStore, ButtonHamburger, DropdownContainer, MenuItem} from '../../../index.js';
   import './header.css';
-   const {
+  
+  const {
     toggleMenu = (() => {}),
   } = $props();
+  let openMenu = $state(false);
 
 </script>
 <header id='sierra-header'>
   <div style="display: flex; align-items: center; gap: 1rem;">
+    
     <a href={$layoutStore.headerLink} style="display: flex; align-items: center; gap: 0.5rem; color: inherit; margin-left: 1rem;'}">
       {#if $layoutStore.headerImage}
-          <img style="--header-image-size : {$layoutStore.headerImageSize}" src={$layoutStore.headerImage} alt="Logo"/>
-      {/if}
-      {#if $layoutStore.headerTitle}
-        <h2
-        style="
-          color: {$layoutStore.headerTitleColor};
-          font-family: {$layoutStore.headerTitleFont};
-          font-size: {$layoutStore.headerTitleFontSize};
-          font-weight: {$layoutStore.headerTitleFontWeight};
-        ">{$layoutStore.headerTitle}</h2>
+        <img style="--header-image-size : {$layoutStore.headerImageSize}" src={$layoutStore.headerImage} alt="Logo"/>
       {/if}
     </a>
+
+    <div style="display: flex; align-items: center; gap: 5px">
+        
+        <!--More header options-->
+        {#if $layoutStore.dropdownContent}
+          {#snippet TriggerMenu()}
+            <button aria-label="Ellipsis" onclick={() => (openMenu = !openMenu)}>
+              <i class="fa-solid fa-chevron-down {openMenu? 'active':''}"></i>
+            </button>
+          {/snippet}
+          <DropdownContainer zIndex={15} bind:open={openMenu} dropdownTrigger={TriggerMenu}>
+            {@render $layoutStore.dropdownContent?.()}
+          </DropdownContainer>
+        {/if}
+
+        <!-- Header Title -->        
+        {#if $layoutStore.headerTitle}
+            <a href={$layoutStore.headerLink}
+            style="
+              color: {$layoutStore.headerTitleColor};
+              font-family: {$layoutStore.headerTitleFont};
+              font-size: {$layoutStore.headerTitleFontSize};
+              font-weight: {$layoutStore.headerTitleFontWeight};
+            ">{$layoutStore.headerTitle}</a>
+        {/if}
+    </div>
+
   </div>
   <div>{@render $layoutStore.headerCenterContent?.()}</div>
   <div style="display: flex; gap: 1rem; align-items: center;">

package/dist/index.d.ts

@@ -3,14 +3,20 @@ export { default as CircularProgress } from './Core/components/others/Progress/C
 export { default as LinearProgress } from './Core/components/others/Progress/LinearProgress/LinearProgress.svelte';
 export { default as CustomProgress } from './Core/components/others/Progress/CustomProgress/customProgress.svelte';
 export { default as StorageGauge } from './Core/components/others/Progress/StorageGauge/storagegauge.svelte';
-export { default as Button } from './Core/components/Form/Button/default/button.svelte';
-export { default as ButtonFlip } from './Core/components/Form/Button/Flip/button.svelte';
-export { default as ButtonMarquee } from './Core/components/Form/Button/Marquee/button.svelte';
-export { default as ButtonSwipe } from './Core/components/Form/Button/Swipe/button.svelte';
-export { default as ButtonTheme } from './Core/components/Form/Button/theme/theme.svelte';
-export { default as ButtonTimes } from './Core/components/Form/Button/times/times.svelte';
-export { default as ButtonSelect } from './Core/components/Form/Button/select/select.svelte';
-export { default as ButtonHamburger } from './Core/components/Form/Button/Hamburger/hamburger.svelte';
+export { default as Button } from './Core/components/Button/default/button.svelte';
+export { default as ButtonFlip } from './Core/components/Button/custom/Flip/button.svelte';
+export { default as ButtonMarquee } from './Core/components/Button/custom/Marquee/button.svelte';
+export { default as ButtonSwipe } from './Core/components/Button/custom/Swipe/button.svelte';
+export { default as ButtonTheme } from './Core/components/Button/theme/theme.svelte';
+export { default as ButtonTimes } from './Core/components/Button/iconType/times/times.svelte';
+export { default as ButtonSelect } from './Core/components/Button/iconType/select/select.svelte';
+export { default as ButtonHamburger } from './Core/components/Button/Hamburger/hamburger.svelte';
+export { default as ButtonWhatsappShare } from './Core/components/Button/WhatsappShare/whatsapp.svelte';
+export { default as Form } from './Core/components/Form/Form/form.svelte';
+export { default as Hr } from './Core/components/Form/HorizontalRule/Hr/hr.svelte';
+export { default as HrSplit } from './Core/components/Form/HorizontalRule/HrSplit/hrsplit.svelte';
+export { default as Checkbox } from './Core/components/Form/Checkbox/checkbox.svelte';
+export { default as Table } from './Core/components/Form/Table/table.svelte';
 export { default as Input } from './Core/components/Form/Input/input/input.svelte';
 export { default as PasswordInput } from './Core/components/Form/Input/password/password.svelte';
 export { default as Select } from './Core/components/Form/Input/select/select.svelte';
@@ -20,29 +26,24 @@ export { default as TextArea } from './Core/components/Form/Input/TextArea/texta
 export { default as DateInput } from './Core/components/Form/Input/Date/date.svelte';
 export { default as TimeInput } from './Core/components/Form/Input/Time/time.svelte';
 export { default as PasswordStrength } from './Core/components/Form/Input/PasswordStrength/passwordStrength.svelte';
-export { default as PreviewAudio } from './Core/components/others/Previews/Audio/audio.svelte';
-export { default as PreviewImage } from './Core/components/others/Previews/Image/image.svelte';
-export { default as PreviewVideo } from './Core/components/others/Previews/Video/video.svelte';
-export { default as PreviewDocument } from './Core/components/others/Previews/Document/documents.svelte';
-export { default as PreviewGenericFile } from './Core/components/others/Previews/GenericFile/genericFile.svelte';
+export { default as PreviewAudio } from './Core/components/Form/Input/Previews/Audio/audio.svelte';
+export { default as PreviewImage } from './Core/components/Form/Input/Previews/Image/image.svelte';
+export { default as PreviewVideo } from './Core/components/Form/Input/Previews/Video/video.svelte';
+export { default as PreviewDocument } from './Core/components/Form/Input/Previews/Document/documents.svelte';
+export { default as PreviewGenericFile } from './Core/components/Form/Input/Previews/GenericFile/genericFile.svelte';
 export { default as MenuItem } from './Core/components/Menus/MenuItem/menuItem.svelte';
 export { default as DropdownContainer } from './Core/components/Menus/DropdownContainer/dropdown.svelte';
 export { default as Tabs } from './Core/components/Menus/Tabs/main.svelte';
-export { default as HamburgerMenu } from './Core/components/Menus/Hamburger/hamburger.svelte';
+export { default as HamburgerMenu } from './Core/components/Menus/HamburgerMenu/hamburger.svelte';
 export { default as ContentSwitcher } from './Core/components/Menus/ContentSwitcher/contentSwitcher.svelte';
-export { default as Modal } from './Core/components/others/Modal/modal.svelte';
-export { default as Backdrop } from './Core/components/others/Backdrop/backdrop.svelte';
-export { default as Wrapper } from './Core/components/others/Wrapper/wrapper.svelte';
+export { default as Modal } from './Core/components/others/popups/Modal/modal.svelte';
+export { default as Backdrop } from './Core/components/others/popups/Backdrop/backdrop.svelte';
+export { default as Wrapper } from './Core/components/others/popups/Wrapper/wrapper.svelte';
 export { default as Time } from './Core/components/others/Calender/Time/time.svelte';
 export { default as Date } from './Core/components/others/Calender/Date/date.svelte';
-export { default as Hr } from './Core/components/others/Hr/Hr/hr.svelte';
-export { default as HrSplit } from './Core/components/others/Hr/HrSplit/hrsplit.svelte';
-export { default as Checkbox } from './Core/components/Form/Checkbox/checkbox.svelte';
-export { default as Form } from './Core/components/Form/Form/form.svelte';
 export { default as Carousel } from './Core/components/others/Carousel/carousel.svelte';
 export { default as Avatar } from './Core/components/others/Avatar/avatar.svelte';
 export { default as ColorPicker } from './Core/components/others/ColorPicker/main.svelte';
-export { default as WhatsappShare } from './Core/components/others/WhatsappShare/whatsapp.svelte';
 export { default as GlobalSearch } from './Core/features/GlobalSearch/main.svelte';
 export { default as ToastManager } from './Core/features/ToastManager/toastManager.svelte';
 export { default as Editor } from './Modules/Editor/main.svelte';

package/dist/index.js

@@ -6,14 +6,21 @@ export { default as LinearProgress } from './Core/components/others/Progress/Lin
 export { default as CustomProgress } from './Core/components/others/Progress/CustomProgress/customProgress.svelte';
 export { default as StorageGauge } from './Core/components/others/Progress/StorageGauge/storagegauge.svelte';
 //Buttons
-export { default as Button } from './Core/components/Form/Button/default/button.svelte';
-export { default as ButtonFlip } from './Core/components/Form/Button/Flip/button.svelte';
-export { default as ButtonMarquee } from './Core/components/Form/Button/Marquee/button.svelte';
-export { default as ButtonSwipe } from './Core/components/Form/Button/Swipe/button.svelte';
-export { default as ButtonTheme } from './Core/components/Form/Button/theme/theme.svelte';
-export { default as ButtonTimes } from './Core/components/Form/Button/times/times.svelte';
-export { default as ButtonSelect } from './Core/components/Form/Button/select/select.svelte';
-export { default as ButtonHamburger } from './Core/components/Form/Button/Hamburger/hamburger.svelte';
+export { default as Button } from './Core/components/Button/default/button.svelte';
+export { default as ButtonFlip } from './Core/components/Button/custom/Flip/button.svelte';
+export { default as ButtonMarquee } from './Core/components/Button/custom/Marquee/button.svelte';
+export { default as ButtonSwipe } from './Core/components/Button/custom/Swipe/button.svelte';
+export { default as ButtonTheme } from './Core/components/Button/theme/theme.svelte';
+export { default as ButtonTimes } from './Core/components/Button/iconType/times/times.svelte';
+export { default as ButtonSelect } from './Core/components/Button/iconType/select/select.svelte';
+export { default as ButtonHamburger } from './Core/components/Button/Hamburger/hamburger.svelte';
+export { default as ButtonWhatsappShare } from './Core/components/Button/WhatsappShare/whatsapp.svelte';
+//Form
+export { default as Form } from './Core/components/Form/Form/form.svelte';
+export { default as Hr } from './Core/components/Form/HorizontalRule/Hr/hr.svelte';
+export { default as HrSplit } from './Core/components/Form/HorizontalRule/HrSplit/hrsplit.svelte';
+export { default as Checkbox } from './Core/components/Form/Checkbox/checkbox.svelte';
+export { default as Table } from './Core/components/Form/Table/table.svelte';
 //Inputs
 export { default as Input } from './Core/components/Form/Input/input/input.svelte';
 export { default as PasswordInput } from './Core/components/Form/Input/password/password.svelte';
@@ -25,31 +32,26 @@ export { default as DateInput } from './Core/components/Form/Input/Date/date.sve
 export { default as TimeInput } from './Core/components/Form/Input/Time/time.svelte';
 export { default as PasswordStrength } from './Core/components/Form/Input/PasswordStrength/passwordStrength.svelte';
 //Previews
-export { default as PreviewAudio } from './Core/components/others/Previews/Audio/audio.svelte';
-export { default as PreviewImage } from './Core/components/others/Previews/Image/image.svelte';
-export { default as PreviewVideo } from './Core/components/others/Previews/Video/video.svelte';
-export { default as PreviewDocument } from './Core/components/others/Previews/Document/documents.svelte';
-export { default as PreviewGenericFile } from './Core/components/others/Previews/GenericFile/genericFile.svelte';
+export { default as PreviewAudio } from './Core/components/Form/Input/Previews/Audio/audio.svelte';
+export { default as PreviewImage } from './Core/components/Form/Input/Previews/Image/image.svelte';
+export { default as PreviewVideo } from './Core/components/Form/Input/Previews/Video/video.svelte';
+export { default as PreviewDocument } from './Core/components/Form/Input/Previews/Document/documents.svelte';
+export { default as PreviewGenericFile } from './Core/components/Form/Input/Previews/GenericFile/genericFile.svelte';
 //Menus
 export { default as MenuItem } from './Core/components/Menus/MenuItem/menuItem.svelte';
 export { default as DropdownContainer } from './Core/components/Menus/DropdownContainer/dropdown.svelte';
 export { default as Tabs } from './Core/components/Menus/Tabs/main.svelte';
-export { default as HamburgerMenu } from './Core/components/Menus/Hamburger/hamburger.svelte';
+export { default as HamburgerMenu } from './Core/components/Menus/HamburgerMenu/hamburger.svelte';
 export { default as ContentSwitcher } from './Core/components/Menus/ContentSwitcher/contentSwitcher.svelte';
 //others
-export { default as Modal } from './Core/components/others/Modal/modal.svelte';
-export { default as Backdrop } from './Core/components/others/Backdrop/backdrop.svelte';
-export { default as Wrapper } from './Core/components/others/Wrapper/wrapper.svelte';
+export { default as Modal } from './Core/components/others/popups/Modal/modal.svelte';
+export { default as Backdrop } from './Core/components/others/popups/Backdrop/backdrop.svelte';
+export { default as Wrapper } from './Core/components/others/popups/Wrapper/wrapper.svelte';
 export { default as Time } from './Core/components/others/Calender/Time/time.svelte';
 export { default as Date } from './Core/components/others/Calender/Date/date.svelte';
-export { default as Hr } from './Core/components/others/Hr/Hr/hr.svelte';
-export { default as HrSplit } from './Core/components/others/Hr/HrSplit/hrsplit.svelte';
-export { default as Checkbox } from './Core/components/Form/Checkbox/checkbox.svelte';
-export { default as Form } from './Core/components/Form/Form/form.svelte';
 export { default as Carousel } from './Core/components/others/Carousel/carousel.svelte';
 export { default as Avatar } from './Core/components/others/Avatar/avatar.svelte';
 export { default as ColorPicker } from './Core/components/others/ColorPicker/main.svelte';
-export { default as WhatsappShare } from './Core/components/others/WhatsappShare/whatsapp.svelte';
 //####################Features##################################
 export { default as GlobalSearch } from './Core/features/GlobalSearch/main.svelte';
 export { default as ToastManager } from './Core/features/ToastManager/toastManager.svelte';

package/dist/stores/modules/layout.d.ts

@@ -35,6 +35,8 @@ export type LayoutState = {
     backgroundColor: string;
     userRole?: string;
     ROLE_LEVELS: Record<any, number>;
+    dropdown?: boolean;
+    dropdownContent?: any;
 };
 export declare const layoutStore: import("svelte/store").Writable<LayoutState>;
 export declare function resetLayoutStore(): void;

package/dist/stores/modules/layout.js

@@ -19,7 +19,9 @@ const defaultLayoutState = {
     menuActiveIconColor: 'var(--primary-bg)',
     backgroundColor: '',
     userRole: 'user',
-    ROLE_LEVELS: { user: 1 }
+    ROLE_LEVELS: { user: 1 },
+    dropdown: false,
+    dropdownContent: null
 };
 export const layoutStore = writable({
     ...defaultLayoutState

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@sierra-95/svelte-scaffold",
-	"version": "1.2.22",
+	"version": "1.2.23",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build && npm run prepack",