@infinityfx/fluid
Version:
React UI library, using zero-runtime CSS-in-JS.
3 lines (2 loc) • 1.2 kB
JavaScript
import{jsxs as r,jsx as e}from"react/jsx-runtime";import{useId as o,cloneElement as i}from"react";import{combineClasses as s,classes as a}from"../../core/utils.js";import{createStyles as l}from"../../core/style.js";import t from"../layout/collapsible.js";const n=l("annotation",{".wrapper":{display:"flex",flexDirection:"column",color:"var(--f-clr-text-100)",minWidth:"min(100vw, 12em)","--width":"100%"},".s__xsm":{fontSize:"var(--f-font-size-xxs)"},".s__sml":{fontSize:"var(--f-font-size-xsm)"},".s__med":{fontSize:"var(--f-font-size-sml)"},".s__lrg":{fontSize:"var(--f-font-size-med)"},".label, .error":{fontSize:".8em",fontWeight:500},".label":{paddingBottom:"var(--f-spacing-xxs)"},".error":{color:"var(--f-clr-error-100)",paddingTop:"var(--f-spacing-xxs)"}});function c({children:l,cc:c={},label:f,error:m,...d}){const p=s(n,c),v=o(),x=l.props.size||"med",z=!!l.props.required;return r("div",{...d,className:a(p.wrapper,p[`s__${x}`],d.className),children:[f&&r("div",{id:v,className:p.label,children:[f,z?" *":""]}),i(l,{"aria-labelledby":f?v:void 0,"data-fc":!0}),e(t,{shown:!!m,children:e("div",{className:p.error,children:m})})]})}export{c as default};
//# sourceMappingURL=annotation.js.map