@clickhouse/click-ui 0.0.115 → 0.0.116

package/dist/click-ui.es.js

@@ -11113,7 +11113,7 @@ const mS = () => xo({
   }
 }), bS = G(v8).withConfig({
   componentId: "sc-1vtv6sf-0"
-})(["display:flex;flex-direction:column;align-items:center;overflow:hidden;flex:1;top:0;bottom:0;width:fit-content;--flyout-width:", ";animation:", " 500ms cubic-bezier(0.16,1,0.3,1) forwards;", ""], ({
+})(["display:flex;flex-direction:column;align-items:center;overflow:hidden;top:0;bottom:0;width:fit-content;--flyout-width:", ";animation:", " 500ms cubic-bezier(0.16,1,0.3,1) forwards;", ""], ({
   theme: e,
   $size: t = "default",
   $width: n
@@ -11264,7 +11264,7 @@ const SS = G(Gr).withConfig({
   componentId: "sc-1vtv6sf-8"
 })(["width:var(--flyout-width);max-width:100%;"]), M8 = (e) => /* @__PURE__ */ r.jsxs(SS, { gap: "none", orientation: "vertical", alignItems: "end", children: [
   /* @__PURE__ */ r.jsx(Wa, { size: "xs" }),
-  /* @__PURE__ */ r.jsx(kS, { justifyContent: "end", gap: "none", padding: "none", isResponsive: !1, ...e })
+  /* @__PURE__ */ r.jsx(kS, { justifyContent: "end", gap: "none", padding: "none", isResponsive: !1, wrap: "wrap", ...e })
 ] });
 M8.displayName = "Flyout.Footer";
 Fi.Footer = M8;
@@ -11272,9 +11272,11 @@ const LS = G(Nk).withConfig({
   componentId: "sc-1vtv6sf-9"
 })(["display:flex;height:100%;pre{flex:1;}"]), $S = ({
   statement: e,
-  ...t
-}) => /* @__PURE__ */ r.jsxs(d5, { fillHeight: !0, ...t, children: [
-  /* @__PURE__ */ r.jsx(LS, { wrapLines: !0, className: "fs-exclude", children: e }),
+  language: t,
+  wrapLines: n,
+  ...o
+}) => /* @__PURE__ */ r.jsxs(d5, { fillHeight: !0, ...o, children: [
+  /* @__PURE__ */ r.jsx(LS, { wrapLines: n, language: t, children: e }),
   /* @__PURE__ */ r.jsx(v5, { size: "xs" })
 ] });
 Fi.CodeBlock = $S;

package/dist/click-ui.umd.js

@@ -461,7 +461,7 @@ https://github.com/highlightjs/highlight.js/issues/2277`),gt=de,Ge=xe);const Ce=
     ${n&&`min-height: ${n}`};
   `,({$overflow:e})=>`
     ${e&&`overflow: ${e}`};
-  `,({$wrap:e="nowrap"})=>e,({theme:e,$gapSize:t})=>e.click.container.gap[t],({$maxWidth:e})=>e??"none",({$minWidth:e})=>e??"none",({theme:e,$paddingSize:t})=>e.click.container.space[t],({$fillWidth:e=!0})=>e===!0?"100%":"auto",({$orientation:e="horizontal"})=>e==="horizontal"?"row":"column",({$alignItems:e="center"})=>e,({$justifyContent:e="left"})=>e==="start"?"start":`${e}`,({theme:e})=>e.breakpoint.sizes.md,({$isResponsive:e=!0,$fillWidth:t=!0})=>e===!0||t===!0?"100%":"auto",({$isResponsive:e=!0})=>e===!0?"none":"auto",({$isResponsive:e=!0})=>e===!0?"column":"auto"),hr=p.forwardRef(py),q6="Dialog",[Q6,DA]=pn(q6),[gy,_r]=Q6(q6),e7=e=>{const{__scopeDialog:t,children:n,open:o,defaultOpen:i,onOpenChange:a,modal:s=!0}=e,c=p.useRef(null),u=p.useRef(null),[g=!1,C]=_n({prop:o,defaultProp:i,onChange:a});return p.createElement(gy,{scope:t,triggerRef:c,contentRef:u,contentId:tr(),titleId:tr(),descriptionId:tr(),open:g,onOpenChange:C,onOpenToggle:p.useCallback(()=>C(v=>!v),[C]),modal:s},n)},vy="DialogTrigger",t7=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(vy,n),a=_t(t,i.triggerRef);return p.createElement(ot.button,ue({type:"button","aria-haspopup":"dialog","aria-expanded":i.open,"aria-controls":i.contentId,"data-state":k0(i.open)},o,{ref:a,onClick:Ee(e.onClick,i.onOpenToggle)}))}),n7="DialogPortal",[my,r7]=Q6(n7,{forceMount:void 0}),o7=e=>{const{__scopeDialog:t,forceMount:n,children:o,container:i}=e,a=_r(n7,t);return p.createElement(my,{scope:t,forceMount:n},p.Children.map(o,s=>p.createElement(Cn,{present:n||a.open},p.createElement($1,{asChild:!0,container:i},s))))},y0="DialogOverlay",i7=p.forwardRef((e,t)=>{const n=r7(y0,e.__scopeDialog),{forceMount:o=n.forceMount,...i}=e,a=_r(y0,e.__scopeDialog);return a.modal?p.createElement(Cn,{present:o||a.open},p.createElement(by,ue({},i,{ref:t}))):null}),by=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(y0,n);return p.createElement(H3,{as:$i,allowPinchZoom:!0,shards:[i.contentRef]},p.createElement(ot.div,ue({"data-state":k0(i.open)},o,{ref:t,style:{pointerEvents:"auto",...o.style}})))}),gl="DialogContent",a7=p.forwardRef((e,t)=>{const n=r7(gl,e.__scopeDialog),{forceMount:o=n.forceMount,...i}=e,a=_r(gl,e.__scopeDialog);return p.createElement(Cn,{present:o||a.open},a.modal?p.createElement(Cy,ue({},i,{ref:t})):p.createElement(xy,ue({},i,{ref:t})))}),Cy=p.forwardRef((e,t)=>{const n=_r(gl,e.__scopeDialog),o=p.useRef(null),i=_t(t,n.contentRef,o);return p.useEffect(()=>{const a=o.current;if(a)return T3(a)},[]),p.createElement(l7,ue({},e,{ref:i,trapFocus:n.open,disableOutsidePointerEvents:!0,onCloseAutoFocus:Ee(e.onCloseAutoFocus,a=>{var s;a.preventDefault(),(s=n.triggerRef.current)===null||s===void 0||s.focus()}),onPointerDownOutside:Ee(e.onPointerDownOutside,a=>{const s=a.detail.originalEvent,c=s.button===0&&s.ctrlKey===!0;(s.button===2||c)&&a.preventDefault()}),onFocusOutside:Ee(e.onFocusOutside,a=>a.preventDefault())}))}),xy=p.forwardRef((e,t)=>{const n=_r(gl,e.__scopeDialog),o=p.useRef(!1),i=p.useRef(!1);return p.createElement(l7,ue({},e,{ref:t,trapFocus:!1,disableOutsidePointerEvents:!1,onCloseAutoFocus:a=>{var s;if((s=e.onCloseAutoFocus)===null||s===void 0||s.call(e,a),!a.defaultPrevented){var c;o.current||(c=n.triggerRef.current)===null||c===void 0||c.focus(),a.preventDefault()}o.current=!1,i.current=!1},onInteractOutside:a=>{var s,c;(s=e.onInteractOutside)===null||s===void 0||s.call(e,a),a.defaultPrevented||(o.current=!0,a.detail.originalEvent.type==="pointerdown"&&(i.current=!0));const u=a.target;((c=n.triggerRef.current)===null||c===void 0?void 0:c.contains(u))&&a.preventDefault(),a.detail.originalEvent.type==="focusin"&&i.current&&a.preventDefault()}}))}),l7=p.forwardRef((e,t)=>{const{__scopeDialog:n,trapFocus:o,onOpenAutoFocus:i,onCloseAutoFocus:a,...s}=e,c=_r(gl,n),u=p.useRef(null),g=_t(t,u);return h3(),p.createElement(p.Fragment,null,p.createElement(m3,{asChild:!0,loop:!0,trapped:o,onMountAutoFocus:i,onUnmountAutoFocus:a},p.createElement(w1,ue({role:"dialog",id:c.contentId,"aria-describedby":c.descriptionId,"aria-labelledby":c.titleId,"data-state":k0(c.open)},s,{ref:g,onDismiss:()=>c.onOpenChange(!1)}))),!1)}),wy="DialogTitle",yy=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(wy,n);return p.createElement(ot.h2,ue({id:i.titleId},o,{ref:t}))}),ky="DialogDescription",Sy=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(ky,n);return p.createElement(ot.p,ue({id:i.descriptionId},o,{ref:t}))}),Ly="DialogClose",bc=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(Ly,n);return p.createElement(ot.button,ue({type:"button"},o,{ref:t,onClick:Ee(e.onClick,()=>i.onOpenChange(!1))}))});function k0(e){return e?"open":"closed"}const $y=e7,My=t7,jy=o7,Ey=i7,_y=a7,s7=bc,ti=({children:e,...t})=>r.jsx($y,{...t,children:e}),Iy=W(My).withConfig({componentId:"sc-1wr6otn-0"})(["width:fit-content;background:transparent;border:none;cursor:pointer;"]),c7=({children:e,...t})=>r.jsx(Iy,{...t,children:e});c7.displayName="DialogTrigger",ti.Trigger=c7;const d7=({label:e="Close",type:t="secondary",...n})=>r.jsx(s7,{asChild:!0,children:r.jsx(ul,{type:t,label:e,...n})});d7.displayName="DialogClose",ti.Close=d7;const Ty=W.keyframes({"0%":{opacity:0},"100%":{opacity:1}}),Fy=W.keyframes({"0%":{opacity:0,transform:"translate(-50%, -48%) scale(.96)"},"100%":{opacity:1,transform:"translate(-50%, -50%) scale(1)"}}),Oy=W(Ey).withConfig({componentId:"sc-1wr6otn-1"})(["background-color:",";position:fixed;inset:0;animation:"," 150ms cubic-bezier(0.16,1,0.3,1);"],({theme:e})=>e.click.dialog.color.opaqueBackground.default,Ty),Py=W(_y).withConfig({componentId:"sc-1wr6otn-2"})(["background:",";border-radius:",";padding:"," ",";box-shadow:",";border:1px solid ",";width:75%;max-width:670px;position:fixed;top:50%;left:50%;max-height:75%;overflow:auto;transform:translate(-50%,-50%);animation:"," 150ms cubic-bezier(0.16,1,0.3,1);outline:none;"],({theme:e})=>e.click.dialog.color.background.default,({theme:e})=>e.click.dialog.radii.all,({theme:e})=>e.click.dialog.space.y,({theme:e})=>e.click.dialog.space.x,({theme:e})=>e.click.dialog.shadow.default,({theme:e})=>e.click.global.color.stroke.default,Fy),Hy=W.div.withConfig({componentId:"sc-1wr6otn-3"})(["display:flex;justify-content:space-between;align-items:center;min-height:",";"],({theme:e})=>e.sizes[9]),Dy=W.h2.withConfig({componentId:"sc-1wr6otn-4"})(["font:",";padding:0;margin:0;"],({theme:e})=>e.click.dialog.typography.title.default),Ay=({onClose:e})=>r.jsx(s7,{asChild:!0,children:r.jsx(a3,{onClick:e,children:r.jsx(rt,{name:"cross",size:"lg"})})}),u7=({title:e,children:t,showClose:n,onClose:o,forceMount:i,container:a,showOverlay:s=!0,...c})=>r.jsxs(jy,{forceMount:i,container:a,children:[s&&r.jsx(Oy,{}),r.jsxs(Py,{...c,children:[r.jsxs(Hy,{children:[r.jsx(Dy,{children:e}),n&&r.jsx(Ay,{onClose:o})]}),r.jsx(Qc,{size:"sm"}),t]})]});u7.displayName="DialogContent",ti.Content=u7;const Ry=W.div.withConfig({componentId:"sc-6eozxy-0"})(["display:flex;justify-content:flex-end;gap:",";"],e=>e.theme.click.dialog.space.gap),Vy=W.div.withConfig({componentId:"sc-6eozxy-1"})(["overflow:hidden;display:flex;flex-direction:column;"]),By=({open:e,onCancel:t,title:n,message:o,loading:i,primaryActionType:a="primary",primaryActionLabel:s="Confirm",secondaryActionLabel:c="Cancel",onConfirm:u,children:g,showClose:C,...v})=>{if(g&&o)throw new Error("You can't pass children and message props at the same time");return r.jsx(ti,{open:e,onOpenChange:y=>{!y&&t&&t()},children:r.jsxs(Vy,{as:ti.Content,title:n,showClose:C,...v,children:[r.jsx(hr,{overflow:"auto",grow:"1",orientation:"vertical",children:g||r.jsx(bo,{children:o})}),r.jsx(Vi,{size:"xl"}),r.jsxs(Ry,{children:[r.jsx(ti.Close,{label:c}),r.jsx(ti.Close,{loading:!!i,disabled:!!i,type:a,label:s,onClick:()=>{u&&u()}})]})]})})},xo=({modal:e=!1,...t})=>r.jsx(e7,{modal:e,...t}),f7=({children:e,...t})=>r.jsx(t7,{asChild:!0,...t,children:r.jsx("div",{children:e})});f7.displayName="Flyout.Trigger",xo.Trigger=f7;const Ny=()=>W.keyframes({from:{width:0},to:{width:"fit-content"}}),Zy=W(a7).withConfig({componentId:"sc-1vtv6sf-0"})(["display:flex;flex-direction:column;align-items:center;overflow:hidden;flex:1;top:0;bottom:0;width:fit-content;--flyout-width:",";animation:"," 500ms cubic-bezier(0.16,1,0.3,1) forwards;",""],({theme:e,$size:t="default",$width:n})=>n||e.click.flyout.size[t].width,Ny,({theme:e,$strategy:t,$type:n="default",$align:o})=>`
+  `,({$wrap:e="nowrap"})=>e,({theme:e,$gapSize:t})=>e.click.container.gap[t],({$maxWidth:e})=>e??"none",({$minWidth:e})=>e??"none",({theme:e,$paddingSize:t})=>e.click.container.space[t],({$fillWidth:e=!0})=>e===!0?"100%":"auto",({$orientation:e="horizontal"})=>e==="horizontal"?"row":"column",({$alignItems:e="center"})=>e,({$justifyContent:e="left"})=>e==="start"?"start":`${e}`,({theme:e})=>e.breakpoint.sizes.md,({$isResponsive:e=!0,$fillWidth:t=!0})=>e===!0||t===!0?"100%":"auto",({$isResponsive:e=!0})=>e===!0?"none":"auto",({$isResponsive:e=!0})=>e===!0?"column":"auto"),hr=p.forwardRef(py),q6="Dialog",[Q6,DA]=pn(q6),[gy,_r]=Q6(q6),e7=e=>{const{__scopeDialog:t,children:n,open:o,defaultOpen:i,onOpenChange:a,modal:s=!0}=e,c=p.useRef(null),u=p.useRef(null),[g=!1,C]=_n({prop:o,defaultProp:i,onChange:a});return p.createElement(gy,{scope:t,triggerRef:c,contentRef:u,contentId:tr(),titleId:tr(),descriptionId:tr(),open:g,onOpenChange:C,onOpenToggle:p.useCallback(()=>C(v=>!v),[C]),modal:s},n)},vy="DialogTrigger",t7=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(vy,n),a=_t(t,i.triggerRef);return p.createElement(ot.button,ue({type:"button","aria-haspopup":"dialog","aria-expanded":i.open,"aria-controls":i.contentId,"data-state":k0(i.open)},o,{ref:a,onClick:Ee(e.onClick,i.onOpenToggle)}))}),n7="DialogPortal",[my,r7]=Q6(n7,{forceMount:void 0}),o7=e=>{const{__scopeDialog:t,forceMount:n,children:o,container:i}=e,a=_r(n7,t);return p.createElement(my,{scope:t,forceMount:n},p.Children.map(o,s=>p.createElement(Cn,{present:n||a.open},p.createElement($1,{asChild:!0,container:i},s))))},y0="DialogOverlay",i7=p.forwardRef((e,t)=>{const n=r7(y0,e.__scopeDialog),{forceMount:o=n.forceMount,...i}=e,a=_r(y0,e.__scopeDialog);return a.modal?p.createElement(Cn,{present:o||a.open},p.createElement(by,ue({},i,{ref:t}))):null}),by=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(y0,n);return p.createElement(H3,{as:$i,allowPinchZoom:!0,shards:[i.contentRef]},p.createElement(ot.div,ue({"data-state":k0(i.open)},o,{ref:t,style:{pointerEvents:"auto",...o.style}})))}),gl="DialogContent",a7=p.forwardRef((e,t)=>{const n=r7(gl,e.__scopeDialog),{forceMount:o=n.forceMount,...i}=e,a=_r(gl,e.__scopeDialog);return p.createElement(Cn,{present:o||a.open},a.modal?p.createElement(Cy,ue({},i,{ref:t})):p.createElement(xy,ue({},i,{ref:t})))}),Cy=p.forwardRef((e,t)=>{const n=_r(gl,e.__scopeDialog),o=p.useRef(null),i=_t(t,n.contentRef,o);return p.useEffect(()=>{const a=o.current;if(a)return T3(a)},[]),p.createElement(l7,ue({},e,{ref:i,trapFocus:n.open,disableOutsidePointerEvents:!0,onCloseAutoFocus:Ee(e.onCloseAutoFocus,a=>{var s;a.preventDefault(),(s=n.triggerRef.current)===null||s===void 0||s.focus()}),onPointerDownOutside:Ee(e.onPointerDownOutside,a=>{const s=a.detail.originalEvent,c=s.button===0&&s.ctrlKey===!0;(s.button===2||c)&&a.preventDefault()}),onFocusOutside:Ee(e.onFocusOutside,a=>a.preventDefault())}))}),xy=p.forwardRef((e,t)=>{const n=_r(gl,e.__scopeDialog),o=p.useRef(!1),i=p.useRef(!1);return p.createElement(l7,ue({},e,{ref:t,trapFocus:!1,disableOutsidePointerEvents:!1,onCloseAutoFocus:a=>{var s;if((s=e.onCloseAutoFocus)===null||s===void 0||s.call(e,a),!a.defaultPrevented){var c;o.current||(c=n.triggerRef.current)===null||c===void 0||c.focus(),a.preventDefault()}o.current=!1,i.current=!1},onInteractOutside:a=>{var s,c;(s=e.onInteractOutside)===null||s===void 0||s.call(e,a),a.defaultPrevented||(o.current=!0,a.detail.originalEvent.type==="pointerdown"&&(i.current=!0));const u=a.target;((c=n.triggerRef.current)===null||c===void 0?void 0:c.contains(u))&&a.preventDefault(),a.detail.originalEvent.type==="focusin"&&i.current&&a.preventDefault()}}))}),l7=p.forwardRef((e,t)=>{const{__scopeDialog:n,trapFocus:o,onOpenAutoFocus:i,onCloseAutoFocus:a,...s}=e,c=_r(gl,n),u=p.useRef(null),g=_t(t,u);return h3(),p.createElement(p.Fragment,null,p.createElement(m3,{asChild:!0,loop:!0,trapped:o,onMountAutoFocus:i,onUnmountAutoFocus:a},p.createElement(w1,ue({role:"dialog",id:c.contentId,"aria-describedby":c.descriptionId,"aria-labelledby":c.titleId,"data-state":k0(c.open)},s,{ref:g,onDismiss:()=>c.onOpenChange(!1)}))),!1)}),wy="DialogTitle",yy=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(wy,n);return p.createElement(ot.h2,ue({id:i.titleId},o,{ref:t}))}),ky="DialogDescription",Sy=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(ky,n);return p.createElement(ot.p,ue({id:i.descriptionId},o,{ref:t}))}),Ly="DialogClose",bc=p.forwardRef((e,t)=>{const{__scopeDialog:n,...o}=e,i=_r(Ly,n);return p.createElement(ot.button,ue({type:"button"},o,{ref:t,onClick:Ee(e.onClick,()=>i.onOpenChange(!1))}))});function k0(e){return e?"open":"closed"}const $y=e7,My=t7,jy=o7,Ey=i7,_y=a7,s7=bc,ti=({children:e,...t})=>r.jsx($y,{...t,children:e}),Iy=W(My).withConfig({componentId:"sc-1wr6otn-0"})(["width:fit-content;background:transparent;border:none;cursor:pointer;"]),c7=({children:e,...t})=>r.jsx(Iy,{...t,children:e});c7.displayName="DialogTrigger",ti.Trigger=c7;const d7=({label:e="Close",type:t="secondary",...n})=>r.jsx(s7,{asChild:!0,children:r.jsx(ul,{type:t,label:e,...n})});d7.displayName="DialogClose",ti.Close=d7;const Ty=W.keyframes({"0%":{opacity:0},"100%":{opacity:1}}),Fy=W.keyframes({"0%":{opacity:0,transform:"translate(-50%, -48%) scale(.96)"},"100%":{opacity:1,transform:"translate(-50%, -50%) scale(1)"}}),Oy=W(Ey).withConfig({componentId:"sc-1wr6otn-1"})(["background-color:",";position:fixed;inset:0;animation:"," 150ms cubic-bezier(0.16,1,0.3,1);"],({theme:e})=>e.click.dialog.color.opaqueBackground.default,Ty),Py=W(_y).withConfig({componentId:"sc-1wr6otn-2"})(["background:",";border-radius:",";padding:"," ",";box-shadow:",";border:1px solid ",";width:75%;max-width:670px;position:fixed;top:50%;left:50%;max-height:75%;overflow:auto;transform:translate(-50%,-50%);animation:"," 150ms cubic-bezier(0.16,1,0.3,1);outline:none;"],({theme:e})=>e.click.dialog.color.background.default,({theme:e})=>e.click.dialog.radii.all,({theme:e})=>e.click.dialog.space.y,({theme:e})=>e.click.dialog.space.x,({theme:e})=>e.click.dialog.shadow.default,({theme:e})=>e.click.global.color.stroke.default,Fy),Hy=W.div.withConfig({componentId:"sc-1wr6otn-3"})(["display:flex;justify-content:space-between;align-items:center;min-height:",";"],({theme:e})=>e.sizes[9]),Dy=W.h2.withConfig({componentId:"sc-1wr6otn-4"})(["font:",";padding:0;margin:0;"],({theme:e})=>e.click.dialog.typography.title.default),Ay=({onClose:e})=>r.jsx(s7,{asChild:!0,children:r.jsx(a3,{onClick:e,children:r.jsx(rt,{name:"cross",size:"lg"})})}),u7=({title:e,children:t,showClose:n,onClose:o,forceMount:i,container:a,showOverlay:s=!0,...c})=>r.jsxs(jy,{forceMount:i,container:a,children:[s&&r.jsx(Oy,{}),r.jsxs(Py,{...c,children:[r.jsxs(Hy,{children:[r.jsx(Dy,{children:e}),n&&r.jsx(Ay,{onClose:o})]}),r.jsx(Qc,{size:"sm"}),t]})]});u7.displayName="DialogContent",ti.Content=u7;const Ry=W.div.withConfig({componentId:"sc-6eozxy-0"})(["display:flex;justify-content:flex-end;gap:",";"],e=>e.theme.click.dialog.space.gap),Vy=W.div.withConfig({componentId:"sc-6eozxy-1"})(["overflow:hidden;display:flex;flex-direction:column;"]),By=({open:e,onCancel:t,title:n,message:o,loading:i,primaryActionType:a="primary",primaryActionLabel:s="Confirm",secondaryActionLabel:c="Cancel",onConfirm:u,children:g,showClose:C,...v})=>{if(g&&o)throw new Error("You can't pass children and message props at the same time");return r.jsx(ti,{open:e,onOpenChange:y=>{!y&&t&&t()},children:r.jsxs(Vy,{as:ti.Content,title:n,showClose:C,...v,children:[r.jsx(hr,{overflow:"auto",grow:"1",orientation:"vertical",children:g||r.jsx(bo,{children:o})}),r.jsx(Vi,{size:"xl"}),r.jsxs(Ry,{children:[r.jsx(ti.Close,{label:c}),r.jsx(ti.Close,{loading:!!i,disabled:!!i,type:a,label:s,onClick:()=>{u&&u()}})]})]})})},xo=({modal:e=!1,...t})=>r.jsx(e7,{modal:e,...t}),f7=({children:e,...t})=>r.jsx(t7,{asChild:!0,...t,children:r.jsx("div",{children:e})});f7.displayName="Flyout.Trigger",xo.Trigger=f7;const Ny=()=>W.keyframes({from:{width:0},to:{width:"fit-content"}}),Zy=W(a7).withConfig({componentId:"sc-1vtv6sf-0"})(["display:flex;flex-direction:column;align-items:center;overflow:hidden;top:0;bottom:0;width:fit-content;--flyout-width:",";animation:"," 500ms cubic-bezier(0.16,1,0.3,1) forwards;",""],({theme:e,$size:t="default",$width:n})=>n||e.click.flyout.size[t].width,Ny,({theme:e,$strategy:t,$type:n="default",$align:o})=>`
     ${o==="start"?"left":"right"}: 0;
     max-width: 100%;
     position: ${t};
@@ -506,7 +506,7 @@ https://github.com/highlightjs/highlight.js/issues/2277`),gt=de,Ge=xe);const Ce=
     row-gap: ${e.click.flyout.space[t].content["row-gap"]};
     column-gap: ${e.click.flyout.space[t].content["column-gap"]};
     padding: ${e.click.flyout.space[t].y} ${e.click.flyout.space[t].content.x};
-  `),b7=({children:e,...t})=>r.jsx(bc,{asChild:!0,children:e??r.jsx(ul,{type:"secondary",...t})});b7.displayName="Flyout.Close",xo.Close=b7;const Xy=W(hr).withConfig({componentId:"sc-1vtv6sf-8"})(["width:var(--flyout-width);max-width:100%;"]),C7=e=>r.jsxs(Xy,{gap:"none",orientation:"vertical",alignItems:"end",children:[r.jsx(Vi,{size:"xs"}),r.jsx(Yy,{justifyContent:"end",gap:"none",padding:"none",isResponsive:!1,...e})]});C7.displayName="Flyout.Footer",xo.Footer=C7;const Ky=W(J6).withConfig({componentId:"sc-1vtv6sf-9"})(["display:flex;height:100%;pre{flex:1;}"]),Jy=({statement:e,...t})=>r.jsxs(S0,{fillHeight:!0,...t,children:[r.jsx(Ky,{wrapLines:!0,className:"fs-exclude",children:e}),r.jsx(Qc,{size:"xs"})]});xo.CodeBlock=Jy;const qy=({id:e,label:t,orientation:n,dir:o,error:i,children:a,addLabelPadding:s,...c})=>r.jsxs(Li,{$orientation:n,$dir:o,$addLabelPadding:s,...c,children:[r.jsxs(Ps,{children:[a,!!i&&i!==!0&&r.jsx(Fs,{children:i})]}),t&&r.jsx(Zo,{htmlFor:e,error:!!i,children:t})]}),Qy=({alignItems:e="stretch",alignContent:t="stretch",children:n,columnGap:o,gap:i,gridAutoColumns:a,gridAutoFlow:s,gridAutoRows:c,gridTemplateAreas:u,gridTemplateColumns:g,gridTemplateRows:C,gridTemplate:v,inline:y=!1,isResponsive:E=!0,justifyContent:M="stretch",justifyItems:_="stretch",rowGap:I,height:j,maxHeight:R,minHeight:P,fillWidth:B=!0,maxWidth:D,minWidth:H,overflow:A,...G})=>r.jsx(ek,{$alignItems:e,$alignContent:t,$columnGap:o,$gap:i,$gridAutoColumns:a,$gridAutoFlow:s,$gridAutoRows:c,$gridTemplateAreas:u,$gridTemplateColumns:g,$gridTemplateRows:C,$gridTemplate:v,$inline:y,$isResponsive:E,$justifyContent:M,$justifyItems:_,$rowGap:I,$height:j,$maxHeight:R,$minHeight:P,$fillWidth:B,$maxWidth:D,$minWidth:H,$overflow:A,"data-testid":"grid-container",...G,children:n}),ek=W.div.withConfig({componentId:"sc-r57kdn-0"})(["align-items:",";align-content:",";display:",";",";",";",";",";",";",";",";justify-content:",";justify-items:",";"," "," "," "," @media (max-width:","){grid-template-columns:",";}"],({$alignItems:e="stretch"})=>e,({$alignContent:e="stretch"})=>e,({$inline:e})=>e===!0?"inline-grid":"grid",({$gridAutoColumns:e})=>e&&`grid-auto-columns: ${e}`,({$gridAutoFlow:e})=>e&&`grid-auto-flow: ${e}`,({$gridAutoRows:e})=>e&&`grid-auto-rows: ${e}`,({$gridTemplateAreas:e})=>e&&`grid-template-area: ${e}`,({$gridTemplateColumns:e})=>e&&`grid-template-columns: ${e}`,({$gridTemplateRows:e})=>e&&`grid-template-rows: ${e}`,({$gridTemplate:e})=>e&&`grid-template:  ${e}`,({$justifyContent:e="stretch"})=>e,({$justifyItems:e="stretch"})=>e,({theme:e,$gap:t,$columnGap:n,$rowGap:o})=>`
+  `),b7=({children:e,...t})=>r.jsx(bc,{asChild:!0,children:e??r.jsx(ul,{type:"secondary",...t})});b7.displayName="Flyout.Close",xo.Close=b7;const Xy=W(hr).withConfig({componentId:"sc-1vtv6sf-8"})(["width:var(--flyout-width);max-width:100%;"]),C7=e=>r.jsxs(Xy,{gap:"none",orientation:"vertical",alignItems:"end",children:[r.jsx(Vi,{size:"xs"}),r.jsx(Yy,{justifyContent:"end",gap:"none",padding:"none",isResponsive:!1,wrap:"wrap",...e})]});C7.displayName="Flyout.Footer",xo.Footer=C7;const Ky=W(J6).withConfig({componentId:"sc-1vtv6sf-9"})(["display:flex;height:100%;pre{flex:1;}"]),Jy=({statement:e,language:t,wrapLines:n,...o})=>r.jsxs(S0,{fillHeight:!0,...o,children:[r.jsx(Ky,{wrapLines:n,language:t,children:e}),r.jsx(Qc,{size:"xs"})]});xo.CodeBlock=Jy;const qy=({id:e,label:t,orientation:n,dir:o,error:i,children:a,addLabelPadding:s,...c})=>r.jsxs(Li,{$orientation:n,$dir:o,$addLabelPadding:s,...c,children:[r.jsxs(Ps,{children:[a,!!i&&i!==!0&&r.jsx(Fs,{children:i})]}),t&&r.jsx(Zo,{htmlFor:e,error:!!i,children:t})]}),Qy=({alignItems:e="stretch",alignContent:t="stretch",children:n,columnGap:o,gap:i,gridAutoColumns:a,gridAutoFlow:s,gridAutoRows:c,gridTemplateAreas:u,gridTemplateColumns:g,gridTemplateRows:C,gridTemplate:v,inline:y=!1,isResponsive:E=!0,justifyContent:M="stretch",justifyItems:_="stretch",rowGap:I,height:j,maxHeight:R,minHeight:P,fillWidth:B=!0,maxWidth:D,minWidth:H,overflow:A,...G})=>r.jsx(ek,{$alignItems:e,$alignContent:t,$columnGap:o,$gap:i,$gridAutoColumns:a,$gridAutoFlow:s,$gridAutoRows:c,$gridTemplateAreas:u,$gridTemplateColumns:g,$gridTemplateRows:C,$gridTemplate:v,$inline:y,$isResponsive:E,$justifyContent:M,$justifyItems:_,$rowGap:I,$height:j,$maxHeight:R,$minHeight:P,$fillWidth:B,$maxWidth:D,$minWidth:H,$overflow:A,"data-testid":"grid-container",...G,children:n}),ek=W.div.withConfig({componentId:"sc-r57kdn-0"})(["align-items:",";align-content:",";display:",";",";",";",";",";",";",";",";justify-content:",";justify-items:",";"," "," "," "," @media (max-width:","){grid-template-columns:",";}"],({$alignItems:e="stretch"})=>e,({$alignContent:e="stretch"})=>e,({$inline:e})=>e===!0?"inline-grid":"grid",({$gridAutoColumns:e})=>e&&`grid-auto-columns: ${e}`,({$gridAutoFlow:e})=>e&&`grid-auto-flow: ${e}`,({$gridAutoRows:e})=>e&&`grid-auto-rows: ${e}`,({$gridTemplateAreas:e})=>e&&`grid-template-area: ${e}`,({$gridTemplateColumns:e})=>e&&`grid-template-columns: ${e}`,({$gridTemplateRows:e})=>e&&`grid-template-rows: ${e}`,({$gridTemplate:e})=>e&&`grid-template:  ${e}`,({$justifyContent:e="stretch"})=>e,({$justifyItems:e="stretch"})=>e,({theme:e,$gap:t,$columnGap:n,$rowGap:o})=>`
     gap: ${t?e.click.gridContainer.gap[t]:"inherit"};
     ${n&&`column-gap: ${e.click.gridContainer.gap[n]}`};
     ${o&&`row-gap: ${e.click.gridContainer.gap[o]}`};

package/dist/components/Flyout/Flyout.d.ts

@@ -34,8 +34,10 @@ export declare const Flyout: {
         (props: FlyoutFooterProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
-    CodeBlock: ({ statement, ...props }: {
+    CodeBlock: ({ statement, language, wrapLines, ...props }: {
         statement: string;
+        language?: string | undefined;
+        wrapLines?: boolean | undefined;
     } & ElementProps) => import("react/jsx-runtime").JSX.Element;
 };
 type FlyoutSizeType = "default" | "narrow" | "wide";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clickhouse/click-ui",
-  "version": "0.0.115",
+  "version": "0.0.116",
   "description": "Official ClickHouse design system react library",
   "type": "module",
   "license": "Apache-2.0",