var lesson = {
	files: [
		{
			name: "main",
			content: "import { render } from \"solid-js/web\";\nimport { createSignal } from \"solid-js\";\n\nimport \"./style.css\";\n\nfunction App() {\n  const [pos, setPos] = createSignal({x: 0, y: 0});\n\n  function handleMouseMove(event) {\n    setPos({\n      x: event.clientX,\n      y: event.clientY\n    });\n  }\n\n  return (\n    <div>\n      The mouse position is {pos().x} x {pos().y}\n    </div>\n  );\n}\n\nrender(() => <App />, document.getElementById('app'));"
		},
		{
			name: "style",
			type: "css",
			content: "div { width: 100%; height: 100%; }"
		}
	]
};
var solved = {
	files: [
		{
			name: "main",
			content: "import { render } from \"solid-js/web\";\nimport { createSignal } from \"solid-js\";\n\nimport \"./style.css\";\n\nfunction App() {\n  const [pos, setPos] = createSignal({x: 0, y: 0});\n\n  function handleMouseMove(event) {\n    setPos({\n      x: event.clientX,\n      y: event.clientY\n    });\n  }\n\n  return (\n    <div onMouseMove={handleMouseMove}>\n      The mouse position is {pos().x} x {pos().y}\n    </div>\n  );\n}\n\nrender(() => <App />, document.getElementById('app'));"
		},
		{
			name: "style",
			type: "css",
			content: "div { width: 100%; height: 100%; }"
		}
	]
};
var markdown = "События в Solid это атрибуты с префиксом `on`. Они являются особенными в своем поведении. Во-первых, они не включаются в реактивные обертки. Во многих случаях очень тяжело объяснить разницу между `Сигналом` и слушателем события (`event handler`). В случае с событиями они вызываются и им не нужна реактивность они прикрепляются (`bound`) только единожды. Вы всегда можете сделать так, чтобы ваш слушатель выполнял различные операции, в зависимости от текущего состояния вашего приложения.\n\nСтандартные UI события (которые всплывают и композируются (`composed`)) автоматически делегируются документу. Для улучшения перформанса при делегации Solid поддерживает синтаксис в виде массива, чтобы вызывать слушателя без создания дополнительных замыканий (`closures`):\n\n```jsx\nconst handler = (data, event) => /*...*/\n\n<button onClick={[handler, data]}>Click Me</button>\n```\n\nНапример, давайте прикрепим слушатель на событие `mousemove`:\n\n```jsx\n<div onMouseMove={handleMouseMove}>\n  The mouse position is {pos().x} x {pos().y}\n</div>\n```\n\nВсе `on` атрибуты не зависят от регистра, однако для сверки вы должны ориентироваться на названия с нижним регистром. Например, `onMouseMove` будет отслеживать событие `mousemove`. Если вам нужна поддержка других регистров или вы не хотите использовать делегацию событий, то вы можете использовать префикс `on:` чтобы использовать названия событий после двоеточия:\n\n```jsx\n<button on:DOMContentLoaded={() => /* Любое действие */} >Click Me</button>\n```\n";
var bindings_events = {
	lesson: lesson,
	solved: solved,
	markdown: markdown
};

export { bindings_events as default, lesson, markdown, solved };
