twenty-ui 2.49.0 → 2.51.1

package/dist/surfaces-v0kQLZYO.js

@@ -0,0 +1,224 @@
+import { t as _ } from "./isDefined-fMi6eQ4r.js";
+import { t as u } from "./theme-B2EaXhye.js";
+import { t as c } from "./mergeClassNames-ClFMR1v0.js";
+import { t as v } from "./useProvidedTextDirection-Dk8LBQeF.js";
+import { t as f } from "./Heading-Nj5BlPqB.js";
+import { useRender as l } from "@base-ui/react/use-render";
+import { isUndefined as D } from "@sniptt/guards";
+import { clsx as d } from "clsx";
+import { isValidElement as C } from "react";
+import { jsx as i } from "react/jsx-runtime";
+import { AlertDialog as s } from "@base-ui/react/alert-dialog";
+import { Dialog as p } from "@base-ui/react/dialog";
+var N = "_backdrop_aak4r_1", k = "_viewport_aak4r_12", H = "_popup_aak4r_30", A = "_header_aak4r_82", T = "_body_aak4r_91", y = "_footer_aak4r_95", b = "_title_aak4r_106", P = "_description_aak4r_113", t = {
+  backdrop: N,
+  viewport: k,
+  popup: H,
+  header: A,
+  body: T,
+  footer: y,
+  title: b,
+  description: P
+}, w = ({ className: a, ...r }) => /* @__PURE__ */ i(s.Backdrop, {
+  ...r,
+  className: c(t.backdrop, a)
+}), B = ({ render: a, ref: r, className: o, ...e }) => l({
+  render: a,
+  ref: r,
+  props: {
+    ...e,
+    className: d(t.body, o)
+  }
+}), F = ({ className: a, ...r }) => /* @__PURE__ */ i(s.Description, {
+  ...r,
+  className: c(t.description, a)
+}), h = ({ render: a, ref: r, className: o, ...e }) => l({
+  render: a,
+  ref: r,
+  props: {
+    ...e,
+    className: d(t.footer, o)
+  }
+}), R = ({ render: a, ref: r, className: o, ...e }) => l({
+  render: a,
+  ref: r,
+  props: {
+    ...e,
+    className: d(t.header, o)
+  }
+}), V = ({ container: a, ...r }) => {
+  const o = u(), e = v();
+  return /* @__PURE__ */ i(s.Portal, {
+    dir: e,
+    ...r,
+    container: a === void 0 ? o ?? void 0 : a
+  });
+}, x = ({ size: a = "md", className: r, ...o }) => /* @__PURE__ */ i(s.Popup, {
+  ...o,
+  "data-size": a,
+  className: c(t.popup, r)
+}), $ = ({ className: a, ...r }) => /* @__PURE__ */ i(s.Title, {
+  ...r,
+  className: c(t.title, a)
+}), z = ({ className: a, ...r }) => {
+  const o = v();
+  return /* @__PURE__ */ i(s.Viewport, {
+    dir: o,
+    ...r,
+    className: c(t.viewport, a)
+  });
+}, j = () => ({
+  Root: s.Root,
+  Trigger: s.Trigger,
+  Portal: V,
+  Backdrop: w,
+  Viewport: z,
+  Popup: x,
+  Title: $,
+  Description: F,
+  Close: s.Close,
+  Header: R,
+  Body: B,
+  Footer: h,
+  Handle: s.Handle,
+  createHandle: s.createHandle
+}), Pa = /* @__PURE__ */ j(), E = "_action_mi80l_1", U = { action: E }, q = ({ className: a, disabled: r = !1, render: o, ref: e, ...n }) => l({
+  defaultTagName: "button",
+  render: o,
+  ref: e,
+  props: {
+    ...!_(o) || C(o) && o.type === "button" ? { type: "button" } : void 0,
+    disabled: r || void 0,
+    ...n,
+    className: d(U.action, a),
+    "data-card-action": "",
+    "data-disabled": r || void 0
+  }
+}), G = "_control_do7fa_1", I = { control: G }, J = ({ className: a, render: r, ref: o, ...e }) => l({
+  defaultTagName: "span",
+  render: r,
+  ref: o,
+  props: {
+    ...e,
+    className: d(I.control, a)
+  }
+}), K = "_cardContent_58fb8_1", L = { cardContent: K }, M = ({ className: a, divider: r, render: o, ref: e, ...n }) => l({
+  render: o,
+  ref: e,
+  props: {
+    ...n,
+    className: d(L.cardContent, a),
+    "data-divider": r || void 0
+  }
+}), O = "_cardFooter_1mjcf_1", Q = { cardFooter: O }, S = ({ className: a, divider: r, render: o, ref: e, ...n }) => l({
+  render: o,
+  ref: e,
+  props: {
+    ...n,
+    className: d(Q.cardFooter, a),
+    "data-no-divider": r === !1 || void 0
+  }
+}), W = "_cardHeader_1u3yd_1", X = { cardHeader: W }, Y = ({ className: a, render: r, ref: o, ...e }) => l({
+  render: r,
+  ref: o,
+  props: {
+    ...e,
+    className: d(X.cardHeader, a)
+  }
+}), Z = "_card_12yh1_1", aa = { card: Z }, ra = ({ className: a, fullWidth: r, backgroundColor: o, style: e, render: n, ref: m, ...g }) => l({
+  render: n,
+  ref: m,
+  props: {
+    ...g,
+    className: d(aa.card, a),
+    "data-full-width": r || void 0,
+    style: _(o) ? {
+      ...e,
+      "--card-background-color": o
+    } : e
+  }
+}), wa = {
+  Root: ra,
+  Action: q,
+  Control: J,
+  Header: Y,
+  Content: M,
+  Footer: S
+}, oa = ({ className: a, ...r }) => /* @__PURE__ */ i(p.Backdrop, {
+  ...r,
+  className: c(t.backdrop, a)
+}), ea = ({ render: a, ref: r, className: o, ...e }) => l({
+  render: a,
+  ref: r,
+  props: {
+    ...e,
+    className: d(t.body, o)
+  }
+}), ta = "_description_3f4d1_1", ia = { description: ta }, da = ({ className: a, ...r }) => /* @__PURE__ */ i(p.Description, {
+  ...r,
+  className: c(d(t.description, ia.description), a)
+}), la = ({ render: a, ref: r, className: o, ...e }) => l({
+  render: a,
+  ref: r,
+  props: {
+    ...e,
+    className: d(t.footer, o)
+  }
+}), sa = ({ render: a, ref: r, className: o, ...e }) => l({
+  render: a,
+  ref: r,
+  props: {
+    ...e,
+    className: d(t.header, o)
+  }
+}), pa = ({ size: a = "md", className: r, ...o }) => {
+  const e = v();
+  return /* @__PURE__ */ i(p.Popup, {
+    dir: e,
+    ...o,
+    "data-size": a,
+    className: c(t.popup, r)
+  });
+}, ca = ({ container: a, ...r }) => {
+  const o = u();
+  return /* @__PURE__ */ i(p.Portal, {
+    ...r,
+    container: D(a) ? o ?? void 0 : a
+  });
+}, na = "_title_yzpck_1", va = { title: na }, ma = ({ level: a = 2, size: r = "lg", color: o = "primary", className: e, render: n, ...m }) => /* @__PURE__ */ i(p.Title, {
+  ...m,
+  className: c(va.title, e),
+  render: /* @__PURE__ */ i(f, {
+    level: a,
+    size: r,
+    color: o,
+    render: n
+  })
+}), _a = ({ className: a, ...r }) => {
+  const o = v();
+  return /* @__PURE__ */ i(p.Viewport, {
+    dir: o,
+    ...r,
+    className: c(t.viewport, a)
+  });
+}, Ba = {
+  createHandle: p.createHandle,
+  Handle: p.Handle,
+  Root: p.Root,
+  Trigger: p.Trigger,
+  Portal: ca,
+  Backdrop: oa,
+  Viewport: _a,
+  Popup: pa,
+  Title: ma,
+  Description: da,
+  Close: p.Close,
+  Header: sa,
+  Body: ea,
+  Footer: la
+};
+export {
+  wa as n,
+  Pa as r,
+  Ba as t
+};

package/dist/testing/index.d.ts

@@ -7,3 +7,4 @@ export { GroupedCatalog } from './GroupedCatalog';
 export { AVATAR_URL_MOCK } from './mocks/avatarUrlMock';
 export type { CatalogStory } from './types/CatalogStory';
 export { overrideMediaQueryMatches } from './utils/overrideMediaQueryMatches';
+export { waitForStorybookFontsLoaded } from './utils/waitForStorybookFontsLoaded';

package/dist/testing/utils/waitForStorybookFontsLoaded.d.ts

@@ -0,0 +1 @@
+export declare const waitForStorybookFontsLoaded: () => Promise<void>;

package/dist/testing.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("./theme-1XkFz8Qu.cjs"),E=require("./isDefined-DS2Q42p5.cjs"),B=require("./Heading-CTRYClCO.cjs");let h=require("@sniptt/guards"),U=require("clsx"),e=require("react/jsx-runtime");var j={test:"error",config:{rules:[{id:"color-contrast",enabled:!1}]}},V="_layout_17ld0_1",T={layout:V},w=({width:r,backgroundColor:a,height:A,children:t})=>(0,e.jsx)("div",{className:T.layout,style:{background:a,height:E.isDefined(A)?`${A}px`:"fit-content",minWidth:r?"unset":"300px",width:r?`${r}px`:"fit-content"},children:t}),y="_columnTitle_5dert_1",f="_rowsTitle_5dert_7",M="_rowTitle_5dert_15",F="_elementTitle_5dert_23",S="_container_5dert_32",b="_columnContainer_5dert_37",N="_rowsContainer_5dert_43",k="_rowContainer_5dert_49",D="_elementContainer_5dert_56",x="_cellContainer_5dert_60",i={columnTitle:y,rowsTitle:f,rowTitle:M,elementTitle:F,container:S,columnContainer:b,rowsContainer:N,rowContainer:k,elementContainer:D,cellContainer:x},m={name:"",values:[void 0],props:()=>({})},g=r=>(0,h.isString)(r)||(0,h.isNumber)(r),L=(r,a)=>{const{catalog:{dimensions:A=[],options:t={}}={dimensions:[],options:{}}}=a.parameters||{};if(!A||!Array.isArray(A))return(0,e.jsx)(r,{});const[n=m,s=m,u=m,C=m]=A;return(0,e.jsx)("div",{className:i.container,children:C.values.map((l,_)=>(0,e.jsxs)("div",{className:i.columnContainer,children:[(0,e.jsx)("div",{className:i.columnTitle,children:C.labels?.(l)??(g(l)?l:"")}),u.values.map((d,R)=>(0,e.jsxs)("div",{className:i.rowsContainer,children:[(0,e.jsx)("div",{className:i.rowsTitle,children:u.labels?.(d)??(g(d)?d:"")}),s.values.map((c,v)=>(0,e.jsxs)("div",{className:i.rowContainer,children:[(0,e.jsx)("div",{className:i.rowTitle,children:s.labels?.(c)??(g(c)?c:"")}),n.values.map((o,Q)=>(0,e.jsxs)("div",{className:i.cellContainer,id:A.length>1?`catalog-cell-${_}-${R}-${v}-${Q}`:o,children:[(0,e.jsx)("span",{className:i.elementTitle,children:n.labels?.(o)??(g(o)?o:"")}),(0,e.jsx)("div",{className:(0,U.clsx)(i.elementContainer,t?.elementContainer?.className),style:{minWidth:t?.elementContainer?.width?`${t.elementContainer.width}px`:"auto",...t?.elementContainer?.style},children:(0,e.jsx)(r,{args:{...a.args,...n.props(o),...s.props(c),...u.props(d),...C.props(l)}})})]},`d1-${Q}`))]},`d2-${v}`))]},`d3-${R}`))]},`d4-${_}`))})},I=(r,a)=>{if(r)switch(a){case"default":return p.themeCssVariables.grayScale.gray11;case"danger":return p.themeCssVariables.color.red;case"blue":return p.themeCssVariables.color.blue;default:return}},q=(r,a)=>{const{container:A}=a.parameters,t=a.args.inverted,n=a.args.accent,s=I(t,n);return(0,e.jsx)(w,{width:A?.width,height:A?.height,backgroundColor:s,children:(0,e.jsx)(r,{})})},K=({groups:r,renderExample:a})=>(0,e.jsx)("div",{style:{display:"grid",gap:"var(--t-spacing-6)",width:"100%"},children:r.map(({label:A,examples:t})=>(0,e.jsxs)("section",{"aria-label":A,children:[(0,e.jsx)(B.Heading,{level:3,children:A}),(0,e.jsx)("div",{style:{display:"flex",flexWrap:"wrap",gap:"var(--t-spacing-6)",marginTop:"var(--t-spacing-3)"},children:t.map(n=>(0,e.jsx)("div",{style:{display:"grid",gap:"var(--t-spacing-2)",justifyItems:"start"},children:a(n)},n.label))})]},A))}),W="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAYABgAAD/4QCMRXhpZgAATU0AKgAAAAgABQESAAMAAAABAAEAAAEaAAUAAAABAAAASgEbAAUAAAABAAAAUgEoAAMAAAABAAIAAIdpAAQAAAABAAAAWgAAAAAAAABgAAAAAQAAAGAAAAABAAOgAQADAAAAAQABAACgAgAEAAAAAQAAABSgAwAEAAAAAQAAABQAAAAA/8AAEQgAFAAUAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/bAEMACwgICggHCwoJCg0MCw0RHBIRDw8RIhkaFBwpJCsqKCQnJy0yQDctMD0wJyc4TDk9Q0VISUgrNk9VTkZUQEdIRf/bAEMBDA0NEQ8RIRISIUUuJy5FRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRf/dAAQAAv/aAAwDAQACEQMRAD8Ava1q728otYY98joSCTgZrnbXWdTtrhrfVZXWLafmcAEkdgR/hVltQku9Q8+OIEBcGOT+ID0PY1ka1KH2u8ToqnPLbmIqG7u6LtbQ7RXBRec4Uck9eKXcPWsKDWVnhWSL5kYcFelSf2m3901POh8jP//QoyIAnTuKpXsY82NsksUyWPU5q/L9z8RVK++/F/uCsVsaEURwgA4HtT9x9TUcf3KfUGh//9k=",O=r=>Object.assign(new EventTarget,{media:r,matches:!1,onchange:null,addListener:()=>{},removeListener:()=>{}}),Y=r=>{const a=window.matchMedia;return window.matchMedia=A=>{const t=(0,h.isFunction)(a)?a.call(window,A):O(A),n=r[A];return E.isDefined(n)&&Object.defineProperty(t,"matches",{value:n}),t},()=>{window.matchMedia=a}};exports.A11Y_DEFER_COLOR_CONTRAST=j;exports.AVATAR_URL_MOCK=W;exports.CatalogDecorator=L;exports.ComponentDecorator=q;exports.ComponentStorybookLayout=w;exports.GroupedCatalog=K;exports.overrideMediaQueryMatches=Y;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("./theme-1XkFz8Qu.cjs"),w=require("./isDefined-DS2Q42p5.cjs"),B=require("./Heading-CHvEXL6n.cjs");let h=require("@sniptt/guards"),y=require("clsx"),r=require("react/jsx-runtime");var U={test:"error",config:{rules:[{id:"color-contrast",enabled:!1}]}},T="_layout_17ld0_1",j={layout:T},E=({width:e,backgroundColor:A,height:a,children:t})=>(0,r.jsx)("div",{className:j.layout,style:{background:A,height:w.isDefined(a)?`${a}px`:"fit-content",minWidth:e?"unset":"300px",width:e?`${e}px`:"fit-content"},children:t}),V="_columnTitle_5dert_1",M="_rowsTitle_5dert_7",F="_rowTitle_5dert_15",f="_elementTitle_5dert_23",S="_container_5dert_32",b="_columnContainer_5dert_37",k="_rowsContainer_5dert_43",D="_rowContainer_5dert_49",N="_elementContainer_5dert_56",I="_cellContainer_5dert_60",o={columnTitle:V,rowsTitle:M,rowTitle:F,elementTitle:f,container:S,columnContainer:b,rowsContainer:k,rowContainer:D,elementContainer:N,cellContainer:I},m={name:"",values:[void 0],props:()=>({})},g=e=>(0,h.isString)(e)||(0,h.isNumber)(e),L=(e,A)=>{const{catalog:{dimensions:a=[],options:t={}}={dimensions:[],options:{}}}=A.parameters||{};if(!a||!Array.isArray(a))return(0,r.jsx)(e,{});const[n=m,i=m,u=m,C=m]=a;return(0,r.jsx)("div",{className:o.container,children:C.values.map((l,_)=>(0,r.jsxs)("div",{className:o.columnContainer,children:[(0,r.jsx)("div",{className:o.columnTitle,children:C.labels?.(l)??(g(l)?l:"")}),u.values.map((d,R)=>(0,r.jsxs)("div",{className:o.rowsContainer,children:[(0,r.jsx)("div",{className:o.rowsTitle,children:u.labels?.(d)??(g(d)?d:"")}),i.values.map((c,v)=>(0,r.jsxs)("div",{className:o.rowContainer,children:[(0,r.jsx)("div",{className:o.rowTitle,children:i.labels?.(c)??(g(c)?c:"")}),n.values.map((s,Q)=>(0,r.jsxs)("div",{className:o.cellContainer,id:a.length>1?`catalog-cell-${_}-${R}-${v}-${Q}`:s,children:[(0,r.jsx)("span",{className:o.elementTitle,children:n.labels?.(s)??(g(s)?s:"")}),(0,r.jsx)("div",{className:(0,y.clsx)(o.elementContainer,t?.elementContainer?.className),style:{minWidth:t?.elementContainer?.width?`${t.elementContainer.width}px`:"auto",...t?.elementContainer?.style},children:(0,r.jsx)(e,{args:{...A.args,...n.props(s),...i.props(c),...u.props(d),...C.props(l)}})})]},`d1-${Q}`))]},`d2-${v}`))]},`d3-${R}`))]},`d4-${_}`))})},x=(e,A)=>{if(e)switch(A){case"default":return p.themeCssVariables.grayScale.gray11;case"danger":return p.themeCssVariables.color.red;case"blue":return p.themeCssVariables.color.blue;default:return}},O=(e,A)=>{const{container:a}=A.parameters,t=A.args.inverted,n=A.args.accent,i=x(t,n);return(0,r.jsx)(E,{width:a?.width,height:a?.height,backgroundColor:i,children:(0,r.jsx)(e,{})})},K=({groups:e,renderExample:A})=>(0,r.jsx)("div",{style:{display:"grid",gap:"var(--t-spacing-6)",width:"100%"},children:e.map(({label:a,examples:t})=>(0,r.jsxs)("section",{"aria-label":a,children:[(0,r.jsx)(B.Heading,{level:3,children:a}),(0,r.jsx)("div",{style:{display:"flex",flexWrap:"wrap",gap:"var(--t-spacing-6)",marginTop:"var(--t-spacing-3)"},children:t.map(n=>(0,r.jsx)("div",{style:{display:"grid",gap:"var(--t-spacing-2)",justifyItems:"start"},children:A(n)},n.label))})]},a))}),q="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAYABgAAD/4QCMRXhpZgAATU0AKgAAAAgABQESAAMAAAABAAEAAAEaAAUAAAABAAAASgEbAAUAAAABAAAAUgEoAAMAAAABAAIAAIdpAAQAAAABAAAAWgAAAAAAAABgAAAAAQAAAGAAAAABAAOgAQADAAAAAQABAACgAgAEAAAAAQAAABSgAwAEAAAAAQAAABQAAAAA/8AAEQgAFAAUAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/bAEMACwgICggHCwoJCg0MCw0RHBIRDw8RIhkaFBwpJCsqKCQnJy0yQDctMD0wJyc4TDk9Q0VISUgrNk9VTkZUQEdIRf/bAEMBDA0NEQ8RIRISIUUuJy5FRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRf/dAAQAAv/aAAwDAQACEQMRAD8Ava1q728otYY98joSCTgZrnbXWdTtrhrfVZXWLafmcAEkdgR/hVltQku9Q8+OIEBcGOT+ID0PY1ka1KH2u8ToqnPLbmIqG7u6LtbQ7RXBRec4Uck9eKXcPWsKDWVnhWSL5kYcFelSf2m3901POh8jP//QoyIAnTuKpXsY82NsksUyWPU5q/L9z8RVK++/F/uCsVsaEURwgA4HtT9x9TUcf3KfUGh//9k=",W=e=>Object.assign(new EventTarget,{media:e,matches:!1,onchange:null,addListener:()=>{},removeListener:()=>{}}),Y=e=>{const A=window.matchMedia;return window.matchMedia=a=>{const t=(0,h.isFunction)(A)?A.call(window,a):W(a),n=e[a];return w.isDefined(n)&&Object.defineProperty(t,"matches",{value:n}),t},()=>{window.matchMedia=A}},J=["400 1em Inter","500 1em Inter","600 1em Inter","700 1em Inter",'400 1em "DM Mono"','500 1em "DM Mono"'],X=async()=>{await Promise.all(J.map(e=>document.fonts.load(e))),await document.fonts.ready};exports.A11Y_DEFER_COLOR_CONTRAST=U;exports.AVATAR_URL_MOCK=q;exports.CatalogDecorator=L;exports.ComponentDecorator=O;exports.ComponentStorybookLayout=E;exports.GroupedCatalog=K;exports.overrideMediaQueryMatches=Y;exports.waitForStorybookFontsLoaded=X;

package/dist/testing.mjs

@@ -1,119 +1,119 @@
-import { t as w } from "./isDefined-fMi6eQ4r.js";
-import { a as Q } from "./theme-B2EaXhye.js";
-import { t as B } from "./Heading-pXllCJCO.js";
-import { isFunction as _, isNumber as U, isString as V } from "@sniptt/guards";
-import { clsx as f } from "clsx";
+import { t as B } from "./isDefined-fMi6eQ4r.js";
+import { a as u } from "./theme-B2EaXhye.js";
+import { t as E } from "./Heading-Nj5BlPqB.js";
+import { isFunction as _, isNumber as U, isString as f } from "@sniptt/guards";
+import { clsx as y } from "clsx";
 import { jsx as a, jsxs as l } from "react/jsx-runtime";
-var q = {
+var P = {
   test: "error",
   config: { rules: [{
     id: "color-contrast",
     enabled: !1
   }] }
-}, T = "_layout_17ld0_1", y = { layout: T }, F = ({ width: e, backgroundColor: r, height: A, children: t }) => /* @__PURE__ */ a("div", {
-  className: y.layout,
+}, T = "_layout_17ld0_1", V = { layout: T }, F = ({ width: e, backgroundColor: A, height: r, children: t }) => /* @__PURE__ */ a("div", {
+  className: V.layout,
   style: {
-    background: r,
-    height: w(A) ? `${A}px` : "fit-content",
+    background: A,
+    height: B(r) ? `${r}px` : "fit-content",
     minWidth: e ? "unset" : "300px",
     width: e ? `${e}px` : "fit-content"
   },
   children: t
-}), M = "_columnTitle_5dert_1", N = "_rowsTitle_5dert_7", k = "_rowTitle_5dert_15", S = "_elementTitle_5dert_23", b = "_container_5dert_32", I = "_columnContainer_5dert_37", D = "_rowsContainer_5dert_43", L = "_rowContainer_5dert_49", W = "_elementContainer_5dert_56", j = "_cellContainer_5dert_60", i = {
+}), M = "_columnTitle_5dert_1", S = "_rowsTitle_5dert_7", N = "_rowTitle_5dert_15", k = "_elementTitle_5dert_23", I = "_container_5dert_32", b = "_columnContainer_5dert_37", D = "_rowsContainer_5dert_43", L = "_rowContainer_5dert_49", K = "_elementContainer_5dert_56", W = "_cellContainer_5dert_60", o = {
   columnTitle: M,
-  rowsTitle: N,
-  rowTitle: k,
-  elementTitle: S,
-  container: b,
-  columnContainer: I,
+  rowsTitle: S,
+  rowTitle: N,
+  elementTitle: k,
+  container: I,
+  columnContainer: b,
   rowsContainer: D,
   rowContainer: L,
-  elementContainer: W,
-  cellContainer: j
+  elementContainer: K,
+  cellContainer: W
 }, g = {
   name: "",
   values: [void 0],
   props: () => ({})
-}, p = (e) => V(e) || U(e), $ = (e, r) => {
-  const { catalog: { dimensions: A = [], options: t = {} } = {
+}, p = (e) => f(e) || U(e), $ = (e, A) => {
+  const { catalog: { dimensions: r = [], options: t = {} } = {
     dimensions: [],
     options: {}
-  } } = r.parameters || {};
-  if (!A || !Array.isArray(A)) return /* @__PURE__ */ a(e, {});
-  const [n = g, o = g, C = g, h = g] = A;
+  } } = A.parameters || {};
+  if (!r || !Array.isArray(r)) return /* @__PURE__ */ a(e, {});
+  const [n = g, i = g, C = g, h = g] = r;
   return /* @__PURE__ */ a("div", {
-    className: i.container,
-    children: h.values.map((c, u) => /* @__PURE__ */ l("div", {
-      className: i.columnContainer,
+    className: o.container,
+    children: h.values.map((d, v) => /* @__PURE__ */ l("div", {
+      className: o.columnContainer,
       children: [/* @__PURE__ */ a("div", {
-        className: i.columnTitle,
-        children: h.labels?.(c) ?? (p(c) ? c : "")
-      }), C.values.map((d, v) => /* @__PURE__ */ l("div", {
-        className: i.rowsContainer,
+        className: o.columnTitle,
+        children: h.labels?.(d) ?? (p(d) ? d : "")
+      }), C.values.map((c, Q) => /* @__PURE__ */ l("div", {
+        className: o.rowsContainer,
         children: [/* @__PURE__ */ a("div", {
-          className: i.rowsTitle,
-          children: C.labels?.(d) ?? (p(d) ? d : "")
-        }), o.values.map((m, R) => /* @__PURE__ */ l("div", {
-          className: i.rowContainer,
+          className: o.rowsTitle,
+          children: C.labels?.(c) ?? (p(c) ? c : "")
+        }), i.values.map((m, R) => /* @__PURE__ */ l("div", {
+          className: o.rowContainer,
           children: [/* @__PURE__ */ a("div", {
-            className: i.rowTitle,
-            children: o.labels?.(m) ?? (p(m) ? m : "")
-          }), n.values.map((s, E) => /* @__PURE__ */ l("div", {
-            className: i.cellContainer,
-            id: A.length > 1 ? `catalog-cell-${u}-${v}-${R}-${E}` : s,
+            className: o.rowTitle,
+            children: i.labels?.(m) ?? (p(m) ? m : "")
+          }), n.values.map((s, w) => /* @__PURE__ */ l("div", {
+            className: o.cellContainer,
+            id: r.length > 1 ? `catalog-cell-${v}-${Q}-${R}-${w}` : s,
             children: [/* @__PURE__ */ a("span", {
-              className: i.elementTitle,
+              className: o.elementTitle,
               children: n.labels?.(s) ?? (p(s) ? s : "")
             }), /* @__PURE__ */ a("div", {
-              className: f(i.elementContainer, t?.elementContainer?.className),
+              className: y(o.elementContainer, t?.elementContainer?.className),
               style: {
                 minWidth: t?.elementContainer?.width ? `${t.elementContainer.width}px` : "auto",
                 ...t?.elementContainer?.style
               },
               children: /* @__PURE__ */ a(e, { args: {
-                ...r.args,
+                ...A.args,
                 ...n.props(s),
-                ...o.props(m),
-                ...C.props(d),
-                ...h.props(c)
+                ...i.props(m),
+                ...C.props(c),
+                ...h.props(d)
               } })
             })]
-          }, `d1-${E}`))]
+          }, `d1-${w}`))]
         }, `d2-${R}`))]
-      }, `d3-${v}`))]
-    }, `d4-${u}`))
+      }, `d3-${Q}`))]
+    }, `d4-${v}`))
   });
-}, K = (e, r) => {
+}, j = (e, A) => {
   if (e)
-    switch (r) {
+    switch (A) {
       case "default":
-        return Q.grayScale.gray11;
+        return u.grayScale.gray11;
       case "danger":
-        return Q.color.red;
+        return u.color.red;
       case "blue":
-        return Q.color.blue;
+        return u.color.blue;
       default:
         return;
     }
-}, P = (e, r) => {
-  const { container: A } = r.parameters, t = r.args.inverted, n = r.args.accent, o = K(t, n);
+}, x = (e, A) => {
+  const { container: r } = A.parameters, t = A.args.inverted, n = A.args.accent, i = j(t, n);
   return /* @__PURE__ */ a(F, {
-    width: A?.width,
-    height: A?.height,
-    backgroundColor: o,
+    width: r?.width,
+    height: r?.height,
+    backgroundColor: i,
     children: /* @__PURE__ */ a(e, {})
   });
-}, x = ({ groups: e, renderExample: r }) => /* @__PURE__ */ a("div", {
+}, z = ({ groups: e, renderExample: A }) => /* @__PURE__ */ a("div", {
   style: {
     display: "grid",
     gap: "var(--t-spacing-6)",
     width: "100%"
   },
-  children: e.map(({ label: A, examples: t }) => /* @__PURE__ */ l("section", {
-    "aria-label": A,
-    children: [/* @__PURE__ */ a(B, {
+  children: e.map(({ label: r, examples: t }) => /* @__PURE__ */ l("section", {
+    "aria-label": r,
+    children: [/* @__PURE__ */ a(E, {
       level: 3,
-      children: A
+      children: r
     }), /* @__PURE__ */ a("div", {
       style: {
         display: "flex",
@@ -127,11 +127,11 @@ var q = {
           gap: "var(--t-spacing-2)",
           justifyItems: "start"
         },
-        children: r(n)
+        children: A(n)
       }, n.label))
     })]
-  }, A))
-}), z = "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAYABgAAD/4QCMRXhpZgAATU0AKgAAAAgABQESAAMAAAABAAEAAAEaAAUAAAABAAAASgEbAAUAAAABAAAAUgEoAAMAAAABAAIAAIdpAAQAAAABAAAAWgAAAAAAAABgAAAAAQAAAGAAAAABAAOgAQADAAAAAQABAACgAgAEAAAAAQAAABSgAwAEAAAAAQAAABQAAAAA/8AAEQgAFAAUAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/bAEMACwgICggHCwoJCg0MCw0RHBIRDw8RIhkaFBwpJCsqKCQnJy0yQDctMD0wJyc4TDk9Q0VISUgrNk9VTkZUQEdIRf/bAEMBDA0NEQ8RIRISIUUuJy5FRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRf/dAAQAAv/aAAwDAQACEQMRAD8Ava1q728otYY98joSCTgZrnbXWdTtrhrfVZXWLafmcAEkdgR/hVltQku9Q8+OIEBcGOT+ID0PY1ka1KH2u8ToqnPLbmIqG7u6LtbQ7RXBRec4Uck9eKXcPWsKDWVnhWSL5kYcFelSf2m3901POh8jP//QoyIAnTuKpXsY82NsksUyWPU5q/L9z8RVK++/F/uCsVsaEURwgA4HtT9x9TUcf3KfUGh//9k=", Y = (e) => Object.assign(new EventTarget(), {
+  }, r))
+}), ee = "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAYABgAAD/4QCMRXhpZgAATU0AKgAAAAgABQESAAMAAAABAAEAAAEaAAUAAAABAAAASgEbAAUAAAABAAAAUgEoAAMAAAABAAIAAIdpAAQAAAABAAAAWgAAAAAAAABgAAAAAQAAAGAAAAABAAOgAQADAAAAAQABAACgAgAEAAAAAQAAABSgAwAEAAAAAQAAABQAAAAA/8AAEQgAFAAUAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/bAEMACwgICggHCwoJCg0MCw0RHBIRDw8RIhkaFBwpJCsqKCQnJy0yQDctMD0wJyc4TDk9Q0VISUgrNk9VTkZUQEdIRf/bAEMBDA0NEQ8RIRISIUUuJy5FRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRUVFRf/dAAQAAv/aAAwDAQACEQMRAD8Ava1q728otYY98joSCTgZrnbXWdTtrhrfVZXWLafmcAEkdgR/hVltQku9Q8+OIEBcGOT+ID0PY1ka1KH2u8ToqnPLbmIqG7u6LtbQ7RXBRec4Uck9eKXcPWsKDWVnhWSL5kYcFelSf2m3901POh8jP//QoyIAnTuKpXsY82NsksUyWPU5q/L9z8RVK++/F/uCsVsaEURwgA4HtT9x9TUcf3KfUGh//9k=", Y = (e) => Object.assign(new EventTarget(), {
   media: e,
   matches: !1,
   onchange: null,
@@ -139,21 +139,31 @@ var q = {
   },
   removeListener: () => {
   }
-}), ee = (e) => {
-  const r = window.matchMedia;
-  return window.matchMedia = (A) => {
-    const t = _(r) ? r.call(window, A) : Y(A), n = e[A];
-    return w(n) && Object.defineProperty(t, "matches", { value: n }), t;
+}), re = (e) => {
+  const A = window.matchMedia;
+  return window.matchMedia = (r) => {
+    const t = _(A) ? A.call(window, r) : Y(r), n = e[r];
+    return B(n) && Object.defineProperty(t, "matches", { value: n }), t;
   }, () => {
-    window.matchMedia = r;
+    window.matchMedia = A;
   };
+}, O = [
+  "400 1em Inter",
+  "500 1em Inter",
+  "600 1em Inter",
+  "700 1em Inter",
+  '400 1em "DM Mono"',
+  '500 1em "DM Mono"'
+], Ae = async () => {
+  await Promise.all(O.map((e) => document.fonts.load(e))), await document.fonts.ready;
 };
 export {
-  q as A11Y_DEFER_COLOR_CONTRAST,
-  z as AVATAR_URL_MOCK,
+  P as A11Y_DEFER_COLOR_CONTRAST,
+  ee as AVATAR_URL_MOCK,
   $ as CatalogDecorator,
-  P as ComponentDecorator,
+  x as ComponentDecorator,
   F as ComponentStorybookLayout,
-  x as GroupedCatalog,
-  ee as overrideMediaQueryMatches
+  z as GroupedCatalog,
+  re as overrideMediaQueryMatches,
+  Ae as waitForStorybookFontsLoaded
 };

package/dist/{typography-bKeSMuJd.cjs → typography-B05olPwL.cjs}

@@ -1 +1 @@
-const t=require("./Shortcut-N8TELGPI.cjs"),o=require("./OverflowingTextWithTooltip-Z2daM0_x.cjs");let i=require("react/jsx-runtime");var n=({mode:e,children:r})=>(0,i.jsx)(o.OverflowingTextTooltipModeContext.Provider,{value:e,children:r}),u=e=>t.getShortcutPresentation(e).text;Object.defineProperty(exports,"OverflowingTextTooltipModeProvider",{enumerable:!0,get:function(){return n}});Object.defineProperty(exports,"formatShortcut",{enumerable:!0,get:function(){return u}});
+const t=require("./Shortcut-N8TELGPI.cjs"),o=require("./OverflowingTextWithTooltip-ClpPsdpP.cjs");let i=require("react/jsx-runtime");var n=({mode:e,children:r})=>(0,i.jsx)(o.OverflowingTextTooltipModeContext.Provider,{value:e,children:r}),u=e=>t.getShortcutPresentation(e).text;Object.defineProperty(exports,"OverflowingTextTooltipModeProvider",{enumerable:!0,get:function(){return n}});Object.defineProperty(exports,"formatShortcut",{enumerable:!0,get:function(){return u}});

package/dist/{typography-DT2eKLvd.js → typography-BwyZEDDi.js}

@@ -1,5 +1,5 @@
 import { n as r } from "./Shortcut-Bp9iDdQg.js";
-import { n as e } from "./OverflowingTextWithTooltip-BmUROIah.js";
+import { n as e } from "./OverflowingTextWithTooltip-D4eZc-7P.js";
 import { jsx as i } from "react/jsx-runtime";
 var v = ({ mode: o, children: t }) => /* @__PURE__ */ i(e.Provider, {
   value: o,

package/dist/utilities/color/utils/themeColorSchema.d.ts

@@ -1,28 +1,28 @@
 import { z } from 'zod';
 export declare const themeColorSchema: z.ZodEnum<{
     ruby: "ruby";
-    red: "red";
+    blue: "blue";
+    brown: "brown";
     crimson: "crimson";
-    tomato: "tomato";
+    cyan: "cyan";
+    gold: "gold";
+    gray: "gray";
+    green: "green";
+    lime: "lime";
     orange: "orange";
-    amber: "amber";
+    pink: "pink";
+    plum: "plum";
+    purple: "purple";
+    red: "red";
+    tomato: "tomato";
+    turquoise: "turquoise";
+    violet: "violet";
     yellow: "yellow";
-    lime: "lime";
+    amber: "amber";
     grass: "grass";
-    green: "green";
     jade: "jade";
     mint: "mint";
-    turquoise: "turquoise";
-    cyan: "cyan";
     sky: "sky";
-    blue: "blue";
     iris: "iris";
-    violet: "violet";
-    purple: "purple";
-    plum: "plum";
-    pink: "pink";
     bronze: "bronze";
-    gold: "gold";
-    brown: "brown";
-    gray: "gray";
 }>;

package/dist/utilities.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("./isDefined-DS2Q42p5.cjs"),e=require("./utilities-xZh8D2gd.cjs"),i=require("./useIsMobile-Byp9AIq-.cjs"),r=require("./preventDismissingClickActivation-CIhWvKCu.cjs");exports.MOBILE_MEDIA_QUERY=i.MOBILE_MEDIA_QUERY;exports.TOUCH_DEVICE_MEDIA_QUERY=e.TOUCH_DEVICE_MEDIA_QUERY;exports.getMainColorNameFromPaletteColorName=e.getMainColorNameFromPaletteColorName;exports.getOsControlSymbol=e.getOsControlSymbol;exports.getSafeUrl=e.getSafeUrl;exports.getUserDevice=i.getUserDevice;exports.isDefined=o.isDefined;exports.normalizeSearchText=r.normalizeSearchText;exports.parseThemeColor=e.parseThemeColor;exports.preventDismissingClickActivation=r.preventDismissingClickActivation;exports.stringToThemeColor=e.stringToThemeColor;exports.stringToThemeColorP3String=e.stringToThemeColorP3String;exports.themeColorSchema=e.themeColorSchema;exports.useIsMobile=i.useIsMobile;exports.useIsTouchDevice=e.useIsTouchDevice;exports.useMediaQuery=i.useMediaQuery;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("./isDefined-DS2Q42p5.cjs"),e=require("./utilities-xZh8D2gd.cjs"),r=require("./useIsMobile-Byp9AIq-.cjs"),o=require("./normalizeSearchText-Do0MELpQ.cjs"),t=require("./preventDismissingClickActivation-BEBrL9aB.cjs");exports.MOBILE_MEDIA_QUERY=r.MOBILE_MEDIA_QUERY;exports.TOUCH_DEVICE_MEDIA_QUERY=e.TOUCH_DEVICE_MEDIA_QUERY;exports.getMainColorNameFromPaletteColorName=e.getMainColorNameFromPaletteColorName;exports.getOsControlSymbol=e.getOsControlSymbol;exports.getSafeUrl=e.getSafeUrl;exports.getUserDevice=r.getUserDevice;exports.isDefined=i.isDefined;exports.normalizeSearchText=o.normalizeSearchText;exports.parseThemeColor=e.parseThemeColor;exports.preventDismissingClickActivation=t.preventDismissingClickActivation;exports.stringToThemeColor=e.stringToThemeColor;exports.stringToThemeColorP3String=e.stringToThemeColorP3String;exports.themeColorSchema=e.themeColorSchema;exports.useIsMobile=r.useIsMobile;exports.useIsTouchDevice=e.useIsTouchDevice;exports.useMediaQuery=r.useMediaQuery;

package/dist/utilities.mjs

@@ -1,22 +1,23 @@
 import { t as o } from "./isDefined-fMi6eQ4r.js";
-import { a as r, c as a, i as t, l as i, n as m, o as l, r as n, s as C, t as c } from "./utilities-BKCMZyqZ.js";
-import { i as T, n as h, r as p, t as D } from "./useIsMobile-D1ImfQnE.js";
-import { n as f, t as I } from "./preventDismissingClickActivation-AaqHBLnW.js";
+import { a as s, c as a, i as t, l as i, n as m, o as l, r as n, s as C, t as c } from "./utilities-BKCMZyqZ.js";
+import { i as p, n as T, r as f, t as h } from "./useIsMobile-D1ImfQnE.js";
+import { t as E } from "./normalizeSearchText-DLmPiBUZ.js";
+import { t as M } from "./preventDismissingClickActivation-BQFMKRey.js";
 export {
-  p as MOBILE_MEDIA_QUERY,
+  f as MOBILE_MEDIA_QUERY,
   n as TOUCH_DEVICE_MEDIA_QUERY,
   i as getMainColorNameFromPaletteColorName,
   t as getOsControlSymbol,
   c as getSafeUrl,
-  T as getUserDevice,
+  p as getUserDevice,
   o as isDefined,
-  f as normalizeSearchText,
+  E as normalizeSearchText,
   C as parseThemeColor,
-  I as preventDismissingClickActivation,
-  r as stringToThemeColor,
+  M as preventDismissingClickActivation,
+  s as stringToThemeColor,
   l as stringToThemeColorP3String,
   a as themeColorSchema,
-  D as useIsMobile,
+  h as useIsMobile,
   m as useIsTouchDevice,
-  h as useMediaQuery
+  T as useMediaQuery
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "twenty-ui",
-  "version": "2.49.0",
+  "version": "2.51.1",
   "description": "Twenty's shared React UI component library.",
   "license": "MIT",
   "repository": {
@@ -51,6 +51,7 @@
     "@vitejs/plugin-react-swc": "^4.3.1",
     "@vitest/browser-playwright": "^4.1.0",
     "esbuild": "^0.28.1",
+    "frimousse": "^0.4.0",
     "glob": "^11.1.0",
     "jsdom": "^30.0.1",
     "lightningcss": "^1.32.0",
@@ -80,6 +81,7 @@
     "@sniptt/guards": "^0.2.0",
     "@tabler/icons-react": "^3.31.0",
     "clsx": "^2.1.1",
+    "react-datepicker": "^9.1.0",
     "type-fest": "^4.10.1",
     "zod": "^4.1.11"
   },

package/dist/Avatar-C6WxBgjS.cjs

@@ -1 +0,0 @@
-const I=require("./theme-1XkFz8Qu.cjs"),u=require("./isDefined-DS2Q42p5.cjs"),P=require("./doNotTranslate-CHE7WmRS.cjs"),q=require("./mergeClassNames-D4lshrT6.cjs"),h=require("./utilities-xZh8D2gd.cjs");let k=require("@sniptt/guards"),n=require("react/jsx-runtime"),A=require("@base-ui/react/avatar");var S="_root_14f7e_1",y="_avatarPulsing_14f7e_1",L="_image_14f7e_89",w="_fallback_14f7e_101",N={root:S,avatarPulsing:y,image:L,fallback:w},C=({className:a,...e})=>(0,n.jsx)(A.Avatar.Fallback,{...e,className:q.mergeClassNames(N.fallback,a)}),T=({className:a,...e})=>(0,n.jsx)(A.Avatar.Image,{...e,className:q.mergeClassNames(N.image,a)}),p=a=>a?.trim().charAt(0).toUpperCase(),x=({name:a,colorSeed:e=a,size:i="md",shape:g="square",variant:v="soft",color:m,backgroundColor:b,borderColor:_,pulsing:s=!1,ring:l=!1,className:o,style:c,...r})=>{const t=I.useTheme(),d=p(a),D=d?m??h.stringToThemeColorP3String({string:e??"",variant:12,theme:t}):m??t.font.color.tertiary,F=d?b??h.stringToThemeColorP3String({string:e??"",variant:v==="outline"?5:4,theme:t}):b??t.background.transparent.light,j=_??(d?h.stringToThemeColorP3String({string:e??"",variant:6,theme:t}):void 0);return(0,n.jsx)(A.Avatar.Root,{...r,"data-size":i,"data-shape":g,"data-pulsing":s||void 0,"data-ring":l||void 0,className:q.mergeClassNames(N.root,o),style:f=>({"--tw-avatar-color":D,"--tw-avatar-background":f.imageLoadingStatus==="loaded"?"none":F,"--tw-avatar-border":v==="outline"&&f.imageLoadingStatus!=="loaded"&&j?P.doNotTranslate(`1px solid ${j}`):"none",...(0,k.isFunction)(c)?c(f):c})})},B=({src:a,name:e,icon:i,imageProps:g,fallbackProps:v,backgroundColor:m,...b})=>{const _=p(e),s=u.isDefined(i)&&!(0,k.isBoolean)(i)&&i!=="",l=g?.alt??"",o=!s&&(0,k.isNonEmptyString)(l),{children:c=s?i:_||"-",...r}=v??{},t=u.isDefined(r.role)||u.isDefined(r["aria-label"])||u.isDefined(r["aria-labelledby"]),d=!o&&!t&&!u.isDefined(r.render);return(0,n.jsxs)(x,{...b,name:e,backgroundColor:s?"inherit":m,children:[!s&&(0,n.jsx)(T,{src:a??void 0,...g,alt:l}),(0,n.jsx)(C,{role:o?"img":void 0,"aria-label":o?l:void 0,"aria-hidden":d||void 0,...r,children:c})]})},R=Object.assign(B,{Root:x,Image:T,Fallback:C});Object.defineProperty(exports,"Avatar",{enumerable:!0,get:function(){return R}});