@undp/design-system-react/dist/InputGroup.cjs

React based design system for UNDP

Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./utils-Dd9-5CFr.cjs"),t=require("./dist-BZMXZCSu.cjs"),n=require("./Button.cjs"),r=require("./Input.cjs"),i=require("./Textarea.cjs");let a=require("react/jsx-runtime");var o=t.t(`group/input-group relative flex w-full min-w-0 items-stretch outline-none transition-colors in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-start]]:h-auto has-[>textarea]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:flex-col  has-[[data-slot][aria-invalid=true]]:border-error has-disabled:bg-background/50 has-disabled:opacity-disabled has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-error/20 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-start]]:[&>input]:pl-1.5`,{variants:{variant:{light:`border border-stroke`,normal:`border-2 border-foreground`},rounded:{base:`rounded`,sm:`rounded-sm`,md:`rounded-md`,lg:`rounded-lg`,xl:`rounded-xl`,"2xl":`rounded-2xl`,full:`rounded-full`}},defaultVariants:{variant:`normal`,rounded:`base`}});function s({className:t,variant:n,rounded:r,...i}){return(0,a.jsx)(`div`,{"data-slot":`input-group`,role:`group`,className:e.t(o({variant:n,rounded:r}),t),...i})}var c=t.t(`flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4`,{variants:{variant:{transparent:`bg-transparent text-content-secondary`,surface:`bg-surface text-content-secondary`,"surface-hard":`bg-surface-hard text-content-secondary`,background:`bg-background text-content-secondary`,"background-soft":`bg-background-soft text-content-secondary`,foreground:`bg-foreground text-content-reverse`,"foreground-soft":`bg-foreground-soft text-content-reverse`,error:`bg-error text-content-reverse`,warning:`bg-warning text-content-primary`,info:`bg-info text-content-reverse`,success:`bg-success text-content-reverse`},align:{"inline-start":`order-first px-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]`,"inline-end":`order-last px-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]`,"block-start":`order-first w-full justify-start p-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2`,"block-end":`order-last w-full justify-start p-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2`}},compoundVariants:[{variant:`background`,align:`inline-start`,class:`border-r border-stroke`},{variant:`background`,align:`inline-end`,class:`border-l border-stroke`},{variant:`background`,align:`block-start`,class:`border-b border-stroke`},{variant:`background`,align:`block-end`,class:`border-t border-stroke`}],defaultVariants:{align:`inline-start`,variant:`surface`}});function l({className:t,align:n,variant:r,...i}){return(0,a.jsx)(`div`,{role:`group`,"data-slot":`input-group-addon`,"data-align":n,"data-variant":r,className:e.t(c({align:n,variant:r}),t),onClick:e=>{e.target.closest(`button`)||e.currentTarget.parentElement?.querySelector(`input`)?.focus()},...i})}var u=t.t(`flex items-center gap-2 text-sm shadow-none`,{variants:{size:{xs:`h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5`,sm:``,"icon-xs":`size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0`,"icon-sm":`size-8 p-0 has-[>svg]:p-0`}},defaultVariants:{size:`xs`}});function d({className:t,type:r=`button`,variant:i=`icon`,size:o=`xs`,...s}){return(0,a.jsx)(n.Button,{type:r,"data-size":o,variant:i,className:e.t(u({size:o}),t),...s})}var f=t.t(`flex items-center gap-2 text-xs [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none`,{variants:{variant:{primary:`text-content-primary`,secondary:`text-content-secondary`,tertiary:`text-content-tertiary`,quaternary:`text-content-quaternary`,reverse:`text-content-reverse`,placeholder:`text-content-placeholder`,error:`text-error`,warning:`text-warning`,info:`text-info`,success:`text-success`}},defaultVariants:{variant:`tertiary`}});function p({className:t,variant:n,...r}){return(0,a.jsx)(`span`,{className:e.t(f({variant:n}),t),...r})}function m({className:t,...n}){return(0,a.jsx)(r.Input,{"data-slot":`input-group-control`,className:e.t(`flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0`,t),...n})}function h({className:t,...n}){return(0,a.jsx)(i.Textarea,{"data-slot":`input-group-control`,className:e.t(`flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0`,t),...n})}exports.InputGroup=s,exports.InputGroupAddon=l,exports.InputGroupButton=d,exports.InputGroupInput=m,exports.InputGroupText=p,exports.InputGroupTextarea=h;
//# sourceMappingURL=InputGroup.cjs.map