UNPKG

@copilotkit/a2ui-renderer

Version:

A2UI Renderer for CopilotKit - render A2UI surfaces in React applications

1 lines 2.65 kB
{"version":3,"file":"Image.cjs","names":["createReactComponent","ImageApi","getBaseLeafStyle"],"sources":["../../../../../../src/react-renderer/a2ui-react/catalog/basic/components/Image.tsx"],"sourcesContent":["/**\n * Copyright 2026 Google LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from \"react\";\nimport { createReactComponent } from \"../../../adapter\";\nimport { ImageApi } from \"@a2ui/web_core/v0_9/basic_catalog\";\nimport { getBaseLeafStyle } from \"../utils\";\n\nexport const Image = createReactComponent(ImageApi, ({ props }) => {\n const mapFit = (fit?: string): React.CSSProperties[\"objectFit\"] => {\n if (fit === \"scaleDown\") return \"scale-down\";\n return (fit as React.CSSProperties[\"objectFit\"]) || \"fill\";\n };\n\n const style: React.CSSProperties = {\n ...getBaseLeafStyle(),\n objectFit: mapFit(props.fit),\n width: \"100%\",\n height: \"auto\",\n display: \"block\",\n };\n\n if (props.variant === \"icon\") {\n style.width = \"24px\";\n style.height = \"24px\";\n } else if (props.variant === \"avatar\") {\n style.width = \"40px\";\n style.height = \"40px\";\n style.borderRadius = \"50%\";\n } else if (props.variant === \"smallFeature\") {\n style.maxWidth = \"100px\";\n } else if (props.variant === \"largeFeature\") {\n style.maxHeight = \"400px\";\n } else if (props.variant === \"header\") {\n style.height = \"200px\";\n style.objectFit = \"cover\";\n }\n\n return <img src={props.url} alt={props.description || \"\"} style={style} />;\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAa,QAAQA,qCAAqBC,6CAAW,EAAE,YAAY;CACjE,MAAM,UAAU,QAAmD;AACjE,MAAI,QAAQ,YAAa,QAAO;AAChC,SAAQ,OAA4C;;CAGtD,MAAM,QAA6B;EACjC,GAAGC,gCAAkB;EACrB,WAAW,OAAO,MAAM,IAAI;EAC5B,OAAO;EACP,QAAQ;EACR,SAAS;EACV;AAED,KAAI,MAAM,YAAY,QAAQ;AAC5B,QAAM,QAAQ;AACd,QAAM,SAAS;YACN,MAAM,YAAY,UAAU;AACrC,QAAM,QAAQ;AACd,QAAM,SAAS;AACf,QAAM,eAAe;YACZ,MAAM,YAAY,eAC3B,OAAM,WAAW;UACR,MAAM,YAAY,eAC3B,OAAM,YAAY;UACT,MAAM,YAAY,UAAU;AACrC,QAAM,SAAS;AACf,QAAM,YAAY;;AAGpB,QAAO,2CAAC;EAAI,KAAK,MAAM;EAAK,KAAK,MAAM,eAAe;EAAW;GAAS;EAC1E"}