{
  "name": "editable-autosize-demo",
  "type": "registry:example",
  "registryDependencies": [
    "editable"
  ],
  "files": [
    {
      "path": "examples/editable-autosize-demo.tsx",
      "type": "registry:example",
      "content": "import { Button } from \"@/registry/bases/base/ui/button\";\nimport {\n  Editable,\n  EditableArea,\n  EditableCancel,\n  EditableInput,\n  EditableLabel,\n  EditablePreview,\n  EditableSubmit,\n  EditableToolbar,\n} from \"@/registry/bases/base/ui/editable\";\n\nexport default function EditableAutosizeDemo() {\n  return (\n    <Editable\n      defaultValue=\"Adjust the size of the input with the text inside.\"\n      autosize\n    >\n      <EditableLabel>Autosize editable</EditableLabel>\n      <EditableArea>\n        <EditablePreview className=\"whitespace-pre-wrap\" />\n        <EditableInput />\n      </EditableArea>\n      <EditableToolbar>\n        <EditableSubmit render={<Button size=\"sm\" />}>Save</EditableSubmit>\n        <EditableCancel render={<Button variant=\"outline\" size=\"sm\" />}>\n          Cancel\n        </EditableCancel>\n      </EditableToolbar>\n    </Editable>\n  );\n}\n",
      "target": ""
    }
  ]
}