@sqrzro/admin 2.0.0-beta.0 → 2.0.0

package/dist/core/Pagination/index.d.ts

@@ -1,15 +1,15 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import type { PaginationObject } from '../../utility/interfaces';
-interface PaginationProps extends PaginationObject {
-    isDisabled?: boolean;
-}
-declare function Pagination({ activePage, isDisabled, pageCount, }: PaginationProps): React.ReactElement | null;
-declare namespace Pagination {
-    var propTypes: {
-        activePage: PropTypes.Validator<number>;
-        pageCount: PropTypes.Validator<number>;
-        isDisabled: PropTypes.Requireable<boolean>;
-    };
-}
-export default Pagination;
+import React from 'react';
+import PropTypes from 'prop-types';
+import type { PaginationObject } from '../../utility/interfaces';
+interface PaginationProps extends PaginationObject {
+    isDisabled?: boolean;
+}
+declare function Pagination({ activePage, isDisabled, pageCount, }: PaginationProps): React.ReactElement | null;
+declare namespace Pagination {
+    var propTypes: {
+        activePage: PropTypes.Validator<number>;
+        pageCount: PropTypes.Validator<number>;
+        isDisabled: PropTypes.Requireable<boolean>;
+    };
+}
+export default Pagination;

package/dist/core/Pagination/index.js

@@ -1,64 +1,64 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { filterDuplicates } from '@sqrzro/utility';
-import PaginationItem from '../PaginationItem';
-// Import styles from './Pagination.module.css';
-/**
- * Find an index. In many cases this is simply the active page. However, with the first and
- * last pages, the index is moved 'in' one space (i.e. when the active page is 1, the index is
- * 2). This ensures that the first 3 links are shown on the first page, and the last 3 on the
- * last page.
- */
-const getIndex = (activePage, pageCount) => {
-    if (activePage === 1) {
-        return 2;
-    }
-    if (activePage === pageCount) {
-        return pageCount - 1;
-    }
-    return activePage;
-};
-/**
- * Reduce the links to their final array. If it's the first value, or the previous value is the
- * number before the current one (i.e. the current is 4 and the previous is 3), add it to the array.
- * Otherwise (i.e. the current is 5 and the previous is 2), add a hyphen and then the value. This
- * will then get interpreted as an ellipsis in the pagination when rendered.
- */
-const reduceLinks = (acc, cur, index, arr) => {
-    if (index === 0 || arr[index - 1] === cur - 1) {
-        return [...acc, cur];
-    }
-    return [...acc, '-', cur];
-};
-/**
- * The idea of the pagination is to always have the following links available:
- * - The first page
- * - The previous page (if applicable)
- * - The current page
- * - The next page (if applicable)
- * - The last page
- *
- * There are situations where some of these will be the same page (i.e. on page 2, the previous page
- * and the first page will both be page 1). When on the first page, links to the first 3 pages are
- * displayed (rather than 2, which would be the default if the above rules are followed). The same
- * is true with the last page
- */
-const getLinks = (activePage, pageCount) => {
-    const index = getIndex(activePage, pageCount);
-    return filterDuplicates([1, index - 1, index, index + 1, pageCount])
-        .filter((item) => item > 0 && item <= pageCount)
-        .reduce(reduceLinks, []);
-};
-function Pagination({ activePage, isDisabled, pageCount, }) {
-    if (pageCount === 1) {
-        return null;
-    }
-    return (React.createElement("ul", { className: "/*clsx(styles.root, isDisabled && styles.rootIsDisabled)*/" }, getLinks(activePage, pageCount).map((item, index) => (React.createElement("li", { key: index, className: "/*styles.item*/" },
-        React.createElement(PaginationItem, { activePage: activePage, pageNumber: item }))))));
-}
-Pagination.propTypes = {
-    activePage: PropTypes.number.isRequired,
-    pageCount: PropTypes.number.isRequired,
-    isDisabled: PropTypes.bool,
-};
-export default Pagination;
+import React from 'react';
+import PropTypes from 'prop-types';
+import { filterDuplicates } from '@sqrzro/utility';
+import PaginationItem from '../../core/PaginationItem';
+// Import styles from './Pagination.module.css';
+/**
+ * Find an index. In many cases this is simply the active page. However, with the first and
+ * last pages, the index is moved 'in' one space (i.e. when the active page is 1, the index is
+ * 2). This ensures that the first 3 links are shown on the first page, and the last 3 on the
+ * last page.
+ */
+const getIndex = (activePage, pageCount) => {
+    if (activePage === 1) {
+        return 2;
+    }
+    if (activePage === pageCount) {
+        return pageCount - 1;
+    }
+    return activePage;
+};
+/**
+ * Reduce the links to their final array. If it's the first value, or the previous value is the
+ * number before the current one (i.e. the current is 4 and the previous is 3), add it to the array.
+ * Otherwise (i.e. the current is 5 and the previous is 2), add a hyphen and then the value. This
+ * will then get interpreted as an ellipsis in the pagination when rendered.
+ */
+const reduceLinks = (acc, cur, index, arr) => {
+    if (index === 0 || arr[index - 1] === cur - 1) {
+        return [...acc, cur];
+    }
+    return [...acc, '-', cur];
+};
+/**
+ * The idea of the pagination is to always have the following links available:
+ * - The first page
+ * - The previous page (if applicable)
+ * - The current page
+ * - The next page (if applicable)
+ * - The last page
+ *
+ * There are situations where some of these will be the same page (i.e. on page 2, the previous page
+ * and the first page will both be page 1). When on the first page, links to the first 3 pages are
+ * displayed (rather than 2, which would be the default if the above rules are followed). The same
+ * is true with the last page
+ */
+const getLinks = (activePage, pageCount) => {
+    const index = getIndex(activePage, pageCount);
+    return filterDuplicates([1, index - 1, index, index + 1, pageCount])
+        .filter((item) => item > 0 && item <= pageCount)
+        .reduce(reduceLinks, []);
+};
+function Pagination({ activePage, isDisabled, pageCount, }) {
+    if (pageCount === 1) {
+        return null;
+    }
+    return (React.createElement("ul", { className: "/*clsx(styles.root, isDisabled && styles.rootIsDisabled)*/" }, getLinks(activePage, pageCount).map((item, index) => (React.createElement("li", { key: index, className: "/*styles.item*/" },
+        React.createElement(PaginationItem, { activePage: activePage, pageNumber: item }))))));
+}
+Pagination.propTypes = {
+    activePage: PropTypes.number.isRequired,
+    pageCount: PropTypes.number.isRequired,
+    isDisabled: PropTypes.bool,
+};
+export default Pagination;

package/dist/core/PaginationItem/index.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-interface PaginationItemProps {
-    activePage: number;
-    pageNumber: number | '-';
-}
-declare function PaginationItem({ activePage, pageNumber }: PaginationItemProps): React.ReactElement;
-declare namespace PaginationItem {
-    var propTypes: {};
-}
-export default PaginationItem;
+import React from 'react';
+interface PaginationItemProps {
+    activePage: number;
+    pageNumber: number | '-';
+}
+declare function PaginationItem({ activePage, pageNumber }: PaginationItemProps): React.ReactElement;
+declare namespace PaginationItem {
+    var propTypes: {};
+}
+export default PaginationItem;

package/dist/core/PaginationItem/index.js

@@ -1,17 +1,17 @@
-import React from 'react';
-import Link from '../../components/Link';
-import { ifWindow } from '@sqrzro/utility';
-const getLinkUrl = (pageNumber) => {
-    const windowLocation = ifWindow((win) => `${win.location.pathname}${win.location.search}`, '');
-    const cleanUrl = windowLocation.replace(/(?:\?|&)page=[0-9]+/u, '');
-    const hasQuery = Boolean(/\?/u.exec(windowLocation) && !/\?page/u.exec(windowLocation));
-    return `${cleanUrl}${hasQuery ? '&' : '?'}page=${pageNumber}`;
-};
-function PaginationItem({ activePage, pageNumber }) {
-    if (pageNumber === '-') {
-        return (React.createElement("span", { className: "/*styles.gap*/", "data-testid": "pagination-item-gap" }, "\u2022\u2022\u2022"));
-    }
-    return (React.createElement(Link, { className: "/*clsx(styles.link, activePage === pageNumber && styles.linkIsActive)*/", "data-testid": "pagination-item-link", to: getLinkUrl(pageNumber) }, pageNumber));
-}
-PaginationItem.propTypes = {};
-export default PaginationItem;
+import React from 'react';
+import Link from '../../components/Link';
+import { ifWindow } from '@sqrzro/utility';
+const getLinkUrl = (pageNumber) => {
+    const windowLocation = ifWindow((win) => `${win.location.pathname}${win.location.search}`, '');
+    const cleanUrl = windowLocation.replace(/(?:\?|&)page=[0-9]+/u, '');
+    const hasQuery = Boolean(/\?/u.exec(windowLocation) && !/\?page/u.exec(windowLocation));
+    return `${cleanUrl}${hasQuery ? '&' : '?'}page=${pageNumber}`;
+};
+function PaginationItem({ activePage, pageNumber }) {
+    if (pageNumber === '-') {
+        return (React.createElement("span", { className: "/*styles.gap*/", "data-testid": "pagination-item-gap" }, "\u2022\u2022\u2022"));
+    }
+    return (React.createElement(Link, { className: "/*clsx(styles.link, activePage === pageNumber && styles.linkIsActive)*/", "data-testid": "pagination-item-link", to: getLinkUrl(pageNumber) }, pageNumber));
+}
+PaginationItem.propTypes = {};
+export default PaginationItem;

package/dist/core/Panel/index.d.ts

@@ -1,17 +1,17 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-interface PanelProps {
-    children: React.ReactNode;
-    isPadded?: boolean;
-    isSpaced?: boolean;
-    title?: string;
-}
-declare function Panel({ children, isPadded, isSpaced, title }: PanelProps): React.ReactElement;
-declare namespace Panel {
-    var propTypes: {
-        children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
-        isPadded: PropTypes.Requireable<boolean>;
-        isSpaced: PropTypes.Requireable<boolean>;
-    };
-}
-export default Panel;
+import React from 'react';
+import PropTypes from 'prop-types';
+interface PanelProps {
+    children: React.ReactNode;
+    isPadded?: boolean;
+    isSpaced?: boolean;
+    title?: string;
+}
+declare function Panel({ children, isPadded, isSpaced, title }: PanelProps): React.ReactElement;
+declare namespace Panel {
+    var propTypes: {
+        children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
+        isPadded: PropTypes.Requireable<boolean>;
+        isSpaced: PropTypes.Requireable<boolean>;
+    };
+}
+export default Panel;

package/dist/core/Panel/index.js

@@ -1,16 +1,13 @@
-import React from 'react';
-import clsx from 'clsx';
-import PropTypes from 'prop-types';
-function Panel({ children, isPadded, isSpaced, title }) {
-    return (React.createElement("div", { className: clsx('bg-white rounded-md mb-2 w-full p-8', {
-            'mb-4': isSpaced,
-        }) },
-        title ? (React.createElement("h2", { className: "border-b border-b-slate-400 text-lg font-semibold" }, title)) : null,
-        children));
-}
-Panel.propTypes = {
-    children: PropTypes.node.isRequired,
-    isPadded: PropTypes.bool,
-    isSpaced: PropTypes.bool,
-};
-export default Panel;
+import React from 'react';
+import PropTypes from 'prop-types';
+function Panel({ children, isPadded, isSpaced, title }) {
+    return (React.createElement("div", { className: "clsx(styles.root, isPadded && styles.rootIsPadded, isSpaced && styles.rootIsSpaced)" },
+        title ? React.createElement("h2", { className: "/*styles.title*/" }, title) : null,
+        children));
+}
+Panel.propTypes = {
+    children: PropTypes.node.isRequired,
+    isPadded: PropTypes.bool,
+    isSpaced: PropTypes.bool,
+};
+export default Panel;

package/dist/core/PasswordForgotForm/index.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
-import type { NextRouter } from 'next/router';
-interface PasswordForgotFormProps {
-    router: Omit<NextRouter, 'events'>;
-}
-declare function PasswordForgotForm({ router }: PasswordForgotFormProps): React.ReactElement;
-export default PasswordForgotForm;
+import React from 'react';
+import type { NextRouter } from 'next/router';
+interface PasswordForgotFormProps {
+    router: Omit<NextRouter, 'events'>;
+}
+declare function PasswordForgotForm({ router }: PasswordForgotFormProps): React.ReactElement;
+export default PasswordForgotForm;

package/dist/core/PasswordForgotForm/index.js

@@ -1,40 +1,40 @@
-'use client';
-import React from 'react';
-import { AuthIdentifier, useForm } from '@sqrzro/hooks';
-import Button from '../../components/Button';
-import ContentBlock from '../../components/ContentBlock';
-import FormField from '../../components/FormField';
-import TextInput from '../../components/TextInput';
-import AuthForm from '../AuthForm';
-import useConfig from '../../hooks/useConfig';
-function PasswordForgotForm({ router }) {
-    const { auth } = useConfig();
-    const { fieldProps, formProps, isLoading, handleSubmit } = useForm({
-        defaults: {
-            identifier: router.query[auth.identifier]?.toString() || '',
-        },
-        errorMessage: false,
-        method: 'post',
-        successMessage: 'password ',
-        transformRequest: (data) => ({
-            [auth.identifier]: data.identifier,
-        }),
-        url: auth.passwordUrl,
-    });
-    const handleKeyDown = (event) => {
-        if (event.key === 'Enter') {
-            handleSubmit();
-        }
-    };
-    return (React.createElement(AuthForm, { ...formProps },
-        React.createElement(ContentBlock, { title: "Forgotten you password?", isCentered: true },
-            "Enter your ",
-            auth.identifier,
-            ' ',
-            auth.identifier === AuthIdentifier.email ? 'address' : '',
-            " and we will send you an email with a link to reset your password:"),
-        React.createElement(FormField, { ...fieldProps('identifier'), onKeyDown: handleKeyDown, render: TextInput }),
-        React.createElement("hr", null),
-        React.createElement(Button, { isDisabled: isLoading, type: "submit", isFullWidth: true }, isLoading ? 'Loading...' : 'Send Reset Email')));
-}
-export default PasswordForgotForm;
+'use client';
+import React from 'react';
+import { AuthIdentifier, useForm } from '@sqrzro/hooks';
+import Button from '../../components/Button';
+import ContentBlock from '../../components/ContentBlock';
+import FormField from '../../components/FormField';
+import TextInput from '../../components/TextInput';
+import AuthForm from '../../core/AuthForm';
+import useAppConfig from '../../hooks/useAppConfig';
+function PasswordForgotForm({ router }) {
+    const { auth } = useAppConfig();
+    const { fieldProps, formProps, isLoading, handleSubmit } = useForm({
+        defaults: {
+            identifier: router.query[auth.identifier]?.toString() || '',
+        },
+        errorMessage: false,
+        method: 'post',
+        successMessage: 'password ',
+        transformRequest: (data) => ({
+            [auth.identifier]: data.identifier,
+        }),
+        url: auth.passwordUrl,
+    });
+    const handleKeyDown = (event) => {
+        if (event.key === 'Enter') {
+            handleSubmit();
+        }
+    };
+    return (React.createElement(AuthForm, { ...formProps },
+        React.createElement(ContentBlock, { title: "Forgotten you password?", isCentered: true },
+            "Enter your ",
+            auth.identifier,
+            ' ',
+            auth.identifier === AuthIdentifier.email ? 'address' : '',
+            " and we will send you an email with a link to reset your password:"),
+        React.createElement(FormField, { ...fieldProps('identifier'), onKeyDown: handleKeyDown, render: TextInput }),
+        React.createElement("hr", null),
+        React.createElement(Button, { isDisabled: isLoading, type: "submit", isFullWidth: true }, isLoading ? 'Loading...' : 'Send Reset Email')));
+}
+export default PasswordForgotForm;

package/dist/core/PasswordResetForm/index.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
-import type { NextRouter } from 'next/router';
-interface PasswordResetFormProps {
-    router: Omit<NextRouter, 'events'>;
-}
-declare function PasswordResetForm({ router }: PasswordResetFormProps): React.ReactElement;
-export default PasswordResetForm;
+import React from 'react';
+import type { NextRouter } from 'next/router';
+interface PasswordResetFormProps {
+    router: Omit<NextRouter, 'events'>;
+}
+declare function PasswordResetForm({ router }: PasswordResetFormProps): React.ReactElement;
+export default PasswordResetForm;

package/dist/core/PasswordResetForm/index.js

@@ -1,34 +1,34 @@
-'use client';
-import React from 'react';
-import { useForm } from '@sqrzro/hooks';
-import Button from '../../components/Button';
-import FormField from '../../components/FormField';
-import PasswordInput from '../../components/PasswordInput';
-import AuthForm from '../AuthForm';
-import useConfig from '../../hooks/useConfig';
-const AUTH_ROUTE = '/auth/login';
-function PasswordResetForm({ router }) {
-    const { auth } = useConfig();
-    const handleSubmitSuccess = () => {
-        void router.push(`${AUTH_ROUTE}?email=${router.query.email?.toString() || ''}`);
-    };
-    const { fieldProps, formProps, isLoading, handleSubmit } = useForm({
-        errorMessage: false,
-        method: 'post',
-        successMessage: 'Password reset successfully. You can now log in.',
-        url: auth.passwordUrl,
-        onSubmitSuccess: handleSubmitSuccess,
-        transformRequest: (data) => ({ token: router.query.token || '', ...data }),
-    });
-    const handleKeyDown = (event) => {
-        if (event.key === 'Enter') {
-            handleSubmit();
-        }
-    };
-    return (React.createElement(AuthForm, { ...formProps },
-        React.createElement(FormField, { ...fieldProps('password'), label: "New Password", render: PasswordInput }),
-        React.createElement(FormField, { ...fieldProps('password_confirmation'), label: "Confirm New Password", onKeyDown: handleKeyDown, render: PasswordInput }),
-        React.createElement("hr", null),
-        React.createElement(Button, { isDisabled: isLoading, type: "submit", isFullWidth: true }, isLoading ? 'Loading...' : 'Reset Password')));
-}
-export default PasswordResetForm;
+'use client';
+import React from 'react';
+import { useForm } from '@sqrzro/hooks';
+import Button from '../../components/Button';
+import FormField from '../../components/FormField';
+import PasswordInput from '../../components/PasswordInput';
+import AuthForm from '../../core/AuthForm';
+import useAppConfig from '../../hooks/useAppConfig';
+const AUTH_ROUTE = '/auth/login';
+function PasswordResetForm({ router }) {
+    const { auth } = useAppConfig();
+    const handleSubmitSuccess = () => {
+        void router.push(`${AUTH_ROUTE}?email=${router.query.email?.toString() || ''}`);
+    };
+    const { fieldProps, formProps, isLoading, handleSubmit } = useForm({
+        errorMessage: false,
+        method: 'post',
+        successMessage: 'Password reset successfully. You can now log in.',
+        url: auth.passwordUrl,
+        onSubmitSuccess: handleSubmitSuccess,
+        transformRequest: (data) => ({ token: router.query.token || '', ...data }),
+    });
+    const handleKeyDown = (event) => {
+        if (event.key === 'Enter') {
+            handleSubmit();
+        }
+    };
+    return (React.createElement(AuthForm, { ...formProps },
+        React.createElement(FormField, { ...fieldProps('password'), label: "New Password", render: PasswordInput }),
+        React.createElement(FormField, { ...fieldProps('password_confirmation'), label: "Confirm New Password", onKeyDown: handleKeyDown, render: PasswordInput }),
+        React.createElement("hr", null),
+        React.createElement(Button, { isDisabled: isLoading, type: "submit", isFullWidth: true }, isLoading ? 'Loading...' : 'Reset Password')));
+}
+export default PasswordResetForm;

package/dist/core/RadialProgress/index.d.ts

@@ -1,16 +1,16 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-interface RadialProgressProps {
-    duration: number;
-    icon: string;
-    variant?: string;
-}
-declare function RadialProgress({ duration, icon, variant }: RadialProgressProps): React.ReactElement;
-declare namespace RadialProgress {
-    var propTypes: {
-        duration: PropTypes.Validator<number>;
-        icon: PropTypes.Validator<string>;
-        variant: PropTypes.Requireable<string>;
-    };
-}
-export default RadialProgress;
+import React from 'react';
+import PropTypes from 'prop-types';
+interface RadialProgressProps {
+    duration: number;
+    icon: string;
+    variant?: string;
+}
+declare function RadialProgress({ duration, icon, variant }: RadialProgressProps): React.ReactElement;
+declare namespace RadialProgress {
+    var propTypes: {
+        duration: PropTypes.Validator<number>;
+        icon: PropTypes.Validator<string>;
+        variant: PropTypes.Requireable<string>;
+    };
+}
+export default RadialProgress;

package/dist/core/RadialProgress/index.js

@@ -1,23 +1,23 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Icon from '../Icon';
-// Import styles from './RadialProgress.module.css';
-const DURATION_FACTOR = 2000;
-function RadialProgress({ duration, icon, variant }) {
-    const adjustedDuration = duration / DURATION_FACTOR;
-    return (React.createElement("div", { className: "/*styles.root*/" },
-        React.createElement("div", { className: "/*styles.semi1*/", style: { animationDuration: `${adjustedDuration}s` } }),
-        React.createElement("div", { className: "/*clsx(styles.mask, variant && styles[`mask${ucwords(variant)`])*/" }),
-        React.createElement("div", { className: "/*styles.semi2*/", style: {
-                animationDuration: `${adjustedDuration}s`,
-                animationDelay: `${adjustedDuration}s`,
-            } }),
-        React.createElement("div", { className: "/*clsx(styles.icon, variant && styles[`icon${ucwords(variant)`])*/" },
-            React.createElement(Icon, { icon: icon, size: 30 }))));
-}
-RadialProgress.propTypes = {
-    duration: PropTypes.number.isRequired,
-    icon: PropTypes.string.isRequired,
-    variant: PropTypes.string,
-};
-export default RadialProgress;
+import React from 'react';
+import PropTypes from 'prop-types';
+import Icon from '../../core/Icon';
+// Import styles from './RadialProgress.module.css';
+const DURATION_FACTOR = 2000;
+function RadialProgress({ duration, icon, variant }) {
+    const adjustedDuration = duration / DURATION_FACTOR;
+    return (React.createElement("div", { className: "/*styles.root*/" },
+        React.createElement("div", { className: "/*styles.semi1*/", style: { animationDuration: `${adjustedDuration}s` } }),
+        React.createElement("div", { className: "/*clsx(styles.mask, variant && styles[`mask${ucwords(variant)`])*/" }),
+        React.createElement("div", { className: "/*styles.semi2*/", style: {
+                animationDuration: `${adjustedDuration}s`,
+                animationDelay: `${adjustedDuration}s`,
+            } }),
+        React.createElement("div", { className: "/*clsx(styles.icon, variant && styles[`icon${ucwords(variant)`])*/" },
+            React.createElement(Icon, { icon: icon, size: 30 }))));
+}
+RadialProgress.propTypes = {
+    duration: PropTypes.number.isRequired,
+    icon: PropTypes.string.isRequired,
+    variant: PropTypes.string,
+};
+export default RadialProgress;

package/dist/core/SettingsForm/index.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-declare function SettingsForm(): React.ReactElement;
-export default SettingsForm;
+import React from 'react';
+declare function SettingsForm(): React.ReactElement;
+export default SettingsForm;

package/dist/core/SettingsForm/index.js

@@ -1,14 +1,14 @@
-'use client';
-import React from 'react';
-import { useForm } from '@sqrzro/hooks';
-import Form from '../../components/Form';
-import FormField from '../../components/FormField';
-import ModalActions from '../../components/ModalActions';
-import TextInput from '../../components/TextInput';
-function SettingsForm() {
-    const { fieldProps, formProps } = useForm({});
-    return (React.createElement(Form, { ...formProps },
-        React.createElement(FormField, { ...fieldProps('name'), label: "Name", render: TextInput }),
-        React.createElement(ModalActions, { label: "Save Settings" })));
-}
-export default SettingsForm;
+'use client';
+import React from 'react';
+import { useForm } from '@sqrzro/hooks';
+import Form from '../../components/Form';
+import FormField from '../../components/FormField';
+import ModalActions from '../../components/ModalActions';
+import TextInput from '../../components/TextInput';
+function SettingsForm() {
+    const { fieldProps, formProps } = useForm({});
+    return (React.createElement(Form, { ...formProps },
+        React.createElement(FormField, { ...fieldProps('name'), label: "Name", render: TextInput }),
+        React.createElement(ModalActions, { label: "Save Settings" })));
+}
+export default SettingsForm;