twenty-ui 2.48.0 → 2.50.0

package/dist/data-display-CXw-mxeS.js

@@ -0,0 +1,252 @@
+import { t as v } from "./isDefined-fMi6eQ4r.js";
+import { t as q } from "./doNotTranslate-BSVT8Xyd.js";
+import { a as u, r as H } from "./theme-B2EaXhye.js";
+import { t as E } from "./mergeClassNames-ClFMR1v0.js";
+import { o as A, s as J } from "./utilities-BKCMZyqZ.js";
+import { t as K } from "./Loader-DtHWQH8w.js";
+import { t as D } from "./OverflowingTextWithTooltip-BtB9cGdJ.js";
+import { useRender as x } from "@base-ui/react/use-render";
+import { isBoolean as L, isFunction as Q, isNonEmptyString as W, isString as I } from "@sniptt/guards";
+import { clsx as k } from "clsx";
+import { Fragment as N, jsx as l, jsxs as h } from "react/jsx-runtime";
+import { Avatar as z } from "@base-ui/react/avatar";
+var X = "_root_173kq_1", aa = "_avatarPulsing_173kq_1", ta = "_image_173kq_95", ra = "_fallback_173kq_107", B = {
+  root: X,
+  avatarPulsing: aa,
+  image: ta,
+  fallback: ra
+}, j = ({ className: a, ...t }) => /* @__PURE__ */ l(z.Fallback, {
+  ...t,
+  className: E(B.fallback, a)
+}), P = ({ className: a, ...t }) => /* @__PURE__ */ l(z.Image, {
+  ...t,
+  className: E(B.image, a)
+}), $ = (a) => a?.trim().charAt(0).toUpperCase(), O = ({ name: a, colorSeed: t = a, size: r = "md", shape: i = "square", variant: e = "soft", color: o, backgroundColor: s, borderColor: c, pulsing: d = !1, ring: n = !1, className: _, style: m, ...g }) => {
+  const p = H(), f = $(a), T = f ? o ?? A({
+    string: t ?? "",
+    variant: 12,
+    theme: p
+  }) : o ?? p.font.color.tertiary, S = f ? s ?? A({
+    string: t ?? "",
+    variant: e === "outline" ? 5 : 4,
+    theme: p
+  }) : s ?? p.background.transparent.light, y = c ?? (f ? A({
+    string: t ?? "",
+    variant: 6,
+    theme: p
+  }) : void 0);
+  return /* @__PURE__ */ l(z.Root, {
+    ...g,
+    "data-size": r,
+    "data-shape": i,
+    "data-pulsing": d || void 0,
+    "data-ring": n || void 0,
+    className: E(B.root, _),
+    style: (b) => ({
+      "--tw-avatar-color": T,
+      "--tw-avatar-background": b.imageLoadingStatus === "loaded" ? "none" : S,
+      "--tw-avatar-border": e === "outline" && b.imageLoadingStatus !== "loaded" && y ? q(`1px solid ${y}`) : "none",
+      ...Q(m) ? m(b) : m
+    })
+  });
+}, ea = ({ src: a, name: t, icon: r, imageProps: i, fallbackProps: e, backgroundColor: o, ...s }) => {
+  const c = $(t), d = v(r) && !L(r) && r !== "", n = i?.alt ?? "", _ = !d && W(n), { children: m = d ? r : c || "-", ...g } = e ?? {}, p = v(g.role) || v(g["aria-label"]) || v(g["aria-labelledby"]), f = !_ && !p && !v(g.render);
+  return /* @__PURE__ */ h(O, {
+    ...s,
+    name: t,
+    backgroundColor: d ? "inherit" : o,
+    children: [!d && /* @__PURE__ */ l(P, {
+      src: a ?? void 0,
+      ...i,
+      alt: n
+    }), /* @__PURE__ */ l(j, {
+      role: _ ? "img" : void 0,
+      "aria-label": _ ? n : void 0,
+      "aria-hidden": f || void 0,
+      ...g,
+      children: m
+    })]
+  });
+}, La = Object.assign(ea, {
+  Root: O,
+  Image: P,
+  Fallback: j
+}), za = {
+  xxl: {
+    fontSize: "16px",
+    width: "40px"
+  },
+  xl: {
+    fontSize: "16px",
+    width: "32px"
+  },
+  lg: {
+    fontSize: "13px",
+    width: "24px"
+  },
+  md: {
+    fontSize: "12px",
+    width: "16px"
+  },
+  sm: {
+    fontSize: "10px",
+    width: "14px"
+  },
+  xs: {
+    fontSize: "8px",
+    width: "12px"
+  }
+}, oa = "_badge_1bd5g_1", sa = { badge: oa }, Ba = ({ size: a = "sm", color: t = "tertiary", shape: r = "pill", className: i, render: e, ref: o, ...s }) => x({
+  defaultTagName: "span",
+  render: e,
+  ref: o,
+  props: {
+    ...s,
+    className: k(sa.badge, i),
+    "data-badge-size": a,
+    "data-badge-color": t,
+    "data-badge-shape": r
+  }
+}), la = "_chip_gk059_1", ia = "_label_gk059_32", na = "_endElementDivider_gk059_93", C = {
+  chip: la,
+  label: ia,
+  endElementDivider: na
+}, da = { height: "var(--t-spacing-4)" }, Fa = ({ children: a, size: t = "sm", variant: r = "ghost", color: i = "primary", shape: e = "square", weight: o = "regular", onClick: s, clickable: c = v(s), startElement: d, endElement: n, endElementDivider: _ = !1, maxWidth: m, truncate: g = !0, tooltipContent: p, tooltipDelay: f, isTooltipMultiline: T, tooltipPlace: S, alwaysShowTooltip: y = !1, className: b, style: M, render: U, ref: V, ...Y }) => {
+  const Z = v(a) && !L(a) && a !== "", G = I(a) ? {
+    text: a,
+    tooltipContent: p
+  } : {
+    text: a ?? !1,
+    tooltipContent: p ?? ""
+  };
+  return x({
+    render: U,
+    ref: V,
+    state: {
+      size: t,
+      variant: r,
+      color: i,
+      shape: e,
+      weight: o,
+      clickable: c,
+      truncate: g
+    },
+    props: {
+      ...Y,
+      onClick: s,
+      className: k(C.chip, b),
+      style: {
+        ...v(m) ? { "--tw-chip-max-width": q(`${m}px`) } : {},
+        ...M
+      },
+      children: /* @__PURE__ */ h(N, { children: [
+        d,
+        Z && /* @__PURE__ */ l(D, {
+          ...G,
+          render: /* @__PURE__ */ l("span", {}),
+          className: C.label,
+          style: t === "md" ? da : void 0,
+          truncate: g,
+          tooltipDelay: f,
+          isTooltipMultiline: T,
+          tooltipPlace: S,
+          alwaysShowTooltip: y
+        }),
+        v(n) && n !== !1 && /* @__PURE__ */ h(N, { children: [_ && /* @__PURE__ */ l("span", { className: C.endElementDivider }), n] })
+      ] })
+    }
+  });
+}, ca = "_root_6bfj6_1", ma = "_circle_6bfj6_13", F = {
+  root: ca,
+  circle: ma
+}, Ra = ({ colorName: a, color: t, variant: r, className: i, style: e, render: o, ref: s, ...c }) => x({
+  defaultTagName: "div",
+  render: o,
+  ref: s,
+  props: {
+    ...c,
+    className: k(F.root, r === "circle" && F.circle, i),
+    style: {
+      "--color-sample-color": t ?? u.tag.background[a],
+      "--color-sample-border-color": u.tag.text[a],
+      ...e
+    }
+  }
+}), ga = "_status_y5v42_1", pa = "_content_y5v42_49", R = {
+  status: ga,
+  content: pa
+}, qa = ({ children: a, color: t, loading: r = !1, weight: i = "regular", className: e, style: o, render: s, ref: c, ...d }) => {
+  const n = J(t);
+  return x({
+    defaultTagName: "span",
+    render: s,
+    ref: c,
+    state: {
+      loading: r,
+      weight: i
+    },
+    props: {
+      "aria-busy": r || void 0,
+      ...d,
+      className: k(R.status, e),
+      style: {
+        "--tw-status-background": u.tag.background[n],
+        "--tw-status-text-color": u.tag.text[n],
+        ...o
+      },
+      children: /* @__PURE__ */ h(N, { children: [/* @__PURE__ */ l("span", {
+        className: R.content,
+        children: a
+      }), r && /* @__PURE__ */ l(K, {
+        color: t,
+        "aria-hidden": "true",
+        render: /* @__PURE__ */ l("span", {})
+      })] })
+    }
+  });
+}, va = "_tag_1ot0y_1", _a = "_content_1ot0y_49", ua = "_overflowingText_1ot0y_58", fa = "_iconContainer_1ot0y_62", w = {
+  tag: va,
+  content: _a,
+  overflowingText: ua,
+  iconContainer: fa
+}, Da = ({ children: a, color: t, weight: r = "regular", variant: i = "soft", startIcon: e, truncate: o = !0, borderStyle: s = "solid", className: c, style: d, render: n, ref: _, ...m }) => x({
+  defaultTagName: "span",
+  render: n,
+  ref: _,
+  state: {
+    variant: i,
+    weight: r,
+    truncate: o
+  },
+  props: {
+    ...m,
+    className: k(w.tag, c),
+    style: {
+      "--tw-tag-background": t === "transparent" ? "transparent" : u.tag.background[t] ?? u.tag.background.gray,
+      "--tw-tag-text": t === "transparent" ? u.font.color.secondary : u.tag.text[t] ?? u.font.color.secondary,
+      "--tw-tag-border-style": s,
+      ...d
+    },
+    children: /* @__PURE__ */ h(N, { children: [v(e) && !L(e) && e !== "" && /* @__PURE__ */ l("span", {
+      className: w.iconContainer,
+      "aria-hidden": !0,
+      children: e
+    }), /* @__PURE__ */ l("span", {
+      className: w.content,
+      children: I(a) && o ? /* @__PURE__ */ l(D, {
+        text: a,
+        render: /* @__PURE__ */ l("span", {}),
+        className: w.overflowingText
+      }) : a
+    })] })
+  }
+});
+export {
+  Ba as a,
+  Fa as i,
+  qa as n,
+  za as o,
+  Ra as r,
+  La as s,
+  Da as t
+};

package/dist/data-display-DdES9XqZ.cjs

@@ -0,0 +1 @@
+const m=require("./theme-1XkFz8Qu.cjs"),v=require("./isDefined-DS2Q42p5.cjs"),R=require("./doNotTranslate-CHE7WmRS.cjs"),S=require("./mergeClassNames-D4lshrT6.cjs"),y=require("./utilities-xZh8D2gd.cjs"),U=require("./Loader-Bb72CUQ9.cjs"),O=require("./OverflowingTextWithTooltip-BQmpPObX.cjs");let h=require("@base-ui/react/use-render"),f=require("@sniptt/guards"),T=require("clsx"),t=require("react/jsx-runtime"),w=require("@base-ui/react/avatar");var W="_root_173kq_1",Z="_avatarPulsing_173kq_1",G="_image_173kq_95",H="_fallback_173kq_107",A={root:W,avatarPulsing:Z,image:G,fallback:H},B=({className:e,...a})=>(0,t.jsx)(w.Avatar.Fallback,{...a,className:S.mergeClassNames(A.fallback,e)}),E=({className:e,...a})=>(0,t.jsx)(w.Avatar.Image,{...a,className:S.mergeClassNames(A.image,e)}),V=e=>e?.trim().charAt(0).toUpperCase(),F=({name:e,colorSeed:a=e,size:r="md",shape:o="square",variant:s="soft",color:i,backgroundColor:n,borderColor:u,pulsing:d=!1,ring:l=!1,className:p,style:c,...g})=>{const _=m.useTheme(),b=V(e),k=b?i??y.stringToThemeColorP3String({string:a??"",variant:12,theme:_}):i??_.font.color.tertiary,q=b?n??y.stringToThemeColorP3String({string:a??"",variant:s==="outline"?5:4,theme:_}):n??_.background.transparent.light,j=u??(b?y.stringToThemeColorP3String({string:a??"",variant:6,theme:_}):void 0);return(0,t.jsx)(w.Avatar.Root,{...g,"data-size":r,"data-shape":o,"data-pulsing":d||void 0,"data-ring":l||void 0,className:S.mergeClassNames(A.root,p),style:x=>({"--tw-avatar-color":k,"--tw-avatar-background":x.imageLoadingStatus==="loaded"?"none":q,"--tw-avatar-border":s==="outline"&&x.imageLoadingStatus!=="loaded"&&j?R.doNotTranslate(`1px solid ${j}`):"none",...(0,f.isFunction)(c)?c(x):c})})},J=({src:e,name:a,icon:r,imageProps:o,fallbackProps:s,backgroundColor:i,...n})=>{const u=V(a),d=v.isDefined(r)&&!(0,f.isBoolean)(r)&&r!=="",l=o?.alt??"",p=!d&&(0,f.isNonEmptyString)(l),{children:c=d?r:u||"-",...g}=s??{},_=v.isDefined(g.role)||v.isDefined(g["aria-label"])||v.isDefined(g["aria-labelledby"]),b=!p&&!_&&!v.isDefined(g.render);return(0,t.jsxs)(F,{...n,name:a,backgroundColor:d?"inherit":i,children:[!d&&(0,t.jsx)(E,{src:e??void 0,...o,alt:l}),(0,t.jsx)(B,{role:p?"img":void 0,"aria-label":p?l:void 0,"aria-hidden":b||void 0,...g,children:c})]})},K=Object.assign(J,{Root:F,Image:E,Fallback:B}),Q={xxl:{fontSize:"16px",width:"40px"},xl:{fontSize:"16px",width:"32px"},lg:{fontSize:"13px",width:"24px"},md:{fontSize:"12px",width:"16px"},sm:{fontSize:"10px",width:"14px"},xs:{fontSize:"8px",width:"12px"}},X="_badge_1bd5g_1",ee={badge:X},ae=({size:e="sm",color:a="tertiary",shape:r="pill",className:o,render:s,ref:i,...n})=>(0,h.useRender)({defaultTagName:"span",render:s,ref:i,props:{...n,className:(0,T.clsx)(ee.badge,o),"data-badge-size":e,"data-badge-color":a,"data-badge-shape":r}}),te="_chip_gk059_1",re="_label_gk059_32",se="_endElementDivider_gk059_93",N={chip:te,label:re,endElementDivider:se},ie={height:"var(--t-spacing-4)"},ne=({children:e,size:a="sm",variant:r="ghost",color:o="primary",shape:s="square",weight:i="regular",onClick:n,clickable:u=v.isDefined(n),startElement:d,endElement:l,endElementDivider:p=!1,maxWidth:c,truncate:g=!0,tooltipContent:_,tooltipDelay:b,isTooltipMultiline:k,tooltipPlace:q,alwaysShowTooltip:j=!1,className:x,style:L,render:I,ref:z,...$})=>{const Y=v.isDefined(e)&&!(0,f.isBoolean)(e)&&e!=="",M=(0,f.isString)(e)?{text:e,tooltipContent:_}:{text:e??!1,tooltipContent:_??""};return(0,h.useRender)({render:I,ref:z,state:{size:a,variant:r,color:o,shape:s,weight:i,clickable:u,truncate:g},props:{...$,onClick:n,className:(0,T.clsx)(N.chip,x),style:{...v.isDefined(c)?{"--tw-chip-max-width":R.doNotTranslate(`${c}px`)}:{},...L},children:(0,t.jsxs)(t.Fragment,{children:[d,Y&&(0,t.jsx)(O.OverflowingTextWithTooltip,{...M,render:(0,t.jsx)("span",{}),className:N.label,style:a==="md"?ie:void 0,truncate:g,tooltipDelay:b,isTooltipMultiline:k,tooltipPlace:q,alwaysShowTooltip:j}),v.isDefined(l)&&l!==!1&&(0,t.jsxs)(t.Fragment,{children:[p&&(0,t.jsx)("span",{className:N.endElementDivider}),l]})]})}})},oe="_root_6bfj6_1",le="_circle_6bfj6_13",D={root:oe,circle:le},de=({colorName:e,color:a,variant:r,className:o,style:s,render:i,ref:n,...u})=>(0,h.useRender)({defaultTagName:"div",render:i,ref:n,props:{...u,className:(0,T.clsx)(D.root,r==="circle"&&D.circle,o),style:{"--color-sample-color":a??m.themeCssVariables.tag.background[e],"--color-sample-border-color":m.themeCssVariables.tag.text[e],...s}}}),ue="_status_y5v42_1",ce="_content_y5v42_49",P={status:ue,content:ce},ge=({children:e,color:a,loading:r=!1,weight:o="regular",className:s,style:i,render:n,ref:u,...d})=>{const l=y.parseThemeColor(a);return(0,h.useRender)({defaultTagName:"span",render:n,ref:u,state:{loading:r,weight:o},props:{"aria-busy":r||void 0,...d,className:(0,T.clsx)(P.status,s),style:{"--tw-status-background":m.themeCssVariables.tag.background[l],"--tw-status-text-color":m.themeCssVariables.tag.text[l],...i},children:(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("span",{className:P.content,children:e}),r&&(0,t.jsx)(U.Loader,{color:a,"aria-hidden":"true",render:(0,t.jsx)("span",{})})]})}})},_e="_tag_1ot0y_1",me="_content_1ot0y_49",ve="_overflowingText_1ot0y_58",pe="_iconContainer_1ot0y_62",C={tag:_e,content:me,overflowingText:ve,iconContainer:pe},be=({children:e,color:a,weight:r="regular",variant:o="soft",startIcon:s,truncate:i=!0,borderStyle:n="solid",className:u,style:d,render:l,ref:p,...c})=>(0,h.useRender)({defaultTagName:"span",render:l,ref:p,state:{variant:o,weight:r,truncate:i},props:{...c,className:(0,T.clsx)(C.tag,u),style:{"--tw-tag-background":a==="transparent"?"transparent":m.themeCssVariables.tag.background[a]??m.themeCssVariables.tag.background.gray,"--tw-tag-text":a==="transparent"?m.themeCssVariables.font.color.secondary:m.themeCssVariables.tag.text[a]??m.themeCssVariables.font.color.secondary,"--tw-tag-border-style":n,...d},children:(0,t.jsxs)(t.Fragment,{children:[v.isDefined(s)&&!(0,f.isBoolean)(s)&&s!==""&&(0,t.jsx)("span",{className:C.iconContainer,"aria-hidden":!0,children:s}),(0,t.jsx)("span",{className:C.content,children:(0,f.isString)(e)&&i?(0,t.jsx)(O.OverflowingTextWithTooltip,{text:e,render:(0,t.jsx)("span",{}),className:C.overflowingText}):e})]})}});Object.defineProperty(exports,"AVATAR_PROPERTIES_BY_SIZE",{enumerable:!0,get:function(){return Q}});Object.defineProperty(exports,"Avatar",{enumerable:!0,get:function(){return K}});Object.defineProperty(exports,"Badge",{enumerable:!0,get:function(){return ae}});Object.defineProperty(exports,"Chip",{enumerable:!0,get:function(){return ne}});Object.defineProperty(exports,"ColorSample",{enumerable:!0,get:function(){return de}});Object.defineProperty(exports,"Status",{enumerable:!0,get:function(){return ge}});Object.defineProperty(exports,"Tag",{enumerable:!0,get:function(){return be}});

package/dist/doNotTranslate-BSVT8Xyd.js

@@ -0,0 +1,4 @@
+var t = (a) => a;
+export {
+  t
+};

package/dist/doNotTranslate-CHE7WmRS.cjs

@@ -0,0 +1 @@
+var t=e=>e;Object.defineProperty(exports,"doNotTranslate",{enumerable:!0,get:function(){return t}});