@julseb-lib/react 1.0.74 → 1.1.0

package/dist/chunk-TN4HZFI3.js

@@ -0,0 +1,2071 @@
+// src/lib/utils/design-tokens.ts
+var libTextDisplayTags = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5"
+};
+var designTokens = {
+  libColors: {
+    "primary-50": "#eff6ff",
+    "primary-100": "#dbeafe",
+    "primary-200": "#bfdbfe",
+    "primary-300": "#93c5fd",
+    "primary-400": "#60a5fa",
+    "primary-500": "#3b82f6",
+    "primary-600": "#2563eb",
+    "primary-700": "#1d4ed8",
+    "primary-800": "#1e40af",
+    "primary-900": "#1e3a8a",
+    "primary-950": "#172554",
+    "secondary-50": "#ecfeff",
+    "secondary-100": "#cffafe",
+    "secondary-200": "#a5f3fc",
+    "secondary-300": "#67e8f9",
+    "secondary-400": "#22d3ee",
+    "secondary-500": "#06b6d4",
+    "secondary-600": "#0891b2",
+    "secondary-700": "#0e7490",
+    "secondary-800": "#155e75",
+    "secondary-900": "#164e63",
+    "secondary-950": "#083344",
+    "success-50": "#f0fdf4",
+    "success-100": "#dcfce7",
+    "success-200": "#bbf7d0",
+    "success-300": "#86efac",
+    "success-400": "#4ade80",
+    "success-500": "#22c55e",
+    "success-600": "#16a34a",
+    "success-700": "#15803d",
+    "success-800": "#166534",
+    "success-900": "#14532d",
+    "success-950": "#052e16",
+    "danger-50": "#fef2f2",
+    "danger-100": "#fee2e2",
+    "danger-200": "#fecaca",
+    "danger-300": "#fca5a5",
+    "danger-400": "#f87171",
+    "danger-500": "#ef4444",
+    "danger-600": "#dc2626",
+    "danger-700": "#b91c1c",
+    "danger-800": "#991b1b",
+    "danger-900": "#7f1d1d",
+    "danger-950": "#450a0a",
+    "warning-50": "#fffbeb",
+    "warning-100": "#fef3c7",
+    "warning-200": "#fde68a",
+    "warning-300": "#fcd34d",
+    "warning-400": "#fbbf24",
+    "warning-500": "#f59e42",
+    "warning-600": "#d97706",
+    "warning-700": "#b45309",
+    "warning-800": "#92400e",
+    "warning-900": "#78350f",
+    "warning-950": "#451a03",
+    "gray-50": "#f9fafb",
+    "gray-100": "#f3f4f6",
+    "gray-200": "#e5e7eb",
+    "gray-300": "#d1d5db",
+    "gray-400": "#9ca3af",
+    "gray-500": "#6b7280",
+    "gray-600": "#4b5563",
+    "gray-700": "#374151",
+    "gray-800": "#1f2937",
+    "gray-900": "#111827",
+    "gray-950": "#030712",
+    black: "#000000",
+    white: "#ffffff",
+    current: "currentColor",
+    transparent: "transparent",
+    background: "background",
+    font: "font"
+  },
+  libColorsShort: {
+    primary: "primary",
+    secondary: "secondary",
+    success: "success",
+    danger: "danger",
+    warning: "warning",
+    gray: "gray",
+    black: "black",
+    white: "white",
+    current: "current",
+    transparent: "transparent",
+    background: "background"
+  },
+  libColorsHover: {
+    primary: "primary",
+    secondary: "secondary",
+    success: "success",
+    danger: "danger",
+    warning: "warning",
+    gray: "gray",
+    white: "white"
+  },
+  libOverlays: {
+    "black-50": "black-50",
+    "black-80": "black-80",
+    "white-50": "white-50",
+    "white-80": "white-80",
+    "gradient-black": "gradient-black",
+    "gradient-white": "gradient-white"
+  },
+  libFontFamilies: {
+    body: "body",
+    code: "code"
+  },
+  libSpacers: {
+    /** 4px */
+    "2xs": "2xs",
+    /** 8px */
+    xs: "xs",
+    /** 12px */
+    sm: "sm",
+    /** 16px */
+    md: "md",
+    /** 24px */
+    lg: "lg",
+    /** 32px */
+    xl: "xl",
+    /** 48px */
+    "2xl": "2xl"
+  },
+  libBreakpoints: {
+    sm: "sm",
+    md: "md",
+    lg: "lg",
+    xl: "xl",
+    "2xl": "2xl"
+  },
+  libContainer: {
+    "3xs": "3xs",
+    "2xs": "2xs",
+    xs: "xs",
+    sm: "sm",
+    md: "md",
+    lg: "lg",
+    xl: "xl",
+    "2xl": "2xl",
+    "3xl": "3xl",
+    "4xl": "4xl",
+    "5xl": "5xl",
+    "6xl": "6xl",
+    "7xl": "7xl"
+  },
+  libFontSizes: {
+    xs: "xs",
+    sm: "sm",
+    base: "base",
+    lg: "lg",
+    xl: "xl",
+    "2xl": "2xl",
+    "3xl": "3xl",
+    "4xl": "4xl",
+    "5xl": "5xl",
+    "6xl": "6xl",
+    "7xl": "7xl",
+    "8xl": "8xl",
+    "9xl": "9xl"
+  },
+  libLineHeights: {
+    xs: "xs--line-height",
+    sm: "sm--line-height",
+    base: "base--line-height",
+    lg: "lg--line-height",
+    xl: "xl--line-height",
+    "2xl": "2xl--line-height",
+    "3xl": "3xl--line-height",
+    "4xl": "4xl--line-height",
+    "5xl": "5xl--line-height",
+    "6xl": "6xl--line-height",
+    "7xl": "7xl--line-height",
+    "8xl": "8xl--line-height",
+    "9xl": "9xl--line-height"
+  },
+  libFontWeights: {
+    thin: "thin",
+    extralight: "extralight",
+    light: "light",
+    normal: "normal",
+    medium: "medium",
+    semibold: "semibold",
+    bold: "bold",
+    extrabold: "extrabold",
+    black: "black"
+  },
+  libTracking: {
+    tighter: "tighter",
+    tight: "tight",
+    normal: "normal",
+    wide: "wide",
+    wider: "wider",
+    widest: "widest"
+  },
+  libLeading: {
+    tight: "tight",
+    snug: "snug",
+    normal: "normal",
+    relaxed: "relaxed",
+    loose: "loose",
+    none: "none"
+  },
+  libRadius: {
+    xs: "xs",
+    sm: "sm",
+    md: "md",
+    lg: "lg",
+    xl: "xl",
+    "2xl": "2xl",
+    "3xl": "3xl",
+    "4xl": "4xl",
+    full: "full"
+  },
+  libShadows: {
+    "2xs": "2xs",
+    xs: "xs",
+    sm: "sm",
+    md: "md",
+    lg: "lg",
+    xl: "xl",
+    "2xl": "2xl",
+    none: "none"
+  },
+  libInsetShadows: {
+    "2xs": "2xs",
+    xs: "xs",
+    sm: "sm"
+  },
+  libDropShadows: {
+    xs: "xs",
+    sm: "sm",
+    md: "md",
+    lg: "lg",
+    xl: "xl",
+    "2xl": "2xl"
+  },
+  libTextShadow: {
+    "2xs": "2xs",
+    xs: "xs",
+    sm: "sm",
+    md: "md",
+    lg: "lg"
+  },
+  libTransitionTimingFunctions: {
+    "--ease-in": "--ease-in",
+    "--ease-out": "--ease-out",
+    "--ease-in-out": "--ease-in-out"
+  },
+  libAnimate: {
+    spin: "spin",
+    ping: "ping",
+    pulse: "pulse",
+    bounce: "bounce"
+  },
+  libBlur: {
+    xs: "xs",
+    sm: "sm",
+    md: "md",
+    lg: "lg",
+    xl: "xl",
+    "2xl": "2xl",
+    "3xl": "3xl"
+  },
+  libPerspective: {
+    dramatic: "dramatic",
+    near: "near",
+    normal: "normal",
+    midrange: "midrange",
+    distant: "distant"
+  },
+  libAspectVideo: {},
+  libTextDisplayTags,
+  libTextTags: {
+    h6: "h6",
+    p: "p",
+    strong: "strong",
+    em: "em",
+    small: "small",
+    blockquote: "blockquote",
+    ul: "ul",
+    ol: "ol",
+    dl: "dl"
+  },
+  libTransitions: {
+    none: "none",
+    all: "all",
+    default: "default",
+    colors: "colors",
+    opacity: "opacity",
+    shadow: "shadow",
+    transform: "transform"
+  },
+  libThemes: {
+    light: "light",
+    dark: "dark"
+  },
+  libInputVariants: {
+    rounded: "rounded",
+    pill: "pill"
+  },
+  libInputBackgrounds: {
+    light: "light",
+    dark: "dark"
+  },
+  libMainSizes: {
+    default: "default",
+    large: "large",
+    form: "form"
+  },
+  libAsideSizes: {
+    default: "default",
+    small: "small"
+  },
+  libZIndex: {
+    "0": "0",
+    "10": "10",
+    "20": "20",
+    "30": "30",
+    "40": "40",
+    "50": "50",
+    "-0": "-0",
+    "-10": "-10",
+    "-20": "-20",
+    "-30": "-30",
+    "-40": "-40",
+    "-50": "-50"
+  },
+  libPosition: {
+    relative: "relative",
+    absolute: "absolute",
+    fixed: "fixed"
+  },
+  libMinHeights: {
+    px: "px",
+    full: "full",
+    screen: "screen",
+    dvh: "dvh",
+    dvw: "dvw",
+    lvh: "lvh",
+    lvw: "lvw",
+    svw: "svw",
+    svh: "svh",
+    auto: "auto",
+    min: "min",
+    max: "max",
+    fit: "fit",
+    lh: "lh"
+  },
+  libKeySizes: { large: "large", small: "small" },
+  libMaxWidths: {
+    "3xs": "3xs",
+    "2xs": "2xs",
+    xs: "xs",
+    sm: "sm",
+    md: "md",
+    lg: "lg",
+    xl: "xl",
+    "2xl": "2xl",
+    "3xl": "3xl",
+    "4xl": "4xl",
+    "5xl": "5xl",
+    "6xl": "6xl",
+    "7xl": "7xl",
+    none: "none",
+    px: "px",
+    full: "full",
+    dvw: "dvw",
+    dvh: "dvh",
+    lvw: "lvw",
+    lvh: "lvh",
+    svw: "svw",
+    svh: "svh",
+    screen: "screen",
+    min: "min",
+    max: "max",
+    fit: "fit"
+  },
+  libSkeletonAnimations: { pulse: "pulse", shine: "shine", none: "none" },
+  libTooltipPositions: {
+    top: "top",
+    bottom: "bottom",
+    left: "left",
+    right: "right"
+  },
+  libTooltipTriggers: { hover: "hover", click: "click" },
+  libLoaderVariants: { 1: 1, 2: 2, 3: 3 },
+  libButtonVariants: {
+    plain: "plain",
+    ghost: "ghost",
+    transparent: "transparent"
+  },
+  libButtonSize: { default: "default", small: "small" },
+  libButtonGroupToggle: { single: "single", multi: "multi" },
+  libTagVariant: { plain: "plain", outline: "outline" },
+  libInputTypes: {
+    color: "color",
+    date: "date",
+    "datetime-local": "datetime-local",
+    month: "month",
+    week: "week",
+    file: "file",
+    password: "password",
+    search: "search",
+    email: "email",
+    number: "number",
+    tel: "tel",
+    text: "text",
+    url: "url",
+    time: "time",
+    select: "select",
+    textarea: "textarea"
+  },
+  libCheckInputVariants: {
+    tile: "tile",
+    toggle: "toggle",
+    selector: "selector"
+  },
+  libListInputDirections: { up: "up", down: "down" },
+  libAccordionVariant: { basic: "basic", rounded: "rounded" },
+  libAccordionIcon: { plus: "plus", chevron: "chevron" },
+  libToastStatus: {
+    success: "success",
+    error: "error",
+    warning: "warning",
+    info: "info",
+    loading: "loading"
+  },
+  libTabsJustify: { start: "start", stretch: "stretch" },
+  libTabsVariant: { basic: "basic", rounded: "rounded" },
+  libSlideshowPagination: {
+    dots: "dots",
+    "dots-outline": "dots-outline",
+    bars: "bars",
+    thumbnails: "thumbnails"
+  },
+  libSlideshowPaginationPosition: { inside: "inside", outside: "outside" },
+  libSlideshowButtonsPositions: { left: "left", right: "right" },
+  libSlideshowButtonsSizes: { small: "small", large: "large" },
+  libTableVariants: {
+    bordered: "bordered",
+    stripped: "stripped",
+    "border-bottom": "border-bottom"
+  },
+  libMdEditorViews: {
+    viewCode: "viewCode",
+    viewLive: "viewLive",
+    viewPreview: "viewPreview"
+  },
+  libMdEditorButtons: {
+    bold: "bold",
+    italic: "italic",
+    strikethrough: "strikethrough",
+    underline: "underline",
+    ul: "ul",
+    ol: "ol",
+    link: "link",
+    quote: "quote",
+    hr: "hr",
+    code: "code",
+    codeBlock: "codeBlock",
+    comment: "comment",
+    image: "image"
+  },
+  libMdEditorTitles: { ...libTextDisplayTags, h6: "h6" },
+  libDrawerPositions: { left: "left", right: "right" },
+  libNavBurgerPositions: { left: "left", right: "right" },
+  libNavMobileVariants: { full: "full", top: "top", drawer: "drawer" },
+  libFooterDirection: { horizontal: "horizontal", vertical: "vertical" },
+  libFooterLinksSeparator: { dot: "dot", dash: "dash" },
+  libCountryCodes: {
+    af: "af",
+    ax: "ax",
+    al: "al",
+    dz: "dz",
+    as: "as",
+    ad: "ad",
+    ao: "ao",
+    ai: "ai",
+    aq: "aq",
+    ag: "ag",
+    ar: "ar",
+    am: "am",
+    aw: "aw",
+    au: "au",
+    at: "at",
+    az: "az",
+    bs: "bs",
+    bh: "bh",
+    bd: "bd",
+    bb: "bb",
+    by: "by",
+    be: "be",
+    bz: "bz",
+    bj: "bj",
+    bm: "bm",
+    bt: "bt",
+    bo: "bo",
+    ba: "ba",
+    bw: "bw",
+    br: "br",
+    io: "io",
+    bn: "bn",
+    bg: "bg",
+    bf: "bf",
+    bi: "bi",
+    kh: "kh",
+    cm: "cm",
+    ca: "ca",
+    cv: "cv",
+    ky: "ky",
+    cf: "cf",
+    td: "td",
+    cl: "cl",
+    cn: "cn",
+    cx: "cx",
+    cc: "cc",
+    co: "co",
+    km: "km",
+    cg: "cg",
+    cd: "cd",
+    ck: "ck",
+    cr: "cr",
+    ci: "ci",
+    hr: "hr",
+    cu: "cu",
+    cy: "cy",
+    cz: "cz",
+    dk: "dk",
+    dj: "dj",
+    dm: "dm",
+    do: "do",
+    ec: "ec",
+    eg: "eg",
+    sv: "sv",
+    gq: "gq",
+    er: "er",
+    ee: "ee",
+    et: "et",
+    fk: "fk",
+    fo: "fo",
+    fj: "fj",
+    fi: "fi",
+    fr: "fr",
+    gf: "gf",
+    pf: "pf",
+    ga: "ga",
+    gm: "gm",
+    ge: "ge",
+    de: "de",
+    gh: "gh",
+    gi: "gi",
+    gr: "gr",
+    gl: "gl",
+    gd: "gd",
+    gp: "gp",
+    gu: "gu",
+    gt: "gt",
+    gg: "gg",
+    gn: "gn",
+    gw: "gw",
+    gy: "gy",
+    ht: "ht",
+    va: "va",
+    hn: "hn",
+    hk: "hk",
+    hu: "hu",
+    is: "is",
+    in: "in",
+    id: "id",
+    ir: "ir",
+    iq: "iq",
+    ie: "ie",
+    im: "im",
+    il: "il",
+    it: "it",
+    jm: "jm",
+    jp: "jp",
+    je: "je",
+    jo: "jo",
+    kz: "kz",
+    ke: "ke",
+    ki: "ki",
+    kp: "kp",
+    kr: "kr",
+    kw: "kw",
+    kg: "kg",
+    la: "la",
+    lv: "lv",
+    lb: "lb",
+    ls: "ls",
+    lr: "lr",
+    ly: "ly",
+    li: "li",
+    lt: "lt",
+    lu: "lu",
+    mo: "mo",
+    mk: "mk",
+    mg: "mg",
+    mw: "mw",
+    my: "my",
+    mv: "mv",
+    ml: "ml",
+    mt: "mt",
+    mh: "mh",
+    mq: "mq",
+    mr: "mr",
+    mu: "mu",
+    yt: "yt",
+    mx: "mx",
+    fm: "fm",
+    md: "md",
+    mc: "mc",
+    mn: "mn",
+    me: "me",
+    ms: "ms",
+    ma: "ma",
+    mz: "mz",
+    mm: "mm",
+    na: "na",
+    nr: "nr",
+    np: "np",
+    nl: "nl",
+    nc: "nc",
+    nz: "nz",
+    ni: "ni",
+    ne: "ne",
+    ng: "ng",
+    nu: "nu",
+    nf: "nf",
+    mp: "mp",
+    no: "no",
+    om: "om",
+    pk: "pk",
+    pw: "pw",
+    ps: "ps",
+    pa: "pa",
+    pg: "pg",
+    py: "py",
+    pe: "pe",
+    ph: "ph",
+    pn: "pn",
+    pl: "pl",
+    pt: "pt",
+    pr: "pr",
+    qa: "qa",
+    ro: "ro",
+    ru: "ru",
+    rw: "rw",
+    re: "re",
+    bl: "bl",
+    sh: "sh",
+    kn: "kn",
+    lc: "lc",
+    mf: "mf",
+    pm: "pm",
+    vc: "vc",
+    ws: "ws",
+    sm: "sm",
+    st: "st",
+    sa: "sa",
+    sn: "sn",
+    rs: "rs",
+    sc: "sc",
+    sl: "sl",
+    sg: "sg",
+    sk: "sk",
+    si: "si",
+    sb: "sb",
+    so: "so",
+    za: "za",
+    ss: "ss",
+    gs: "gs",
+    es: "es",
+    lk: "lk",
+    sd: "sd",
+    sr: "sr",
+    sj: "sj",
+    sz: "sz",
+    se: "se",
+    ch: "ch",
+    sy: "sy",
+    tw: "tw",
+    tj: "tj",
+    tz: "tz",
+    th: "th",
+    tl: "tl",
+    tg: "tg",
+    tk: "tk",
+    to: "to",
+    tt: "tt",
+    tn: "tn",
+    tr: "tr",
+    tm: "tm",
+    tc: "tc",
+    tv: "tv",
+    ug: "ug",
+    ua: "ua",
+    ae: "ae",
+    gb: "gb",
+    us: "us",
+    uy: "uy",
+    uz: "uz",
+    vu: "vu",
+    ve: "ve",
+    vn: "vn",
+    vg: "vg",
+    vi: "vi",
+    wf: "wf",
+    ye: "ye",
+    zm: "zm",
+    zw: "zw"
+  }
+};
+
+// src/lib/utils/linkify-text.tsx
+import { Fragment } from "react";
+import { uuid } from "@julseb-lib/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+var URL_REGEX = /^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)?[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/gm;
+var linkifyText = (text, blank) => {
+  const words = text?.split(" ");
+  return words?.map(
+    (word) => word.match(URL_REGEX) ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: word,
+          target: blank ? "_blank" : void 0,
+          rel: blank ? "noreferrer noopener" : void 0,
+          className: "font-black",
+          children: word
+        }
+      ),
+      " "
+    ] }, uuid()) : word + " "
+  );
+};
+
+// src/lib/utils/gen-link-color.ts
+var genLinkColor = {
+  primary: "[&_a]:font-black [&_a]:text-primary-500 [&_a]:hover:text-primary-300 [&_a]:active:text-primary-600",
+  secondary: "[&_a]:font-black [&_a]:text-secondary-500 [&_a]:hover:text-secondary-300 [&_a]:active:text-secondary-600",
+  success: "[&_a]:font-black [&_a]:text-success-500 [&_a]:hover:text-success-300 [&_a]:active:text-success-600",
+  danger: "[&_a]:font-black [&_a]:text-danger-500 [&_a]:hover:text-danger-300 [&_a]:active:text-danger-600",
+  warning: "[&_a]:font-black [&_a]:text-warning-500 [&_a]:hover:text-warning-300 [&_a]:active:text-warning-600",
+  gray: "[&_a]:font-black [&_a]:text-gray-500 [&_a]:hover:text-gray-300 [&_a]:active:text-gray-600",
+  white: "[&_a]:font-black [&_a]:text-white [&_a]:hover:text-gray-300 [&_a]:active:text-gray-100"
+};
+var genButtonColor = {
+  primary: "[&_button]:font-black [&_button]:text-primary-500 [&_button]:hover:text-primary-300 [&_button]:active:text-primary-600",
+  secondary: "[&_button]:font-black [&_button]:text-secondary-500 [&_button]:hover:text-secondary-300 [&_button]:active:text-secondary-600",
+  success: "[&_button]:font-black [&_button]:text-success-500 [&_button]:hover:text-success-300 [&_button]:active:text-success-600",
+  danger: "[&_button]:font-black [&_button]:text-danger-500 [&_button]:hover:text-danger-300 [&_button]:active:text-danger-600",
+  warning: "[&_button]:font-black [&_button]:text-warning-500 [&_button]:hover:text-warning-300 [&_button]:active:text-warning-600",
+  gray: "[&_button]:font-black [&_button]:text-gray-500 [&_button]:hover:text-gray-300 [&_button]:active:text-gray-600",
+  white: "[&_button]:font-black [&_button]:text-white [&_button]:hover:text-gray-300 [&_button]:active:text-gray-100"
+};
+
+// src/lib/utils/gen-text-align.ts
+var genTextAlign = {
+  left: "text-left",
+  center: "text-center",
+  right: "text-right",
+  justify: "text-justify",
+  start: "text-start",
+  end: "text-end"
+};
+
+// src/lib/utils/gen-text-color.ts
+var genTextColor = {
+  black: "text-black",
+  white: "text-white",
+  "primary-50": "text-primary-50",
+  "primary-100": "text-primary-100",
+  "primary-200": "text-primary-200",
+  "primary-300": "text-primary-300",
+  "primary-400": "text-primary-400",
+  "primary-500": "text-primary-500",
+  "primary-600": "text-primary-600",
+  "primary-700": "text-primary-700",
+  "primary-800": "text-primary-800",
+  "primary-900": "text-primary-900",
+  "primary-950": "text-primary-950",
+  "secondary-50": "text-secondary-50",
+  "secondary-100": "text-secondary-100",
+  "secondary-200": "text-secondary-200",
+  "secondary-300": "text-secondary-300",
+  "secondary-400": "text-secondary-400",
+  "secondary-500": "text-secondary-500",
+  "secondary-600": "text-secondary-600",
+  "secondary-700": "text-secondary-700",
+  "secondary-800": "text-secondary-800",
+  "secondary-900": "text-secondary-900",
+  "secondary-950": "text-secondary-950",
+  "success-50": "text-success-50",
+  "success-100": "text-success-100",
+  "success-200": "text-success-200",
+  "success-300": "text-success-300",
+  "success-400": "text-success-400",
+  "success-500": "text-success-500",
+  "success-600": "text-success-600",
+  "success-700": "text-success-700",
+  "success-800": "text-success-800",
+  "success-900": "text-success-900",
+  "success-950": "text-success-950",
+  "danger-50": "text-danger-50",
+  "danger-100": "text-danger-100",
+  "danger-200": "text-danger-200",
+  "danger-300": "text-danger-300",
+  "danger-400": "text-danger-400",
+  "danger-500": "text-danger-500",
+  "danger-600": "text-danger-600",
+  "danger-700": "text-danger-700",
+  "danger-800": "text-danger-800",
+  "danger-900": "text-danger-900",
+  "danger-950": "text-danger-950",
+  "warning-50": "text-warning-50",
+  "warning-100": "text-warning-100",
+  "warning-200": "text-warning-200",
+  "warning-300": "text-warning-300",
+  "warning-400": "text-warning-400",
+  "warning-500": "text-warning-500",
+  "warning-600": "text-warning-600",
+  "warning-700": "text-warning-700",
+  "warning-800": "text-warning-800",
+  "warning-900": "text-warning-900",
+  "warning-950": "text-warning-950",
+  "gray-50": "text-gray-50",
+  "gray-100": "text-gray-100",
+  "gray-200": "text-gray-200",
+  "gray-300": "text-gray-300",
+  "gray-400": "text-gray-400",
+  "gray-500": "text-gray-500",
+  "gray-600": "text-gray-600",
+  "gray-700": "text-gray-700",
+  "gray-800": "text-gray-800",
+  "gray-900": "text-gray-900",
+  "gray-950": "text-gray-950",
+  current: "text-current",
+  transparent: "text-transparent",
+  background: "text-background",
+  font: "text-font"
+};
+var genTextColorShort = {
+  primary: "text-primary-500",
+  secondary: "text-secondary-500",
+  success: "text-success-500",
+  danger: "text-danger-500",
+  warning: "text-warning-500",
+  gray: "text-gray-500",
+  black: "text-black",
+  white: "text-white",
+  current: "text-current",
+  transparent: "text-transparent",
+  background: "text-background"
+};
+var genTextColorHover = {
+  primary: "text-primary-500 hover:text-primary-300 active:text-primary-600",
+  secondary: "text-secondary-500 hover:text-secondary-300 active:text-secondary-600",
+  success: "text-success-500 hover:text-success-300 active:text-success-600",
+  danger: "text-danger-500 hover:text-danger-300 active:text-danger-600",
+  warning: "text-warning-500 hover:text-warning-300 active:text-warning-600",
+  gray: "text-gray-500 hover:text-gray-300 active:text-gray-600",
+  white: "text-white hover:text-gray-300! active:text-gray-100!"
+};
+var genTextAllColor = {
+  ...genTextColor,
+  ...genTextColorShort
+};
+
+// src/lib/utils/gen-bg-color.ts
+var genBgColor = {
+  black: "bg-black",
+  white: "bg-white",
+  "primary-50": "bg-primary-50",
+  "primary-100": "bg-primary-100",
+  "primary-200": "bg-primary-200",
+  "primary-300": "bg-primary-300",
+  "primary-400": "bg-primary-400",
+  "primary-500": "bg-primary-500",
+  "primary-600": "bg-primary-600",
+  "primary-700": "bg-primary-700",
+  "primary-800": "bg-primary-800",
+  "primary-900": "bg-primary-900",
+  "primary-950": "bg-primary-950",
+  "secondary-50": "bg-secondary-50",
+  "secondary-100": "bg-secondary-100",
+  "secondary-200": "bg-secondary-200",
+  "secondary-300": "bg-secondary-300",
+  "secondary-400": "bg-secondary-400",
+  "secondary-500": "bg-secondary-500",
+  "secondary-600": "bg-secondary-600",
+  "secondary-700": "bg-secondary-700",
+  "secondary-800": "bg-secondary-800",
+  "secondary-900": "bg-secondary-900",
+  "secondary-950": "bg-secondary-950",
+  "success-50": "bg-success-50",
+  "success-100": "bg-success-100",
+  "success-200": "bg-success-200",
+  "success-300": "bg-success-300",
+  "success-400": "bg-success-400",
+  "success-500": "bg-success-500",
+  "success-600": "bg-success-600",
+  "success-700": "bg-success-700",
+  "success-800": "bg-success-800",
+  "success-900": "bg-success-900",
+  "success-950": "bg-success-950",
+  "danger-50": "bg-danger-50",
+  "danger-100": "bg-danger-100",
+  "danger-200": "bg-danger-200",
+  "danger-300": "bg-danger-300",
+  "danger-400": "bg-danger-400",
+  "danger-500": "bg-danger-500",
+  "danger-600": "bg-danger-600",
+  "danger-700": "bg-danger-700",
+  "danger-800": "bg-danger-800",
+  "danger-900": "bg-danger-900",
+  "danger-950": "bg-danger-950",
+  "warning-50": "bg-warning-50",
+  "warning-100": "bg-warning-100",
+  "warning-200": "bg-warning-200",
+  "warning-300": "bg-warning-300",
+  "warning-400": "bg-warning-400",
+  "warning-500": "bg-warning-500",
+  "warning-600": "bg-warning-600",
+  "warning-700": "bg-warning-700",
+  "warning-800": "bg-warning-800",
+  "warning-900": "bg-warning-900",
+  "warning-950": "bg-warning-950",
+  "gray-50": "bg-gray-50",
+  "gray-100": "bg-gray-100",
+  "gray-200": "bg-gray-200",
+  "gray-300": "bg-gray-300",
+  "gray-400": "bg-gray-400",
+  "gray-500": "bg-gray-500",
+  "gray-600": "bg-gray-600",
+  "gray-700": "bg-gray-700",
+  "gray-800": "bg-gray-800",
+  "gray-900": "bg-gray-900",
+  "gray-950": "bg-gray-950",
+  current: "bg-current",
+  transparent: "bg-transparent",
+  background: "bg-background",
+  font: "bg-font"
+};
+var genBgColorShort = {
+  primary: "bg-primary-500",
+  secondary: "bg-secondary-500",
+  success: "bg-success-500",
+  danger: "bg-danger-500",
+  warning: "bg-warning-500",
+  gray: "bg-gray-500",
+  black: "bg-black",
+  white: "bg-white",
+  current: "bg-current",
+  transparent: "bg-transparent",
+  background: "bg-background"
+};
+var genBgColor50 = (theme) => {
+  const colors = {
+    primary: theme === "dark" ? "bg-primary-950" : "bg-primary-50",
+    secondary: theme === "dark" ? "bg-secondary-950" : "bg-secondary-50",
+    success: theme === "dark" ? "bg-success-950" : "bg-success-50",
+    danger: theme === "dark" ? "bg-danger-950" : "bg-danger-50",
+    warning: theme === "dark" ? "bg-warning-950" : "bg-warning-50",
+    gray: theme === "dark" ? "bg-gray-950" : "bg-gray-50",
+    white: theme === "dark" ? "bg-gray-950" : "bg-white"
+  };
+  return colors;
+};
+var genBgColorHover = {
+  primary: "bg-primary-500 hover:bg-primary-300 active:bg-primary-600",
+  secondary: "bg-secondary-500 hover:bg-secondary-300 active:bg-secondary-600",
+  success: "bg-success-500 hover:bg-success-300 active:bg-success-600",
+  danger: "bg-danger-500 hover:bg-danger-300 active:bg-danger-600",
+  warning: "bg-warning-500 hover:bg-warning-300 active:bg-warning-600",
+  gray: "bg-gray-500 hover:bg-gray-300 active:bg-gray-600",
+  white: "bg-white hover:bg-gray-300! active:bg-gray-100!"
+};
+var genBgColorGhostHover = {
+  primary: "bg-primary-50 hover:bg-primary-300 active:bg-primary-100",
+  secondary: "bg-secondary-50 hover:bg-secondary-300 active:bg-secondary-100",
+  success: "bg-success-50 hover:bg-success-300 active:bg-success-100",
+  danger: "bg-danger-50 hover:bg-danger-300 active:bg-danger-100",
+  warning: "bg-warning-50 hover:bg-warning-300 active:bg-warning-100",
+  gray: "bg-gray-50 hover:bg-gray-300 active:bg-gray-100",
+  white: "bg-white hover:bg-gray-300! active:bg-gray-100!"
+};
+var genBgOverlay = {
+  "black-50": "bg-overlay-black-50",
+  "black-80": "bg-overlay-black-80",
+  "white-50": "bg-overlay-white-50",
+  "white-80": "bg-overlay-white-80",
+  "gradient-black": "bg-overlay-gradient-black",
+  "gradient-white": "bg-overlay-gradient-white"
+};
+var genBgAllColors = {
+  ...genBgColor,
+  ...genBgColorShort
+};
+var genBgAllColorsAndOverlays = {
+  ...genBgAllColors,
+  ...genBgOverlay
+};
+
+// src/lib/utils/gen-border-color.ts
+var genBorderColor = {
+  black: "border-black",
+  white: "border-white",
+  "primary-50": "border-primary-50",
+  "primary-100": "border-primary-100",
+  "primary-200": "border-primary-200",
+  "primary-300": "border-primary-300",
+  "primary-400": "border-primary-400",
+  "primary-500": "border-primary-500",
+  "primary-600": "border-primary-600",
+  "primary-700": "border-primary-700",
+  "primary-800": "border-primary-800",
+  "primary-900": "border-primary-900",
+  "primary-950": "border-primary-950",
+  "secondary-50": "border-secondary-50",
+  "secondary-100": "border-secondary-100",
+  "secondary-200": "border-secondary-200",
+  "secondary-300": "border-secondary-300",
+  "secondary-400": "border-secondary-400",
+  "secondary-500": "border-secondary-500",
+  "secondary-600": "border-secondary-600",
+  "secondary-700": "border-secondary-700",
+  "secondary-800": "border-secondary-800",
+  "secondary-900": "border-secondary-900",
+  "secondary-950": "border-secondary-950",
+  "success-50": "border-success-50",
+  "success-100": "border-success-100",
+  "success-200": "border-success-200",
+  "success-300": "border-success-300",
+  "success-400": "border-success-400",
+  "success-500": "border-success-500",
+  "success-600": "border-success-600",
+  "success-700": "border-success-700",
+  "success-800": "border-success-800",
+  "success-900": "border-success-900",
+  "success-950": "border-success-950",
+  "danger-50": "border-danger-50",
+  "danger-100": "border-danger-100",
+  "danger-200": "border-danger-200",
+  "danger-300": "border-danger-300",
+  "danger-400": "border-danger-400",
+  "danger-500": "border-danger-500",
+  "danger-600": "border-danger-600",
+  "danger-700": "border-danger-700",
+  "danger-800": "border-danger-800",
+  "danger-900": "border-danger-900",
+  "danger-950": "border-danger-950",
+  "warning-50": "border-warning-50",
+  "warning-100": "border-warning-100",
+  "warning-200": "border-warning-200",
+  "warning-300": "border-warning-300",
+  "warning-400": "border-warning-400",
+  "warning-500": "border-warning-500",
+  "warning-600": "border-warning-600",
+  "warning-700": "border-warning-700",
+  "warning-800": "border-warning-800",
+  "warning-900": "border-warning-900",
+  "warning-950": "border-warning-950",
+  "gray-50": "border-gray-50",
+  "gray-100": "border-gray-100",
+  "gray-200": "border-gray-200",
+  "gray-300": "border-gray-300",
+  "gray-400": "border-gray-400",
+  "gray-500": "border-gray-500",
+  "gray-600": "border-gray-600",
+  "gray-700": "border-gray-700",
+  "gray-800": "border-gray-800",
+  "gray-900": "border-gray-900",
+  "gray-950": "border-gray-950",
+  current: "border-current",
+  transparent: "border-transparent",
+  background: "border-background",
+  font: "border-font"
+};
+var genBorderColorShort = {
+  primary: "border-primary-500",
+  secondary: "border-secondary-500",
+  success: "border-success-500",
+  danger: "border-danger-500",
+  warning: "border-warning-500",
+  gray: "border-gray-500",
+  black: "border-black",
+  white: "border-white",
+  current: "border-current",
+  transparent: "border-transparent",
+  background: "border-background"
+};
+var genBorderColorHover = {
+  primary: "border-primary-500 hover:border-primary-300 active:border-primary-600",
+  secondary: "border-secondary-500 hover:border-secondary-300 active:border-secondary-600",
+  success: "border-success-500 hover:border-success-300 active:border-success-600",
+  danger: "border-danger-500 hover:border-danger-300 active:border-danger-600",
+  warning: "border-warning-500 hover:border-warning-300 active:border-warning-600",
+  gray: "border-gray-500 hover:border-gray-300 active:border-gray-600",
+  white: "border-white hover:border-gray-300 active:border-gray-100"
+};
+var genBorderAllColors = {
+  ...genBorderColor,
+  ...genBorderColorShort
+};
+
+// src/lib/utils/gen-gap.ts
+var genGap = {
+  "2xl": "gap-12",
+  xl: "gap-8",
+  lg: "gap-6",
+  md: "gap-4",
+  sm: "gap-3",
+  xs: "gap-2",
+  "2xs": "gap-1",
+  "0px": "0px"
+};
+var genRowGap = {
+  "2xl": "gap-y-12",
+  xl: "gap-y-8",
+  lg: "gap-y-6",
+  md: "gap-y-4",
+  sm: "gap-y-3",
+  xs: "gap-y-2",
+  "2xs": "gap-y-1",
+  "0px": "0px"
+};
+var genColGap = {
+  "2xl": "gap-x-12",
+  xl: "gap-x-8",
+  lg: "gap-x-6",
+  md: "gap-x-4",
+  sm: "gap-x-3",
+  xs: "gap-x-2",
+  "2xs": "gap-x-1",
+  "0px": "0px"
+};
+
+// src/lib/utils/clsx.tsx
+import classNameX from "clsx";
+
+// src/lib/utils/tools.ts
+import { createTools } from "tailwindest";
+import { twMerge } from "tailwind-merge";
+var tw = createTools({
+  merger: twMerge
+  // set tailwind-merge as merger, [optional]
+});
+
+// src/lib/utils/clsx.tsx
+var clsx = (...classes) => classNameX(tw.def(classes));
+
+// src/lib/utils/gen-align.ts
+var genAlignContent = {
+  normal: "content-normal",
+  center: "content-center",
+  start: "content-start",
+  end: "content-end",
+  "space-between": "content-between",
+  "space-around": "content-around",
+  "space-evenly": "content-evenly",
+  baseline: "content-baseline",
+  stretch: "content-stretch"
+};
+var genAlignItems = {
+  start: "items-start",
+  end: "items-end",
+  "end-safe": "items-end-safe",
+  center: "items-center",
+  "center-safe": "items-center-safe",
+  baseline: "items-baseline",
+  "baseline-start": "items-baseline-last",
+  stretch: "items-stretch"
+};
+
+// src/lib/utils/gen-justify.ts
+var genJustifyContent = {
+  start: "justify-start",
+  end: "justify-end",
+  "end-safe": "justify-end-safe",
+  center: "justify-center",
+  "center-safe": "justify-center-safe",
+  "space-between": "justify-between",
+  "space-around": "justify-around",
+  "space-evenly": "justify-evenly",
+  stretch: "justify-stretch",
+  baseline: "justify-baseline",
+  normal: "justify-normal"
+};
+var genJustifyItems = {
+  start: "justify-items-start",
+  end: "justify-items-end",
+  "end-safe": "justify-items-end-safe",
+  center: "justify-items-center",
+  "center-safe": "justify-items-center-safe",
+  stretch: "justify-items-stretch",
+  normal: "justify-items-normal"
+};
+
+// src/lib/utils/gen-max-width.ts
+var genMaxWidth = {
+  "3xs": "max-w-3xs",
+  "2xs": "max-w-2xs",
+  xs: "max-w-xs",
+  sm: "max-w-sm",
+  md: "max-w-md",
+  lg: "max-w-lg",
+  xl: "max-w-xl",
+  "2xl": "max-w-2xl",
+  "3xl": "max-w-3xl",
+  "4xl": "max-w-4xl",
+  "5xl": "max-w-5xl",
+  "6xl": "max-w-6xl",
+  "7xl": "max-w-7xl",
+  none: "max-w-none",
+  px: "max-w-px",
+  full: "max-w-full",
+  dvw: "max-w-dvw",
+  dvh: "max-w-dvh",
+  lvw: "max-w-lvw",
+  lvh: "max-w-lvh",
+  svw: "max-w-svw",
+  svh: "max-w-svh",
+  screen: "max-w-screen",
+  min: "max-w-min",
+  max: "max-w-max",
+  fit: "max-w-fit"
+};
+
+// src/lib/utils/gen-border-radius.ts
+var genBorderRadius = {
+  xs: "rounded-xs",
+  sm: "rounded-sm",
+  md: "rounded-md",
+  lg: "rounded-lg",
+  xl: "rounded-xl",
+  "2xl": "rounded-2xl",
+  "3xl": "rounded-3xl",
+  "4xl": "rounded-4xl",
+  full: "rounded-full"
+};
+
+// src/lib/utils/gen-object-fit.ts
+var genObjectFit = {
+  contain: "object-contain",
+  cover: "object-cover",
+  fill: "object-fill",
+  none: "object-none",
+  "scale-down": "object-scale-down"
+};
+
+// src/lib/utils/gen-button-color.ts
+var genButtonDisabled = {
+  plain: "disabled:bg-gray-200 disabled:hover:bg-gray-200 disabled:text-gray-500!",
+  ghost: "disabled:bg-gray-200 disabled:hover:bg-gray-200 disabled:text-gray-500",
+  outline: "disabled:border-gray-500 disabled:text-gray-500 disabled:hover:border-gray-500 disabled:hover:text-gray-500",
+  transparent: "disabled:text-gray-500 disabled:hover:text-gray-500"
+};
+
+// src/lib/utils/gen-box-shadow.ts
+var genBoxShadow = {
+  "2xs": "shadow-2xs",
+  xs: "shadow-xs",
+  sm: "shadow-sm",
+  md: "shadow-md",
+  lg: "shadow-lg",
+  xl: "shadow-xl",
+  "2xl": "shadow-2xl",
+  none: "shadow-none"
+};
+
+// src/lib/utils/gen-vertical-align.ts
+var genVAlign = {
+  "align-baseline": "align-baseline",
+  "align-top": "align-top",
+  "align-middle": "align-middle",
+  "align-bottom": "align-bottom",
+  "align-text-top": "align-text-top",
+  "align-text-bottom": "align-text-bottom",
+  "align-sub": "align-sub",
+  "align-super": "align-super"
+};
+
+// src/lib/components/Text/Text.tsx
+import "react";
+
+// src/lib/components/Table/Table.tsx
+import "react";
+import { uuid as uuid2 } from "@julseb-lib/utils";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var Table = ({
+  className,
+  ref,
+  children,
+  variant = "bordered",
+  vAlign = "align-top",
+  textAlign = "left",
+  linkify,
+  blank,
+  headers,
+  footers,
+  data,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsxs2(
+    "table",
+    {
+      ref,
+      className: clsx(
+        "table bg-background w-full h-[1px] border-collapse border-spacing-0 table-fixed",
+        TEXT_BASE_CLASSES,
+        "text-(length:--font-size-small)",
+        genLinkColor["primary"],
+        genButtonColor["primary"],
+        "[&_thead]:bg-primary-500 [&_thead]:text-white [&_thead]:font-bold",
+        "[&_td]:overflow-x-scroll [&_td]:px-2 [&_td]:py-1 [&_th]:overflow-x-scroll [&_th]:px-2 [&_th]:py-1",
+        "md:[&_td]:table-cell md:[&_th]:table-cell [&_td]:block [&_th]:block",
+        variant === "bordered" && [
+          "border border-gray-200",
+          "[&_thead_th:not(:last-child)]:border-r [&_thead_th:not(:last-child)]:border-background [&_td]:border [&_td]:border-gray-200"
+        ],
+        variant === "stripped" && [
+          "[&_tbody_tr:nth-child(even)]:bg-gray-100"
+        ],
+        variant === "border-bottom" && [
+          "[&_tbody_tr]:border-b [&_tbody_tr]:border-b-gray-200"
+        ],
+        genVAlign[vAlign],
+        genTextAlign[textAlign],
+        "table",
+        className
+      ),
+      ...rest,
+      children: [
+        headers && /* @__PURE__ */ jsx2("thead", { className: clsx(genVAlign[vAlign]), children: /* @__PURE__ */ jsx2("tr", { className: clsx(genVAlign[vAlign]), children: headers.map((header) => /* @__PURE__ */ jsx2(
+          "th",
+          {
+            className: clsx(
+              genVAlign[vAlign],
+              "no-scrollbar"
+            ),
+            children: linkify && typeof header === "string" ? linkifyText(header, blank) : header
+          },
+          uuid2()
+        )) }) }),
+        data ? /* @__PURE__ */ jsx2("tbody", { className: clsx(genVAlign[vAlign]), children: data.map((row) => /* @__PURE__ */ jsx2("tr", { children: row.map((col) => /* @__PURE__ */ jsx2("td", { className: "no-scrollbar", children: linkify && typeof col === "string" ? linkifyText(col, blank) : col }, uuid2())) }, uuid2())) }) : /* @__PURE__ */ jsx2("tbody", { children }),
+        footers && /* @__PURE__ */ jsx2("tfoot", { children: /* @__PURE__ */ jsx2("tr", { children: footers.map((footer) => /* @__PURE__ */ jsx2("td", { className: "no-scrollbar", children: linkify && typeof footer === "string" ? linkifyText(footer, blank) : footer }, uuid2())) }) })
+      ]
+    }
+  );
+};
+
+// src/lib/utils/options-markdown.ts
+var libOptionsMarkdown = {
+  forceBlock: true,
+  wrapper: "div",
+  overrides: {
+    h1: { component: Text, props: { tag: "h1" } },
+    h2: { component: Text, props: { tag: "h2" } },
+    h3: { component: Text, props: { tag: "h3" } },
+    h4: { component: Text, props: { tag: "h4" } },
+    h5: { component: Text, props: { tag: "h5" } },
+    h6: { component: Text, props: { tag: "h6" } },
+    p: { component: Text, props: { tag: "p" } },
+    strong: { component: Text, props: { tag: "strong" } },
+    em: { component: Text, props: { tag: "em" } },
+    ul: { component: Text, props: { tag: "ul" } },
+    ol: { component: Text, props: { tag: "ol" } },
+    dl: { component: Text, props: { tag: "dl" } },
+    small: { component: Text, props: { tag: "small" } },
+    blockquote: { component: Text, props: { tag: "blockquote" } },
+    table: { component: Table }
+  }
+};
+var libMarkdownEditorOptions = {
+  bold: true,
+  italic: true,
+  strikethrough: true,
+  underline: true,
+  ul: true,
+  ol: true,
+  link: true,
+  quote: true,
+  hr: true,
+  code: true,
+  codeBlock: true,
+  comment: true,
+  image: true,
+  viewCode: true,
+  viewLive: true,
+  viewPreview: true,
+  titles: true
+};
+
+// src/lib/utils/gen-ring-color.ts
+var genRingColor = {
+  primary: "focus:ring-1 focus:ring-primary-800",
+  secondary: "focus:ring-1 focus:ring-secondary-800",
+  success: "focus:ring-1 focus:ring-success-800",
+  danger: "focus:ring-1 focus:ring-danger-800",
+  warning: "focus:ring-1 focus:ring-warning-800",
+  gray: "focus:ring-1 focus:ring-gray-800",
+  white: "focus:ring-1 focus:ring-gray-500"
+};
+var genRingColorChildren = {
+  primary: "[&>*]:focus:ring-1 [&>*]:focus:ring-primary-800",
+  secondary: "[&>*]:focus:ring-1 [&>*]:focus:ring-secondary-800",
+  success: "[&>*]:focus:ring-1 [&>*]:focus:ring-success-800",
+  danger: "[&>*]:focus:ring-1 [&>*]:focus:ring-danger-800",
+  warning: "[&>*]:focus:ring-1 [&>*]:focus:ring-warning-800",
+  gray: "[&>*]:focus:ring-1 [&>*]:focus:ring-gray-800",
+  white: "[&>*]:focus:ring-1 [&>*]:focus:ring-gray-500"
+};
+
+// src/lib/utils/detect-language.ts
+function detectLanguage() {
+  if (window && typeof window !== "undefined") {
+    if (localStorage.getItem("language") !== null) {
+      return localStorage.getItem("language");
+    } else if (localStorage.getItem("lang") !== null) {
+      return localStorage.getItem("lang");
+    } else {
+      if (navigator && typeof navigator !== "undefined") {
+        return navigator.language;
+      }
+    }
+  }
+}
+
+// src/lib/utils/disable-scroll.ts
+function disableScroll() {
+  const body = document.body;
+  body.style.height = "100vh";
+  body.style.overflow = "hidden";
+  return;
+}
+
+// src/lib/utils/enable-scroll.ts
+function enableScroll() {
+  const body = document.body;
+  body.style.height = "";
+  body.style.overflow = "";
+  return;
+}
+
+// src/lib/utils/scroll-to-top.ts
+function scrollToTop() {
+  if (typeof window !== "undefined") {
+    return window.scrollTo(0, 0);
+  }
+}
+
+// src/lib/components/Text/templates/H1.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var H1 = ({
+  element = "h1",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  display,
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx3(
+    Element,
+    {
+      className: clsx(
+        display ? "text-display-h1" : "text-h1",
+        TEXT_BASE_CLASSES,
+        "font-black",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "h1",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/H2.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var H2 = ({
+  element = "h2",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  display,
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx4(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "font-black",
+        display ? "text-display-h2" : "text-h2",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "h2",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/H3.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var H3 = ({
+  element = "h3",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  display,
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx5(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "font-black",
+        display ? "text-display-h3" : "text-h3",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "h3",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/H4.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var H4 = ({
+  element = "h4",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  display,
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx6(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "font-black",
+        display ? "text-display-h4" : "text-h4",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "h4",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/H5.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+var H5 = ({
+  element = "h5",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  display,
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx7(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "font-black",
+        display ? "text-display-h5" : "text-h5",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "h5",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/H6.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+var H6 = ({
+  element = "h6",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx8(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "text-h6",
+        "font-black",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "h6",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/P.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var P = ({
+  element = "p",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx9(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "text-body",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "p",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/Small.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var Small = ({
+  element = "small",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx10(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "text-small",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "small",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/Strong.tsx
+import { jsx as jsx11 } from "react/jsx-runtime";
+var Strong = ({
+  element = "strong",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx11(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "font-black",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "strong",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/Em.tsx
+import { jsx as jsx12 } from "react/jsx-runtime";
+var Em = ({
+  element = "em",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx12(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "italic",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "em",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/Blockquote.tsx
+import { jsx as jsx13 } from "react/jsx-runtime";
+var Blockquote = ({
+  element = "blockquote",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx13(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "text-h6",
+        "italic ps-4",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "blockquote",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/Ul.tsx
+import { jsx as jsx14 } from "react/jsx-runtime";
+var Ul = ({
+  element = "ul",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx14(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "text-body",
+        "list-disc ps-8",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "ul",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/Ol.tsx
+import { jsx as jsx15 } from "react/jsx-runtime";
+var Ol = ({
+  element = "ol",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx15(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "text-body",
+        "list-decimal ps-8",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "ol",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/templates/Dl.tsx
+import { jsx as jsx16 } from "react/jsx-runtime";
+var Dl = ({
+  element = "dl",
+  className,
+  children,
+  color = "currentColor",
+  linkColor = "primary",
+  textAlign = "left",
+  ...rest
+}) => {
+  const Element = element;
+  return /* @__PURE__ */ jsx16(
+    Element,
+    {
+      className: clsx(
+        TEXT_BASE_CLASSES,
+        "text-body",
+        "[&>dt]:font-bold",
+        "[&>dd]:font-normal [&>dd]:ps-4",
+        genTextAlign[textAlign],
+        genTextAllColor[color],
+        genLinkColor[linkColor],
+        genButtonColor[linkColor],
+        "dl",
+        className
+      ),
+      ...rest,
+      children
+    }
+  );
+};
+
+// src/lib/components/Text/Text.tsx
+import { jsx as jsx17 } from "react/jsx-runtime";
+var TEXT_BASE_CLASSES = clsx(
+  "font-family-body",
+  "[&_code]:font-family-code [&_code]:leading-8 [&_code]:p-1 [&_code]:text-primary-500 [&_code]:bg-gray-50 [&_code]:rounded-xs"
+);
+var Text = ({ tag = "p", ...rest }) => {
+  switch (tag) {
+    case "h1":
+      return /* @__PURE__ */ jsx17(H1, { ...rest });
+    case "h2":
+      return /* @__PURE__ */ jsx17(H2, { ...rest });
+    case "h3":
+      return /* @__PURE__ */ jsx17(H3, { ...rest });
+    case "h4":
+      return /* @__PURE__ */ jsx17(H4, { ...rest });
+    case "h5":
+      return /* @__PURE__ */ jsx17(H5, { ...rest });
+    case "h6":
+      return /* @__PURE__ */ jsx17(H6, { ...rest });
+    case "small":
+      return /* @__PURE__ */ jsx17(Small, { ...rest });
+    case "strong":
+      return /* @__PURE__ */ jsx17(Strong, { ...rest });
+    case "em":
+      return /* @__PURE__ */ jsx17(Em, { ...rest });
+    case "blockquote":
+      return /* @__PURE__ */ jsx17(Blockquote, { ...rest });
+    case "ul":
+      return /* @__PURE__ */ jsx17(Ul, { ...rest });
+    case "ol":
+      return /* @__PURE__ */ jsx17(Ol, { ...rest });
+    case "dl":
+      return /* @__PURE__ */ jsx17(Dl, { ...rest });
+    case "p":
+    default:
+      return /* @__PURE__ */ jsx17(P, { ...rest });
+  }
+};
+
+// src/lib/components/Image/Image.tsx
+import "react";
+import { jsx as jsx18, jsxs as jsxs3 } from "react/jsx-runtime";
+var Image = ({
+  className,
+  ref,
+  caption,
+  borderRadius,
+  fit,
+  ...rest
+}) => {
+  const Element = caption ? "figure" : "img";
+  if (caption) {
+    return /* @__PURE__ */ jsxs3(
+      Element,
+      {
+        ref,
+        className: clsx(
+          "relative overflow-hidden image-container",
+          borderRadius && genBorderRadius[borderRadius],
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx18(
+            "img",
+            {
+              className: clsx(
+                "z-0 relative",
+                fit && genObjectFit[fit],
+                typeof caption === "object" && caption.imgClasses,
+                "image"
+              ),
+              ...rest
+            }
+          ),
+          /* @__PURE__ */ jsx18(
+            "figcaption",
+            {
+              className: clsx(
+                "bottom-0 left-0 z-10 absolute bg-overlay-black-80 px-4 py-2 w-full text-white",
+                typeof caption === "object" && caption.backgroundColor && genBgAllColorsAndOverlays[caption.backgroundColor],
+                typeof caption === "object" && caption.textColor && genTextAllColor[caption.textColor],
+                typeof caption === "object" && caption.captionClasses,
+                "figcaption"
+              ),
+              children: typeof caption === "object" ? caption.text : caption
+            }
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx18(
+    Element,
+    {
+      ref,
+      className: clsx(
+        borderRadius && genBorderRadius[borderRadius],
+        fit && genObjectFit[fit],
+        className,
+        "image"
+      ),
+      ...rest
+    }
+  );
+};
+
+export {
+  designTokens,
+  URL_REGEX,
+  linkifyText,
+  genLinkColor,
+  genButtonColor,
+  genTextAlign,
+  genTextColor,
+  genTextColorShort,
+  genTextColorHover,
+  genTextAllColor,
+  genBgColor,
+  genBgColorShort,
+  genBgColor50,
+  genBgColorHover,
+  genBgColorGhostHover,
+  genBgOverlay,
+  genBgAllColors,
+  genBgAllColorsAndOverlays,
+  genBorderColor,
+  genBorderColorShort,
+  genBorderColorHover,
+  genBorderAllColors,
+  genGap,
+  genRowGap,
+  genColGap,
+  clsx,
+  genAlignContent,
+  genAlignItems,
+  genJustifyContent,
+  genJustifyItems,
+  genMaxWidth,
+  genBorderRadius,
+  genObjectFit,
+  genButtonDisabled,
+  genBoxShadow,
+  genVAlign,
+  TEXT_BASE_CLASSES,
+  Text,
+  Table,
+  libOptionsMarkdown,
+  libMarkdownEditorOptions,
+  genRingColor,
+  genRingColorChildren,
+  detectLanguage,
+  disableScroll,
+  enableScroll,
+  scrollToTop,
+  Image
+};
+//# sourceMappingURL=chunk-TN4HZFI3.js.map