@clickhouse/click-ui 0.0.25 → 0.0.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/click-ui.es.js
CHANGED
|
@@ -4726,7 +4726,7 @@ const Ar = L.button.withConfig({
|
|
|
4726
4726
|
...d
|
|
4727
4727
|
}) => /* @__PURE__ */ o.jsxs(m5, { $styleType: e, $align: r, $fillWidth: i, disabled: s || c, ...d, children: [
|
|
4728
4728
|
t && /* @__PURE__ */ o.jsx(T1, { name: t, size: "sm" }),
|
|
4729
|
-
|
|
4729
|
+
l ?? a,
|
|
4730
4730
|
n && /* @__PURE__ */ o.jsx(T1, { name: n, size: "sm" }),
|
|
4731
4731
|
c && /* @__PURE__ */ o.jsx(g5, { children: /* @__PURE__ */ o.jsx(oe, { name: "loading-animated", "data-testid": "click-ui-loading-icon" }) })
|
|
4732
4732
|
] }), g5 = L.div.withConfig({
|
package/dist/click-ui.umd.js
CHANGED
|
@@ -242,7 +242,7 @@ Check the top-level render call using <`+P+">.")}return E}}function Zc(m,E){{if(
|
|
|
242
242
|
font: ${e.click.button.basic.typography.label.disabled};
|
|
243
243
|
cursor: not-allowed;
|
|
244
244
|
}
|
|
245
|
-
`),za=({type:e="primary",iconLeft:t,iconRight:n,align:r="center",children:a,fillWidth:i,label:s,loading:c=!1,disabled:d,...f})=>o.jsxs(du,{$styleType:e,$align:r,$fillWidth:i,disabled:d||c,...f,children:[t&&o.jsx(Ga,{name:t,size:"sm"}),o.jsx("span",{"data-testid":"click-ui-button-label",children:s??a}),n&&o.jsx(Ga,{name:n,size:"sm"}),c&&o.jsx(su,{children:o.jsx(K,{name:"loading-animated","data-testid":"click-ui-loading-icon"})})]}),su=L.div.withConfig({componentId:"sc-1k4tz4c-0"})(["position:absolute;background-color:inherit;top:0;left:0;bottom:0;right:0;display:flex;align-content:center;justify-content:center;"]),du=L(Yo).withConfig({componentId:"sc-1k4tz4c-1"})(["width:",";color:",";background-color:",";border:1px solid ",";position:relative;display:flex;align-items:center;justify-content:",";&:hover{background-color:",";border:1px solid ",";transition:",";}&:active,&:focus{background-color:",";border:1px solid ",";}&:disabled,&:disabled:hover,&:disabled:active{background-color:",";color:",";border:1px solid ",";}"],({$fillWidth:e})=>e?"100%":"revert",({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].text.default,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].background.default,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].stroke.default,({$align:e})=>e==="left"?"flex-start":"center",({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].background.hover,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].stroke.hover,({theme:e})=>e.transition.default,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].background.active,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].stroke.active,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].background.disabled,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].text.disabled,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].stroke.disabled),Ga=L(K).withConfig({componentId:"sc-1k4tz4c-2"})(["height:",";width:",";svg{height:",";width:",";}"],({theme:e})=>e.click.button.basic.size.icon.all,({theme:e})=>e.click.button.basic.size.icon.all,({theme:e})=>e.click.button.basic.size.icon.all,({theme:e})=>e.click.button.basic.size.icon.all),Xo=({size:e,family:t,type:n,color:r,children:a})=>o.jsx(fu,{$color:r,$size:e,$family:t,as:n,children:a}),fu=L.div.withConfig({componentId:"sc-1bq7thb-0"})(["font:",";color:",";margin:0;padding:0;font-style:inherit;line-height:1;"],({$size:e="md",$family:t="product",theme:n})=>n.typography.styles[t].titles[e],({$color:e="default",theme:t})=>t.click.global.color.text[e]),uu=({color:e,size:t,weight:n,className:r,children:a})=>o.jsx(pu,{$color:e,$size:t,$weight:n,className:r,children:a}),pu=L.p.withConfig({componentId:"sc-6r74pj-0"})(["font:",";color:",";margin:0;"],({$size:e="md",$weight:t="normal",theme:n})=>n.typography.styles.product.text[t][e],({$color:e="default",theme:t})=>t.click.global.color.text[e]),Rt=L(uu).withConfig({componentId:"sc-6r74pj-1"})([""]);Rt.displayName="Text";const hu=L.div.withConfig({componentId:"sc-1drx130-0"})(["display:flex;justify-content:space-between;align-items:center;"]),vu=L.div.withConfig({componentId:"sc-1drx130-1"})(["display:flex;align-items:center;gap:",";h3{color:",";}"],({theme:e})=>e.click.card.secondary.space.gap,({$disabled:e,theme:t})=>e==!0?t.click.global.color.text.muted:t.click.global.color.text.default),bu=L.div.withConfig({componentId:"sc-1drx130-2"})(["display:flex;flex-direction:column;"]),gu=L.a.withConfig({componentId:"sc-1drx130-3"})(["display:flex;align-items:center;color:",";text-decoration:none;"],({theme:e})=>e.click.card.secondary.color.link.default),mu=L(K).withConfig({componentId:"sc-1drx130-4"})(["color:",";height:",";width:",";"],({theme:e})=>e.click.card.secondary.color.link.default,({theme:e})=>e.click.image.md.size.height,({theme:e})=>e.click.image.md.size.width),Jo=L(Rt).withConfig({componentId:"sc-1drx130-5"})([""]),Qo=L(mu).withConfig({componentId:"sc-1drx130-6"})([""]),xu=L.div.withConfig({componentId:"sc-1drx130-7"})(["background-color:",";border-radius:",";border:",";max-width:420px;min-width:320px;display:flex;flex-direction:column;padding:",";gap:",";box-shadow:",";&:hover,:focus{background-color:",";cursor:pointer;",",","{color:",";}}&[disabled],&[disabled]:hover,&[disabled]:active{background-color:",";color:",";border:1px solid ",";cursor:not-allowed;",",","{color:",";}}"],({theme:e})=>e.click.card.secondary.color.background.default,({theme:e})=>e.click.card.secondary.radii.all,({theme:e})=>`1px solid ${e.click.card.secondary.color.stroke.default}`,({theme:e})=>e.click.card.secondary.space.all,({theme:e})=>e.click.card.secondary.space.gap,({$hasShadow:e,theme:t})=>e?t.shadow[1]:"none",({theme:e})=>e.click.card.secondary.color.background.hover,Jo,Qo,({theme:e})=>e.click.card.secondary.color.link.hover,({theme:e})=>e.click.card.secondary.color.background.disabled,({theme:e})=>e.click.card.secondary.color.title.disabled,({theme:e})=>e.click.card.secondary.color.stroke.disabled,Jo,Qo,({theme:e})=>e.click.card.secondary.color.link.disabled),ku=({title:e,icon:t,badgeState:n,badgeText:r="",hasShadow:a=!1,disabled:i=!1,description:s,infoUrl:c,infoText:d})=>o.jsxs(xu,{$disabled:i,$hasShadow:a,children:[o.jsxs(hu,{children:[o.jsxs(vu,{$disabled:i,children:[o.jsx(K,{name:t,size:"lg"}),o.jsx(Xo,{type:"h3",children:e})]}),r&&o.jsx(Ba,{text:r,state:i==!0?"disabled":n})]}),o.jsx(bu,{children:o.jsx(Rt,{color:"muted",children:s})}),(c||d)&&o.jsxs(gu,{href:i?void 0:c,as:i||!c||c.length===0?"div":"a",children:[o.jsx(Jo,{children:d}),o.jsx(Qo,{name:"chevron-right"})]})]}),$u=L.div.withConfig({componentId:"sc-2dguvi-0"})(["background-color:",";border-radius:",";border:",";display:flex;max-width:100%;text-align:center;flex-direction:column;padding:",";gap:",";box-shadow:",";&:hover,&:focus{background-color:",";cursor:pointer;button{background-color:",";border-color:",";&:active{background-color:",";border-color:",";}}}&[disabled],&[disabled]:hover,&[disabled]:active{background-color:",";color:",";border:1px solid ",";cursor:not-allowed;button{background-color:",";border-color:",";&:active{background-color:",";border-color:",";}}}"],({theme:e})=>e.click.card.primary.color.background.default,({theme:e})=>e.click.card.primary.radii.all,({theme:e})=>`1px solid ${e.click.card.primary.color.stroke.default}`,({$size:e="md",theme:t})=>`${t.click.card.primary.space[e].x} ${t.click.card.primary.space[e].y}`,({$size:e="md",theme:t})=>t.click.card.primary.space[e].gap,({$hasShadow:e,theme:t})=>e?t.shadow[1]:"none",({theme:e})=>e.click.card.secondary.color.background.hover,({theme:e})=>e.click.button.basic.color.primary.background.hover,({theme:e})=>e.click.button.basic.color.primary.stroke.hover,({theme:e})=>e.click.button.basic.color.primary.background.active,({theme:e})=>e.click.button.basic.color.primary.stroke.active,({theme:e})=>e.click.card.primary.color.background.disabled,({theme:e})=>e.click.card.primary.color.title.disabled,({theme:e})=>e.click.card.primary.color.stroke.disabled,({theme:e})=>e.click.button.basic.color.primary.background.disabled,({theme:e})=>e.click.button.basic.color.primary.stroke.disabled,({theme:e})=>e.click.button.basic.color.primary.background.disabled,({theme:e})=>e.click.button.basic.color.primary.stroke.disabled),wu=L.div.withConfig({componentId:"sc-2dguvi-1"})(["display:flex;flex-direction:column;align-items:center;gap:",";h3{color:",";}svg{height:",";width:",";}"],({$size:e="md",theme:t})=>t.click.card.primary.space[e].gap,({$disabled:e,theme:t})=>e==!0?t.click.global.color.text.muted:t.click.global.color.text.default,({$size:e="md",theme:t})=>t.click.card.primary.size.icon[e].all,({$size:e="md",theme:t})=>t.click.card.primary.size.icon[e].all),yu=L.div.withConfig({componentId:"sc-2dguvi-2"})(["width:85%;display:flex;flex-direction:column;align-self:center;gap:",";"],({$size:e="md",theme:t})=>t.click.card.primary.space[e].gap),Cu=({title:e,icon:t,hasShadow:n=!1,description:r,infoUrl:a,infoText:i,size:s,disabled:c=!1})=>{const d=()=>{a&&window.open(a,"_blank")},f=!a||a.length===0?"div":za;return o.jsxs($u,{$hasShadow:n,$size:s,$disabled:c,children:[o.jsxs(wu,{$size:s,$disabled:c,children:[o.jsx(K,{name:t}),o.jsx(Xo,{type:"h3",children:e})]}),o.jsx(yu,{$size:s,children:o.jsx(Rt,{color:"muted",children:r})}),s=="sm"&&o.jsx(kl,{size:"sm"}),i&&o.jsx(f,{onClick:d,disabled:c,children:i})]})};function er(e){const t=l.useRef({value:e,previous:e});return l.useMemo(()=>(t.current.value!==e&&(t.current.previous=t.current.value,t.current.value=e),t.current.previous),[e])}const Ka="Checkbox",[Mu,Vm]=ce(Ka),[Su,Lu]=Mu(Ka),ju=l.forwardRef((e,t)=>{const{__scopeCheckbox:n,name:r,checked:a,defaultChecked:i,required:s,disabled:c,value:d="on",onCheckedChange:f,...p}=e,[u,v]=l.useState(null),b=oe(t,y=>v(y)),g=l.useRef(!1),h=u?!!u.closest("form"):!0,[x=!1,k]=pe({prop:a,defaultProp:i,onChange:f}),$=l.useRef(x);return l.useEffect(()=>{const y=u==null?void 0:u.form;if(y){const C=()=>k($.current);return y.addEventListener("reset",C),()=>y.removeEventListener("reset",C)}},[u,k]),l.createElement(Su,{scope:n,state:x,disabled:c},l.createElement(q.button,M({type:"button",role:"checkbox","aria-checked":qe(x)?"mixed":x,"aria-required":s,"data-state":qa(x),"data-disabled":c?"":void 0,disabled:c,value:d},p,{ref:b,onKeyDown:F(e.onKeyDown,y=>{y.key==="Enter"&&y.preventDefault()}),onClick:F(e.onClick,y=>{k(C=>qe(C)?!0:!C),h&&(g.current=y.isPropagationStopped(),g.current||y.stopPropagation())})})),h&&l.createElement(_u,{control:u,bubbles:!g.current,name:r,value:d,checked:x,required:s,disabled:c,style:{transform:"translateX(-100%)"}}))}),Eu="CheckboxIndicator",Ou=l.forwardRef((e,t)=>{const{__scopeCheckbox:n,forceMount:r,...a}=e,i=Lu(Eu,n);return l.createElement(he,{present:r||qe(i.state)||i.state===!0},l.createElement(q.span,M({"data-state":qa(i.state),"data-disabled":i.disabled?"":void 0},a,{ref:t,style:{pointerEvents:"none",...e.style}})))}),_u=e=>{const{control:t,checked:n,bubbles:r=!0,...a}=e,i=l.useRef(null),s=er(n),c=gn(t);return l.useEffect(()=>{const d=i.current,f=window.HTMLInputElement.prototype,u=Object.getOwnPropertyDescriptor(f,"checked").set;if(s!==n&&u){const v=new Event("click",{bubbles:r});d.indeterminate=qe(n),u.call(d,qe(n)?!1:n),d.dispatchEvent(v)}},[s,n,r]),l.createElement("input",M({type:"checkbox","aria-hidden":!0,defaultChecked:qe(n)?!1:n},a,{tabIndex:-1,ref:i,style:{...e.style,...c,position:"absolute",pointerEvents:"none",opacity:0,margin:0}}))};function qe(e){return e==="indeterminate"}function qa(e){return qe(e)?"indeterminate":e?"checked":"unchecked"}const Pu=ju,Iu=Ou,Fu=({id:e,label:t="",...n})=>{const r=l.useId();return o.jsxs(Tu,{children:[o.jsx(Hu,{id:e??r,"data-testid":"checkbox",...n,children:o.jsx(Du,{children:o.jsx(K,{name:"check",size:"sm"})})}),t&&o.jsx("label",{htmlFor:e??r,children:t})]})},Tu=L.div.withConfig({componentId:"sc-1sck1ja-0"})(["padding:",";display:flex;align-items:center;gap:",";"],({theme:e})=>e.click.checkbox.space.all,({theme:e})=>e.click.checkbox.space.gap),Hu=L(Pu).withConfig({componentId:"sc-1sck1ja-1"})(["display:flex;align-items:center;justify-content:center;",";"],({theme:e})=>`
|
|
245
|
+
`),za=({type:e="primary",iconLeft:t,iconRight:n,align:r="center",children:a,fillWidth:i,label:s,loading:c=!1,disabled:d,...f})=>o.jsxs(du,{$styleType:e,$align:r,$fillWidth:i,disabled:d||c,...f,children:[t&&o.jsx(Ga,{name:t,size:"sm"}),s??a,n&&o.jsx(Ga,{name:n,size:"sm"}),c&&o.jsx(su,{children:o.jsx(K,{name:"loading-animated","data-testid":"click-ui-loading-icon"})})]}),su=L.div.withConfig({componentId:"sc-1k4tz4c-0"})(["position:absolute;background-color:inherit;top:0;left:0;bottom:0;right:0;display:flex;align-content:center;justify-content:center;"]),du=L(Yo).withConfig({componentId:"sc-1k4tz4c-1"})(["width:",";color:",";background-color:",";border:1px solid ",";position:relative;display:flex;align-items:center;justify-content:",";&:hover{background-color:",";border:1px solid ",";transition:",";}&:active,&:focus{background-color:",";border:1px solid ",";}&:disabled,&:disabled:hover,&:disabled:active{background-color:",";color:",";border:1px solid ",";}"],({$fillWidth:e})=>e?"100%":"revert",({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].text.default,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].background.default,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].stroke.default,({$align:e})=>e==="left"?"flex-start":"center",({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].background.hover,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].stroke.hover,({theme:e})=>e.transition.default,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].background.active,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].stroke.active,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].background.disabled,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].text.disabled,({$styleType:e="primary",theme:t})=>t.click.button.basic.color[e].stroke.disabled),Ga=L(K).withConfig({componentId:"sc-1k4tz4c-2"})(["height:",";width:",";svg{height:",";width:",";}"],({theme:e})=>e.click.button.basic.size.icon.all,({theme:e})=>e.click.button.basic.size.icon.all,({theme:e})=>e.click.button.basic.size.icon.all,({theme:e})=>e.click.button.basic.size.icon.all),Xo=({size:e,family:t,type:n,color:r,children:a})=>o.jsx(fu,{$color:r,$size:e,$family:t,as:n,children:a}),fu=L.div.withConfig({componentId:"sc-1bq7thb-0"})(["font:",";color:",";margin:0;padding:0;font-style:inherit;line-height:1;"],({$size:e="md",$family:t="product",theme:n})=>n.typography.styles[t].titles[e],({$color:e="default",theme:t})=>t.click.global.color.text[e]),uu=({color:e,size:t,weight:n,className:r,children:a})=>o.jsx(pu,{$color:e,$size:t,$weight:n,className:r,children:a}),pu=L.p.withConfig({componentId:"sc-6r74pj-0"})(["font:",";color:",";margin:0;"],({$size:e="md",$weight:t="normal",theme:n})=>n.typography.styles.product.text[t][e],({$color:e="default",theme:t})=>t.click.global.color.text[e]),Rt=L(uu).withConfig({componentId:"sc-6r74pj-1"})([""]);Rt.displayName="Text";const hu=L.div.withConfig({componentId:"sc-1drx130-0"})(["display:flex;justify-content:space-between;align-items:center;"]),vu=L.div.withConfig({componentId:"sc-1drx130-1"})(["display:flex;align-items:center;gap:",";h3{color:",";}"],({theme:e})=>e.click.card.secondary.space.gap,({$disabled:e,theme:t})=>e==!0?t.click.global.color.text.muted:t.click.global.color.text.default),bu=L.div.withConfig({componentId:"sc-1drx130-2"})(["display:flex;flex-direction:column;"]),gu=L.a.withConfig({componentId:"sc-1drx130-3"})(["display:flex;align-items:center;color:",";text-decoration:none;"],({theme:e})=>e.click.card.secondary.color.link.default),mu=L(K).withConfig({componentId:"sc-1drx130-4"})(["color:",";height:",";width:",";"],({theme:e})=>e.click.card.secondary.color.link.default,({theme:e})=>e.click.image.md.size.height,({theme:e})=>e.click.image.md.size.width),Jo=L(Rt).withConfig({componentId:"sc-1drx130-5"})([""]),Qo=L(mu).withConfig({componentId:"sc-1drx130-6"})([""]),xu=L.div.withConfig({componentId:"sc-1drx130-7"})(["background-color:",";border-radius:",";border:",";max-width:420px;min-width:320px;display:flex;flex-direction:column;padding:",";gap:",";box-shadow:",";&:hover,:focus{background-color:",";cursor:pointer;",",","{color:",";}}&[disabled],&[disabled]:hover,&[disabled]:active{background-color:",";color:",";border:1px solid ",";cursor:not-allowed;",",","{color:",";}}"],({theme:e})=>e.click.card.secondary.color.background.default,({theme:e})=>e.click.card.secondary.radii.all,({theme:e})=>`1px solid ${e.click.card.secondary.color.stroke.default}`,({theme:e})=>e.click.card.secondary.space.all,({theme:e})=>e.click.card.secondary.space.gap,({$hasShadow:e,theme:t})=>e?t.shadow[1]:"none",({theme:e})=>e.click.card.secondary.color.background.hover,Jo,Qo,({theme:e})=>e.click.card.secondary.color.link.hover,({theme:e})=>e.click.card.secondary.color.background.disabled,({theme:e})=>e.click.card.secondary.color.title.disabled,({theme:e})=>e.click.card.secondary.color.stroke.disabled,Jo,Qo,({theme:e})=>e.click.card.secondary.color.link.disabled),ku=({title:e,icon:t,badgeState:n,badgeText:r="",hasShadow:a=!1,disabled:i=!1,description:s,infoUrl:c,infoText:d})=>o.jsxs(xu,{$disabled:i,$hasShadow:a,children:[o.jsxs(hu,{children:[o.jsxs(vu,{$disabled:i,children:[o.jsx(K,{name:t,size:"lg"}),o.jsx(Xo,{type:"h3",children:e})]}),r&&o.jsx(Ba,{text:r,state:i==!0?"disabled":n})]}),o.jsx(bu,{children:o.jsx(Rt,{color:"muted",children:s})}),(c||d)&&o.jsxs(gu,{href:i?void 0:c,as:i||!c||c.length===0?"div":"a",children:[o.jsx(Jo,{children:d}),o.jsx(Qo,{name:"chevron-right"})]})]}),$u=L.div.withConfig({componentId:"sc-2dguvi-0"})(["background-color:",";border-radius:",";border:",";display:flex;max-width:100%;text-align:center;flex-direction:column;padding:",";gap:",";box-shadow:",";&:hover,&:focus{background-color:",";cursor:pointer;button{background-color:",";border-color:",";&:active{background-color:",";border-color:",";}}}&[disabled],&[disabled]:hover,&[disabled]:active{background-color:",";color:",";border:1px solid ",";cursor:not-allowed;button{background-color:",";border-color:",";&:active{background-color:",";border-color:",";}}}"],({theme:e})=>e.click.card.primary.color.background.default,({theme:e})=>e.click.card.primary.radii.all,({theme:e})=>`1px solid ${e.click.card.primary.color.stroke.default}`,({$size:e="md",theme:t})=>`${t.click.card.primary.space[e].x} ${t.click.card.primary.space[e].y}`,({$size:e="md",theme:t})=>t.click.card.primary.space[e].gap,({$hasShadow:e,theme:t})=>e?t.shadow[1]:"none",({theme:e})=>e.click.card.secondary.color.background.hover,({theme:e})=>e.click.button.basic.color.primary.background.hover,({theme:e})=>e.click.button.basic.color.primary.stroke.hover,({theme:e})=>e.click.button.basic.color.primary.background.active,({theme:e})=>e.click.button.basic.color.primary.stroke.active,({theme:e})=>e.click.card.primary.color.background.disabled,({theme:e})=>e.click.card.primary.color.title.disabled,({theme:e})=>e.click.card.primary.color.stroke.disabled,({theme:e})=>e.click.button.basic.color.primary.background.disabled,({theme:e})=>e.click.button.basic.color.primary.stroke.disabled,({theme:e})=>e.click.button.basic.color.primary.background.disabled,({theme:e})=>e.click.button.basic.color.primary.stroke.disabled),wu=L.div.withConfig({componentId:"sc-2dguvi-1"})(["display:flex;flex-direction:column;align-items:center;gap:",";h3{color:",";}svg{height:",";width:",";}"],({$size:e="md",theme:t})=>t.click.card.primary.space[e].gap,({$disabled:e,theme:t})=>e==!0?t.click.global.color.text.muted:t.click.global.color.text.default,({$size:e="md",theme:t})=>t.click.card.primary.size.icon[e].all,({$size:e="md",theme:t})=>t.click.card.primary.size.icon[e].all),yu=L.div.withConfig({componentId:"sc-2dguvi-2"})(["width:85%;display:flex;flex-direction:column;align-self:center;gap:",";"],({$size:e="md",theme:t})=>t.click.card.primary.space[e].gap),Cu=({title:e,icon:t,hasShadow:n=!1,description:r,infoUrl:a,infoText:i,size:s,disabled:c=!1})=>{const d=()=>{a&&window.open(a,"_blank")},f=!a||a.length===0?"div":za;return o.jsxs($u,{$hasShadow:n,$size:s,$disabled:c,children:[o.jsxs(wu,{$size:s,$disabled:c,children:[o.jsx(K,{name:t}),o.jsx(Xo,{type:"h3",children:e})]}),o.jsx(yu,{$size:s,children:o.jsx(Rt,{color:"muted",children:r})}),s=="sm"&&o.jsx(kl,{size:"sm"}),i&&o.jsx(f,{onClick:d,disabled:c,children:i})]})};function er(e){const t=l.useRef({value:e,previous:e});return l.useMemo(()=>(t.current.value!==e&&(t.current.previous=t.current.value,t.current.value=e),t.current.previous),[e])}const Ka="Checkbox",[Mu,Vm]=ce(Ka),[Su,Lu]=Mu(Ka),ju=l.forwardRef((e,t)=>{const{__scopeCheckbox:n,name:r,checked:a,defaultChecked:i,required:s,disabled:c,value:d="on",onCheckedChange:f,...p}=e,[u,v]=l.useState(null),b=oe(t,y=>v(y)),g=l.useRef(!1),h=u?!!u.closest("form"):!0,[x=!1,k]=pe({prop:a,defaultProp:i,onChange:f}),$=l.useRef(x);return l.useEffect(()=>{const y=u==null?void 0:u.form;if(y){const C=()=>k($.current);return y.addEventListener("reset",C),()=>y.removeEventListener("reset",C)}},[u,k]),l.createElement(Su,{scope:n,state:x,disabled:c},l.createElement(q.button,M({type:"button",role:"checkbox","aria-checked":qe(x)?"mixed":x,"aria-required":s,"data-state":qa(x),"data-disabled":c?"":void 0,disabled:c,value:d},p,{ref:b,onKeyDown:F(e.onKeyDown,y=>{y.key==="Enter"&&y.preventDefault()}),onClick:F(e.onClick,y=>{k(C=>qe(C)?!0:!C),h&&(g.current=y.isPropagationStopped(),g.current||y.stopPropagation())})})),h&&l.createElement(_u,{control:u,bubbles:!g.current,name:r,value:d,checked:x,required:s,disabled:c,style:{transform:"translateX(-100%)"}}))}),Eu="CheckboxIndicator",Ou=l.forwardRef((e,t)=>{const{__scopeCheckbox:n,forceMount:r,...a}=e,i=Lu(Eu,n);return l.createElement(he,{present:r||qe(i.state)||i.state===!0},l.createElement(q.span,M({"data-state":qa(i.state),"data-disabled":i.disabled?"":void 0},a,{ref:t,style:{pointerEvents:"none",...e.style}})))}),_u=e=>{const{control:t,checked:n,bubbles:r=!0,...a}=e,i=l.useRef(null),s=er(n),c=gn(t);return l.useEffect(()=>{const d=i.current,f=window.HTMLInputElement.prototype,u=Object.getOwnPropertyDescriptor(f,"checked").set;if(s!==n&&u){const v=new Event("click",{bubbles:r});d.indeterminate=qe(n),u.call(d,qe(n)?!1:n),d.dispatchEvent(v)}},[s,n,r]),l.createElement("input",M({type:"checkbox","aria-hidden":!0,defaultChecked:qe(n)?!1:n},a,{tabIndex:-1,ref:i,style:{...e.style,...c,position:"absolute",pointerEvents:"none",opacity:0,margin:0}}))};function qe(e){return e==="indeterminate"}function qa(e){return qe(e)?"indeterminate":e?"checked":"unchecked"}const Pu=ju,Iu=Ou,Fu=({id:e,label:t="",...n})=>{const r=l.useId();return o.jsxs(Tu,{children:[o.jsx(Hu,{id:e??r,"data-testid":"checkbox",...n,children:o.jsx(Du,{children:o.jsx(K,{name:"check",size:"sm"})})}),t&&o.jsx("label",{htmlFor:e??r,children:t})]})},Tu=L.div.withConfig({componentId:"sc-1sck1ja-0"})(["padding:",";display:flex;align-items:center;gap:",";"],({theme:e})=>e.click.checkbox.space.all,({theme:e})=>e.click.checkbox.space.gap),Hu=L(Pu).withConfig({componentId:"sc-1sck1ja-1"})(["display:flex;align-items:center;justify-content:center;",";"],({theme:e})=>`
|
|
246
246
|
border-radius: ${e.click.checkbox.radii.all};
|
|
247
247
|
width: ${e.click.checkbox.size.all};
|
|
248
248
|
height: ${e.click.checkbox.size.all};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IconName } from '../../components/Icon/types';
|
|
2
|
+
import React from "react";
|
|
3
3
|
type ButtonType = "primary" | "secondary" | "danger";
|
|
4
4
|
type Alignment = "center" | "left";
|
|
5
5
|
export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@clickhouse/click-ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.26",
|
|
4
4
|
"description": "Official ClickHouse design system react library",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"storybook": "storybook dev -p 6006",
|
|
40
40
|
"build-storybook": "storybook build",
|
|
41
41
|
"chromatic": "npx chromatic",
|
|
42
|
-
"publish": "npm run test && npm run build && npm publish"
|
|
42
|
+
"publish:click-ui": "npm run test && npm run build && npm publish"
|
|
43
43
|
},
|
|
44
44
|
"dependencies": {
|
|
45
45
|
"@radix-ui/react-accordion": "^1.1.2",
|