feat(form): ✨ enhance form layout and functionality

* Add FormerButtonArea component for action buttons
* Introduce FormerLayoutTop and FormerLayoutBottom for structured layout
* Update Former types to include new properties
* Implement dynamic ID generation for forms
* Refactor example to demonstrate new layout features
* Mark tasks as completed in todo.md

src/Former/FormerLayoutTop.tsx

@@ -0,0 +1,22 @@
+import { useFormerStore } from './Former.store';
+import { FormerButtonArea } from './FormerButtonArea';
+
+export const FormerLayoutTop = () => {
+  const { renderTop, getState, opened, buttonOnTop } = useFormerStore((state) => ({
+    renderTop: state.layout?.renderTop,
+    buttonOnTop: state.layout?.buttonOnTop,
+    getState: state.getState,
+    opened: state.opened,
+  }));
+
+  if (renderTop) {
+    return renderTop(
+      <FormerButtonArea />,
+      opened,
+      getState('onClose'),
+      getState('onOpen'),
+      getState
+    );
+  }
+  return buttonOnTop ? <FormerButtonArea /> : <></>;
+};