@livechat/design-system-react-components 1.17.1-alpha.3 → 1.17.1-alpha.4

package/dist/components/ActionMenu/index.es.js

@@ -0,0 +1,199 @@
+var _e = Object.defineProperty, ie = Object.defineProperties;
+var ae = Object.getOwnPropertyDescriptors;
+var M = Object.getOwnPropertySymbols;
+var K = Object.prototype.hasOwnProperty, L = Object.prototype.propertyIsEnumerable;
+var H = (t, _, n) => _ in t ? _e(t, _, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[_] = n, g = (t, _) => {
+  for (var n in _ || (_ = {}))
+    K.call(_, n) && H(t, n, _[n]);
+  if (M)
+    for (var n of M(_))
+      L.call(_, n) && H(t, n, _[n]);
+  return t;
+}, N = (t, _) => ie(t, ae(_));
+var S = (t, _) => {
+  var n = {};
+  for (var a in t)
+    K.call(t, a) && _.indexOf(a) < 0 && (n[a] = t[a]);
+  if (t != null && M)
+    for (var a of M(t))
+      _.indexOf(a) < 0 && L.call(t, a) && (n[a] = t[a]);
+  return n;
+};
+import * as i from "react";
+import { useFloating as ce, offset as le, flip as me, autoUpdate as re, useClick as ue, useDismiss as oe, useRole as se, useInteractions as de, useTransitionStyles as ge } from "@floating-ui/react";
+import { Check as fe } from "@livechat/design-system-icons";
+import x from "clsx";
+import { K as U } from "../../chunks/keyCodes-30323e90.js";
+import { Icon as ye } from "../Icon/index.es.js";
+import "../../chunks/Typography.module-93efb34d.js";
+import { T as be } from "../../chunks/Text-b31d1e9a.js";
+const m = {
+  "action-menu": "lc-ActionMenu-module__action-menu___K2UwW",
+  "action-menu__trigger-button": "lc-ActionMenu-module__action-menu__trigger-button___tBrz5",
+  "action-menu__list": "lc-ActionMenu-module__action-menu__list___9pNUX",
+  "action-menu__list__group-header": "lc-ActionMenu-module__action-menu__list__group-header___n-DTq",
+  "action-menu__list__item": "lc-ActionMenu-module__action-menu__list__item___n-OgH",
+  "action-menu__list__item--with-divider": "lc-ActionMenu-module__action-menu__list__item--with-divider___2H3Vm",
+  "action-menu__list__item--disabled": "lc-ActionMenu-module__action-menu__list__item--disabled___MgaX8",
+  "action-menu__list__item--selected": "lc-ActionMenu-module__action-menu__list__item--selected___eevlJ",
+  "action-menu__list__item__icon": "lc-ActionMenu-module__action-menu__list__item__icon___o3ePo"
+}, r = "action-menu", Ne = (he) => {
+  var R = he, {
+    className: t,
+    triggerClassName: _,
+    options: n,
+    triggerRenderer: a,
+    placement: F = "bottom-end",
+    openedOnInit: J = !1,
+    keepOpenOnClick: P,
+    flipOptions: q,
+    visible: D,
+    onClose: o,
+    onOpen: v,
+    floatingStrategy: X,
+    selectedOptions: s
+  } = R, Y = S(R, [
+    "className",
+    "triggerClassName",
+    "options",
+    "triggerRenderer",
+    "placement",
+    "openedOnInit",
+    "keepOpenOnClick",
+    "flipOptions",
+    "visible",
+    "onClose",
+    "onOpen",
+    "floatingStrategy",
+    "selectedOptions"
+  ]);
+  const w = D !== void 0, [z, k] = i.useState(J), u = i.useRef(-1), T = i.useRef(null), d = w ? D : z, B = () => {
+    d ? (o == null || o(), !w && k(!1)) : (v == null || v(), !w && k(!0));
+  }, { x: A, y: $, strategy: W, refs: V, context: E } = ce({
+    middleware: [le(4), me(q)],
+    placement: F,
+    open: d,
+    strategy: X,
+    onOpenChange: B,
+    whileElementsMounted: re
+  }), j = ue(E), G = oe(E, {
+    enabled: d
+  }), Q = se(E), { getReferenceProps: Z, getFloatingProps: C } = de([
+    j,
+    G,
+    Q
+  ]), { styles: O } = ge(E, {
+    initial: ({ side: e }) => g({
+      opacity: 0
+    }, e === "bottom" && {
+      marginTop: -10
+    } || e === "top" && {
+      marginTop: 10
+    } || e === "left" && {
+      marginLeft: 10
+    } || e === "right" && {
+      marginLeft: -10
+    })
+  }), ee = (e) => {
+    var f, y;
+    const c = u.current;
+    let l = c + e;
+    for (; (f = n[l]) != null && f.disabled || (y = n[l]) != null && y.groupHeader; )
+      if (l += e, l === -1) {
+        l = c;
+        break;
+      }
+    return l;
+  }, p = (e) => {
+    var f, y;
+    u.current = ee(e);
+    const c = (f = T.current) == null ? void 0 : f.children, l = c && ((y = c[u.current]) == null ? void 0 : y.children[0]);
+    return l == null ? void 0 : l.focus();
+  }, I = (e) => {
+    e.key === U.arrowUp && u.current > 0 && (e.preventDefault(), p(-1)), e.key === U.arrowDown && u.current + 1 < n.length && (e.preventDefault(), p(1));
+  };
+  i.useEffect(() => {
+    if (d)
+      return document.addEventListener("keydown", I), () => document.removeEventListener("keydown", I);
+    u.current = -1;
+  }, [d, I]);
+  const te = (e, c) => {
+    u.current = e, c == null || c(), !w && !P && (k(!1), o == null || o());
+  }, ne = (e, c) => e.groupHeader ? /* @__PURE__ */ i.createElement(
+    "li",
+    {
+      key: e.key,
+      role: "none",
+      className: m[`${r}__list__group-header`]
+    },
+    e.element
+  ) : /* @__PURE__ */ i.createElement("li", { key: e.key, role: "none" }, /* @__PURE__ */ i.createElement(
+    "button",
+    {
+      "data-testid": e.key,
+      tabIndex: -1,
+      key: e.key,
+      disabled: e.disabled,
+      onClick: () => te(c, e.onClick),
+      role: "menuitem",
+      className: x(m[`${r}__list__item`], {
+        [m[`${r}__list__item--disabled`]]: e.disabled,
+        [m[`${r}__list__item--with-divider`]]: e.withDivider,
+        [m[`${r}__list__item--selected`]]: s == null ? void 0 : s.includes(e.key)
+      })
+    },
+    e.element,
+    (s == null ? void 0 : s.includes(e.key)) && /* @__PURE__ */ i.createElement("div", { className: m[`${r}__list__item__icon`] }, /* @__PURE__ */ i.createElement(ye, { source: fe, kind: "action-primary" }))
+  ));
+  return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
+    "div",
+    N(g({
+      "aria-label": "Toggle menu",
+      "data-testid": "action-menu-trigger-button",
+      ref: V.setReference
+    }, Z()), {
+      className: _
+    }),
+    a
+  ), d && /* @__PURE__ */ i.createElement(
+    "div",
+    g({
+      ref: V.setFloating,
+      className: m[r],
+      style: g({
+        position: W,
+        top: $ != null ? $ : "",
+        left: A != null ? A : ""
+      }, O)
+    }, C()),
+    /* @__PURE__ */ i.createElement(
+      "ul",
+      N(g({}, Y), {
+        className: x(m[`${r}__list`], t),
+        role: "menu",
+        ref: T
+      }),
+      n.map(ne)
+    )
+  ));
+}, b = {
+  "action-menu-item": "lc-ActionMenuItem-module__action-menu-item___cT70J",
+  "action-menu-item__left-node": "lc-ActionMenuItem-module__action-menu-item__left-node___3R-o1",
+  "action-menu-item__right-node": "lc-ActionMenuItem-module__action-menu-item__right-node___uq0Ym",
+  "action-menu-item__label": "lc-ActionMenuItem-module__action-menu-item__label___OgJ80",
+  "action-menu-item--warning": "lc-ActionMenuItem-module__action-menu-item--warning___DgeYg"
+}, h = "action-menu-item", xe = ({ leftNode: t, rightNode: _, children: n, kind: a }) => /* @__PURE__ */ i.createElement(
+  "div",
+  {
+    className: x(b[h], {
+      [b[`${h}--warning`]]: a === "warning"
+    })
+  },
+  t && /* @__PURE__ */ i.createElement("div", { className: b[`${h}__left-node`] }, t),
+  /* @__PURE__ */ i.createElement(be, { as: "div", className: b[`${h}__label`] }, n),
+  _ && /* @__PURE__ */ i.createElement("div", { className: b[`${h}__right-node`] }, _)
+);
+export {
+  Ne as ActionMenu,
+  xe as ActionMenuItem
+};

package/dist/components/Alert/index.cjs.js

@@ -0,0 +1 @@
+"use strict";var h=Object.defineProperty,z=Object.defineProperties;var I=Object.getOwnPropertyDescriptors;var s=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var A=(e,_,t)=>_ in e?h(e,_,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[_]=t,m=(e,_)=>{for(var t in _||(_={}))b.call(_,t)&&A(e,t,_[t]);if(s)for(var t of s(_))E.call(_,t)&&A(e,t,_[t]);return e},C=(e,_)=>z(e,I(_));var $=(e,_)=>{var t={};for(var r in e)b.call(e,r)&&_.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&s)for(var r of s(e))_.indexOf(r)<0&&E.call(e,r)&&(t[r]=e[r]);return t};Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("react"),o=require("@livechat/design-system-icons"),S=require("clsx"),T=require("lodash.debounce"),d=require("../Button/index.cjs.js"),v=require("../Icon/index.cjs.js");require("../../chunks/Typography.module-2558416b.js");const D=require("../../chunks/Text-df483689.js");require("../Loader/index.cjs.js");function O(e){const _=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(_,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return _.default=e,Object.freeze(_)}const n=O(q),P="lc-Alert-module__alert___HBTns",R="lc-Alert-module__alert__icon___8TaAH",j="lc-Alert-module__alert__content___9nZdf",y="lc-Alert-module__alert__content__wrapper___aLBkP",M="lc-Alert-module__alert__content__wrapper__text___HDMbR",W="lc-Alert-module__alert__content__wrapper__cta___9L-oE",H="lc-Alert-module__alert__content__wrapper__cta__link___D9Igz",l={alert:P,alert__icon:R,alert__content:j,alert__content__wrapper:y,alert__content__wrapper__text:M,alert__content__wrapper__cta:W,alert__content__wrapper__cta__link:H,"alert__close-icon":"lc-Alert-module__alert__close-icon___rYxVy","alert--small":"lc-Alert-module__alert--small___Fyk-v","alert--medium":"lc-Alert-module__alert--medium___ItZWT","alert--large":"lc-Alert-module__alert--large___IH9yM","alert--info":"lc-Alert-module__alert--info___GmIGN","alert--warning":"lc-Alert-module__alert--warning___MubhD","alert--success":"lc-Alert-module__alert--success___fPtlZ","alert--error":"lc-Alert-module__alert--error___DKPo0"},L={info:{source:o.Info,kind:"link"},warning:{source:o.Warning,kind:"warning"},success:{source:o.CheckCircle,kind:"success"},error:{source:o.Block,kind:"error"}},c="alert",Z=G=>{var w=G,{children:e,className:_,primaryButton:t,secondaryButton:r,kind:p="info",onClose:f}=w,x=$(w,["children","className","primaryButton","secondaryButton","kind","onClose"]);const a=n.useRef(null),[i,u]=n.useState(null),N=S(l[c],l[`${c}--${p}`],i==="large"&&l[`${c}--large`],i==="medium"&&l[`${c}--medium`],i==="small"&&l[`${c}--small`],_);return n.useEffect(()=>{const g=()=>a.current&&a.current.offsetWidth<=400?u("small"):a.current&&a.current.offsetWidth>400&&a.current.offsetWidth<=800?u("medium"):u("large"),k=T(()=>{g()},500);return window.addEventListener("resize",k),g(),()=>window.removeEventListener("resize",k)}),n.createElement("div",m({ref:a,className:N},x),n.createElement("div",{className:l[`${c}__content`]},n.createElement("div",{className:l[`${c}__content__wrapper`]},n.createElement(v.Icon,C(m({},L[p]),{size:"large",className:l[`${c}__icon`]})),n.createElement(D.Text,{as:"div",className:l[`${c}__content__wrapper__text`]},e)),(t||r)&&n.createElement("div",{className:l[`${c}__content__wrapper__cta`]},t&&n.createElement(d.Button,{kind:"high-contrast",onClick:t.handleClick},t.label),r&&n.createElement(d.Button,{className:l[`${c}__content__wrapper__cta__link`],kind:"text",onClick:r.handleClick},r.label))),f&&n.createElement(d.Button,{"aria-label":"Close alert",type:"button",className:l[`${c}__close-icon`],size:"compact",kind:"plain",icon:n.createElement(v.Icon,{source:o.Close}),onClick:f}))};exports.Alert=Z;

package/dist/components/Alert/index.es.js

@@ -0,0 +1,129 @@
+var x = Object.defineProperty, z = Object.defineProperties;
+var b = Object.getOwnPropertyDescriptors;
+var o = Object.getOwnPropertySymbols;
+var g = Object.prototype.hasOwnProperty, E = Object.prototype.propertyIsEnumerable;
+var A = (e, t, _) => t in e ? x(e, t, { enumerable: !0, configurable: !0, writable: !0, value: _ }) : e[t] = _, m = (e, t) => {
+  for (var _ in t || (t = {}))
+    g.call(t, _) && A(e, _, t[_]);
+  if (o)
+    for (var _ of o(t))
+      E.call(t, _) && A(e, _, t[_]);
+  return e;
+}, C = (e, t) => z(e, b(t));
+var $ = (e, t) => {
+  var _ = {};
+  for (var r in e)
+    g.call(e, r) && t.indexOf(r) < 0 && (_[r] = e[r]);
+  if (e != null && o)
+    for (var r of o(e))
+      t.indexOf(r) < 0 && E.call(e, r) && (_[r] = e[r]);
+  return _;
+};
+import * as l from "react";
+import { Close as I, Info as R, Warning as T, CheckCircle as W, Block as D } from "@livechat/design-system-icons";
+import H from "clsx";
+import L from "lodash.debounce";
+import { Button as p } from "../Button/index.es.js";
+import { Icon as h } from "../Icon/index.es.js";
+import "../../chunks/Typography.module-93efb34d.js";
+import { T as M } from "../../chunks/Text-b31d1e9a.js";
+import "../Loader/index.es.js";
+const P = "lc-Alert-module__alert___HBTns", S = "lc-Alert-module__alert__icon___8TaAH", Z = "lc-Alert-module__alert__content___9nZdf", G = "lc-Alert-module__alert__content__wrapper___aLBkP", F = "lc-Alert-module__alert__content__wrapper__text___HDMbR", K = "lc-Alert-module__alert__content__wrapper__cta___9L-oE", V = "lc-Alert-module__alert__content__wrapper__cta__link___D9Igz", n = {
+  alert: P,
+  alert__icon: S,
+  alert__content: Z,
+  alert__content__wrapper: G,
+  alert__content__wrapper__text: F,
+  alert__content__wrapper__cta: K,
+  alert__content__wrapper__cta__link: V,
+  "alert__close-icon": "lc-Alert-module__alert__close-icon___rYxVy",
+  "alert--small": "lc-Alert-module__alert--small___Fyk-v",
+  "alert--medium": "lc-Alert-module__alert--medium___ItZWT",
+  "alert--large": "lc-Alert-module__alert--large___IH9yM",
+  "alert--info": "lc-Alert-module__alert--info___GmIGN",
+  "alert--warning": "lc-Alert-module__alert--warning___MubhD",
+  "alert--success": "lc-Alert-module__alert--success___fPtlZ",
+  "alert--error": "lc-Alert-module__alert--error___DKPo0"
+}, Y = {
+  info: {
+    source: R,
+    kind: "link"
+  },
+  warning: {
+    source: T,
+    kind: "warning"
+  },
+  success: {
+    source: W,
+    kind: "success"
+  },
+  error: {
+    source: D,
+    kind: "error"
+  }
+}, a = "alert", _e = (j) => {
+  var f = j, {
+    children: e,
+    className: t,
+    primaryButton: _,
+    secondaryButton: r,
+    kind: u = "info",
+    onClose: d
+  } = f, N = $(f, [
+    "children",
+    "className",
+    "primaryButton",
+    "secondaryButton",
+    "kind",
+    "onClose"
+  ]);
+  const c = l.useRef(null), [s, i] = l.useState(null), v = H(
+    n[a],
+    n[`${a}--${u}`],
+    s === "large" && n[`${a}--large`],
+    s === "medium" && n[`${a}--medium`],
+    s === "small" && n[`${a}--small`],
+    t
+  );
+  return l.useEffect(() => {
+    const w = () => c.current && c.current.offsetWidth <= 400 ? i("small") : c.current && c.current.offsetWidth > 400 && c.current.offsetWidth <= 800 ? i("medium") : i("large"), k = L(() => {
+      w();
+    }, 500);
+    return window.addEventListener("resize", k), w(), () => window.removeEventListener("resize", k);
+  }), /* @__PURE__ */ l.createElement("div", m({ ref: c, className: v }, N), /* @__PURE__ */ l.createElement("div", { className: n[`${a}__content`] }, /* @__PURE__ */ l.createElement("div", { className: n[`${a}__content__wrapper`] }, /* @__PURE__ */ l.createElement(
+    h,
+    C(m({}, Y[u]), {
+      size: "large",
+      className: n[`${a}__icon`]
+    })
+  ), /* @__PURE__ */ l.createElement(
+    M,
+    {
+      as: "div",
+      className: n[`${a}__content__wrapper__text`]
+    },
+    e
+  )), (_ || r) && /* @__PURE__ */ l.createElement("div", { className: n[`${a}__content__wrapper__cta`] }, _ && /* @__PURE__ */ l.createElement(p, { kind: "high-contrast", onClick: _.handleClick }, _.label), r && /* @__PURE__ */ l.createElement(
+    p,
+    {
+      className: n[`${a}__content__wrapper__cta__link`],
+      kind: "text",
+      onClick: r.handleClick
+    },
+    r.label
+  ))), d && /* @__PURE__ */ l.createElement(
+    p,
+    {
+      "aria-label": "Close alert",
+      type: "button",
+      className: n[`${a}__close-icon`],
+      size: "compact",
+      kind: "plain",
+      icon: /* @__PURE__ */ l.createElement(h, { source: I }),
+      onClick: d
+    }
+  ));
+};
+export {
+  _e as Alert
+};

package/dist/components/Avatar/index.cjs.js

@@ -0,0 +1 @@
+"use strict";var Q=Object.defineProperty;var c=Object.getOwnPropertySymbols;var S=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable;var E=(a,_,t)=>_ in a?Q(a,_,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[_]=t,A=(a,_)=>{for(var t in _||(_={}))S.call(_,t)&&E(a,t,_[t]);if(c)for(var t of c(_))h.call(_,t)&&E(a,t,_[t]);return a};var F=(a,_)=>{var t={};for(var r in a)S.call(a,r)&&_.indexOf(r)<0&&(t[r]=a[r]);if(a!=null&&c)for(var r of c(a))_.indexOf(r)<0&&h.call(a,r)&&(t[r]=a[r]);return t};Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react"),T=require("@livechat/design-system-icons"),u=require("clsx"),V=require("../Icon/index.cjs.js"),G=require("../../chunks/Heading-617540b6.js");require("../../chunks/Typography.module-2558416b.js");const K=require("polished");function W(a){const _=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const t in a)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(a,t);Object.defineProperty(_,t,r.get?r:{enumerable:!0,get:()=>a[t]})}}return _.default=a,Object.freeze(_)}const m=W(R),I=Array.from({length:10},(a,_)=>`--surface-avatar-${_+1}`);function q(a){if(!a)return;const _=a.split("").reduce((t,r)=>t+r.charCodeAt(0),0);return`var(${I[_%I.length]})`}function X(a="",_=2){const t=a.trim().split(/\s+/),r=t.map(o=>[...o][0]);if(_<1)return"";if(t.length<=_)return r.join("").toUpperCase();const s=[r[0]];for(let o=t.length-_+1;o<t.length;o++)s.push(r[o]);return s.join("").toUpperCase()}function J(a){let _=a;if(a.startsWith("var(--")&&a.endsWith(")")){const t=a.slice(4,-1);_=window.getComputedStyle(document.documentElement).getPropertyValue(t).trim()}return _&&K.getContrast(_,"#FFFFFF")>3?"var(--color-white)":"var(--color-black)"}const Y="lc-Avatar-module__avatar___1zTCE",Z="lc-Avatar-module__avatar__status___nX2Ls",z="lc-Avatar-module__avatar__rim___RCQ8Q",aa="lc-Avatar-module__avatar__image___YqfqE",e={avatar:Y,avatar__status:Z,"avatar__status--available":"lc-Avatar-module__avatar__status--available___tcpFg","avatar__status--unavailable":"lc-Avatar-module__avatar__status--unavailable___ciauF","avatar__status--unknown":"lc-Avatar-module__avatar__status--unknown___MBaGB","avatar__status--xxxsmall":"lc-Avatar-module__avatar__status--xxxsmall___8pkEO","avatar__status--circle":"lc-Avatar-module__avatar__status--circle___doV5H","avatar__status--xxsmall":"lc-Avatar-module__avatar__status--xxsmall___M69lx","avatar__status--xsmall":"lc-Avatar-module__avatar__status--xsmall___RKQiI","avatar__status--small":"lc-Avatar-module__avatar__status--small___cVrA7","avatar__status--medium":"lc-Avatar-module__avatar__status--medium___n5z1H","avatar__status--large":"lc-Avatar-module__avatar__status--large___Lt-0p","avatar__status--xlarge":"lc-Avatar-module__avatar__status--xlarge___RWIcJ","avatar__status--xxlarge":"lc-Avatar-module__avatar__status--xxlarge___crG9D","avatar__status--xxxlarge":"lc-Avatar-module__avatar__status--xxxlarge___Iv61X","avatar__status--rounded-square":"lc-Avatar-module__avatar__status--rounded-square___-My1P",avatar__rim:z,"avatar__rim--xxxsmall":"lc-Avatar-module__avatar__rim--xxxsmall___0CH9D","avatar__rim--xxsmall":"lc-Avatar-module__avatar__rim--xxsmall___Mde0K","avatar__rim--xsmall":"lc-Avatar-module__avatar__rim--xsmall___LAN-b","avatar__rim--small":"lc-Avatar-module__avatar__rim--small___FT8LX","avatar__rim--medium":"lc-Avatar-module__avatar__rim--medium___Dy0pr","avatar__rim--large":"lc-Avatar-module__avatar__rim--large___FPvGp","avatar__rim--xlarge":"lc-Avatar-module__avatar__rim--xlarge___CY0kN","avatar__rim--xxlarge":"lc-Avatar-module__avatar__rim--xxlarge___tE053","avatar__rim--xxxlarge":"lc-Avatar-module__avatar__rim--xxxlarge___amlGP",avatar__image:aa,"avatar__icon--xxxsmall":"lc-Avatar-module__avatar__icon--xxxsmall___KaoMa","avatar__icon--xxsmall":"lc-Avatar-module__avatar__icon--xxsmall___NJJNV","avatar__icon--xsmall":"lc-Avatar-module__avatar__icon--xsmall___yHEZK","avatar__icon--small":"lc-Avatar-module__avatar__icon--small___l6lBu","avatar__icon--medium":"lc-Avatar-module__avatar__icon--medium___LF4w2","avatar__icon--large":"lc-Avatar-module__avatar__icon--large___QntBf","avatar__icon--xlarge":"lc-Avatar-module__avatar__icon--xlarge___bcHbI","avatar__icon--xxlarge":"lc-Avatar-module__avatar__icon--xxlarge___sx8Fq","avatar__icon--xxxlarge":"lc-Avatar-module__avatar__icon--xxxlarge___4144S","avatar--circle":"lc-Avatar-module__avatar--circle___XwEz-","avatar--rounded-square":"lc-Avatar-module__avatar--rounded-square___m7-4I","avatar--xxxsmall":"lc-Avatar-module__avatar--xxxsmall___EHzpP","avatar--xxsmall":"lc-Avatar-module__avatar--xxsmall___EDOVp","avatar--xsmall":"lc-Avatar-module__avatar--xsmall___nI348","avatar--small":"lc-Avatar-module__avatar--small___UuQen","avatar--medium":"lc-Avatar-module__avatar--medium___Bt9Eo","avatar--large":"lc-Avatar-module__avatar--large___OU-08","avatar--xlarge":"lc-Avatar-module__avatar--xlarge___zwgeW","avatar--xxlarge":"lc-Avatar-module__avatar--xxlarge___Ur0ul","avatar--xxxlarge":"lc-Avatar-module__avatar--xxxlarge___Z-54U"},l="avatar",_a=ta=>{var b=ta,{alt:a,className:_,color:t,shape:r="circle",size:s="medium",src:o,status:v,text:p,type:n,withRim:f=!1}=b,k=F(b,["alt","className","color","shape","size","src","status","text","type","withRim"]);const i=n==="image"&&!o,[$,y]=m.useState(i),N=n==="image"&&!!o&&!$,C=n==="text",D=["xxxsmall","xxsmall","xsmall"].includes(s)?1:2,w=X(p,D),x=["xxxsmall","xxsmall","xsmall","small"].includes(s),d=t||q(p),O=d?J(d):void 0,P=C?{backgroundColor:d}:{},H=u(A({[e[l]]:!0,[e[`${l}--${r}`]]:!0,[e[`${l}--${s}`]]:!0,[e[`${l}--with-rim`]]:f},_?{[`${_}`]:_}:{})),j=u(e[`${l}__status`],e[`${l}__status--${r}`],e[`${l}__status--${s}`],...v?[e[`${l}__status--${v}`]]:[]),M=u(e[`${l}__icon`],e[`${l}__icon--${s}`]),B=u(e[`${l}__rim`],e[`${l}__rim--${s}`]),U=g=>x?"2xs":["medium"].includes(g)?"xs":["large","xlarge"].includes(g)?"sm":["xxlarge"].includes(g)?"lg":"xl",L=m.useCallback(()=>y(!0),[]);return m.useEffect(()=>{y(i)},[i]),m.createElement("div",A({className:H,style:P},k),f&&m.createElement("div",{"data-testid":`${l}__rim`,className:B}),v&&m.createElement("div",{"data-testid":`${l}__status`,className:j}),N&&m.createElement("img",{className:e[`${l}__image`],src:o,alt:a,onError:L}),C&&m.createElement(G.Heading,{as:"span",size:U(s),style:{color:O},bold:x,uppercase:x},w),$&&m.createElement(V.Icon,{"data-testid":`${l}__icon`,className:M,source:T.Person}))};exports.Avatar=_a;exports.generateAvatarColor=q;

package/dist/components/Avatar/index.es.js

@@ -0,0 +1,190 @@
+var V = Object.defineProperty;
+var v = Object.getOwnPropertySymbols;
+var F = Object.prototype.hasOwnProperty, h = Object.prototype.propertyIsEnumerable;
+var y = (_, a, t) => a in _ ? V(_, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : _[a] = t, A = (_, a) => {
+  for (var t in a || (a = {}))
+    F.call(a, t) && y(_, t, a[t]);
+  if (v)
+    for (var t of v(a))
+      h.call(a, t) && y(_, t, a[t]);
+  return _;
+};
+var I = (_, a) => {
+  var t = {};
+  for (var r in _)
+    F.call(_, r) && a.indexOf(r) < 0 && (t[r] = _[r]);
+  if (_ != null && v)
+    for (var r of v(_))
+      a.indexOf(r) < 0 && h.call(_, r) && (t[r] = _[r]);
+  return t;
+};
+import * as o from "react";
+import { Person as G } from "@livechat/design-system-icons";
+import u from "clsx";
+import { Icon as K } from "../Icon/index.es.js";
+import { H as R } from "../../chunks/Heading-6b95d08b.js";
+import "../../chunks/Typography.module-93efb34d.js";
+import { getContrast as W } from "polished";
+const k = Array.from(
+  { length: 10 },
+  (_, a) => `--surface-avatar-${a + 1}`
+);
+function X(_) {
+  if (!_)
+    return;
+  const a = _.split("").reduce((t, r) => t + r.charCodeAt(0), 0);
+  return `var(${k[a % k.length]})`;
+}
+function J(_ = "", a = 2) {
+  const t = _.trim().split(/\s+/), r = t.map((m) => [...m][0]);
+  if (a < 1)
+    return "";
+  if (t.length <= a)
+    return r.join("").toUpperCase();
+  const s = [r[0]];
+  for (let m = t.length - a + 1; m < t.length; m++)
+    s.push(r[m]);
+  return s.join("").toUpperCase();
+}
+function O(_) {
+  let a = _;
+  if (_.startsWith("var(--") && _.endsWith(")")) {
+    const t = _.slice(4, -1);
+    a = window.getComputedStyle(document.documentElement).getPropertyValue(t).trim();
+  }
+  return a && W(a, "#FFFFFF") > 3 ? "var(--color-white)" : "var(--color-black)";
+}
+const T = "lc-Avatar-module__avatar___1zTCE", j = "lc-Avatar-module__avatar__status___nX2Ls", Y = "lc-Avatar-module__avatar__rim___RCQ8Q", Z = "lc-Avatar-module__avatar__image___YqfqE", e = {
+  avatar: T,
+  avatar__status: j,
+  "avatar__status--available": "lc-Avatar-module__avatar__status--available___tcpFg",
+  "avatar__status--unavailable": "lc-Avatar-module__avatar__status--unavailable___ciauF",
+  "avatar__status--unknown": "lc-Avatar-module__avatar__status--unknown___MBaGB",
+  "avatar__status--xxxsmall": "lc-Avatar-module__avatar__status--xxxsmall___8pkEO",
+  "avatar__status--circle": "lc-Avatar-module__avatar__status--circle___doV5H",
+  "avatar__status--xxsmall": "lc-Avatar-module__avatar__status--xxsmall___M69lx",
+  "avatar__status--xsmall": "lc-Avatar-module__avatar__status--xsmall___RKQiI",
+  "avatar__status--small": "lc-Avatar-module__avatar__status--small___cVrA7",
+  "avatar__status--medium": "lc-Avatar-module__avatar__status--medium___n5z1H",
+  "avatar__status--large": "lc-Avatar-module__avatar__status--large___Lt-0p",
+  "avatar__status--xlarge": "lc-Avatar-module__avatar__status--xlarge___RWIcJ",
+  "avatar__status--xxlarge": "lc-Avatar-module__avatar__status--xxlarge___crG9D",
+  "avatar__status--xxxlarge": "lc-Avatar-module__avatar__status--xxxlarge___Iv61X",
+  "avatar__status--rounded-square": "lc-Avatar-module__avatar__status--rounded-square___-My1P",
+  avatar__rim: Y,
+  "avatar__rim--xxxsmall": "lc-Avatar-module__avatar__rim--xxxsmall___0CH9D",
+  "avatar__rim--xxsmall": "lc-Avatar-module__avatar__rim--xxsmall___Mde0K",
+  "avatar__rim--xsmall": "lc-Avatar-module__avatar__rim--xsmall___LAN-b",
+  "avatar__rim--small": "lc-Avatar-module__avatar__rim--small___FT8LX",
+  "avatar__rim--medium": "lc-Avatar-module__avatar__rim--medium___Dy0pr",
+  "avatar__rim--large": "lc-Avatar-module__avatar__rim--large___FPvGp",
+  "avatar__rim--xlarge": "lc-Avatar-module__avatar__rim--xlarge___CY0kN",
+  "avatar__rim--xxlarge": "lc-Avatar-module__avatar__rim--xxlarge___tE053",
+  "avatar__rim--xxxlarge": "lc-Avatar-module__avatar__rim--xxxlarge___amlGP",
+  avatar__image: Z,
+  "avatar__icon--xxxsmall": "lc-Avatar-module__avatar__icon--xxxsmall___KaoMa",
+  "avatar__icon--xxsmall": "lc-Avatar-module__avatar__icon--xxsmall___NJJNV",
+  "avatar__icon--xsmall": "lc-Avatar-module__avatar__icon--xsmall___yHEZK",
+  "avatar__icon--small": "lc-Avatar-module__avatar__icon--small___l6lBu",
+  "avatar__icon--medium": "lc-Avatar-module__avatar__icon--medium___LF4w2",
+  "avatar__icon--large": "lc-Avatar-module__avatar__icon--large___QntBf",
+  "avatar__icon--xlarge": "lc-Avatar-module__avatar__icon--xlarge___bcHbI",
+  "avatar__icon--xxlarge": "lc-Avatar-module__avatar__icon--xxlarge___sx8Fq",
+  "avatar__icon--xxxlarge": "lc-Avatar-module__avatar__icon--xxxlarge___4144S",
+  "avatar--circle": "lc-Avatar-module__avatar--circle___XwEz-",
+  "avatar--rounded-square": "lc-Avatar-module__avatar--rounded-square___m7-4I",
+  "avatar--xxxsmall": "lc-Avatar-module__avatar--xxxsmall___EHzpP",
+  "avatar--xxsmall": "lc-Avatar-module__avatar--xxsmall___EDOVp",
+  "avatar--xsmall": "lc-Avatar-module__avatar--xsmall___nI348",
+  "avatar--small": "lc-Avatar-module__avatar--small___UuQen",
+  "avatar--medium": "lc-Avatar-module__avatar--medium___Bt9Eo",
+  "avatar--large": "lc-Avatar-module__avatar--large___OU-08",
+  "avatar--xlarge": "lc-Avatar-module__avatar--xlarge___zwgeW",
+  "avatar--xxlarge": "lc-Avatar-module__avatar--xxlarge___Ur0ul",
+  "avatar--xxxlarge": "lc-Avatar-module__avatar--xxxlarge___Z-54U"
+}, l = "avatar", ma = (z) => {
+  var $ = z, {
+    alt: _,
+    className: a,
+    color: t,
+    shape: r = "circle",
+    size: s = "medium",
+    src: m,
+    status: c,
+    text: p,
+    type: i,
+    withRim: f = !1
+  } = $, N = I($, [
+    "alt",
+    "className",
+    "color",
+    "shape",
+    "size",
+    "src",
+    "status",
+    "text",
+    "type",
+    "withRim"
+  ]);
+  const n = i === "image" && !m, [C, E] = o.useState(n), S = i === "image" && !!m && !C, b = i === "text", w = ["xxxsmall", "xxsmall", "xsmall"].includes(s) ? 1 : 2, D = J(p, w), x = ["xxxsmall", "xxsmall", "xsmall", "small"].includes(s), d = t || X(p), H = d ? O(d) : void 0, q = b ? { backgroundColor: d } : {}, B = u(A({
+    [e[l]]: !0,
+    [e[`${l}--${r}`]]: !0,
+    [e[`${l}--${s}`]]: !0,
+    [e[`${l}--with-rim`]]: f
+  }, a ? { [`${a}`]: a } : {})), P = u(
+    e[`${l}__status`],
+    e[`${l}__status--${r}`],
+    e[`${l}__status--${s}`],
+    ...c ? [e[`${l}__status--${c}`]] : []
+  ), U = u(
+    e[`${l}__icon`],
+    e[`${l}__icon--${s}`]
+  ), L = u(
+    e[`${l}__rim`],
+    e[`${l}__rim--${s}`]
+  ), M = (g) => x ? "2xs" : ["medium"].includes(g) ? "xs" : ["large", "xlarge"].includes(g) ? "sm" : ["xxlarge"].includes(g) ? "lg" : "xl", Q = o.useCallback(() => E(!0), []);
+  return o.useEffect(() => {
+    E(n);
+  }, [n]), /* @__PURE__ */ o.createElement("div", A({ className: B, style: q }, N), f && /* @__PURE__ */ o.createElement(
+    "div",
+    {
+      "data-testid": `${l}__rim`,
+      className: L
+    }
+  ), c && /* @__PURE__ */ o.createElement(
+    "div",
+    {
+      "data-testid": `${l}__status`,
+      className: P
+    }
+  ), S && /* @__PURE__ */ o.createElement(
+    "img",
+    {
+      className: e[`${l}__image`],
+      src: m,
+      alt: _,
+      onError: Q
+    }
+  ), b && /* @__PURE__ */ o.createElement(
+    R,
+    {
+      as: "span",
+      size: M(s),
+      style: { color: H },
+      bold: x,
+      uppercase: x
+    },
+    D
+  ), C && /* @__PURE__ */ o.createElement(
+    K,
+    {
+      "data-testid": `${l}__icon`,
+      className: U,
+      source: G
+    }
+  ));
+};
+export {
+  ma as Avatar,
+  X as generateAvatarColor
+};

package/dist/components/Badge/index.cjs.js

@@ -0,0 +1 @@
+"use strict";var B=Object.defineProperty;var _=Object.getOwnPropertySymbols;var g=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable;var n=(e,a,t)=>a in e?B(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,s=(e,a)=>{for(var t in a||(a={}))g.call(a,t)&&n(e,t,a[t]);if(_)for(var t of _(a))l.call(a,t)&&n(e,t,a[t]);return e};var u=(e,a)=>{var t={};for(var d in e)g.call(e,d)&&a.indexOf(d)<0&&(t[d]=e[d]);if(e!=null&&_)for(var d of _(e))a.indexOf(d)<0&&l.call(e,d)&&(t[d]=e[d]);return t};Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react"),$=require("clsx");function j(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const d=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,d.get?d:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const m=j(O);function N(e,a){return e>a?`${a}+`:`${e}`}const R="lc-Badge-module__badge___GhLnu",S="lc-Badge-module__badge__dot___z6RO6",c={badge:R,badge__dot:S,"badge--large":"lc-Badge-module__badge--large___B131q","badge--medium":"lc-Badge-module__badge--medium___TDU8a","badge--compact":"lc-Badge-module__badge--compact___9xJ4y","badge--primary":"lc-Badge-module__badge--primary___8LRpp","badge--secondary":"lc-Badge-module__badge--secondary___JjNIJ","badge--tertiary":"lc-Badge-module__badge--tertiary___e83wV"},o="badge",q=C=>{var r=C,{className:e,count:a=0,max:t=99,kind:d="primary",size:b="medium",type:i="counter"}=r,p=u(r,["className","count","max","kind","size","type"]);const y=$(e,c[o],c[`${o}--${d}`],c[`${o}--${b}`]),f={counter:N(a,t),alert:"!",dot:m.createElement("span",{className:c[`${o}__dot`]})}[i];return m.createElement("span",s({className:y},p),f)};exports.Badge=q;

package/dist/components/Badge/index.es.js

@@ -0,0 +1,65 @@
+var $ = Object.defineProperty;
+var t = Object.getOwnPropertySymbols;
+var m = Object.prototype.hasOwnProperty, l = Object.prototype.propertyIsEnumerable;
+var r = (e, a, _) => a in e ? $(e, a, { enumerable: !0, configurable: !0, writable: !0, value: _ }) : e[a] = _, s = (e, a) => {
+  for (var _ in a || (a = {}))
+    m.call(a, _) && r(e, _, a[_]);
+  if (t)
+    for (var _ of t(a))
+      l.call(a, _) && r(e, _, a[_]);
+  return e;
+};
+var n = (e, a) => {
+  var _ = {};
+  for (var d in e)
+    m.call(e, d) && a.indexOf(d) < 0 && (_[d] = e[d]);
+  if (e != null && t)
+    for (var d of t(e))
+      a.indexOf(d) < 0 && l.call(e, d) && (_[d] = e[d]);
+  return _;
+};
+import * as b from "react";
+import f from "clsx";
+function N(e, a) {
+  return e > a ? `${a}+` : `${e}`;
+}
+const C = "lc-Badge-module__badge___GhLnu", J = "lc-Badge-module__badge__dot___z6RO6", o = {
+  badge: C,
+  badge__dot: J,
+  "badge--large": "lc-Badge-module__badge--large___B131q",
+  "badge--medium": "lc-Badge-module__badge--medium___TDU8a",
+  "badge--compact": "lc-Badge-module__badge--compact___9xJ4y",
+  "badge--primary": "lc-Badge-module__badge--primary___8LRpp",
+  "badge--secondary": "lc-Badge-module__badge--secondary___JjNIJ",
+  "badge--tertiary": "lc-Badge-module__badge--tertiary___e83wV"
+}, g = "badge", L = (R) => {
+  var c = R, {
+    className: e,
+    count: a = 0,
+    max: _ = 99,
+    kind: d = "primary",
+    size: u = "medium",
+    type: p = "counter"
+  } = c, i = n(c, [
+    "className",
+    "count",
+    "max",
+    "kind",
+    "size",
+    "type"
+  ]);
+  const B = f(
+    e,
+    o[g],
+    o[`${g}--${d}`],
+    o[`${g}--${u}`]
+  ), y = {
+    counter: N(a, _),
+    alert: "!",
+    dot: /* @__PURE__ */ b.createElement("span", { className: o[`${g}__dot`] })
+  }[p];
+  return /* @__PURE__ */ b.createElement("span", s({ className: B }, i), y);
+};
+export {
+  L as Badge
+};

package/dist/components/Button/index.cjs.js

@@ -0,0 +1 @@
+"use strict";var N=Object.defineProperty;var r=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var p=(t,_,n)=>_ in t?N(t,_,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[_]=n,a=(t,_)=>{for(var n in _||(_={}))y.call(_,n)&&p(t,n,_[n]);if(r)for(var n of r(_))v.call(_,n)&&p(t,n,_[n]);return t};var h=(t,_)=>{var n={};for(var e in t)y.call(t,e)&&_.indexOf(e)<0&&(n[e]=t[e]);if(t!=null&&r)for(var e of r(t))_.indexOf(e)<0&&v.call(t,e)&&(n[e]=t[e]);return n};Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("react"),$=require("clsx"),q=require("../Loader/index.cjs.js");require("../../chunks/Typography.module-2558416b.js");require("../../chunks/Text-df483689.js");function D(t){const _=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const e=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(_,n,e.get?e:{enumerable:!0,get:()=>t[n]})}}return _.default=t,Object.freeze(_)}const u=D(S),L=t=>{if(t==="primary"||t==="destructive")return{primaryColor:"var(--action-primary-default)",secondaryColor:"var(--border-invert-primary)"};if(t==="link-inverted")return{primaryColor:"var(--content-invert-primary)",secondaryColor:"var(--surface-invert-secondary)"}},Z="lc-Button-module__btn___aijZJ",A="lc-Button-module__btn__loader___c8zZz",J="lc-Button-module__btn__icon___GVExB",o={btn:Z,"btn--disabled":"lc-Button-module__btn--disabled___lXBav","btn--full-width":"lc-Button-module__btn--full-width___kdbAr","btn--xcompact":"lc-Button-module__btn--xcompact___s-zG-","btn--with-left-icon":"lc-Button-module__btn--with-left-icon___MOLWC","btn--with-right-icon":"lc-Button-module__btn--with-right-icon___R0Xum","btn--compact":"lc-Button-module__btn--compact___4eptQ","btn--medium":"lc-Button-module__btn--medium___wfUJA","btn--large":"lc-Button-module__btn--large___lb-z6","btn--basic":"lc-Button-module__btn--basic___Jc2gD","btn--primary":"lc-Button-module__btn--primary___ajbjQ","btn--secondary":"lc-Button-module__btn--secondary___iWzE0","btn--destructive":"lc-Button-module__btn--destructive___-kLCl","btn--destructive-outline":"lc-Button-module__btn--destructive-outline___dexc3","btn--text":"lc-Button-module__btn--text___WA8OL","btn--link":"lc-Button-module__btn--link___51ZgF","btn--link-light":"lc-Button-module__btn--link-light___iitZ6","btn--link-inverted":"lc-Button-module__btn--link-inverted___5zdGg","btn--plain":"lc-Button-module__btn--plain___eOPui","btn--float":"lc-Button-module__btn--float___J4lTs","btn--dotted":"lc-Button-module__btn--dotted___y1EEP","btn--high-contrast":"lc-Button-module__btn--high-contrast___zHSVM","btn--loading":"lc-Button-module__btn--loading___ZAgjv",btn__loader:A,btn__icon:J,"btn__icon--left":"lc-Button-module__btn__icon--left___H68zu","btn__icon--right":"lc-Button-module__btn__icon--right___fHr3D","btn--icon-only":"lc-Button-module__btn--icon-only___bF5pW","btn--icon-only--bg":"lc-Button-module__btn--icon-only--bg___X-4V2"},l="btn",M=u.forwardRef((P,j)=>{var f=P,{loading:t=!1,disabled:_=!1,type:n="button",fullWidth:e=!1,kind:b="basic",size:w="medium",icon:c=null,iconPosition:s="left",loaderLabel:x,className:z,children:m,href:B,onClick:C}=f,O=h(f,["loading","disabled","type","fullWidth","kind","size","icon","iconPosition","loaderLabel","className","children","href","onClick"]);const i=t||_,d=!m&&c,g=["text","link","link-light"].includes(b),k=B?"a":"button",E=$(z,o[l],o[`${l}--${b}`],o[`${l}--${w}`],{[o[`${l}--loading`]]:t,[o[`${l}--full-width`]]:e,[o[`${l}--with-${s}-icon`]]:c&&!d&&!g,[o[`${l}--icon-only`]]:d,[o[`${l}--icon-only--bg`]]:d&&g,[o[`${l}--disabled`]]:i});return u.createElement(k,a(a({ref:j,className:E,"aria-disabled":i,type:n,disabled:i},!i&&{href:B,onClick:C}),O),t&&u.createElement(q.Loader,a({size:"small",label:x,className:o[`${l}__loader`]},L(b))),c&&u.cloneElement(c,{className:$(c.props.className,o[`${l}__icon`],o[`${l}__icon--${s}`]),disabled:_}),u.createElement("div",{className:o[`${l}__content`]},m))});exports.Button=M;