twenty-ui 1.0.0-alpha.1 → 2.41.0

package/dist/data-display-rTFC5PIU.js

@@ -1,423 +0,0 @@
-import { t as z } from "./handleClickableElementKeyDown-C8Uz61XJ.js";
-import { c as g, r as T, s as x } from "./theme-constants-D9oV4GU4.js";
-import { m as U, p as q, s as Q } from "./utilities-B_4WqR8H.js";
-import { _ as V } from "./theme-DELpGMxN.js";
-import { St as rr } from "./TablerIcons-fqK82OLw.js";
-import { t as W } from "./OverflowingTextWithTooltip-BHAWIWMc.js";
-import { Fragment as I, jsx as e, jsxs as S } from "react/jsx-runtime";
-import { clsx as k } from "clsx";
-import { useState as ar } from "react";
-import { isNonEmptyString as A, isNull as er, isUndefined as L } from "@sniptt/guards";
-import { Link as tr } from "react-router-dom";
-var or = "_animatedPath_wtd8u_1", nr = "_draw-checkmark_wtd8u_1", ir = {
-  animatedPath: or,
-  drawCheckmark: nr
-}, Ha = ({ isAnimating: r = !1, color: a, duration: t = 0.5, size: o = 28 }) => {
-  const n = T();
-  return /* @__PURE__ */ e("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 52 52",
-    width: o,
-    height: o,
-    children: /* @__PURE__ */ e("path", {
-      className: r ? ir.animatedPath : void 0,
-      fill: "none",
-      stroke: a ?? n.grayScale.gray1,
-      strokeWidth: 4,
-      d: "M14 27l7.8 7.8L38 14",
-      pathLength: "1",
-      strokeDasharray: "1",
-      strokeDashoffset: r ? 0 : 1,
-      style: { "--animated-checkmark-duration": `${t}s` }
-    })
-  });
-}, lr = "_root_2ofqu_1", sr = "_xl_2ofqu_24", dr = "_lg_2ofqu_30", cr = "_md_2ofqu_36", _r = "_sm_2ofqu_42", vr = "_xs_2ofqu_48", ur = "_image_2ofqu_54", mr = "_placeholderChar_2ofqu_60", D = {
-  root: lr,
-  xl: sr,
-  lg: dr,
-  md: cr,
-  sm: _r,
-  xs: vr,
-  image: ur,
-  placeholderChar: mr
-}, gr = ({ avatarUrl: r, className: a, size: t = "md", placeholder: o, placeholderColorSeed: n = o, Icon: l, iconColor: d, onClick: s, type: i = "squared", color: v, backgroundColor: c, borderColor: p }) => {
-  const u = T(), [y, h] = ar(null), m = A(r) ? r : null, C = o?.trim()?.charAt(0), b = !C || C === "", N = C?.toUpperCase() || "-", P = er(m) || y === m, F = () => {
-    A(m) && h(m);
-  }, G = b ? u.font.color.tertiary : v ?? q({
-    string: n ?? "",
-    variant: 12,
-    theme: u
-  }), X = b ? u.background.transparent.light : c ?? q({
-    string: n ?? "",
-    variant: i === "app" ? 5 : 4,
-    theme: u
-  }), Y = i === "app" ? p ?? (b ? void 0 : q({
-    string: n ?? "",
-    variant: 6,
-    theme: u
-  })) : void 0, Z = P, O = P ? Y : void 0, J = {
-    "--avatar-color": G,
-    "--avatar-background": l ? "inherit" : Z ? X : "none",
-    ...i === "app" && O ? { "--avatar-border": `1px solid ${O}` } : {}
-  };
-  return /* @__PURE__ */ e("div", {
-    className: k(D.root, D[t], a),
-    "data-type": i ?? void 0,
-    "data-clickable": L(s) ? void 0 : !0,
-    role: L(s) ? void 0 : "button",
-    tabIndex: L(s) ? void 0 : 0,
-    "aria-label": L(s) ? void 0 : A(o) ? o : "Avatar",
-    onClick: s,
-    onKeyDown: z,
-    style: J,
-    children: l ? /* @__PURE__ */ e(l, {
-      color: d || "currentColor",
-      size: u.icon.size.xl
-    }) : P ? /* @__PURE__ */ e("span", {
-      className: D.placeholderChar,
-      children: N
-    }) : /* @__PURE__ */ e("img", {
-      className: D.image,
-      src: m,
-      onError: F,
-      alt: ""
-    })
-  });
-}, Ka = {
-  xl: {
-    fontSize: "16px",
-    width: "40px"
-  },
-  lg: {
-    fontSize: "13px",
-    width: "24px"
-  },
-  md: {
-    fontSize: "12px",
-    width: "16px"
-  },
-  sm: {
-    fontSize: "10px",
-    width: "14px"
-  },
-  xs: {
-    fontSize: "8px",
-    width: "12px"
-  }
-}, hr = "_container_1sxq4_1", pr = "_itemContainer_1sxq4_6", j = {
-  container: hr,
-  itemContainer: pr
-}, fr = 4, Ua = ({ avatars: r }) => r.length ? /* @__PURE__ */ e("div", {
-  className: j.container,
-  children: r.slice(0, fr).map((a, t) => /* @__PURE__ */ e("div", {
-    className: j.itemContainer,
-    children: a
-  }, t))
-}) : null, xr = "_iconWithBackgroundContainer_1g0u9_1", kr = "_wrapper_1g0u9_11", M = {
-  iconWithBackgroundContainer: xr,
-  wrapper: kr
-}, Wa = ({ Icon: r, placeholderColorSeed: a, avatarType: t, avatarUrl: o, placeholder: n, isIconInverted: l = !1, IconColor: d, IconBackgroundColor: s, onClick: i }) => {
-  const v = T();
-  if (!x(r)) return /* @__PURE__ */ e(gr, {
-    avatarUrl: o,
-    placeholderColorSeed: a,
-    placeholder: n,
-    size: "sm",
-    type: t,
-    onClick: i
-  });
-  const c = x(i), p = A(n) ? n : "Avatar";
-  return l || x(s) ? /* @__PURE__ */ e("div", {
-    className: M.wrapper,
-    "data-clickable": c || void 0,
-    role: c ? "button" : void 0,
-    tabIndex: c ? 0 : void 0,
-    "aria-label": c ? p : void 0,
-    onClick: i,
-    onKeyDown: z,
-    children: /* @__PURE__ */ e("div", {
-      className: M.iconWithBackgroundContainer,
-      style: x(s) ? { "--avatar-or-icon-background": s } : void 0,
-      children: /* @__PURE__ */ e(r, {
-        color: v.font.color.inverted,
-        size: v.icon.size.sm,
-        stroke: v.icon.stroke.sm,
-        "aria-hidden": !0
-      })
-    })
-  }) : /* @__PURE__ */ e("div", {
-    className: M.wrapper,
-    "data-clickable": c || void 0,
-    role: c ? "button" : void 0,
-    tabIndex: c ? 0 : void 0,
-    "aria-label": c ? p : void 0,
-    onClick: i,
-    onKeyDown: z,
-    children: /* @__PURE__ */ e(r, {
-      size: v.icon.size.sm,
-      stroke: v.icon.stroke.sm,
-      color: d || "currentColor",
-      "aria-hidden": !0
-    })
-  });
-}, yr = "_root_17w7g_1", Cr = { root: yr }, Fa = ({ className: r }) => {
-  const a = T();
-  return /* @__PURE__ */ e("div", {
-    className: k(Cr.root, r),
-    children: /* @__PURE__ */ e(rr, {
-      color: a.grayScale.gray1,
-      size: 14
-    })
-  });
-}, br = "_chip_rlx2a_1", Sr = "_sizeLarge_rlx2a_24", Nr = "_sizeSmall_rlx2a_28", Tr = "_accentTextPrimary_rlx2a_32", wr = "_accentTextSecondary_rlx2a_36", Ar = "_disabled_rlx2a_40", Lr = "_fontMedium_rlx2a_44", Dr = "_cursorPointer_rlx2a_48", zr = "_cursorNotAllowed_rlx2a_52", Ir = "_backgroundHighlighted_rlx2a_56", Pr = "_backgroundStatic_rlx2a_66", qr = "_interactiveRegular_rlx2a_76", Mr = "_hasMaxWidth_rlx2a_83", Rr = "_paddingLeftNone_rlx2a_87", Br = "_emptyLabel_rlx2a_91", Er = "_rightComponentDivider_rlx2a_95", _ = {
-  chip: br,
-  sizeLarge: Sr,
-  sizeSmall: Nr,
-  accentTextPrimary: Tr,
-  accentTextSecondary: wr,
-  disabled: Ar,
-  fontMedium: Lr,
-  cursorPointer: Dr,
-  cursorNotAllowed: zr,
-  backgroundHighlighted: Ir,
-  backgroundStatic: Pr,
-  interactiveRegular: qr,
-  hasMaxWidth: Mr,
-  paddingLeftNone: Rr,
-  emptyLabel: Br,
-  rightComponentDivider: Er
-}, $r = /* @__PURE__ */ (function(r) {
-  return r.Large = "large", r.Small = "small", r;
-})({}), Or = /* @__PURE__ */ (function(r) {
-  return r.TextPrimary = "text-primary", r.TextSecondary = "text-secondary", r;
-})({}), jr = /* @__PURE__ */ (function(r) {
-  return r.Highlighted = "highlighted", r.Regular = "regular", r.Transparent = "transparent", r.Rounded = "rounded", r.Static = "static", r;
-})({}), Hr = (r, a) => {
-  if (!r) return null;
-  const t = typeof r == "function" ? r() : r;
-  return a === !0 ? /* @__PURE__ */ S(I, { children: [/* @__PURE__ */ e("div", { className: _.rightComponentDivider }), t] }) : t;
-}, Kr = ({ size: r = "small", label: a, tooltipLabel: t, alwaysShowTooltip: o = !1, isLabelHidden: n = !1, isBold: l = !1, disabled: d = !1, clickable: s = !0, variant: i = "regular", leftComponent: v = null, rightComponent: c = null, rightComponentDivider: p = !1, accent: u = "text-primary", className: y, maxWidth: h, forceEmptyText: m = !1, emptyLabel: C = "Untitled" }) => {
-  const b = i === "transparent" ? void 0 : s ? _.cursorPointer : d ? _.cursorNotAllowed : void 0, N = i === "highlighted" ? _.backgroundHighlighted : i === "static" ? _.backgroundStatic : i === "regular" && !d && s ? _.interactiveRegular : void 0;
-  return /* @__PURE__ */ S("div", {
-    "data-testid": "chip",
-    className: k(_.chip, r === "large" ? _.sizeLarge : _.sizeSmall, u === "text-primary" ? _.accentTextPrimary : _.accentTextSecondary, d && _.disabled, (l || u === "text-secondary") && _.fontMedium, b, N, h ? _.hasMaxWidth : void 0, i === "transparent" && _.paddingLeftNone, y),
-    style: h ? { "--chip-max-width": `${h}px` } : void 0,
-    children: [
-      v,
-      !n && x(a) && A(a) ? /* @__PURE__ */ e(W, {
-        size: r,
-        text: a,
-        tooltipContent: t,
-        alwaysShowTooltip: o
-      }) : !m && !n ? /* @__PURE__ */ e("div", {
-        className: _.emptyLabel,
-        children: C
-      }) : "",
-      Hr(c, p)
-    ]
-  });
-}, Ur = "link-chip-click-outside-id", Wr = "_root_higvt_1", Fr = "_circle_higvt_12", Gr = "_pipeline_higvt_17", R = {
-  root: Wr,
-  circle: Fr,
-  pipeline: Gr
-}, Xr = (r, a) => x(a) ? a : g.tag.background[r], Yr = (r) => g.tag.text[r], Ga = ({ colorName: r, color: a, variant: t, className: o }) => /* @__PURE__ */ e("div", {
-  className: k(R.root, t === "circle" && R.circle, t === "pipeline" && R.pipeline, o),
-  style: {
-    "--color-sample-color": Xr(r, a),
-    "--color-sample-border-color": Yr(r)
-  }
-}), Zr = "_container_stu26_1", Jr = "_commandContain_stu26_12", Qr = "_buttonContainer_stu26_16", Vr = "_lineStartSpan_stu26_20", ra = "_lineSpan_stu26_24", w = {
-  container: Zr,
-  commandContain: Jr,
-  buttonContainer: Qr,
-  lineStartSpan: Vr,
-  lineSpan: ra
-}, Xa = ({ commands: r, button: a }) => /* @__PURE__ */ S("div", {
-  className: w.container,
-  children: [/* @__PURE__ */ e("div", {
-    className: w.commandContain,
-    children: /* @__PURE__ */ e(I, { children: r.map((t, o) => /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ e("span", {
-      className: w.lineStartSpan,
-      children: "> "
-    }), /* @__PURE__ */ e("span", {
-      className: w.lineSpan,
-      children: t
-    })] }, o)) })
-  }), a && /* @__PURE__ */ e("div", {
-    className: w.buttonContainer,
-    children: a
-  })]
-}), aa = "_linkContainer_4rvdq_1", ea = { linkContainer: aa }, Ya = ({ to: r, size: a = $r.Small, label: t, isLabelHidden: o = !1, isBold: n = !1, variant: l = jr.Regular, leftComponent: d = null, rightComponent: s = null, rightComponentDivider: i = !1, accent: v = Or.TextPrimary, className: c, maxWidth: p, onClick: u, triggerEvent: y, target: h, emptyLabel: m }) => {
-  const { onClick: C, onMouseDown: b } = Q({
-    to: r,
-    onClick: u,
-    triggerEvent: y
-  });
-  return /* @__PURE__ */ e("span", {
-    className: ea.linkContainer,
-    children: /* @__PURE__ */ e(tr, {
-      to: r,
-      onClick: (N) => {
-        N.stopPropagation(), C(N);
-      },
-      onMouseDown: b,
-      "data-click-outside-id": Ur,
-      target: h,
-      rel: h === "_blank" ? "noopener noreferrer" : void 0,
-      children: /* @__PURE__ */ e(Kr, {
-        size: a,
-        label: t,
-        isLabelHidden: o,
-        isBold: n,
-        clickable: !0,
-        variant: l,
-        leftComponent: d,
-        rightComponent: s,
-        rightComponentDivider: i,
-        accent: v,
-        className: c,
-        maxWidth: p,
-        emptyLabel: m
-      })
-    })
-  });
-}, ta = "_notificationCounter_106qk_1", oa = "_primary_106qk_12", na = "_secondary_106qk_17", H = {
-  notificationCounter: ta,
-  primary: oa,
-  secondary: na
-}, Za = ({ count: r, variant: a = "primary", className: t }) => /* @__PURE__ */ e("div", {
-  className: k(H.notificationCounter, H[a], t),
-  children: r
-}), ia = "_pill_xhshy_1", la = { pill: ia }, Ja = ({ className: r, label: a, Icon: t }) => /* @__PURE__ */ S("span", {
-  className: k(la.pill, r),
-  children: [t && /* @__PURE__ */ e(t, { size: 12 }), a]
-}), sa = "_container_1yumo_1", da = "_dot_1yumo_14", ca = "_loaderDot_1yumo_1", K = {
-  container: sa,
-  dot: da,
-  loaderDot: ca
-}, _a = ({ color: r }) => /* @__PURE__ */ e("div", {
-  className: K.container,
-  style: r ? { "--loader-color": g.tag.text[r] } : void 0,
-  children: /* @__PURE__ */ e("div", { className: K.dot })
-}), va = "_status_1vrpq_1", ua = "_regular_1vrpq_28", ma = "_medium_1vrpq_32", ga = "_content_1vrpq_36", B = {
-  status: va,
-  regular: ua,
-  medium: ma,
-  content: ga
-}, Qa = ({ className: r, color: a, isLoaderVisible: t = !1, text: o, onClick: n, weight: l = "regular" }) => {
-  const d = U(a);
-  return /* @__PURE__ */ S("h3", {
-    className: k(B.status, B[l], r),
-    onClick: n,
-    tabIndex: x(n) ? 0 : void 0,
-    onKeyDown: z,
-    "data-loader-visible": t || void 0,
-    style: {
-      "--status-background": g.tag.background[d],
-      "--status-text-color": g.tag.text[d]
-    },
-    children: [/* @__PURE__ */ e("span", {
-      className: B.content,
-      children: o
-    }), t ? /* @__PURE__ */ e(_a, { color: a }) : null]
-  });
-}, ha = "_root_1l4ur_1", pa = { root: ha }, fa = ({ $backgroundColor: r, $borderColor: a, $dimension: t, className: o, style: n, ...l }) => /* @__PURE__ */ e("div", {
-  ...l,
-  className: k(pa.root, o),
-  style: {
-    "--tinted-icon-tile-background-color": r,
-    "--tinted-icon-tile-border": a ? `1px solid ${a}` : void 0,
-    "--tinted-icon-tile-dimension": t,
-    ...n
-  }
-}), xa = "_tag_5jgty_1", ka = "_interactive_5jgty_20", ya = "_weightMedium_5jgty_27", Ca = "_variantOutline_5jgty_31", ba = "_variantBorder_5jgty_35", Sa = "_preventShrink_5jgty_39", Na = "_preventPadding_5jgty_43", Ta = "_content_5jgty_47", wa = "_nonShrinkableText_5jgty_53", Aa = "_iconContainer_5jgty_58", f = {
-  tag: xa,
-  interactive: ka,
-  weightMedium: ya,
-  variantOutline: Ca,
-  variantBorder: ba,
-  preventShrink: Sa,
-  preventPadding: Na,
-  content: Ta,
-  nonShrinkableText: wa,
-  iconContainer: Aa
-}, Va = ({ className: r, color: a, text: t, Icon: o, onClick: n, weight: l = "regular", variant: d = "solid", preventShrink: s, preventPadding: i }) => {
-  const v = T(), c = a === "transparent" ? "transparent" : g.tag.background[a] ?? g.tag.background.gray, p = a === "transparent" ? g.font.color.secondary : g.tag.text[a] ?? g.font.color.secondary, u = x(n), y = /* @__PURE__ */ S(I, { children: [x(o) ? /* @__PURE__ */ e("div", {
-    className: f.iconContainer,
-    children: /* @__PURE__ */ e(o, {
-      size: v.icon.size.sm,
-      stroke: v.icon.stroke.sm,
-      "aria-hidden": !0
-    })
-  }) : /* @__PURE__ */ e(I, {}), s ? /* @__PURE__ */ e("span", {
-    className: f.nonShrinkableText,
-    children: t
-  }) : /* @__PURE__ */ e("span", {
-    className: f.content,
-    children: /* @__PURE__ */ e(W, { text: t })
-  })] }), h = {
-    "--tag-background": c,
-    "--tag-text": p
-  }, m = k(f.tag, l === "medium" && f.weightMedium, d === "outline" && f.variantOutline, d === "border" && f.variantBorder, s && f.preventShrink, i && f.preventPadding, r);
-  return u ? /* @__PURE__ */ e("button", {
-    type: "button",
-    className: k(m, f.interactive),
-    onClick: n,
-    style: h,
-    children: y
-  }) : /* @__PURE__ */ e("span", {
-    className: m,
-    style: h,
-    children: y
-  });
-}, E = {
-  background: 5,
-  border: 6,
-  icon: 11
-}, $ = (r, a) => {
-  const t = g.color, o = g.tag.text;
-  return t[`${r}${a}`] ?? o[r];
-}, La = (r) => {
-  const a = U(r);
-  return {
-    backgroundColor: $(a, E.background),
-    iconColor: $(a, E.icon),
-    borderColor: $(a, E.border)
-  };
-}, re = ({ Icon: r, color: a = V, size: t, stroke: o }) => {
-  const n = T(), l = La(a), d = t ?? n.icon.size.md, s = o ?? n.icon.stroke.md, i = x(t) ? `${t}px` : void 0;
-  return /* @__PURE__ */ e(fa, {
-    $backgroundColor: l.backgroundColor,
-    $borderColor: l.borderColor,
-    $dimension: i,
-    children: /* @__PURE__ */ e(r, {
-      size: d,
-      stroke: s,
-      color: l.iconColor
-    })
-  });
-};
-export {
-  Ha as S,
-  Fa as _,
-  Qa as a,
-  Ka as b,
-  Za as c,
-  Ga as d,
-  Ur as f,
-  jr as g,
-  $r as h,
-  fa as i,
-  Ya as l,
-  Or as m,
-  La as n,
-  _a as o,
-  Kr as p,
-  Va as r,
-  Ja as s,
-  re as t,
-  Xa as u,
-  Wa as v,
-  gr as x,
-  Ua as y
-};

package/dist/data-display.cjs

@@ -1 +0,0 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./data-display-DVa0Z3Kp.cjs");exports.AVATAR_PROPERTIES_BY_SIZE=e.AVATAR_PROPERTIES_BY_SIZE;exports.AnimatedCheckmark=e.AnimatedCheckmark;exports.Avatar=e.Avatar;exports.AvatarGroup=e.AvatarGroup;exports.AvatarOrIcon=e.AvatarOrIcon;exports.Checkmark=e.Checkmark;exports.Chip=e.Chip;exports.ChipAccent=e.ChipAccent;exports.ChipSize=e.ChipSize;exports.ChipVariant=e.ChipVariant;exports.ColorSample=e.ColorSample;exports.CommandBlock=e.CommandBlock;exports.LINK_CHIP_CLICK_OUTSIDE_ID=e.LINK_CHIP_CLICK_OUTSIDE_ID;exports.LinkChip=e.LinkChip;exports.NotificationCounter=e.NotificationCounter;exports.Pill=e.Pill;exports.Status=e.Status;exports.StyledTintedIconTileContainer=e.StyledTintedIconTileContainer;exports.Tag=e.Tag;exports.TintedIconTile=e.TintedIconTile;exports.getIconTileColorShades=e.getIconTileColorShades;

package/dist/data-display.mjs

@@ -1,24 +0,0 @@
-import { S as s, _ as i, a as t, b as o, c as e, d as n, f as r, g as C, h as c, i as l, l as I, m as p, n as h, p as m, r as S, s as T, t as A, u as _, v as d, x as k, y as u } from "./data-display-rTFC5PIU.js";
-export {
-  o as AVATAR_PROPERTIES_BY_SIZE,
-  s as AnimatedCheckmark,
-  k as Avatar,
-  u as AvatarGroup,
-  d as AvatarOrIcon,
-  i as Checkmark,
-  m as Chip,
-  p as ChipAccent,
-  c as ChipSize,
-  C as ChipVariant,
-  n as ColorSample,
-  _ as CommandBlock,
-  r as LINK_CHIP_CLICK_OUTSIDE_ID,
-  I as LinkChip,
-  e as NotificationCounter,
-  T as Pill,
-  t as Status,
-  l as StyledTintedIconTileContainer,
-  S as Tag,
-  A as TintedIconTile,
-  h as getIconTileColorShades
-};

package/dist/feedback/AnimatedPlaceholder/AnimatedPlaceholder.d.ts

@@ -1,8 +0,0 @@
-import { BACKGROUND } from './constants/Background';
-import { MOVING_IMAGE } from './constants/MovingImage';
-export type AnimatedPlaceholderType = keyof typeof BACKGROUND | keyof typeof MOVING_IMAGE;
-type AnimatedPlaceholderProps = {
-    type: AnimatedPlaceholderType;
-};
-export declare const AnimatedPlaceholder: ({ type }: AnimatedPlaceholderProps) => import("react").JSX.Element;
-export {};

package/dist/feedback/AnimatedPlaceholder/constants/Background.d.ts

@@ -1 +0,0 @@
-export declare const BACKGROUND: Record<string, string>;

package/dist/feedback/AnimatedPlaceholder/constants/DarkBackground.d.ts

@@ -1 +0,0 @@
-export declare const DARK_BACKGROUND: Record<string, string>;

package/dist/feedback/AnimatedPlaceholder/constants/DarkMovingImage.d.ts

@@ -1 +0,0 @@
-export declare const DARK_MOVING_IMAGE: Record<string, string>;

package/dist/feedback/AnimatedPlaceholder/constants/MovingImage.d.ts

@@ -1 +0,0 @@
-export declare const MOVING_IMAGE: Record<string, string>;

package/dist/feedback/InlineBanner/InlineBanner.d.ts

@@ -1,15 +0,0 @@
-import { IconComponent } from '../../icon/types/IconComponent';
-import { BannerColor } from '../Banner/Banner';
-type InlineBannerProps = {
-    color?: BannerColor;
-    message: string;
-    button?: {
-        title?: string;
-        onClick?: () => void;
-        hidden?: boolean;
-    };
-    LeftIcon?: IconComponent;
-    className?: string;
-};
-export declare const InlineBanner: ({ color, message, button, LeftIcon, className, }: InlineBannerProps) => import("react").JSX.Element;
-export {};