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/FormerLayoutBottom.tsx

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