flowbite-svelte 1.9.0 → 1.10.1

package/dist/timeline/theme.js

@@ -2,7 +2,7 @@ import { tv } from "tailwind-variants";
 export const activity = tv({
     base: "relative border-s border-gray-200 dark:border-gray-700"
 });
-export const activityitem = tv({
+export const activityItem = tv({
     slots: {
         li: "mb-10 ms-6",
         span: "flex absolute -start-3 justify-center items-center w-6 h-6 bg-blue-200 rounded-full ring-8 ring-white dark:ring-gray-900 dark:bg-blue-900",
@@ -21,7 +21,7 @@ export const group = tv({
         ol: "mt-3 divide-y divider-gray-200 dark:divide-gray-700"
     }
 });
-export const groupitem = tv({
+export const groupItem = tv({
     slots: {
         a: "block items-center p-3 sm:flex hover:bg-gray-100 dark:hover:bg-gray-700",
         img: "me-3 mb-3 w-12 h-12 rounded-full sm:mb-0",
@@ -45,7 +45,7 @@ export const timeline = tv({
     }
 });
 // export type TimelineItemVariants = VariantProps<typeof timelineitem>;
-export const timelineitem = tv({
+export const timelineItem = tv({
     slots: {
         li: "",
         div: "",

package/dist/toast/Toast.svelte

@@ -1,12 +1,16 @@
 <script lang="ts">
   import { CloseButton } from "..";
   import type { ParamsType } from "../types";
-  import { toast } from ".";
+  import { toast, type ToastTheme } from ".";
   import type { ToastProps } from "../types";
   import { fly } from "svelte/transition";
+  import { cn } from "..";
+  import { getTheme } from "../theme/themeUtils";
 
   let { children, icon, toastStatus = $bindable(true), dismissable = true, color = "primary", position, iconClass, contentClass, align = true, params, transition = fly, class: className, onclose, ...restProps }: ToastProps = $props();
 
+  const theme = getTheme("toast");
+
   const { base, icon: iconVariants, content, close } = $derived(toast({ color, position, align }));
 
   function handleClose() {
@@ -16,19 +20,19 @@
 </script>
 
 {#if toastStatus}
-  <div role="alert" transition:transition={params as ParamsType} {...restProps} class={base({ class: className })}>
+  <div role="alert" transition:transition={params as ParamsType} {...restProps} class={cn(base({ class: className }), (theme as ToastTheme)?.base)}>
     {#if icon}
-      <div class={iconVariants({ class: iconClass })}>
+      <div class={cn(iconVariants({ class: iconClass }), (theme as ToastTheme)?.icon)}>
         {@render icon()}
       </div>
     {/if}
 
-    <div class={content({ class: contentClass })}>
+    <div class={cn(content({ class: contentClass }), (theme as ToastTheme)?.content)}>
       {@render children()}
     </div>
 
     {#if dismissable}
-      <CloseButton class={close()} ariaLabel="Remove toast" {color} onclick={handleClose} />
+      <CloseButton class={cn(close(), (theme as ToastTheme)?.close)} ariaLabel="Remove toast" {color} onclick={handleClose} />
     {/if}
   </div>
 {/if}
@@ -37,7 +41,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ToastProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1830)
+[ToastProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1821)
 ## Props
 @prop children
 @prop icon

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

@@ -2,7 +2,7 @@ import type { ToastProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ToastProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1830)
+ * [ToastProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1821)
  * ## Props
  * @prop children
  * @prop icon

package/dist/toast/index.d.ts

@@ -1,3 +1,2 @@
-import Toast from "./Toast.svelte";
-import { toast } from "./theme";
-export { Toast, toast };
+export { default as Toast } from "./Toast.svelte";
+export { toast, type ToastTheme } from "./theme";

package/dist/toast/index.js

@@ -1,3 +1,2 @@
-import Toast from "./Toast.svelte";
-import { toast } from "./theme";
-export { Toast, toast };
+export { default as Toast } from "./Toast.svelte";
+export { toast } from "./theme";

package/dist/toast/theme.d.ts

@@ -319,3 +319,5 @@ export declare const toast: import("tailwind-variants").TVReturnType<{
     content: string;
     close: string;
 }, undefined, unknown, unknown, undefined>>;
+export type ToastSlots = keyof typeof toast.slots;
+export type ToastTheme = Partial<Record<ToastSlots, string>>;

package/dist/toolbar/Toolbar.svelte

@@ -1,12 +1,16 @@
 <script lang="ts">
   import { setContext } from "svelte";
   import { writable } from "svelte/store";
-  import { toolbar } from "./";
+  import { toolbar, type ToolbarTheme } from "./";
   import type { ToolbarProps } from "../types";
   import clsx from "clsx";
+  import { cn } from "..";
+  import { getTheme } from "../theme/themeUtils";
 
   let { children, end, color, embedded, class: className, ...restProps }: ToolbarProps = $props();
 
+  const theme = getTheme("toolbar");
+
   const separators = writable(false);
   setContext("toolbar", separators);
 
@@ -25,8 +29,8 @@
   // let divClass: string = twMerge('flex justify-between items-center', !embedded && 'py-2 px-3', className);
 </script>
 
-<div {...restProps} class={base({ class: clsx(className) })}>
-  <div class={content()}>
+<div {...restProps} class={cn(base({ class: clsx(className) }), (theme as ToolbarTheme)?.base)}>
+  <div class={cn(content(), (theme as ToolbarTheme)?.content)}>
     {@render children?.()}
   </div>
   {#if end}
@@ -38,7 +42,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ToolbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1139)
+[ToolbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1132)
 ## Props
 @prop children
 @prop end

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

@@ -2,7 +2,7 @@ import type { ToolbarProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ToolbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1139)
+ * [ToolbarProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1132)
  * ## Props
  * @prop children
  * @prop end

package/dist/toolbar/ToolbarButton.svelte

@@ -3,10 +3,14 @@
   import { toolbarButton } from ".";
   import type { ToolbarButtonProps } from "../types";
   import clsx from "clsx";
+  import { cn } from "..";
+  import { getTheme } from "../theme/themeUtils";
 
   const background = getContext("background");
   let { children, color, name, "aria-label": ariaLabel, size, class: className, ...restProps }: ToolbarButtonProps = $props();
 
+  const theme = getTheme("toolbarButton");
+
   const buttonClass = $derived(
     toolbarButton({
       color,
@@ -18,7 +22,7 @@
 </script>
 
 {#if restProps.href === undefined}
-  <button type="button" {...restProps} class={buttonClass} aria-label={ariaLabel ?? name}>
+  <button type="button" {...restProps} class={cn(buttonClass, theme)} aria-label={ariaLabel ?? name}>
     {#if name}<span class="sr-only">{name}</span>{/if}
     {@render children?.()}
   </button>
@@ -33,7 +37,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ToolbarButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1145)
+[ToolbarButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1138)
 ## Props
 @prop children
 @prop color

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

@@ -2,7 +2,7 @@ import type { ToolbarButtonProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ToolbarButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1145)
+ * [ToolbarButtonProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1138)
  * ## Props
  * @prop children
  * @prop color

package/dist/toolbar/ToolbarGroup.svelte

@@ -4,16 +4,20 @@
   import { toolbarGroup } from ".";
   import type { ToolbarGroupProps } from "../types";
   import clsx from "clsx";
+  import { cn } from "..";
+  import { getTheme } from "../theme/themeUtils";
 
   let { children, spacing, padding, position = "middle", class: className, ...restProps }: ToolbarGroupProps = $props();
 
+  const theme = getTheme("toolbarGroup");
+
   const groupClass = $derived(toolbarGroup({ spacing, padding, position, class: clsx(className) }));
 
   const options: Writable<boolean> = getContext("toolbar");
   if (options) $options = true;
 </script>
 
-<div {...restProps} class={groupClass}>
+<div {...restProps} class={cn(groupClass, theme)}>
   {@render children?.()}
 </div>
 
@@ -21,7 +25,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[ToolbarGroupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1143)
+[ToolbarGroupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1136)
 ## Props
 @prop children
 @prop spacing

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

@@ -2,7 +2,7 @@ import type { ToolbarGroupProps } from "../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [ToolbarGroupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1143)
+ * [ToolbarGroupProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1136)
  * ## Props
  * @prop children
  * @prop spacing

package/dist/toolbar/index.d.ts

@@ -1,5 +1,4 @@
-import Toolbar from "./Toolbar.svelte";
-import ToolbarButton from "./ToolbarButton.svelte";
-import ToolbarGroup from "./ToolbarGroup.svelte";
-import { toolbar, toolbarGroup, toolbarButton } from "./theme";
-export { Toolbar, toolbar, ToolbarButton, toolbarButton, ToolbarGroup, toolbarGroup };
+export { default as Toolbar } from "./Toolbar.svelte";
+export { default as ToolbarButton } from "./ToolbarButton.svelte";
+export { default as ToolbarGroup } from "./ToolbarGroup.svelte";
+export { toolbar, toolbarGroup, toolbarButton, type ToolbarTheme, type ToolbarGroupTheme, type ToolbarButtonTheme } from "./theme";

package/dist/toolbar/index.js

@@ -1,5 +1,4 @@
-import Toolbar from "./Toolbar.svelte";
-import ToolbarButton from "./ToolbarButton.svelte";
-import ToolbarGroup from "./ToolbarGroup.svelte";
-import { toolbar, toolbarGroup, toolbarButton } from "./theme";
-export { Toolbar, toolbar, ToolbarButton, toolbarButton, ToolbarGroup, toolbarGroup };
+export { default as Toolbar } from "./Toolbar.svelte";
+export { default as ToolbarButton } from "./ToolbarButton.svelte";
+export { default as ToolbarGroup } from "./ToolbarGroup.svelte";
+export { toolbar, toolbarGroup, toolbarButton } from "./theme";

package/dist/toolbar/theme.d.ts

@@ -196,6 +196,8 @@ export declare const toolbar: import("tailwind-variants").TVReturnType<{
     base: string;
     content: string;
 }, undefined, unknown, unknown, undefined>>;
+export type ToolbarSlots = keyof typeof toolbar.slots;
+export type ToolbarTheme = Partial<Record<ToolbarSlots, string>>;
 export type ToolbarGroupVariants = VariantProps<typeof toolbarGroup>;
 export declare const toolbarGroup: import("tailwind-variants").TVReturnType<{
     spacing: {
@@ -243,6 +245,7 @@ export declare const toolbarGroup: import("tailwind-variants").TVReturnType<{
         last: string;
     };
 }, undefined, "flex items-center", unknown, unknown, undefined>>;
+export type ToolbarGroupTheme = string;
 export type ToolbarButtonVariants = VariantProps<typeof toolbarButton>;
 export declare const toolbarButton: import("tailwind-variants").TVReturnType<{
     color: {
@@ -317,3 +320,4 @@ export declare const toolbarButton: import("tailwind-variants").TVReturnType<{
         false: string;
     };
 }, undefined, "focus:outline-hidden whitespace-normal", unknown, unknown, undefined>>;
+export type ToolbarButtonTheme = string;

package/dist/tooltip/Tooltip.svelte

@@ -1,11 +1,15 @@
 <script lang="ts">
   import clsx from "clsx";
   import Popper from "../utils/Popper.svelte";
-  import { tooltip } from "./theme";
+  import { tooltip, type TooltipTheme } from "./theme";
   import type { TooltipProps, TriggeredToggleEvent } from "..";
+  import { cn } from "..";
+  import { getTheme } from "../theme/themeUtils";
 
   let { type = "dark", color = undefined, trigger = "hover", arrow = true, children, placement = "top", onbeforetoggle: _onbeforetoggle, class: className, isOpen = $bindable(false), ...restProps }: TooltipProps = $props();
 
+  const theme = getTheme("tooltip");
+
   let { base } = $derived(tooltip({ color, type }));
 
   function onbeforetoggle(ev: TriggeredToggleEvent) {
@@ -18,7 +22,7 @@
   }
 </script>
 
-<Popper {...restProps} bind:isOpen {placement} {trigger} {arrow} class={base({ class: clsx(className) })} {onbeforetoggle}>
+<Popper {...restProps} bind:isOpen {placement} {trigger} {arrow} class={cn(base({ class: clsx(className) }), (theme as TooltipTheme)?.base)} {onbeforetoggle}>
   <div class="pointer-events-none">{@render children()}</div>
 </Popper>
 
@@ -26,7 +30,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[TooltipProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1847)
+[TooltipProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1838)
 ## Props
 @prop type = "dark"
 @prop color = undefined

package/dist/tooltip/Tooltip.svelte.d.ts

@@ -2,7 +2,7 @@ import type { TooltipProps } from "..";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [TooltipProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1847)
+ * [TooltipProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1838)
  * ## Props
  * @prop type = "dark"
  * @prop color = undefined

package/dist/tooltip/index.d.ts

@@ -1,3 +1,2 @@
-import Tooltip from "./Tooltip.svelte";
-import { tooltip } from "./theme";
-export { Tooltip, tooltip };
+export { default as Tooltip } from "./Tooltip.svelte";
+export { tooltip, type TooltipTheme } from "./theme";

package/dist/tooltip/index.js

@@ -1,3 +1,2 @@
-import Tooltip from "./Tooltip.svelte";
-import { tooltip } from "./theme";
-export { Tooltip, tooltip };
+export { default as Tooltip } from "./Tooltip.svelte";
+export { tooltip } from "./theme";

package/dist/tooltip/theme.d.ts

@@ -232,3 +232,5 @@ export declare const tooltip: import("tailwind-variants").TVReturnType<{
     base: string;
     arrowBase: string;
 }, undefined, unknown, unknown, undefined>>;
+export type TooltipSlots = keyof typeof tooltip.slots;
+export type TooltipTheme = Partial<Record<TooltipSlots, string>>;

package/dist/types.d.ts

@@ -5,7 +5,7 @@ import type { Component, Snippet } from "svelte";
 import type { HTMLAnchorAttributes, HTMLAttributes, HTMLBlockquoteAttributes, HTMLButtonAttributes, HTMLDialogAttributes, HTMLImgAttributes, HTMLInputAttributes, HTMLLabelAttributes, HTMLLiAttributes, HTMLOlAttributes, HTMLSelectAttributes, HTMLSourceAttributes, HTMLTableAttributes, HTMLTdAttributes, HTMLTextareaAttributes, HTMLThAttributes, HTMLTrackAttributes, HTMLVideoAttributes, SVGAttributes, FullAutoFill } from "svelte/elements";
 import { type Writable } from "svelte/store";
 import type { BlurParams, EasingFunction, FadeParams, FlyParams, ScaleParams, SlideParams, TransitionConfig } from "svelte/transition";
-import { tv, type VariantProps } from "tailwind-variants";
+import { type VariantProps } from "tailwind-variants";
 import type { Day } from "date-fns";
 import type { DatepickerVariants } from "./datepicker/theme";
 import type { IndicatorVariants } from "./indicator/theme";
@@ -15,12 +15,12 @@ import type { PopoverVariants } from "./popover/theme";
 import type { SidebarVariants } from "./sidebar/theme";
 import type { CardPlaceholderVariants, ImagePlaceholderVariants, ListPlaceholderVariants, SkeletonVariants, TextPlaceholderVariants, VideoPlaceholderVariants } from "./skeleton/theme";
 import type { SpinnerVaraiants } from "./spinner/theme";
+import type { StepIndicatorVariants } from "./stepindicator/theme";
 import type { StepperVariants, ProgressStepperVariants, DetailedStepperVariants, VerticalStepperVariants, BreadcrumbStepperVariants, TimelineStepperVariants } from "./stepper/theme";
 import type { TableVariants } from "./table/theme";
 import type { TabsVaraints } from "./tabs/theme";
 import type { PaginationItemVariants, PaginationVariants } from "./pagination/theme";
 import type { ProgressbarVariants, ProgressradialVariants } from "./progress/theme";
-import { baseThemes } from "./theme";
 import { timeline } from "./timeline/theme";
 import type { ToastVaraints } from "./toast/theme";
 import type { ToolbarButtonVariants, ToolbarGroupVariants, ToolbarVariants } from "./toolbar/theme";
@@ -48,6 +48,7 @@ import type { MultiSelectVariants, SelectVariants } from "./forms/select/theme";
 import type { ToggleVariants } from "./forms/toggle/theme";
 import type { PhoneInputVariants } from "./forms/phoneinput/theme";
 import type { ButtonToggleVariants } from "./forms/button-toggle/theme";
+import type { TableSearchColor } from "./table/theme";
 import type { AnchorVariants } from "./typography/anchor/theme";
 import type { BlockquoteVariants } from "./typography/blockquote/theme";
 import type { DescriptionListVariants } from "./typography/descriptionlist/theme";
@@ -57,15 +58,6 @@ import type { ListVariants } from "./typography/list/theme";
 import type { ParagraphVariants } from "./typography/paragraph/theme";
 import type { SpanVariants } from "./typography/span/theme";
 import type { ClipboardVariants } from "./clipboard/theme";
-export interface ThemeConfig {
-    slots?: Record<string, object | string>;
-    variants?: Record<string, object>;
-    compoundVariants?: Array<Record<string, object>>;
-    defaultVariants?: Record<string, object>;
-}
-export interface ThemeType {
-    [key: string]: ReturnType<typeof tv>;
-}
 export declare const xs = "xs";
 export declare const sm = "sm";
 export declare const md = "md";
@@ -1325,11 +1317,12 @@ export interface SpinnerProps extends SVGAttributes<SVGSVGElement> {
     currentColor?: string;
 }
 export interface StepIndicatorProps extends HTMLAttributes<HTMLElement> {
-    steps: string[];
-    currentStep: number;
-    size?: string;
-    glow?: boolean;
-    hideLabel?: boolean;
+    steps?: string[];
+    currentStep?: number;
+    size?: StepIndicatorVariants["size"];
+    color?: StepIndicatorVariants["color"] | "custom";
+    glow?: StepIndicatorVariants["glow"];
+    hideLabel?: StepIndicatorVariants["hideLabel"];
     completedCustom?: string;
     currentCustom?: string;
 }
@@ -1477,7 +1470,7 @@ export interface TableSearchProps extends HTMLTableAttributes {
     striped?: boolean;
     hoverable?: boolean;
     customColor?: string;
-    color?: string;
+    color?: TableSearchColor;
     innerDivClass?: ClassValue;
     inputClass?: ClassValue;
     searchClass?: ClassValue;
@@ -1510,10 +1503,8 @@ export interface TabCtxType {
     selected: Writable<HTMLElement>;
     panelId: string;
 }
-export type BaseThemes = typeof baseThemes;
-export interface ThemeProps {
-    children: Snippet;
-    theme?: BaseThemes;
+export interface ThemeConfig {
+    [key: string]: string | ThemeConfig;
 }
 export type TimelineVariants = VariantProps<typeof timeline>;
 export interface ActivityType {
@@ -1643,9 +1634,17 @@ export interface HrProps extends HTMLAttributes<HTMLElement> {
     textSpanClass?: string;
     innerDivClass?: string;
 }
-export type EnhancedImgAttributes = Omit<HTMLImgAttributes, "src"> & {
-    src: string;
-};
+export interface Picture {
+    /**
+     * Key is format. Value is srcset.
+     */
+    sources: Record<string, string>;
+    img: {
+        src: string;
+        w: number;
+        h: number;
+    };
+}
 export interface ImgProps extends HTMLImgAttributes {
     size?: ImgVariants["size"];
     effect?: ImgVariants["effect"];
@@ -1654,7 +1653,8 @@ export interface ImgProps extends HTMLImgAttributes {
     captionClass?: string;
     href?: HTMLAnchorElement["href"];
 }
-export interface EnhandedImgProps extends EnhancedImgAttributes {
+export interface EnhandedImgProps extends Omit<HTMLImgAttributes, "src"> {
+    src: string | Picture;
     size?: ImgVariants["size"];
     multiple?: boolean;
     transform?: string;

package/dist/types.js

@@ -1,4 +1,4 @@
 import {} from "svelte/store";
 import { tv } from "tailwind-variants";
-import { baseThemes } from "./theme";
+// import { baseThemes } from "./theme";
 import { timeline } from "./timeline/theme";

package/dist/typography/anchor/A.svelte

@@ -2,9 +2,13 @@
   import clsx from "clsx";
   import { anchor } from "./index";
   import type { AnchorProps } from "../../types";
+  import { cn } from "../..";
+  import { getTheme } from "../../theme/themeUtils";
 
   let { children, color = "primary", asButton = false, onclick, href = "#", class: className, ...restProps }: AnchorProps = $props();
 
+  const theme = getTheme("a");
+
   let linkClass = $derived(anchor({ color, class: clsx(className) }));
 
   // Handle click events when in button mode
@@ -26,12 +30,12 @@
 
 {#if asButton}
   <!-- Render as a button that looks like a link -->
-  <button type="button" class={linkClass} onclick={handleClick} {...buttonProps}>
+  <button type="button" class={cn(linkClass, theme)} onclick={handleClick} {...buttonProps}>
     {@render children()}
   </button>
 {:else}
   <!-- Standard anchor behavior -->
-  <a {href} class={linkClass} onclick={handleClick} {...restProps}>
+  <a {href} class={cn(linkClass, theme)} onclick={handleClick} {...restProps}>
     {@render children()}
   </a>
 {/if}
@@ -40,7 +44,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[AnchorProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1855)
+[AnchorProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1846)
 ## Props
 @prop children
 @prop color = "primary"

package/dist/typography/anchor/A.svelte.d.ts

@@ -2,7 +2,7 @@ import type { AnchorProps } from "../../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [AnchorProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1855)
+ * [AnchorProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1846)
  * ## Props
  * @prop children
  * @prop color = "primary"

package/dist/typography/anchor/index.d.ts

@@ -1,3 +1,2 @@
-import A from "./A.svelte";
-import { anchor } from "./theme";
-export { A, anchor };
+export { default as A } from "./A.svelte";
+export { anchor, type AnchorTheme } from "./theme";

package/dist/typography/anchor/index.js

@@ -1,3 +1,2 @@
-import A from "./A.svelte";
-import { anchor } from "./theme";
-export { A, anchor };
+export { default as A } from "./A.svelte";
+export { anchor } from "./theme";

package/dist/typography/anchor/theme.d.ts

@@ -70,3 +70,4 @@ export declare const anchor: import("tailwind-variants").TVReturnType<{
         rose: string;
     };
 }, undefined, "inline-flex items-center hover:underline", unknown, unknown, undefined>>;
+export type AnchorTheme = string;

package/dist/typography/blockquote/Blockquote.svelte

@@ -2,9 +2,13 @@
   import clsx from "clsx";
   import { blockquote } from "./index";
   import type { BlockquoteProps } from "../../types";
+  import { cn } from "../..";
+  import { getTheme } from "../../theme/themeUtils";
 
   let { children, class: className, border, italic = true, bg, alignment = "left", size = "lg", ...restProps }: BlockquoteProps = $props();
 
+  const theme = getTheme("blockquote");
+
   let blockquoteClass = $derived(
     blockquote({
       border,
@@ -17,7 +21,7 @@
   );
 </script>
 
-<blockquote {...restProps} class={blockquoteClass}>
+<blockquote {...restProps} class={cn(blockquoteClass, theme)}>
   {@render children()}
 </blockquote>
 
@@ -25,7 +29,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[BlockquoteProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1884)
+[BlockquoteProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1875)
 ## Props
 @prop children
 @prop class: className

package/dist/typography/blockquote/Blockquote.svelte.d.ts

@@ -2,7 +2,7 @@ import type { BlockquoteProps } from "../../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [BlockquoteProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1884)
+ * [BlockquoteProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1875)
  * ## Props
  * @prop children
  * @prop class: className

package/dist/typography/blockquote/theme.d.ts

@@ -100,3 +100,4 @@ export declare const blockquote: import("tailwind-variants").TVReturnType<{
         "9xl": string;
     };
 }, undefined, "font-semibold text-gray-900 dark:text-white", unknown, unknown, undefined>>;
+export type BlockquoteTheme = string;

package/dist/typography/descriptionlist/DescriptionList.svelte

@@ -2,10 +2,14 @@
   import clsx from "clsx";
   import { descriptionList } from "./index";
   import type { DescriptionListProps } from "../../types";
+  import { cn } from "../..";
+  import { getTheme } from "../../theme/themeUtils";
 
   let { children, tag, class: className, ...restProps }: DescriptionListProps = $props();
 
-  let classDesc = $derived(
+  const theme = getTheme("descriptionList");
+
+  let descCls = $derived(
     descriptionList({
       tag,
       class: clsx(className)
@@ -13,7 +17,7 @@
   );
 </script>
 
-<svelte:element this={tag} {...restProps} class={classDesc}>
+<svelte:element this={tag} {...restProps} class={cn(descCls, theme)}>
   {@render children()}
 </svelte:element>
 
@@ -21,7 +25,7 @@
 @component
 [Go to docs](https://flowbite-svelte.com/)
 ## Type
-[DescriptionListProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1894)
+[DescriptionListProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1885)
 ## Props
 @prop children
 @prop tag

package/dist/typography/descriptionlist/DescriptionList.svelte.d.ts

@@ -2,7 +2,7 @@ import type { DescriptionListProps } from "../../types";
 /**
  * [Go to docs](https://flowbite-svelte.com/)
  * ## Type
- * [DescriptionListProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1894)
+ * [DescriptionListProps](https://github.com/themesberg/flowbite-svelte/blob/main/src/lib/types.ts#L1885)
  * ## Props
  * @prop children
  * @prop tag