odj-svelte-ui 0.1.0

package/dist/typography/span/Span.svelte

@@ -0,0 +1,43 @@
+<script lang="ts">
+  import { type SpanProps as Props, span } from "./index";
+
+  let { children, class: className, italic, underline, linethrough, uppercase, gradient, highlight, decoration, decorationColor, decorationThickness, ...restProps }: Props = $props();
+
+  let classSpan = $derived(
+    span({
+      italic,
+      underline,
+      linethrough,
+      uppercase,
+      gradient,
+      highlight,
+      decoration,
+      decorationColor,
+      decorationThickness,
+      className
+    })
+  );
+</script>
+
+<span {...restProps} class={classSpan}>
+  {#if children}
+    {@render children()}
+  {/if}
+</span>
+
+<!--
+@component
+[Go to docs](https://svelte-5-ui-lib.codewithshin.com/)
+## Props
+@props: children: any;
+@props:class: string;
+@props:italic: any;
+@props:underline: any;
+@props:linethrough: any;
+@props:uppercase: any;
+@props:gradient: any;
+@props:highlight: any;
+@props:decoration: any;
+@props:decorationColor: any;
+@props:decorationThickness: any;
+-->

package/dist/typography/span/Span.svelte.d.ts

@@ -0,0 +1,19 @@
+import { type SpanProps as Props } from "./index";
+/**
+ * [Go to docs](https://svelte-5-ui-lib.codewithshin.com/)
+ * ## Props
+ * @props: children: any;
+ * @props:class: string;
+ * @props:italic: any;
+ * @props:underline: any;
+ * @props:linethrough: any;
+ * @props:uppercase: any;
+ * @props:gradient: any;
+ * @props:highlight: any;
+ * @props:decoration: any;
+ * @props:decorationColor: any;
+ * @props:decorationThickness: any;
+ */
+declare const Span: import("svelte").Component<Props, {}, "">;
+type Span = ReturnType<typeof Span>;
+export default Span;

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

@@ -0,0 +1,4 @@
+import type { SpanProps } from "./type";
+import Span from "./Span.svelte";
+import { span } from "./theme";
+export { Span, span, type SpanProps };

package/dist/typography/span/index.js

@@ -0,0 +1,3 @@
+import Span from "./Span.svelte";
+import { span } from "./theme";
+export { Span, span };

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

@@ -0,0 +1,568 @@
+export declare const span: import("tailwind-variants").TVReturnType<{
+    italic: {
+        true: string;
+    };
+    underline: {
+        true: string;
+    };
+    linethrough: {
+        true: string;
+    };
+    uppercase: {
+        true: string;
+    };
+    gradient: {
+        skyToEmerald: string;
+        purpleToBlue: string;
+        pinkToOrange: string;
+        tealToLime: string;
+        redToYellow: string;
+        indigoToCyan: string;
+        fuchsiaToRose: string;
+        amberToEmerald: string;
+        violetToRed: string;
+        blueToGreen: string;
+        orangeToPurple: string;
+        yellowToRed: string;
+        none: string;
+    };
+    highlight: {
+        blue: string;
+        green: string;
+        red: string;
+        yellow: string;
+        purple: string;
+        pink: string;
+        indigo: string;
+        teal: string;
+        orange: string;
+        cyan: string;
+        fuchsia: string;
+        amber: string;
+        lime: string;
+        none: string;
+    };
+    decoration: {
+        solid: string;
+        double: string;
+        dotted: string;
+        dashed: string;
+        wavy: string;
+        none: string;
+    };
+    decorationColor: {
+        primary: string;
+        secondary: string;
+        gray: string;
+        orange: string;
+        red: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+        none: string;
+    };
+    decorationThickness: {
+        "1": string;
+        "2": string;
+        "4": string;
+        "8": string;
+        "0": string;
+    };
+}, undefined, undefined, import("tailwind-variants/dist/config").TVConfig<{
+    italic: {
+        true: string;
+    };
+    underline: {
+        true: string;
+    };
+    linethrough: {
+        true: string;
+    };
+    uppercase: {
+        true: string;
+    };
+    gradient: {
+        skyToEmerald: string;
+        purpleToBlue: string;
+        pinkToOrange: string;
+        tealToLime: string;
+        redToYellow: string;
+        indigoToCyan: string;
+        fuchsiaToRose: string;
+        amberToEmerald: string;
+        violetToRed: string;
+        blueToGreen: string;
+        orangeToPurple: string;
+        yellowToRed: string;
+        none: string;
+    };
+    highlight: {
+        blue: string;
+        green: string;
+        red: string;
+        yellow: string;
+        purple: string;
+        pink: string;
+        indigo: string;
+        teal: string;
+        orange: string;
+        cyan: string;
+        fuchsia: string;
+        amber: string;
+        lime: string;
+        none: string;
+    };
+    decoration: {
+        solid: string;
+        double: string;
+        dotted: string;
+        dashed: string;
+        wavy: string;
+        none: string;
+    };
+    decorationColor: {
+        primary: string;
+        secondary: string;
+        gray: string;
+        orange: string;
+        red: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+        none: string;
+    };
+    decorationThickness: {
+        "1": string;
+        "2": string;
+        "4": string;
+        "8": string;
+        "0": string;
+    };
+}, {
+    italic: {
+        true: string;
+    };
+    underline: {
+        true: string;
+    };
+    linethrough: {
+        true: string;
+    };
+    uppercase: {
+        true: string;
+    };
+    gradient: {
+        skyToEmerald: string;
+        purpleToBlue: string;
+        pinkToOrange: string;
+        tealToLime: string;
+        redToYellow: string;
+        indigoToCyan: string;
+        fuchsiaToRose: string;
+        amberToEmerald: string;
+        violetToRed: string;
+        blueToGreen: string;
+        orangeToPurple: string;
+        yellowToRed: string;
+        none: string;
+    };
+    highlight: {
+        blue: string;
+        green: string;
+        red: string;
+        yellow: string;
+        purple: string;
+        pink: string;
+        indigo: string;
+        teal: string;
+        orange: string;
+        cyan: string;
+        fuchsia: string;
+        amber: string;
+        lime: string;
+        none: string;
+    };
+    decoration: {
+        solid: string;
+        double: string;
+        dotted: string;
+        dashed: string;
+        wavy: string;
+        none: string;
+    };
+    decorationColor: {
+        primary: string;
+        secondary: string;
+        gray: string;
+        orange: string;
+        red: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+        none: string;
+    };
+    decorationThickness: {
+        "1": string;
+        "2": string;
+        "4": string;
+        "8": string;
+        "0": string;
+    };
+}>, {
+    italic: {
+        true: string;
+    };
+    underline: {
+        true: string;
+    };
+    linethrough: {
+        true: string;
+    };
+    uppercase: {
+        true: string;
+    };
+    gradient: {
+        skyToEmerald: string;
+        purpleToBlue: string;
+        pinkToOrange: string;
+        tealToLime: string;
+        redToYellow: string;
+        indigoToCyan: string;
+        fuchsiaToRose: string;
+        amberToEmerald: string;
+        violetToRed: string;
+        blueToGreen: string;
+        orangeToPurple: string;
+        yellowToRed: string;
+        none: string;
+    };
+    highlight: {
+        blue: string;
+        green: string;
+        red: string;
+        yellow: string;
+        purple: string;
+        pink: string;
+        indigo: string;
+        teal: string;
+        orange: string;
+        cyan: string;
+        fuchsia: string;
+        amber: string;
+        lime: string;
+        none: string;
+    };
+    decoration: {
+        solid: string;
+        double: string;
+        dotted: string;
+        dashed: string;
+        wavy: string;
+        none: string;
+    };
+    decorationColor: {
+        primary: string;
+        secondary: string;
+        gray: string;
+        orange: string;
+        red: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+        none: string;
+    };
+    decorationThickness: {
+        "1": string;
+        "2": string;
+        "4": string;
+        "8": string;
+        "0": string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    italic: {
+        true: string;
+    };
+    underline: {
+        true: string;
+    };
+    linethrough: {
+        true: string;
+    };
+    uppercase: {
+        true: string;
+    };
+    gradient: {
+        skyToEmerald: string;
+        purpleToBlue: string;
+        pinkToOrange: string;
+        tealToLime: string;
+        redToYellow: string;
+        indigoToCyan: string;
+        fuchsiaToRose: string;
+        amberToEmerald: string;
+        violetToRed: string;
+        blueToGreen: string;
+        orangeToPurple: string;
+        yellowToRed: string;
+        none: string;
+    };
+    highlight: {
+        blue: string;
+        green: string;
+        red: string;
+        yellow: string;
+        purple: string;
+        pink: string;
+        indigo: string;
+        teal: string;
+        orange: string;
+        cyan: string;
+        fuchsia: string;
+        amber: string;
+        lime: string;
+        none: string;
+    };
+    decoration: {
+        solid: string;
+        double: string;
+        dotted: string;
+        dashed: string;
+        wavy: string;
+        none: string;
+    };
+    decorationColor: {
+        primary: string;
+        secondary: string;
+        gray: string;
+        orange: string;
+        red: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+        none: string;
+    };
+    decorationThickness: {
+        "1": string;
+        "2": string;
+        "4": string;
+        "8": string;
+        "0": string;
+    };
+}, undefined, undefined, import("tailwind-variants/dist/config").TVConfig<{
+    italic: {
+        true: string;
+    };
+    underline: {
+        true: string;
+    };
+    linethrough: {
+        true: string;
+    };
+    uppercase: {
+        true: string;
+    };
+    gradient: {
+        skyToEmerald: string;
+        purpleToBlue: string;
+        pinkToOrange: string;
+        tealToLime: string;
+        redToYellow: string;
+        indigoToCyan: string;
+        fuchsiaToRose: string;
+        amberToEmerald: string;
+        violetToRed: string;
+        blueToGreen: string;
+        orangeToPurple: string;
+        yellowToRed: string;
+        none: string;
+    };
+    highlight: {
+        blue: string;
+        green: string;
+        red: string;
+        yellow: string;
+        purple: string;
+        pink: string;
+        indigo: string;
+        teal: string;
+        orange: string;
+        cyan: string;
+        fuchsia: string;
+        amber: string;
+        lime: string;
+        none: string;
+    };
+    decoration: {
+        solid: string;
+        double: string;
+        dotted: string;
+        dashed: string;
+        wavy: string;
+        none: string;
+    };
+    decorationColor: {
+        primary: string;
+        secondary: string;
+        gray: string;
+        orange: string;
+        red: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+        none: string;
+    };
+    decorationThickness: {
+        "1": string;
+        "2": string;
+        "4": string;
+        "8": string;
+        "0": string;
+    };
+}, {
+    italic: {
+        true: string;
+    };
+    underline: {
+        true: string;
+    };
+    linethrough: {
+        true: string;
+    };
+    uppercase: {
+        true: string;
+    };
+    gradient: {
+        skyToEmerald: string;
+        purpleToBlue: string;
+        pinkToOrange: string;
+        tealToLime: string;
+        redToYellow: string;
+        indigoToCyan: string;
+        fuchsiaToRose: string;
+        amberToEmerald: string;
+        violetToRed: string;
+        blueToGreen: string;
+        orangeToPurple: string;
+        yellowToRed: string;
+        none: string;
+    };
+    highlight: {
+        blue: string;
+        green: string;
+        red: string;
+        yellow: string;
+        purple: string;
+        pink: string;
+        indigo: string;
+        teal: string;
+        orange: string;
+        cyan: string;
+        fuchsia: string;
+        amber: string;
+        lime: string;
+        none: string;
+    };
+    decoration: {
+        solid: string;
+        double: string;
+        dotted: string;
+        dashed: string;
+        wavy: string;
+        none: string;
+    };
+    decorationColor: {
+        primary: string;
+        secondary: string;
+        gray: string;
+        orange: string;
+        red: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+        none: string;
+    };
+    decorationThickness: {
+        "1": string;
+        "2": string;
+        "4": string;
+        "8": string;
+        "0": string;
+    };
+}>, unknown, unknown, undefined>>;