twenty-ui 2.45.0 → 2.46.0

package/dist/components/code-editor.cjs

@@ -1 +1 @@
-var Z=Object.create;var F=Object.defineProperty;var ee=Object.getOwnPropertyDescriptor;var oe=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,te=Object.prototype.hasOwnProperty;var ne=(e,r,n,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of oe(r))!te.call(e,i)&&i!==n&&F(e,i,{get:()=>r[i],enumerable:!(a=ee(r,i))||a.enumerable});return e};var ie=(e,r,n)=>(n=e!=null?Z(re(e)):{},ne(r||!e||!e.__esModule?F(n,"default",{value:e,enumerable:!0}):n,e));Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const D=require("../theme-DumxXtpW.cjs"),l=require("../isDefined-DS2Q42p5.cjs"),de=require("../Loader-CMXdrX1d.cjs"),ae=require("../ResizeHandle-CI-VTVOi.cjs");let d=require("react/jsx-runtime"),s=require("react"),C=require("@monaco-editor/react");C=D.__toESM(C,1);var $="baseCodeEditorTheme",o=e=>{if(e.trim()==="transparent")return"#00000000";const r=e.match(/color\(display-p3\s+([\d.]+)\s+([\d.]+)\s+([\d.]+)(?:\s+\/\s+([\d.]+))?\)/);if(l.isDefined(r)){const[,n,a,i,b]=r;if(!l.isDefined(n)||!l.isDefined(a)||!l.isDefined(i))return e;const g=Math.round(parseFloat(n)*255).toString(16).padStart(2,"0"),p=Math.round(parseFloat(a)*255).toString(16).padStart(2,"0"),_=Math.round(parseFloat(i)*255).toString(16).padStart(2,"0");return l.isDefined(b)?`#${g}${p}${_}${Math.round(parseFloat(b)*255).toString(16).padStart(2,"0")}`:`#${g}${p}${_}`}return e},se=(e,r)=>({base:r==="dark"?"vs-dark":"vs",inherit:!0,rules:[{token:"",foreground:o(e.font.color.secondary)},{token:"keyword",foreground:o(e.color.pink11)},{token:"keyword.control",foreground:o(e.color.pink11)},{token:"keyword.json",foreground:o(e.color.orange11)},{token:"number",foreground:o(e.color.orange11)},{token:"number.json",foreground:o(e.color.orange11)},{token:"regexp",foreground:o(e.color.orange11)},{token:"type",foreground:o(e.color.green11)},{token:"attribute.name",foreground:o(e.color.blue11)},{token:"tag",foreground:o(e.color.pink11)},{token:"string",foreground:o(e.color.green11)},{token:"string.key.json",foreground:o(e.color.blue11)},{token:"delimiter",foreground:o(e.font.color.light)},{token:"delimiter.bracket.json",foreground:o(e.font.color.light)},{token:"string.value.json",foreground:o(e.color.green11)},{token:"comment",foreground:o(e.font.color.light),fontStyle:"italic"}],colors:{"editor.background":o("transparent"),"editor.foreground":o(e.font.color.secondary),"editorCursor.foreground":o(e.font.color.primary),"editorLineNumber.foreground":o(e.font.color.extraLight),"editorLineNumber.activeForeground":o(e.font.color.light),"editor.lineHighlightBackground":o(e.background.tertiary),"editor.selectionBackground":o(e.background.transparent.blue),"editor.inactiveSelectionBackground":o(e.background.transparent.light),"editorIndentGuide.background1":o(e.border.color.light),"editorIndentGuide.activeBackground1":o(e.border.color.medium),"editorBracketMatch.background":o(e.background.transparent.light),"editorBracketMatch.border":o(e.border.color.medium)}}),le="_editorLoader_zilk9_1",ue="_container_zilk9_20",ce="_editorWrapper_zilk9_24",S={editorLoader:le,container:ue,editorWrapper:ce},z,ge=()=>(z??=import("monaco-editor").then(e=>{C.loader.config({monaco:e})}),z),I=(e,r,n)=>{e.editor.defineTheme($,se(r,n)),e.editor.setTheme($)},fe=({value:e,language:r,onMount:n,onChange:a,setMarkers:i,onValidate:b,height:g=450,variant:p="default",transparentBackground:_,isLoading:O=!1,options:P,resizable:M=!1,resizeLabel:N="Resize editor",contentPadding:w="default",autoHeight:R=!1})=>{const f=D.useTheme(),y=D.useThemeColorScheme(),[h,W]=(0,s.useState)(void 0),[k,A]=(0,s.useState)(void 0),[V,j]=(0,s.useState)(!1),[G,K]=(0,s.useState)(!1),[J,L]=(0,s.useState)(void 0),[q,Q]=(0,s.useState)(typeof g=="number"?g:450),T=(0,s.useId)(),E=R&&!M,H=typeof f.spacingMultiplicator=="number"?f.spacingMultiplicator*4:void 0,m=E?J??g:M?q:g,U={...w==="comfortable"?{lineDecorationsWidth:H}:{},padding:{bottom:H,top:H}},{padding:be,...X}=P??{},B=(t,u)=>{const c=t?.getModel();if(!l.isDefined(c))return;const v=i?.(c.getValue());l.isDefined(v)&&u?.editor.setModelMarkers(c,"customMarker",v)},Y=t=>{V&&t.stopPropagation()};return(0,s.useEffect)(()=>{let t=!0;return ge().then(()=>{t&&K(!0)}),()=>{t=!1}},[]),(0,s.useEffect)(()=>{l.isDefined(h)&&I(h,f,y)},[y,h,f]),(0,s.useEffect)(()=>{if(!E||!l.isDefined(k)){L(void 0);return}const t=()=>{const c=k.getContentHeight();!Number.isFinite(c)||c<=0||L(v=>v===c?v:c)};t();const u=k.onDidContentSizeChange(t);return()=>{u.dispose()}},[k,E]),O||!G?(0,d.jsx)("div",{className:S.editorLoader,"data-variant":p,style:{"--code-editor-height":typeof m=="number"?`${m}px`:m},children:(0,d.jsx)(de.Loader,{})}):(0,d.jsxs)("div",{className:S.container,onKeyDown:Y,children:[(0,d.jsx)("input",{type:"hidden","data-testid":"code-editor-value",value:e??"",readOnly:!0}),(0,d.jsx)("div",{id:T,className:S.editorWrapper,"data-variant":p,"data-transparent-background":_||void 0,children:(0,d.jsx)(C.default,{height:m,value:e,language:r,loading:"",onMount:(t,u)=>{W(u),A(t),I(u,f,y),t.onDidFocusEditorWidget(()=>{j(!0)}),t.onDidBlurEditorWidget(()=>{j(!1)}),n?.(t,u),B(t,u)},onChange:t=>{l.isDefined(t)&&(a?.(t),B(k,h))},onValidate:t=>{b?.(t)},options:{formatOnPaste:!0,formatOnType:!0,fontFamily:f.code.font.family,bracketPairColorization:{enabled:!1},overviewRulerLanes:0,scrollBeyondLastLine:!1,scrollbar:{vertical:"hidden",horizontal:"hidden"},minimap:{enabled:!1},...X,...U}})}),M&&(0,d.jsx)(ae.ResizeHandle,{"aria-label":N,"aria-controls":T,value:q,onValueChange:Q})]})},pe="_editorHeader_19qlo_1",ke="_elementContainer_19qlo_15",x={editorHeader:pe,elementContainer:ke},ve=({title:e,leftNodes:r,rightNodes:n})=>(0,d.jsxs)("div",{className:x.editorHeader,children:[(0,d.jsxs)("div",{className:x.elementContainer,children:[r&&r.map((a,i)=>(0,d.jsx)("div",{children:a},`left-${i}`)),e]}),(0,d.jsx)("div",{className:x.elementContainer,children:n&&n.map((a,i)=>(0,d.jsx)("div",{children:a},`right-${i}`))})]});exports.CodeEditor=fe;exports.CodeEditorHeader=ve;
+var Z=Object.create;var B=Object.defineProperty;var ee=Object.getOwnPropertyDescriptor;var oe=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,te=Object.prototype.hasOwnProperty;var ne=(e,t,n,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of oe(t))!te.call(e,i)&&i!==n&&B(e,i,{get:()=>t[i],enumerable:!(l=ee(t,i))||l.enumerable});return e};var ie=(e,t,n)=>(n=e!=null?Z(re(e)):{},ne(t||!e||!e.__esModule?B(n,"default",{value:e,enumerable:!0}):n,e));Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const D=require("../theme-Zf62UE02.cjs"),s=require("../isDefined-DS2Q42p5.cjs"),de=require("../Loader-GFhTL4Aw.cjs"),ae=require("../ResizeHandle-BGboQXCx.cjs");let se=require("@base-ui/react/use-render"),le=require("clsx"),a=require("react"),d=require("react/jsx-runtime"),C=require("@monaco-editor/react");C=D.__toESM(C,1);var z="baseCodeEditorTheme",o=e=>{if(e.trim()==="transparent")return"#00000000";const t=e.match(/color\(display-p3\s+([\d.]+)\s+([\d.]+)\s+([\d.]+)(?:\s+\/\s+([\d.]+))?\)/);if(s.isDefined(t)){const[,n,l,i,f]=t;if(!s.isDefined(n)||!s.isDefined(l)||!s.isDefined(i))return e;const u=Math.round(parseFloat(n)*255).toString(16).padStart(2,"0"),k=Math.round(parseFloat(l)*255).toString(16).padStart(2,"0"),v=Math.round(parseFloat(i)*255).toString(16).padStart(2,"0");return s.isDefined(f)?`#${u}${k}${v}${Math.round(parseFloat(f)*255).toString(16).padStart(2,"0")}`:`#${u}${k}${v}`}return e},ue=(e,t)=>({base:t==="dark"?"vs-dark":"vs",inherit:!0,rules:[{token:"",foreground:o(e.font.color.secondary)},{token:"keyword",foreground:o(e.color.pink11)},{token:"keyword.control",foreground:o(e.color.pink11)},{token:"keyword.json",foreground:o(e.color.orange11)},{token:"number",foreground:o(e.color.orange11)},{token:"number.json",foreground:o(e.color.orange11)},{token:"regexp",foreground:o(e.color.orange11)},{token:"type",foreground:o(e.color.green11)},{token:"attribute.name",foreground:o(e.color.blue11)},{token:"tag",foreground:o(e.color.pink11)},{token:"string",foreground:o(e.color.green11)},{token:"string.key.json",foreground:o(e.color.blue11)},{token:"delimiter",foreground:o(e.font.color.light)},{token:"delimiter.bracket.json",foreground:o(e.font.color.light)},{token:"string.value.json",foreground:o(e.color.green11)},{token:"comment",foreground:o(e.font.color.light),fontStyle:"italic"}],colors:{"editor.background":o("transparent"),"editor.foreground":o(e.font.color.secondary),"editorCursor.foreground":o(e.font.color.primary),"editorLineNumber.foreground":o(e.font.color.extraLight),"editorLineNumber.activeForeground":o(e.font.color.light),"editor.lineHighlightBackground":o(e.background.tertiary),"editor.selectionBackground":o(e.background.transparent.blue),"editor.inactiveSelectionBackground":o(e.background.transparent.light),"editorIndentGuide.background1":o(e.border.color.light),"editorIndentGuide.activeBackground1":o(e.border.color.medium),"editorBracketMatch.background":o(e.background.transparent.light),"editorBracketMatch.border":o(e.border.color.medium)}}),ce="_editorLoader_zilk9_1",ge="_container_zilk9_20",fe="_editorWrapper_zilk9_24",S={editorLoader:ce,container:ge,editorWrapper:fe},N,pe=()=>(N??=import("monaco-editor").then(e=>{C.loader.config({monaco:e})}),N),I=(e,t,n)=>{e.editor.defineTheme(z,ue(t,n)),e.editor.setTheme(z)},ke=({value:e,language:t,onMount:n,onChange:l,setMarkers:i,onValidate:f,height:u=450,variant:k="default",transparentBackground:v,isLoading:O=!1,options:P,resizable:M=!1,resizeLabel:$="Resize editor",contentPadding:R="default",autoHeight:w=!1})=>{const p=D.useTheme(),y=D.useThemeColorScheme(),[h,W]=(0,a.useState)(void 0),[_,A]=(0,a.useState)(void 0),[V,j]=(0,a.useState)(!1),[G,K]=(0,a.useState)(!1),[J,q]=(0,a.useState)(void 0),[L,Q]=(0,a.useState)(typeof u=="number"?u:450),T=(0,a.useId)(),E=w&&!M,H=typeof p.spacingMultiplicator=="number"?p.spacingMultiplicator*4:void 0,m=E?J??u:M?L:u,U={...R==="comfortable"?{lineDecorationsWidth:H}:{},padding:{bottom:H,top:H}},{padding:he,...X}=P??{},F=(r,c)=>{const g=r?.getModel();if(!s.isDefined(g))return;const b=i?.(g.getValue());s.isDefined(b)&&c?.editor.setModelMarkers(g,"customMarker",b)},Y=r=>{V&&r.stopPropagation()};return(0,a.useEffect)(()=>{let r=!0;return pe().then(()=>{r&&K(!0)}),()=>{r=!1}},[]),(0,a.useEffect)(()=>{s.isDefined(h)&&I(h,p,y)},[y,h,p]),(0,a.useEffect)(()=>{if(!E||!s.isDefined(_)){q(void 0);return}const r=()=>{const g=_.getContentHeight();!Number.isFinite(g)||g<=0||q(b=>b===g?b:g)};r();const c=_.onDidContentSizeChange(r);return()=>{c.dispose()}},[_,E]),O||!G?(0,d.jsx)("div",{className:S.editorLoader,"data-variant":k,style:{"--code-editor-height":typeof m=="number"?`${m}px`:m},children:(0,d.jsx)(de.Loader,{})}):(0,d.jsxs)("div",{className:S.container,onKeyDown:Y,children:[(0,d.jsx)("input",{type:"hidden","data-testid":"code-editor-value",value:e??"",readOnly:!0}),(0,d.jsx)("div",{id:T,className:S.editorWrapper,"data-variant":k,"data-transparent-background":v||void 0,children:(0,d.jsx)(C.default,{height:m,value:e,language:t,loading:"",onMount:(r,c)=>{W(c),A(r),I(c,p,y),r.onDidFocusEditorWidget(()=>{j(!0)}),r.onDidBlurEditorWidget(()=>{j(!1)}),n?.(r,c),F(r,c)},onChange:r=>{s.isDefined(r)&&(l?.(r),F(_,h))},onValidate:r=>{f?.(r)},options:{formatOnPaste:!0,formatOnType:!0,fontFamily:p.code.font.family,bracketPairColorization:{enabled:!1},overviewRulerLanes:0,scrollBeyondLastLine:!1,scrollbar:{vertical:"hidden",horizontal:"hidden"},minimap:{enabled:!1},...X,...U}})}),M&&(0,d.jsx)(ae.ResizeHandle,{"aria-label":$,"aria-controls":T,value:L,onValueChange:Q})]})},_e="_editorHeader_19qlo_1",be="_elementContainer_19qlo_15",x={editorHeader:_e,elementContainer:be},ve=({title:e,startElement:t,endElement:n,className:l,render:i,ref:f,...u})=>(0,se.useRender)({render:i,ref:f,props:{...u,className:(0,le.clsx)(x.editorHeader,l),children:(0,d.jsxs)(d.Fragment,{children:[(0,d.jsxs)("div",{className:x.elementContainer,children:[t,e]}),(0,d.jsx)("div",{className:x.elementContainer,children:n})]})}});exports.CodeEditor=ke;exports.CodeEditorHeader=ve;

package/dist/components/code-editor.mjs

@@ -1,21 +1,23 @@
 import { t as n } from "../isDefined-fMi6eQ4r.js";
-import { n as Y, r as Z } from "../theme-CjHovJAZ.js";
-import { t as oo } from "../Loader-BLkXvZli.js";
-import { t as ro } from "../ResizeHandle-CGYGfOVF.js";
-import { jsx as i, jsxs as x } from "react/jsx-runtime";
-import { useEffect as E, useId as eo, useState as f } from "react";
-import to, { loader as no } from "@monaco-editor/react";
-var z = "baseCodeEditorTheme", r = (o) => {
+import { n as Y, r as Z } from "../theme-yAk9zrNA.js";
+import { t as oo } from "../Loader-BBMC4fe6.js";
+import { t as ro } from "../ResizeHandle-X2NdHzqt.js";
+import { useRender as eo } from "@base-ui/react/use-render";
+import { clsx as to } from "clsx";
+import { useEffect as E, useId as no, useState as p } from "react";
+import { Fragment as ao, jsx as l, jsxs as x } from "react/jsx-runtime";
+import io, { loader as so } from "@monaco-editor/react";
+var $ = "baseCodeEditorTheme", r = (o) => {
   if (o.trim() === "transparent") return "#00000000";
   const t = o.match(/color\(display-p3\s+([\d.]+)\s+([\d.]+)\s+([\d.]+)(?:\s+\/\s+([\d.]+))?\)/);
   if (n(t)) {
-    const [, a, d, s, v] = t;
-    if (!n(a) || !n(d) || !n(s)) return o;
-    const u = Math.round(parseFloat(a) * 255).toString(16).padStart(2, "0"), p = Math.round(parseFloat(d) * 255).toString(16).padStart(2, "0"), b = Math.round(parseFloat(s) * 255).toString(16).padStart(2, "0");
-    return n(v) ? `#${u}${p}${b}${Math.round(parseFloat(v) * 255).toString(16).padStart(2, "0")}` : `#${u}${p}${b}`;
+    const [, i, c, u, g] = t;
+    if (!n(i) || !n(c) || !n(u)) return o;
+    const a = Math.round(parseFloat(i) * 255).toString(16).padStart(2, "0"), k = Math.round(parseFloat(c) * 255).toString(16).padStart(2, "0"), b = Math.round(parseFloat(u) * 255).toString(16).padStart(2, "0");
+    return n(g) ? `#${a}${k}${b}${Math.round(parseFloat(g) * 255).toString(16).padStart(2, "0")}` : `#${a}${k}${b}`;
   }
   return o;
-}, ao = (o, t) => ({
+}, lo = (o, t) => ({
   base: t === "dark" ? "vs-dark" : "vs",
   inherit: !0,
   rules: [
@@ -99,98 +101,98 @@ var z = "baseCodeEditorTheme", r = (o) => {
     "editorBracketMatch.background": r(o.background.transparent.light),
     "editorBracketMatch.border": r(o.border.color.medium)
   }
-}), io = "_editorLoader_zilk9_1", so = "_container_zilk9_20", lo = "_editorWrapper_zilk9_24", S = {
-  editorLoader: io,
-  container: so,
-  editorWrapper: lo
-}, I, co = () => (I ??= import("monaco-editor").then((o) => {
-  no.config({ monaco: o });
-}), I), j = (o, t, a) => {
-  o.editor.defineTheme(z, ao(t, a)), o.editor.setTheme(z);
-}, yo = ({ value: o, language: t, onMount: a, onChange: d, setMarkers: s, onValidate: v, height: u = 450, variant: p = "default", transparentBackground: b, isLoading: N = !1, options: O, resizable: y = !1, resizeLabel: P = "Resize editor", contentPadding: w = "default", autoHeight: W = !1 }) => {
-  const g = Z(), _ = Y(), [h, R] = f(void 0), [k, A] = f(void 0), [V, T] = f(!1), [q, G] = f(!1), [K, B] = f(void 0), [D, J] = f(typeof u == "number" ? u : 450), F = eo(), M = W && !y, H = typeof g.spacingMultiplicator == "number" ? g.spacingMultiplicator * 4 : void 0, C = M ? K ?? u : y ? D : u, Q = {
+}), co = "_editorLoader_zilk9_1", uo = "_container_zilk9_20", go = "_editorWrapper_zilk9_24", S = {
+  editorLoader: co,
+  container: uo,
+  editorWrapper: go
+}, z, fo = () => (z ??= import("monaco-editor").then((o) => {
+  so.config({ monaco: o });
+}), z), I = (o, t, i) => {
+  o.editor.defineTheme($, lo(t, i)), o.editor.setTheme($);
+}, So = ({ value: o, language: t, onMount: i, onChange: c, setMarkers: u, onValidate: g, height: a = 450, variant: k = "default", transparentBackground: b, isLoading: j = !1, options: O, resizable: y = !1, resizeLabel: P = "Resize editor", contentPadding: w = "default", autoHeight: R = !1 }) => {
+  const f = Z(), _ = Y(), [h, W] = p(void 0), [m, A] = p(void 0), [V, F] = p(!1), [q, G] = p(!1), [K, T] = p(void 0), [B, J] = p(typeof a == "number" ? a : 450), D = no(), M = R && !y, H = typeof f.spacingMultiplicator == "number" ? f.spacingMultiplicator * 4 : void 0, C = M ? K ?? a : y ? B : a, Q = {
     ...w === "comfortable" ? { lineDecorationsWidth: H } : {},
     padding: {
       bottom: H,
       top: H
     }
-  }, { padding: fo, ...U } = O ?? {}, $ = (e, l) => {
-    const c = e?.getModel();
-    if (!n(c)) return;
-    const m = s?.(c.getValue());
-    n(m) && l?.editor.setModelMarkers(c, "customMarker", m);
+  }, { padding: mo, ...U } = O ?? {}, N = (e, d) => {
+    const s = e?.getModel();
+    if (!n(s)) return;
+    const v = u?.(s.getValue());
+    n(v) && d?.editor.setModelMarkers(s, "customMarker", v);
   }, X = (e) => {
     V && e.stopPropagation();
   };
   return E(() => {
     let e = !0;
-    return co().then(() => {
+    return fo().then(() => {
       e && G(!0);
     }), () => {
       e = !1;
     };
   }, []), E(() => {
-    n(h) && j(h, g, _);
+    n(h) && I(h, f, _);
   }, [
     _,
     h,
-    g
+    f
   ]), E(() => {
-    if (!M || !n(k)) {
-      B(void 0);
+    if (!M || !n(m)) {
+      T(void 0);
       return;
     }
     const e = () => {
-      const c = k.getContentHeight();
-      !Number.isFinite(c) || c <= 0 || B((m) => m === c ? m : c);
+      const s = m.getContentHeight();
+      !Number.isFinite(s) || s <= 0 || T((v) => v === s ? v : s);
     };
     e();
-    const l = k.onDidContentSizeChange(e);
+    const d = m.onDidContentSizeChange(e);
     return () => {
-      l.dispose();
+      d.dispose();
     };
-  }, [k, M]), N || !q ? /* @__PURE__ */ i("div", {
+  }, [m, M]), j || !q ? /* @__PURE__ */ l("div", {
     className: S.editorLoader,
-    "data-variant": p,
+    "data-variant": k,
     style: { "--code-editor-height": typeof C == "number" ? `${C}px` : C },
-    children: /* @__PURE__ */ i(oo, {})
+    children: /* @__PURE__ */ l(oo, {})
   }) : /* @__PURE__ */ x("div", {
     className: S.container,
     onKeyDown: X,
     children: [
-      /* @__PURE__ */ i("input", {
+      /* @__PURE__ */ l("input", {
         type: "hidden",
         "data-testid": "code-editor-value",
         value: o ?? "",
         readOnly: !0
       }),
-      /* @__PURE__ */ i("div", {
-        id: F,
+      /* @__PURE__ */ l("div", {
+        id: D,
         className: S.editorWrapper,
-        "data-variant": p,
+        "data-variant": k,
         "data-transparent-background": b || void 0,
-        children: /* @__PURE__ */ i(to, {
+        children: /* @__PURE__ */ l(io, {
           height: C,
           value: o,
           language: t,
           loading: "",
-          onMount: (e, l) => {
-            R(l), A(e), j(l, g, _), e.onDidFocusEditorWidget(() => {
-              T(!0);
+          onMount: (e, d) => {
+            W(d), A(e), I(d, f, _), e.onDidFocusEditorWidget(() => {
+              F(!0);
             }), e.onDidBlurEditorWidget(() => {
-              T(!1);
-            }), a?.(e, l), $(e, l);
+              F(!1);
+            }), i?.(e, d), N(e, d);
           },
           onChange: (e) => {
-            n(e) && (d?.(e), $(k, h));
+            n(e) && (c?.(e), N(m, h));
           },
           onValidate: (e) => {
-            v?.(e);
+            g?.(e);
           },
           options: {
             formatOnPaste: !0,
             formatOnType: !0,
-            fontFamily: g.code.font.family,
+            fontFamily: f.code.font.family,
             bracketPairColorization: { enabled: !1 },
             overviewRulerLanes: 0,
             scrollBeyondLastLine: !1,
@@ -204,28 +206,33 @@ var z = "baseCodeEditorTheme", r = (o) => {
           }
         })
       }),
-      y && /* @__PURE__ */ i(ro, {
+      y && /* @__PURE__ */ l(ro, {
         "aria-label": P,
-        "aria-controls": F,
-        value: D,
+        "aria-controls": D,
+        value: B,
         onValueChange: J
       })
     ]
   });
-}, uo = "_editorHeader_19qlo_1", go = "_elementContainer_19qlo_15", L = {
-  editorHeader: uo,
-  elementContainer: go
-}, _o = ({ title: o, leftNodes: t, rightNodes: a }) => /* @__PURE__ */ x("div", {
-  className: L.editorHeader,
-  children: [/* @__PURE__ */ x("div", {
-    className: L.elementContainer,
-    children: [t && t.map((d, s) => /* @__PURE__ */ i("div", { children: d }, `left-${s}`)), o]
-  }), /* @__PURE__ */ i("div", {
-    className: L.elementContainer,
-    children: a && a.map((d, s) => /* @__PURE__ */ i("div", { children: d }, `right-${s}`))
-  })]
+}, po = "_editorHeader_19qlo_1", ko = "_elementContainer_19qlo_15", L = {
+  editorHeader: po,
+  elementContainer: ko
+}, Lo = ({ title: o, startElement: t, endElement: i, className: c, render: u, ref: g, ...a }) => eo({
+  render: u,
+  ref: g,
+  props: {
+    ...a,
+    className: to(L.editorHeader, c),
+    children: /* @__PURE__ */ x(ao, { children: [/* @__PURE__ */ x("div", {
+      className: L.elementContainer,
+      children: [t, o]
+    }), /* @__PURE__ */ l("div", {
+      className: L.elementContainer,
+      children: i
+    })] })
+  }
 });
 export {
-  yo as CodeEditor,
-  _o as CodeEditorHeader
+  So as CodeEditor,
+  Lo as CodeEditorHeader
 };

package/dist/components/data-display/AvatarGroup/AvatarGroup.d.ts

@@ -1,2 +1,2 @@
 import { AvatarGroupProps } from './types/AvatarGroupProps';
-export declare const AvatarGroup: ({ avatars, className, maxVisible, overflowAvatar, overflowCount, overflowShape, overlap, overlapOffset, }: AvatarGroupProps) => import("react").JSX.Element | null;
+export declare const AvatarGroup: ({ avatars, className, maxVisible, total, renderOverflow, overflowShape, overlap, overlapOffset, render, ref, ...props }: AvatarGroupProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | null;

package/dist/components/data-display/AvatarGroup/__stories__/AvatarGroupIdentityExample.d.ts

@@ -0,0 +1 @@
+export declare const AvatarGroupIdentityExample: () => import("react").JSX.Element;

package/dist/components/data-display/AvatarGroup/__stories__/AvatarGroupStatefulAvatar.d.ts

@@ -0,0 +1,3 @@
+export declare const AvatarGroupStatefulAvatar: ({ name }: {
+    name: string;
+}) => import("react").JSX.Element;

package/dist/components/data-display/AvatarGroup/types/AvatarGroupProps.d.ts

@@ -1,11 +1,11 @@
+import { useRender } from '@base-ui/react/use-render';
 import { ReactNode } from 'react';
 import { AvatarShape } from '../../../../primitives/data-display/Avatar/types/AvatarShape';
-export type AvatarGroupProps = {
+export type AvatarGroupProps = Omit<useRender.ComponentProps<'div'>, 'children'> & {
     avatars: ReactNode[];
-    className?: string;
     maxVisible?: number;
-    overflowAvatar?: ReactNode;
-    overflowCount?: number;
+    total?: number;
+    renderOverflow?: (hiddenCount: number) => ReactNode;
     overflowShape?: AvatarShape;
     overlap?: 'left' | 'right';
     overlapOffset?: string;

package/dist/components/data-display/CommandBlock/CommandBlock.d.ts

@@ -1,7 +1,2 @@
-import { ReactElement } from 'react';
-type CommandBlockProps = {
-    commands: string[];
-    button?: ReactElement;
-};
-export declare const CommandBlock: ({ commands, button }: CommandBlockProps) => import("react").JSX.Element;
-export {};
+import { CommandBlockProps } from './types/CommandBlockProps';
+export declare const CommandBlock: ({ commands, actions, render, ref, className, ...props }: CommandBlockProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;

package/dist/components/data-display/CommandBlock/types/CommandBlockProps.d.ts

@@ -0,0 +1,6 @@
+import { useRender } from '@base-ui/react/use-render';
+import { ReactNode } from 'react';
+export type CommandBlockProps = Omit<useRender.ComponentProps<'div'>, 'children'> & {
+    commands: readonly string[];
+    actions?: ReactNode;
+};

package/dist/components/data-display/MetricRow/MetricRow.d.ts

@@ -1,2 +1,2 @@
 import { MetricRowProps } from './types/MetricRowProps';
-export declare const MetricRow: ({ children, startIcon: StartIcon, value, progress, progressColor, progressValueText, render, ref, className, ...props }: MetricRowProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
+export declare const MetricRow: ({ children, startIcon, value, progress, progressColor, progressValueText, render, ref, className, ...props }: MetricRowProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;

package/dist/components/data-display/MetricRow/types/MetricRowProps.d.ts

@@ -1,9 +1,8 @@
 import { useRender } from '@base-ui/react/use-render';
 import { ReactNode } from 'react';
-import { IconComponent } from '../../../../icon';
 export type MetricRowProps = Omit<useRender.ComponentProps<'div'>, 'children'> & {
-    children: string;
-    startIcon?: IconComponent;
+    children: ReactNode;
+    startIcon?: ReactNode;
     value: ReactNode;
     progress?: number;
     progressColor?: string;

package/dist/components/data-display/TintedIconTile/TintedIconTile.d.ts

@@ -1,2 +1,2 @@
 import { TintedIconTileProps } from './types/TintedIconTileProps';
-export declare const TintedIconTile: ({ Icon, color, size: sizeFromProps, stroke: strokeFromProps, }: TintedIconTileProps) => import("react").JSX.Element;
+export declare const TintedIconTile: ({ icon, color, className, style, render, ref, ...props }: TintedIconTileProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;

package/dist/components/data-display/TintedIconTile/types/TintedIconTileProps.d.ts

@@ -1,7 +1,6 @@
-import { IconComponent } from '../../../../icon/types/IconComponent';
-export type TintedIconTileProps = {
-    Icon: IconComponent;
+import { useRender } from '@base-ui/react/use-render';
+import { ReactNode } from 'react';
+export type TintedIconTileProps = Omit<useRender.ComponentProps<'div'>, 'children' | 'color'> & {
+    icon: ReactNode;
     color?: string | null;
-    size?: number;
-    stroke?: number;
 };

package/dist/components/data-display/index.d.ts

@@ -0,0 +1,17 @@
+export { AvatarGroup } from './AvatarGroup/AvatarGroup';
+export type { AvatarGroupProps } from './AvatarGroup/types/AvatarGroupProps';
+export { CommandBlock } from './CommandBlock/CommandBlock';
+export type { CommandBlockProps } from './CommandBlock/types/CommandBlockProps';
+export { JsonTree } from './JsonTree/JsonTree';
+export type { GetJsonNodeHighlighting } from './JsonTree/types/GetJsonNodeHighlighting';
+export type { JsonNodeHighlighting } from './JsonTree/types/JsonNodeHighlighting';
+export type { JsonTreeEntry } from './JsonTree/types/JsonTreeEntry';
+export type { JsonTreeProps } from './JsonTree/types/JsonTreeProps';
+export type { ShouldExpandNodeInitiallyProps } from './JsonTree/types/ShouldExpandNodeInitiallyProps';
+export { MetricRow } from './MetricRow/MetricRow';
+export type { MetricRowProps } from './MetricRow/types/MetricRowProps';
+export { NotificationCounter } from './NotificationCounter/NotificationCounter';
+export { TintedIconTile } from './TintedIconTile/TintedIconTile';
+export type { TintedIconTileProps } from './TintedIconTile/types/TintedIconTileProps';
+export type { IconTileColorShades } from './TintedIconTile/utils/getIconTileColorShades';
+export { getIconTileColorShades } from './TintedIconTile/utils/getIconTileColorShades';

package/dist/components/data-display.cjs

@@ -0,0 +1 @@
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../data-display-Bw-5dsCu.cjs"),o=require("../TintedIconTile-Dp4uH0Up.cjs");exports.AvatarGroup=e.AvatarGroup;exports.CommandBlock=e.CommandBlock;exports.JsonTree=e.JsonTree;exports.MetricRow=e.MetricRow;exports.NotificationCounter=e.NotificationCounter;exports.TintedIconTile=o.TintedIconTile;exports.getIconTileColorShades=o.getIconTileColorShades;

package/dist/components/data-display.mjs

@@ -0,0 +1,11 @@
+import { a, i as r, n as t, r as e, t as i } from "../data-display-CehSwX8i.js";
+import { n as s, t as m } from "../TintedIconTile-BZgRO7cg.js";
+export {
+  a as AvatarGroup,
+  r as CommandBlock,
+  e as JsonTree,
+  t as MetricRow,
+  i as NotificationCounter,
+  m as TintedIconTile,
+  s as getIconTileColorShades
+};

package/dist/components/feedback/Callout/Callout.d.ts

@@ -1,2 +1,3 @@
-import { CalloutProps } from './types/CalloutProps';
-export declare const Callout: ({ variant, title, description, fullWidth, Icon, action, isClosable, closeLabel, onClose, }: CalloutProps) => import("react").JSX.Element | null;
+export declare const Callout: (({ status, variant, color, title, description, fullWidth, icon, action, closeLabel, onDismiss, className, render, ref, ...props }: import('..').CalloutProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>) & {
+    Action: ({ className, ...props }: import('..').CalloutActionProps) => import("react").JSX.Element;
+};

package/dist/components/feedback/Callout/internal/CalloutAction.d.ts

@@ -0,0 +1,2 @@
+import { CalloutActionProps } from '../types/CalloutActionProps';
+export declare const CalloutAction: ({ className, ...props }: CalloutActionProps) => import("react").JSX.Element;

package/dist/components/feedback/Callout/internal/CalloutComponent.d.ts

@@ -0,0 +1,2 @@
+import { CalloutProps } from '../types/CalloutProps';
+export declare const CalloutComponent: ({ status, variant, color, title, description, fullWidth, icon, action, closeLabel, onDismiss, className, render, ref, ...props }: CalloutProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;

package/dist/components/feedback/Callout/types/CalloutActionProps.d.ts

@@ -0,0 +1,2 @@
+import { ButtonProps } from '../../../../primitives/input/Button/types/ButtonProps';
+export type CalloutActionProps = Omit<ButtonProps, 'size' | 'variant'>;

package/dist/components/feedback/Callout/types/CalloutColor.d.ts

@@ -0,0 +1,2 @@
+import { BannerColor } from '../../../../primitives/feedback/Banner/types/BannerColor';
+export type CalloutColor = BannerColor;

package/dist/components/feedback/Callout/types/CalloutProps.d.ts

@@ -1,16 +1,18 @@
-import { IconComponent } from '../../../../icon/types/IconComponent';
+import { useRender } from '@base-ui/react/use-render';
+import { ReactNode } from 'react';
+import { CalloutColor } from './CalloutColor';
+import { CalloutState } from './CalloutState';
+import { CalloutStatus } from './CalloutStatus';
 import { CalloutVariant } from './CalloutVariant';
-export type CalloutProps = {
-    variant: CalloutVariant;
-    title: string;
-    description?: string;
+export type CalloutProps = Omit<useRender.ComponentProps<'div', CalloutState>, 'title' | 'color' | 'children'> & {
+    status?: CalloutStatus;
+    variant?: CalloutVariant;
+    color?: CalloutColor;
+    title: ReactNode;
+    description?: ReactNode;
     fullWidth?: boolean;
-    Icon?: IconComponent;
-    action?: {
-        label: string;
-        onClick: () => void;
-    };
-    isClosable?: boolean;
+    icon?: ReactNode;
+    action?: ReactNode;
     closeLabel?: string;
-    onClose?: () => void;
+    onDismiss?: () => void;
 };

package/dist/components/feedback/Callout/types/CalloutState.d.ts

@@ -0,0 +1,8 @@
+import { CalloutColor } from './CalloutColor';
+import { CalloutStatus } from './CalloutStatus';
+import { CalloutVariant } from './CalloutVariant';
+export type CalloutState = {
+    status: CalloutStatus;
+    variant: CalloutVariant;
+    color: CalloutColor;
+};

package/dist/components/feedback/Callout/types/CalloutStatus.d.ts

@@ -0,0 +1,2 @@
+import { BannerStatus } from '../../../../primitives/feedback/Banner/types/BannerStatus';
+export type CalloutStatus = BannerStatus;

package/dist/components/feedback/Callout/types/CalloutVariant.d.ts

@@ -1 +1 @@
-export type CalloutVariant = 'info' | 'warning' | 'error' | 'neutral' | 'success';
+export type CalloutVariant = 'soft';

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

@@ -1,2 +1,3 @@
-import { InlineBannerProps } from './types/InlineBannerProps';
-export declare const InlineBanner: ({ color, message, variant, embedded, button, LeftIcon, className, }: InlineBannerProps) => import("react").JSX.Element;
+export declare const InlineBanner: (({ children, layout, variant, embedded, icon, className, ...props }: import('..').InlineBannerProps) => import("react").JSX.Element) & {
+    Action: ({ className, ...props }: import('../../..').BannerActionProps) => import("react").JSX.Element;
+};

package/dist/components/feedback/InlineBanner/internal/InlineBannerComponent.d.ts

@@ -0,0 +1,2 @@
+import { InlineBannerProps } from '../types/InlineBannerProps';
+export declare const InlineBannerComponent: ({ children, layout, variant, embedded, icon, className, ...props }: InlineBannerProps) => import("react").JSX.Element;

package/dist/components/feedback/InlineBanner/types/InlineBannerLayout.d.ts

@@ -0,0 +1 @@
+export type InlineBannerLayout = 'standard' | 'compact';

package/dist/components/feedback/InlineBanner/types/InlineBannerProps.d.ts

@@ -1,12 +1,6 @@
-import { IconComponent } from '../../../../icon/types/IconComponent';
-import { BannerColor } from '../../../../primitives/feedback/Banner/Banner';
-import { InlineBannerButtonProps } from './InlineBannerButtonProps';
-export type InlineBannerProps = {
-    color?: BannerColor;
-    message: string;
-    variant?: 'standard' | 'compact';
+import { BannerProps } from '../../../../primitives/feedback/Banner/types/BannerProps';
+import { InlineBannerLayout } from './InlineBannerLayout';
+export type InlineBannerProps = BannerProps & {
+    layout?: InlineBannerLayout;
     embedded?: boolean;
-    button?: InlineBannerButtonProps;
-    LeftIcon?: IconComponent;
-    className?: string;
 };

package/dist/components/feedback/Toast/hooks/useToast.d.ts

@@ -1,7 +1,7 @@
 export declare const useToast: () => {
     enqueueToast: {
-        (options: import('../types/ToastOptions').ToastOptions): string;
-        (options: import('../types/ToastOptions').ToastOptions | undefined): string | undefined;
+        (options: import('../..').ToastOptions): string;
+        (options: import('../..').ToastOptions | undefined): string | undefined;
     };
     closeToast: (id?: string) => void;
 };

package/dist/components/feedback/index.d.ts

@@ -0,0 +1,20 @@
+export { Callout } from './Callout/Callout';
+export type { CalloutActionProps } from './Callout/types/CalloutActionProps';
+export type { CalloutColor } from './Callout/types/CalloutColor';
+export type { CalloutProps } from './Callout/types/CalloutProps';
+export type { CalloutState } from './Callout/types/CalloutState';
+export type { CalloutStatus } from './Callout/types/CalloutStatus';
+export type { CalloutVariant } from './Callout/types/CalloutVariant';
+export { InlineBanner } from './InlineBanner/InlineBanner';
+export type { InlineBannerLayout } from './InlineBanner/types/InlineBannerLayout';
+export type { InlineBannerProps } from './InlineBanner/types/InlineBannerProps';
+export { useToast } from './Toast/hooks/useToast';
+export { Toast } from './Toast/Toast';
+export { ToastProvider } from './Toast/ToastProvider';
+export type { ToastNotification } from './Toast/types/ToastNotification';
+export type { ToastOptions } from './Toast/types/ToastOptions';
+export type { ToastProps } from './Toast/types/ToastProps';
+export type { ToastProviderProps } from './Toast/types/ToastProviderProps';
+export type { ToastVariant } from './Toast/types/ToastVariant';
+export { Toaster } from './Toaster/Toaster';
+export type { ToasterProps } from './Toaster/types/ToasterProps';

package/dist/components/feedback.cjs

@@ -0,0 +1 @@
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../feedback-BleeRoOP.cjs");exports.Callout=e.Callout;exports.InlineBanner=e.InlineBanner;exports.Toast=e.Toast;exports.ToastProvider=e.ToastProvider;exports.Toaster=e.Toaster;exports.useToast=e.useToast;

package/dist/components/feedback.mjs

@@ -0,0 +1,9 @@
+import { a as s, i as o, n as r, o as t, r as e, t as n } from "../feedback-BV1EK98d.js";
+export {
+  t as Callout,
+  s as InlineBanner,
+  e as Toast,
+  r as ToastProvider,
+  n as Toaster,
+  o as useToast
+};