@getmicdrop/svelte-components 2.3.0 → 2.4.0

package/dist/components/Modal/Modal.svelte

@@ -8,6 +8,7 @@
   export let isProcessing = false;
   export let isSuccess = false;
   export let size = "default"; // "default" | "small" | "large"
+  export let persistent = false; // When true, prevents closing by clicking backdrop or pressing Escape
 
   const dispatch = createEventDispatcher();
 
@@ -16,7 +17,7 @@
 
   // Handle escape key
   function handleKeydown(event) {
-    if (event.key === "Escape" && show) {
+    if (event.key === "Escape" && show && !persistent) {
       resetModal();
     }
   }
@@ -72,7 +73,7 @@
   <!-- svelte-ignore a11y-no-static-element-interactions -->
   <div
     class="modal-backdrop"
-    on:click={resetModal}
+    on:click={persistent ? null : resetModal}
     transition:fade={{ duration: 300 }}
     role="dialog"
     aria-modal="true"

package/dist/components/Modal/Modal.svelte.d.ts

@@ -4,6 +4,7 @@ type Modal = SvelteComponent<{
     show?: boolean | undefined;
     isSuccess?: boolean | undefined;
     isProcessing?: boolean | undefined;
+    persistent?: boolean | undefined;
 }, {
     click: PointerEvent;
     cancel: CustomEvent<any>;
@@ -21,6 +22,7 @@ declare const Modal: $$__sveltets_2_IsomorphicComponent<{
     show?: boolean | undefined;
     isSuccess?: boolean | undefined;
     isProcessing?: boolean | undefined;
+    persistent?: boolean | undefined;
 }, {
     click: PointerEvent;
     cancel: CustomEvent<any>;

package/dist/components/Modal/Modal.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Modal/Modal.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAkIA;;;;;;;;;;;;;;eAAmK;6CAdtH,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Modal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Modal/Modal.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAmIA;;;;;;;;;;;;;;;eAAgL;6CAdnI,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/OrderSummary/OrderSummary.svelte

@@ -223,7 +223,7 @@
       {#if loading}
         <Spinner size="sm" color="white" />
       {:else}
-        {btnText}
+        <span translate="no">{btnText}</span>
       {/if}
     </button>
   </div>
@@ -345,7 +345,7 @@
         {#if loading}
           <Spinner size="sm" color="white" />
         {:else}
-          Checkout
+          <span translate="no">Checkout</span>
         {/if}
       </button>
     </div>

package/dist/components/OrderSummary/OrderSummary.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OrderSummary.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/OrderSummary/OrderSummary.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAuVA;;;;;;;;;;;;;;;;;;;;;;;mBAA2S;6CAT9P,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"OrderSummary.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/OrderSummary/OrderSummary.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAyVA;;;;;;;;;;;;;;;;;;;;;;;mBAA2S;6CAT9P,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/Pagination/Pagination.svelte

@@ -9,16 +9,27 @@
   export let maxVisible = 5;
   /** @type {boolean} Show previous/next buttons */
   export let showPrevNext = true;
+  /** @type {boolean} Flowbite API: alias for showPrevNext */
+  export let showIcons = undefined;
+  /** @type {string} Flowbite API: previous button label */
+  export let previousLabel = undefined;
+  /** @type {string} Flowbite API: next button label */
+  export let nextLabel = undefined;
   /** @type {string} Additional CSS classes */
   let className = "";
   export { className as class };
 
   const dispatch = createEventDispatcher();
 
+  // Support flowbite's showIcons prop
+  $: effectiveShowPrevNext = showIcons !== undefined ? showIcons : showPrevNext;
+
   function goToPage(page) {
     if (page >= 1 && page <= totalPages && page !== currentPage) {
       currentPage = page;
       dispatch("change", { page });
+      // Also dispatch flowbite-style event
+      dispatch("pageChange", page);
     }
   }
 
@@ -53,7 +64,7 @@
 </script>
 
 <nav class="pagination {className}" aria-label="Pagination">
-  {#if showPrevNext}
+  {#if effectiveShowPrevNext}
     <button
       type="button"
       class="pagination__button pagination__button--prev"
@@ -61,9 +72,13 @@
       on:click={previous}
       aria-label="Previous page"
     >
-      <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-        <path d="M12.5 15L7.5 10L12.5 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-      </svg>
+      {#if $$slots.prev}
+        <slot name="prev" />
+      {:else}
+        <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M12.5 15L7.5 10L12.5 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+        </svg>
+      {/if}
     </button>
   {/if}
 
@@ -103,7 +118,7 @@
     {/if}
   </div>
 
-  {#if showPrevNext}
+  {#if effectiveShowPrevNext}
     <button
       type="button"
       class="pagination__button pagination__button--next"
@@ -111,9 +126,13 @@
       on:click={next}
       aria-label="Next page"
     >
-      <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-        <path d="M7.5 5L12.5 10L7.5 15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-      </svg>
+      {#if $$slots.next}
+        <slot name="next" />
+      {:else}
+        <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M7.5 5L12.5 10L7.5 15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+        </svg>
+      {/if}
     </button>
   {/if}
 </nav>

package/dist/components/Pagination/Pagination.svelte.d.ts

@@ -5,11 +5,18 @@ type Pagination = SvelteComponent<{
     totalPages?: number | undefined;
     maxVisible?: number | undefined;
     showPrevNext?: boolean | undefined;
+    showIcons?: boolean | undefined;
+    previousLabel?: string | undefined;
+    nextLabel?: string | undefined;
 }, {
     change: CustomEvent<any>;
+    pageChange: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}> & {
+}, {
+    prev: {};
+    next: {};
+}> & {
     $$bindings?: string | undefined;
 };
 declare const Pagination: $$__sveltets_2_IsomorphicComponent<{
@@ -18,11 +25,18 @@ declare const Pagination: $$__sveltets_2_IsomorphicComponent<{
     totalPages?: number | undefined;
     maxVisible?: number | undefined;
     showPrevNext?: boolean | undefined;
+    showIcons?: boolean | undefined;
+    previousLabel?: string | undefined;
+    nextLabel?: string | undefined;
 }, {
     change: CustomEvent<any>;
+    pageChange: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {
+    prev: {};
+    next: {};
+}, {}, string>;
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;

package/dist/components/Pagination/Pagination.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Pagination/Pagination.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;AAqHA;;;;;;;;;;mBAAwL;6CAT3I,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Pagination.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Pagination/Pagination.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAgJA;;;;;;;;;;;;;;;;;eAAsO;6CAdzL,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/Radio/Radio.svelte

@@ -9,13 +9,16 @@
   export let name = "";
   /** @type {boolean} Whether the radio is disabled */
   export let disabled = false;
+  /** @type {boolean|undefined} Direct checked prop for flowbite API compatibility */
+  export let checked = undefined;
   /** @type {string} Additional CSS classes */
   let className = "";
   export { className as class };
 
   const dispatch = createEventDispatcher();
 
-  $: checked = group === value;
+  // Support both flowbite-style checked prop and group binding
+  $: isChecked = checked !== undefined ? checked : group === value;
 
   function handleChange() {
     group = value;
@@ -29,7 +32,7 @@
     {name}
     {value}
     {disabled}
-    checked={checked}
+    checked={isChecked}
     on:change={handleChange}
     class="radio__input"
   />

package/dist/components/Radio/Radio.svelte.d.ts

@@ -2,6 +2,7 @@ export default Radio;
 type Radio = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
     class?: string | undefined;
     disabled?: boolean | undefined;
+    checked?: boolean | undefined;
     value?: string | undefined;
     name?: string | undefined;
     group?: string | undefined;
@@ -19,6 +20,7 @@ type Radio = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
 declare const Radio: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
     class?: string | undefined;
     disabled?: boolean | undefined;
+    checked?: boolean | undefined;
     value?: string | undefined;
     name?: string | undefined;
     group?: string | undefined;

package/dist/components/Radio/Radio.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Radio/Radio.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAiEA;;;;;;;;;;;;;;eAAoK;sCAT9H,KAAK,EAAE,KAAK;;;;;6CALL,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Radio.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Radio/Radio.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAqEA;;;cAhBW,OAAO,GAAC,SAAS;;;;;;;;;;;;eAgBkJ;sCATxI,KAAK,EAAE,KAAK;;;;;6CALL,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/Skeleton/Skeleton.svelte

@@ -10,12 +10,21 @@
   /** @type {string} Additional CSS classes */
   let className = "";
   export { className as class };
+  /** @type {string} Flowbite-style divClass for Tailwind classes */
+  export let divClass = "";
+
+  // If divClass is provided, use it instead of explicit width/height
+  $: useFlowbiteStyle = divClass !== "";
+  $: computedStyle = useFlowbiteStyle ? "" : `width: ${width}; height: ${height};`;
+  $: computedClass = useFlowbiteStyle
+    ? `skeleton skeleton--${variant} ${divClass} ${className}`.trim()
+    : `skeleton skeleton--${variant} ${className}`.trim();
 </script>
 
 <div
-  class="skeleton skeleton--{variant} {className}"
+  class={computedClass}
   class:skeleton--animated={animation}
-  style="width: {width}; height: {height};"
+  style={computedStyle}
   aria-hidden="true"
 ></div>
 

package/dist/components/Skeleton/Skeleton.svelte.d.ts

@@ -5,6 +5,7 @@ type Skeleton = SvelteComponent<{
     width?: string | undefined;
     height?: string | undefined;
     animation?: boolean | undefined;
+    divClass?: string | undefined;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}> & {
@@ -16,6 +17,7 @@ declare const Skeleton: $$__sveltets_2_IsomorphicComponent<{
     width?: string | undefined;
     height?: string | undefined;
     animation?: boolean | undefined;
+    divClass?: string | undefined;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, string>;

package/dist/components/Skeleton/Skeleton.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Skeleton/Skeleton.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;AAqCA;;;;;;;;mBAAsK;6CATzH,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Skeleton.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Skeleton/Skeleton.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;AA+CA;;;;;;;;;mBAAiL;6CATpI,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/Tabs/TabItem.svelte

@@ -0,0 +1,39 @@
+<script>
+  import { getContext, onMount, createEventDispatcher } from "svelte";
+
+  /** @type {string} Tab title displayed in the tab button */
+  export let title = "";
+  /** @type {boolean} Whether this tab is initially open/active (flowbite API) */
+  export let open = false;
+  /** @type {string|number|undefined} Unique identifier for this tab */
+  export let value = undefined;
+  /** @type {boolean} Whether the tab is disabled */
+  export let disabled = false;
+  /** @type {string} Additional CSS classes for the tab button */
+  let className = "";
+  export { className as class };
+
+  const dispatch = createEventDispatcher();
+  const { activeTab, registerTab } = getContext("tabs");
+
+  // Generate unique ID
+  let tabId = value || `tab-${Math.random().toString(36).substring(2, 9)}`;
+
+  onMount(() => {
+    registerTab(tabId, title, open);
+  });
+
+  $: isActive = $activeTab === tabId;
+</script>
+
+{#if isActive}
+  <div class="tab-panel" role="tabpanel" on:click={() => dispatch("click")}>
+    <slot />
+  </div>
+{/if}
+
+<style>
+  .tab-panel {
+    /* Content panel styling can be customized via contentClass on Tabs */
+  }
+</style>

package/dist/components/Tabs/TabItem.svelte.d.ts

@@ -0,0 +1,52 @@
+export default TabItem;
+type TabItem = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
+    class?: string | undefined;
+    open?: boolean | undefined;
+    title?: string | undefined;
+    disabled?: boolean | undefined;
+    value?: string | number | undefined;
+}, {
+    default: {};
+}>, {
+    click: CustomEvent<any>;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}> & {
+    $$bindings?: string | undefined;
+};
+declare const TabItem: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    class?: string | undefined;
+    open?: boolean | undefined;
+    title?: string | undefined;
+    disabled?: boolean | undefined;
+    value?: string | number | undefined;
+}, {
+    default: {};
+}>, {
+    click: CustomEvent<any>;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+//# sourceMappingURL=TabItem.svelte.d.ts.map

package/dist/components/Tabs/TabItem.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabItem.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Tabs/TabItem.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AA8DA;;;;;YAjBW,MAAM,GAAC,MAAM,GAAC,SAAS;;;;;;;;;eAiBoI;sCAThI,KAAK,EAAE,KAAK;;;;;6CALL,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/Tabs/Tabs.svelte

@@ -0,0 +1,181 @@
+<script>
+  import { setContext, onMount } from "svelte";
+  import { writable } from "svelte/store";
+
+  /** @type {'underline' | 'pill' | 'full'} Tab style variant */
+  export let tabStyle = "underline";
+  /** @type {string} CSS classes for the content area (flowbite API) */
+  export let contentClass = "";
+  /** @type {string|number|undefined} Currently active tab value (bindable) */
+  export let activeTabValue = undefined;
+  /** @type {string} Additional CSS classes */
+  let className = "";
+  export { className as class };
+
+  // Create a store for the active tab
+  const activeTab = writable(activeTabValue);
+  const tabItems = writable([]);
+
+  // Keep activeTabValue in sync with store
+  $: if (activeTabValue !== undefined) {
+    activeTab.set(activeTabValue);
+  }
+  $: activeTabValue = $activeTab;
+
+  // Provide context to TabItem children
+  setContext("tabs", {
+    activeTab,
+    tabItems,
+    tabStyle,
+    registerTab: (id, title, open) => {
+      tabItems.update(items => {
+        // Avoid duplicates
+        if (items.find(item => item.id === id)) return items;
+        return [...items, { id, title }];
+      });
+      // If this tab has open prop and no active tab set, make it active
+      if (open && $activeTab === undefined) {
+        activeTab.set(id);
+      }
+      return id;
+    },
+    setActiveTab: (id) => {
+      activeTab.set(id);
+    }
+  });
+
+  // Ensure first tab is selected if none selected
+  $: if ($tabItems.length > 0 && $activeTab === undefined) {
+    activeTab.set($tabItems[0].id);
+  }
+</script>
+
+<div class="tabs tabs--{tabStyle} {className}">
+  <div class="tabs__list" role="tablist">
+    {#each $tabItems as tab (tab.id)}
+      <button
+        type="button"
+        role="tab"
+        class="tabs__tab"
+        class:tabs__tab--active={$activeTab === tab.id}
+        aria-selected={$activeTab === tab.id}
+        tabindex={$activeTab === tab.id ? 0 : -1}
+        on:click={() => activeTab.set(tab.id)}
+      >
+        {tab.title}
+      </button>
+    {/each}
+  </div>
+  <div class="tabs__content {contentClass}">
+    <slot />
+  </div>
+</div>
+
+<style>
+  .tabs {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .tabs__list {
+    display: flex;
+    gap: 0;
+    border-bottom: 1px solid hsl(var(--Stroke-Primary, 220 13% 85%));
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+    scrollbar-width: none;
+  }
+
+  .tabs__list::-webkit-scrollbar {
+    display: none;
+  }
+
+  .tabs--pill .tabs__list {
+    border-bottom: none;
+    gap: 0.5rem;
+    background-color: hsl(var(--BG-Secondary, 220 14% 96%));
+    padding: 0.25rem;
+    border-radius: 0.5rem;
+  }
+
+  .tabs--full .tabs__list {
+    border-bottom: none;
+  }
+
+  .tabs__tab {
+    padding: 0.75rem 1rem;
+    font-size: 0.875rem;
+    font-weight: 500;
+    color: hsl(var(--Text-Secondary, 220 9% 46%));
+    background: transparent;
+    border: none;
+    cursor: pointer;
+    position: relative;
+    transition: all 0.15s ease;
+    white-space: nowrap;
+    flex-shrink: 0;
+  }
+
+  .tabs__tab:hover {
+    color: hsl(var(--Text-Primary, 220 13% 13%));
+  }
+
+  .tabs__tab--active {
+    color: hsl(var(--Brand-Primary, 221 83% 53%));
+  }
+
+  /* Underline style (default) */
+  .tabs--underline .tabs__tab--active::after {
+    content: "";
+    position: absolute;
+    bottom: -1px;
+    left: 0;
+    right: 0;
+    height: 2px;
+    background-color: hsl(var(--Brand-Primary, 221 83% 53%));
+  }
+
+  /* Pill style */
+  .tabs--pill .tabs__tab {
+    border-radius: 0.375rem;
+    padding: 0.5rem 0.75rem;
+  }
+
+  .tabs--pill .tabs__tab--active {
+    background-color: hsl(var(--BG-Primary, 0 0% 100%));
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+  }
+
+  .tabs--pill .tabs__tab--active::after {
+    display: none;
+  }
+
+  .tabs__content {
+    padding-top: 1rem;
+  }
+
+  /* Dark mode */
+  :global(.dark) .tabs__list {
+    border-bottom-color: hsl(var(--Stroke-Primary, 220 13% 30%));
+  }
+
+  :global(.dark) .tabs__tab {
+    color: hsl(var(--Text-Secondary, 220 9% 70%));
+  }
+
+  :global(.dark) .tabs__tab:hover {
+    color: hsl(var(--Text-Primary, 0 0% 95%));
+  }
+
+  :global(.dark) .tabs__tab--active {
+    color: hsl(var(--Brand-Primary, 221 83% 60%));
+  }
+
+  :global(.dark) .tabs--pill .tabs__list {
+    background-color: hsl(var(--BG-Secondary, 220 13% 20%));
+  }
+
+  :global(.dark) .tabs--pill .tabs__tab--active {
+    background-color: hsl(var(--BG-Primary, 220 13% 15%));
+  }
+</style>

package/dist/components/Tabs/Tabs.svelte.d.ts

@@ -0,0 +1,46 @@
+export default Tabs;
+type Tabs = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
+    class?: string | undefined;
+    tabStyle?: "full" | "underline" | "pill" | undefined;
+    contentClass?: string | undefined;
+    activeTabValue?: string | number | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}> & {
+    $$bindings?: string | undefined;
+};
+declare const Tabs: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    class?: string | undefined;
+    tabStyle?: "full" | "underline" | "pill" | undefined;
+    contentClass?: string | undefined;
+    activeTabValue?: string | number | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+//# sourceMappingURL=Tabs.svelte.d.ts.map

package/dist/components/Tabs/Tabs.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Tabs/Tabs.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;AA6FA;;;;qBAhBW,MAAM,GAAC,MAAM,GAAC,SAAS;;;;;;;eAgB0I;sCATtI,KAAK,EAAE,KAAK;;;;;6CALL,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/pages/performers/ShowItemCard.svelte.d.ts

@@ -3,8 +3,8 @@ type ShowItemCard = SvelteComponent<{
     title: any;
     details: any;
     image: any;
-    status: any;
     id: any;
+    status: any;
     location: any;
     role: any;
     startDateTime: any;
@@ -24,8 +24,8 @@ declare const ShowItemCard: $$__sveltets_2_IsomorphicComponent<{
     title: any;
     details: any;
     image: any;
-    status: any;
     id: any;
+    status: any;
     location: any;
     role: any;
     startDateTime: any;