@copilotkit/a2ui-renderer/dist/react-renderer/a2ui-react/catalog/basic/components/Slider.mjs.map

A2UI Renderer for CopilotKit - render A2UI surfaces in React applications

{"version":3,"file":"Slider.mjs","names":[],"sources":["../../../../../../src/react-renderer/a2ui-react/catalog/basic/components/Slider.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 { SliderApi } from \"@a2ui/web_core/v0_9/basic_catalog\";\nimport { LEAF_MARGIN } from \"../utils\";\n\nexport const Slider = createReactComponent(SliderApi, ({ props }) => {\n  const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    props.setValue(Number(e.target.value));\n  };\n\n  const uniqueId = React.useId();\n\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        flexDirection: \"column\",\n        gap: \"4px\",\n        margin: LEAF_MARGIN,\n        width: \"100%\",\n      }}\n    >\n      <div style={{ display: \"flex\", justifyContent: \"space-between\" }}>\n        {props.label && (\n          <label\n            htmlFor={uniqueId}\n            style={{ fontSize: \"14px\", fontWeight: \"bold\" }}\n          >\n            {props.label}\n          </label>\n        )}\n        <span style={{ fontSize: \"12px\", color: \"#666\" }}>{props.value}</span>\n      </div>\n      <input\n        id={uniqueId}\n        type=\"range\"\n        min={props.min ?? 0}\n        max={props.max}\n        value={props.value ?? 0}\n        onChange={onChange}\n        style={{ width: \"100%\", cursor: \"pointer\" }}\n      />\n    </div>\n  );\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAa,SAAS,qBAAqB,YAAY,EAAE,YAAY;CACnE,MAAM,YAAY,MAA2C;AAC3D,QAAM,SAAS,OAAO,EAAE,OAAO,MAAM,CAAC;;CAGxC,MAAM,WAAW,MAAM,OAAO;AAE9B,QACE,qBAAC;EACC,OAAO;GACL,SAAS;GACT,eAAe;GACf,KAAK;GACL,QAAQ;GACR,OAAO;GACR;aAED,qBAAC;GAAI,OAAO;IAAE,SAAS;IAAQ,gBAAgB;IAAiB;cAC7D,MAAM,SACL,oBAAC;IACC,SAAS;IACT,OAAO;KAAE,UAAU;KAAQ,YAAY;KAAQ;cAE9C,MAAM;KACD,EAEV,oBAAC;IAAK,OAAO;KAAE,UAAU;KAAQ,OAAO;KAAQ;cAAG,MAAM;KAAa;IAClE,EACN,oBAAC;GACC,IAAI;GACJ,MAAK;GACL,KAAK,MAAM,OAAO;GAClB,KAAK,MAAM;GACX,OAAO,MAAM,SAAS;GACZ;GACV,OAAO;IAAE,OAAO;IAAQ,QAAQ;IAAW;IAC3C;GACE;EAER"}