@sqrzro/admin 2.1.0-bz.0 → 2.1.0-bz.11

package/dist/components/TableClientComponent/index.js

@@ -1,8 +1,7 @@
 'use client';
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { useState } from 'react';
-import clsx from 'clsx';
-import { Link } from '@sqrzro/components';
+import { Link, tw } from '@sqrzro/components';
 import { usePathname, useSearchParams } from 'next/navigation';
 function toggleArrayItem(array, item) {
     if (array.includes(item)) {
@@ -33,12 +32,26 @@ function getSortIconProps(searchParams, sort) {
     }
     return { dir: null };
 }
+function isStringArray(array) {
+    return array.every((item) => typeof item === 'string');
+}
+function parseColumns(columns) {
+    if (columns.length === 0) {
+        return [];
+    }
+    if (isStringArray(columns)) {
+        return columns.map((key) => ({ key }));
+    }
+    return columns;
+}
 function TableClientComponent({ columns, data, }) {
     const pathname = usePathname();
     const searchParams = useSearchParams();
     const [selected, setSelected] = useState([]);
-    return (_jsx("div", { className: "bg-white shadow-sm", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { children: columns.map((column) => (_jsx("th", { className: "p-4 text-left", children: _jsxs(Link, { href: createSortLink(pathname, searchParams, column.key), children: [column.title, ' '] }) }, column.key))) }) }), _jsx("tbody", { children: data.map((item) => (_jsx("tr", { className: "odd:bg-slate-100", children: columns.map((column) => (_jsx("td", { className: clsx('border-x border-transparent p-4', getSortIconProps(searchParams, column.key).dir
+    const parsedColumns = parseColumns(columns);
+    const hasTitles = parsedColumns.some((column) => column.title);
+    return (_jsx("div", { className: "bg-white shadow-sm", children: _jsxs("table", { className: "w-full", children: [hasTitles ? (_jsx("thead", { children: _jsx("tr", { children: parsedColumns.map((column) => (_jsx("th", { className: tw('p-4', column.type === 'number' ? 'text-right' : 'text-left'), children: column.title ? (_jsxs(Link, { href: createSortLink(pathname, searchParams, column.key), children: [column.title, ' '] })) : null }, column.key))) }) })) : null, _jsx("tbody", { children: data.map((item) => (_jsx("tr", { className: "odd:bg-slate-100", children: parsedColumns.map((column) => (_jsx("td", { className: tw('border-x border-transparent p-4', getSortIconProps(searchParams, column.key).dir
                                 ? 'border-sky-300 bg-sky-300/10'
-                                : ''), children: item[column.key] }, column.key))) }, item.id))) })] }) }));
+                                : '', column.type === 'number' ? 'text-right' : 'text-left'), children: item[column.key] }, column.key))) }, item.id))) })] }) }));
 }
 export default TableClientComponent;

package/dist/components/Tabs/index.js

@@ -1,6 +1,24 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Link } from '@sqrzro/components';
+import { Link, tw } from '@sqrzro/components';
+import { useNavigation } from '@sqrzro/hooks';
 function Tabs({ basePath = '', data }) {
-    return (_jsx("nav", { className: "border-y border-gray-700", children: _jsx("ul", { className: "flex gap-4 font-semibold", children: data.map(({ href, label }) => (_jsx("li", { children: _jsx(Link, { className: "block py-2 text-white", href: `${basePath}${href || ''}`, children: label }) }, href))) }) }));
+    const navigation = useNavigation([basePath, data]);
+    return (_jsx("nav", { className: "border-b border-slate-700", children: _jsx("ul", { className: "flex gap-4", children: navigation.map(({ href, isActive, label }) => (_jsx("li", { children: _jsx(Link, { className: tw('block px-1 pb-2 font-semibold', isActive
+                        ? 'border-primary border-b-4 text-white'
+                        : 'text-white/80 hover:text-white'), href: href, children: label }) }, href))) }) }));
+    // return (
+    //     <nav className="border-y border-slate-700">
+    //         <ul className="flex gap-4 font-semibold">
+    //             {data.map(({ href, label }) => (
+    //                 <li key={href}>
+    //                     <Link className="block py-2 text-white" href={`${basePath}${href || ''}`}>
+    //                         {label}
+    //                     </Link>
+    //                 </li>
+    //             ))}
+    //         </ul>
+    //     </nav>
+    // );
 }
 export default Tabs;

package/dist/components/index.d.ts

@@ -1,24 +1,32 @@
-export { Button, CalendarInput, ConnectedDropdown, DateFormField, DateInput, Dropdown, EditableDateFormField, EditableDropdownFormField, EditableForm, EditableFormField, EditableMultiFormField, EditableNumberFormField, EditableSwitchFormField, EditableTextFormField, Fieldset, Form, FormField, FormSubmit, ImageInput, ImageFormField, Link, ModalForm, NumberInput, Switch, TextFormField, TextInput, Toaster, } from '@sqrzro/components';
+export { Button, CalendarInput, ConnectedDropdown, DateFormField, DateInput, Dropdown, DropdownFormField, EditableDateFormField, EditableDropdownFormField, EditableForm, EditableFormField, EditableMultiFormField, EditableNumberFormField, EditableSwitchFormField, EditableTextFormField, Fieldset, Form, FormField, FormSubmit, ImageInput, ImageFormField, Link, ModalForm, MultiFormField, NumberFormField, NumberInput, Switch, SwitchFormField, TextFormField, TextInput, Toaster, } from '@sqrzro/components';
 export type { AppLayoutProps } from './AppLayout';
 export { default as AppLayout } from './AppLayout';
+export type { AuthProps } from './Auth';
+export { default as Auth } from './Auth';
+export type { BadgeProps } from './Badge';
+export { default as Badge } from './Badge';
 export type { DashboardProps } from './Dashboard';
 export { default as Dashboard } from './Dashboard';
-export type { FilterBarProps } from './FilterBar';
+export type { FilterBarProps, FilterObject } from './FilterBar';
 export { default as FilterBar } from './FilterBar';
 export type { GridListProps } from './GridList';
 export { default as GridList } from './GridList';
+export type { InfoPanelProps } from './InfoPanel';
+export { default as InfoPanel } from './InfoPanel';
 export type { ListComponentProps, ListProps } from './List';
 export { default as List } from './List';
 export type { ListObject } from './ListItem';
 export type { ListActionsProps } from './ListActions';
 export { default as ListActions } from './ListActions';
-export type { LoginFormProps } from './LoginForm';
-export { default as LoginForm } from './LoginForm';
 export type { PageProps } from './Page';
 export { default as Page } from './Page';
+export type { PanelProps } from './Panel';
+export { default as Panel } from './Panel';
 export type { PageActionsProps } from './PageActions';
 export { default as PageActions } from './PageActions';
 export type { RootLayoutProps } from './RootLayout';
 export { default as RootLayout } from './RootLayout';
+export { default as SettingsPage } from './SettingsPage';
+export type { TableColumnObject } from './TableClientComponent';
 export type { TableProps } from './Table';
 export { default as Table } from './Table';

package/dist/components/index.js

@@ -1,13 +1,17 @@
 // Exported from @sqrzro/components
-export { Button, CalendarInput, ConnectedDropdown, DateFormField, DateInput, Dropdown, EditableDateFormField, EditableDropdownFormField, EditableForm, EditableFormField, EditableMultiFormField, EditableNumberFormField, EditableSwitchFormField, EditableTextFormField, Fieldset, Form, FormField, FormSubmit, ImageInput, ImageFormField, Link, ModalForm, NumberInput, Switch, TextFormField, TextInput, Toaster, } from '@sqrzro/components';
+export { Button, CalendarInput, ConnectedDropdown, DateFormField, DateInput, Dropdown, DropdownFormField, EditableDateFormField, EditableDropdownFormField, EditableForm, EditableFormField, EditableMultiFormField, EditableNumberFormField, EditableSwitchFormField, EditableTextFormField, Fieldset, Form, FormField, FormSubmit, ImageInput, ImageFormField, Link, ModalForm, MultiFormField, NumberFormField, NumberInput, Switch, SwitchFormField, TextFormField, TextInput, Toaster, } from '@sqrzro/components';
 export { default as AppLayout } from './AppLayout';
+export { default as Auth } from './Auth';
+export { default as Badge } from './Badge';
 export { default as Dashboard } from './Dashboard';
 export { default as FilterBar } from './FilterBar';
 export { default as GridList } from './GridList';
+export { default as InfoPanel } from './InfoPanel';
 export { default as List } from './List';
 export { default as ListActions } from './ListActions';
-export { default as LoginForm } from './LoginForm';
 export { default as Page } from './Page';
+export { default as Panel } from './Panel';
 export { default as PageActions } from './PageActions';
 export { default as RootLayout } from './RootLayout';
+export { default as SettingsPage } from './SettingsPage';
 export { default as Table } from './Table';

package/dist/services/ConfigService.d.ts

@@ -1,9 +1,11 @@
+/// <reference types="react" />
 export interface Config {
     app: {
         name: string;
         url: string;
     };
+    logo?: () => React.ReactElement;
     navigation: Record<string, string>;
 }
-export declare function setConfig(config: Config): Config;
+export declare function setConfig(cfg: Config, logo?: () => React.ReactElement): Config;
 export declare function getConfig(): Config;

package/dist/services/ConfigService.js

@@ -1,14 +1,14 @@
-let cachedConfig = {
+let config = {
     app: {
         name: 'Square Zero',
         url: 'http://localhost:8080',
     },
     navigation: {},
 };
-export function setConfig(config) {
-    cachedConfig = config;
-    return cachedConfig;
+export function setConfig(cfg, logo) {
+    config = { ...cfg, logo };
+    return config;
 }
 export function getConfig() {
-    return cachedConfig;
+    return config;
 }

package/dist/styles/config.js

@@ -1,82 +1,141 @@
 'use client';
-import clsx from 'clsx';
-const classNames = {
+import { tw, twx } from '@sqrzro/components';
+const classNames = twx({
+    actionList: () => ({
+        root: 'flex gap-2',
+    }),
     button: (props) => ({
         root: {
-            danger: 'bg-red-500 border-red-500 text-white',
-            default: clsx('bg-white h-10 px-5 rounded-md text-md text-slate-600 border border-slate-300', props?.isFullWidth ? 'w-full' : null),
-            primary: 'bg-primary font-semibold text-white border-none shadow-[inset_rgba(255,255,255,0.1)_0_20px]',
+            danger: 'border-red-500 bg-red-500 text-white',
+            default: tw('text-md h-10 rounded border border-slate-300 bg-white px-5 text-slate-600', props?.isFullWidth ? 'w-full' : null),
+            primary: 'bg-button-bg text-button-text border-none font-semibold', // shadow-[inset_rgba(255,255,255,0.2)_0_20px]
         },
     }),
     calendar: () => ({
-        root: 'text-sm text-slate-600 p-4 pb-3',
-        head: 'text-xs text-center pb-2 text-slate-400',
+        root: 'p-4 pb-3 text-sm text-slate-600',
+        head: 'pb-2 text-center text-xs text-slate-400',
         month: 'w-full table-fixed',
         day: {
-            default: 'h-10 border border-gray-200',
-            highlighted: 'bg-red-300',
-            selected: 'bg-blue-400',
+            default: 'h-10 border border-slate-200',
+            highlighted: 'bg-slate-100',
+            selected: 'bg-slate-200',
         },
     }),
     calendarNavigation: () => ({
-        root: 'flex justify-between items-center mb-6',
-        title: 'font-semibold text-base',
-        control: 'h-6 w-6 bg-red-300',
+        root: 'mb-6 flex items-center justify-between',
+        title: 'text-base font-semibold',
+        control: 'h-6 w-6 rounded-full border border-slate-300',
         previous: '-order-1',
     }),
+    codeInput: () => ({
+        input: {
+            default: 'focus:border-primary h-10 rounded border border-slate-300 text-center',
+            error: 'border-red-700',
+        },
+    }),
+    editableFieldset: () => ({
+        root: 'bg-panel grid grid-cols-[30%_1fr] rounded p-8 shadow',
+        title: 'mb-8 text-lg font-semibold leading-none text-slate-700',
+        actions: 'flex justify-end gap-2 border-t border-slate-200 pt-4',
+    }),
+    editableFormField: () => ({
+        root: 'grid grid-cols-[25%_1fr] border-t border-slate-200 py-4',
+        label: 'flex items-center font-semibold leading-none',
+        field: 'flex min-h-10 items-center',
+    }),
     emptyMessage: () => ({
-        root: 'text-center text-slate-500 my-24',
-        title: 'text-2xl font-semibold mb-2',
+        root: 'relative mx-auto mt-4 w-full max-w-xl rounded bg-white py-16 text-center text-slate-500 shadow before:pointer-events-none before:absolute before:inset-2 before:border-2 before:border-dashed',
+        title: 'mb-2 text-xl font-semibold leading-none',
+        action: 'mt-6 flex justify-center',
     }),
     dropdown: () => ({
-        item: { default: 'text-gray-700 block px-3 py-2 text-sm', selected: 'bg-red-400' },
+        item: { default: 'block p-3 text-sm text-slate-700', selected: 'bg-slate-100' },
+        title: 'block leading-none',
+        meta: 'mt-0.5 block text-xs leading-none text-slate-500',
     }),
-    fieldset: (props) => ({
-        root: clsx('bg-white p-8 shadow rounded-md', props?.isEditable ? 'grid grid-cols-[30%_1fr]' : ''),
-        title: 'mb-8 text-xl font-semibold leading-none text-gray-700',
+    fieldset: () => ({
+        root: 'rounded bg-white p-8 shadow',
+        title: 'mb-8 text-lg font-semibold leading-none text-slate-700',
+    }),
+    form: () => ({
+        root: 'flex flex-col gap-6',
     }),
     formField: (props) => ({
         root: {
             default: props?.isEditable
                 ? 'grid grid-cols-[25%_1fr] border-t border-slate-200 py-4'
-                : 'mb-6',
+                : '',
         },
-        label: clsx('font-semibold', props?.isEditable ? 'flex items-center' : 'block mb-2'),
-        optional: 'pl-2 text-base text-grey-dark font-normal',
-        error: 'flex gap-2 items-center mt-2 text-red-700 before:h-4 before:w-4 before:bg-[url(/images/icons/error.svg)] before:rounded-full',
+        label: tw('flex font-semibold leading-none', props?.isEditable ? 'items-center' : 'mb-2 justify-between'),
+        details: 'mb-2 text-xs font-normal leading-none text-slate-500',
+        optional: 'pl-2 text-xs font-normal leading-none text-slate-500',
+        error: 'mt-2 flex items-center gap-2 text-red-700 before:h-4 before:w-4 before:rounded-full before:bg-[url(/images/icons/error.svg)]',
+    }),
+    imageInput: () => ({
+        root: 'h-64 rounded border border-slate-300 bg-slate-50 p-8',
+        icon: 'mx-auto mb-2 block h-12 w-12 rounded-full border-2 border-slate-300',
+        title: 'mb-1 font-semibold',
+        description: 'text-xs italic text-slate-700',
     }),
     inputPanel: () => ({
-        root: 'bg-white border border-slate-300 shadow-md',
+        root: 'show mt-1 origin-top rounded border border-slate-300 bg-white shadow-md',
     }),
     modal: () => ({
-        root: {
-            default: 'bg-white rounded-lg w-full max-w-2xl backdrop:bg-slate-800/60 backdrop:backdrop-blur-sm transition-opacity opacity-0 open:opacity-100 duration-200',
+        root: 'open:backdrop:fade py-16 backdrop:bg-slate-700/50 backdrop:backdrop-blur-sm',
+        panel: 'show bg-panel row-start-2 mx-auto w-full max-w-lg rounded p-6 text-left shadow-xl',
+        title: 'mb-6 text-lg font-semibold',
+        actions: 'flex justify-end',
+    }),
+    multiInput: () => ({
+        root: 'flex flex-col gap-2',
+        row: 'grid grid-cols-[1fr_auto] has-[>_button]:gap-2',
+    }),
+    passwordInput: () => ({
+        action: {
+            default: 'mr-2 h-6 w-6 overflow-hidden bg-[url(/admin/images/eye.svg)] bg-no-repeat indent-12',
+            selected: 'bg-bottom',
         },
-        title: 'text-2xl font-semibold text-center p-4 border-b border-slate-200 text-slate-700',
-        content: 'p-4',
-        actions: 'flex justify-end p-4 border-t border-slate-200',
     }),
     staticTextInput: () => ({
-        root: { default: 'bg-white border border-gray-300 h-10 px-3 rounded-sm text-md' },
+        root: {
+            default: 'text-md h-10 rounded border border-slate-300 bg-white px-3',
+            error: 'border-red-700',
+        },
     }),
     switch: () => ({
-        root: {
-            default: 'cursor-pointer w-10 h-6 bg-slate-300 rounded-full p-1 transition-colors my-2',
+        root: 'flex gap-4',
+        input: {
+            default: 'h-6 w-10 flex-none cursor-pointer rounded-full bg-slate-300 p-1 transition-colors',
             checked: 'bg-green-500',
         },
         control: {
-            default: 'w-4 h-4 bg-white rounded-full shadow-md transform translate-x-0 transition-transform',
+            default: 'h-4 w-4 translate-x-0 transform rounded-full bg-white shadow-md transition-transform',
             checked: 'translate-x-full',
         },
+        label: 'font-semibold',
+        details: 'block text-xs text-slate-500',
+    }),
+    textArea: () => ({
+        root: {
+            default: 'text-md focus:border-primary rounded border border-slate-300 px-3 py-2',
+            error: 'border-red-700',
+        },
     }),
     textButton: () => ({
         root: { danger: 'text-red-600' },
     }),
     textInput: () => ({
         root: {
-            default: 'border border-gray-300 h-10 px-3 rounded-sm text-md focus:border-primary',
+            default: 'text-md focus:border-primary h-10 rounded border border-slate-300 px-3',
             error: 'border-red-700',
         },
     }),
-};
+    toast: () => ({
+        root: {
+            default: 'rounded border px-4 py-2',
+            success: 'border-green-300 bg-green-100 text-green-700',
+            error: 'border-red-300 bg-red-100 text-red-700',
+        },
+    }),
+});
 export default classNames;

package/dist/styles/postcss.d.ts

@@ -0,0 +1,6 @@
+declare const config: {
+    plugins: {
+        tailwindcss: {};
+    };
+};
+export default config;

package/dist/styles/postcss.js

@@ -0,0 +1,4 @@
+const config = {
+    plugins: { tailwindcss: {} },
+};
+export default config;

package/dist/styles/tailwind.d.ts

@@ -0,0 +1,10 @@
+interface Theme {
+    colors?: Partial<{
+        'button-bg': string;
+        'button-text': string;
+        link: string;
+        primary: string;
+    }>;
+}
+declare function config(resolves: string[], customization?: Theme): Record<string, unknown>;
+export default config;

package/dist/styles/tailwind.js

@@ -0,0 +1,72 @@
+import path from 'path';
+import plugin from 'tailwindcss/plugin';
+function config(resolves, customization) {
+    return {
+        content: [
+            './app/**/*.tsx',
+            './src/**/*.tsx',
+            ...resolves.map((item) => path.join(item, '**/*.js')),
+        ],
+        darkMode: 'class',
+        mode: 'jit',
+        theme: {
+            extend: {
+                colors: {
+                    'button-bg': 'var(--color-button-bg)',
+                    'button-text': 'var(--color-button-text)',
+                    link: 'var(--color-link)',
+                    panel: 'var(--color-panel)',
+                    primary: 'var(--color-primary)',
+                },
+                fontFamily: {
+                    sans: ['var(--font-inter)'],
+                },
+            },
+        },
+        plugins: [
+            plugin(({ addBase, addUtilities, theme }) => {
+                addBase({
+                    body: {
+                        '--color-button-bg': customization?.colors?.['button-bg'] ||
+                            customization?.colors?.primary ||
+                            theme('colors.indigo.800'),
+                        '--color-button-text': customization?.colors?.['button-text'] || theme('colors.white'),
+                        '--color-link': customization?.colors?.link || theme('colors.indigo.800'),
+                        '--color-panel': theme('colors.white'),
+                        '--color-primary': customization?.colors?.primary || theme('colors.indigo.800'),
+                    },
+                    'body.dark': {
+                        '--color-panel': theme('colors.gray.700'),
+                    },
+                });
+                addUtilities({
+                    '@keyframes show': {
+                        from: {
+                            opacity: '0',
+                            transform: 'scale3d(.9,.9,.9)',
+                        },
+                        to: {
+                            opacity: '1',
+                            transform: 'scale3d(1,1,1)',
+                        },
+                    },
+                    '.show': {
+                        animation: 'show 0.1s ease-in-out',
+                    },
+                    '@keyframes fade': {
+                        from: {
+                            opacity: '0',
+                        },
+                        to: {
+                            opacity: '1',
+                        },
+                    },
+                    '.fade': {
+                        animation: 'fade 0.2s ease-in-out',
+                    },
+                });
+            }),
+        ],
+    };
+}
+export default config;

package/package.json

@@ -1,77 +1,67 @@
 {
-    "name": "@sqrzro/admin",
-    "version": "2.1.0-bz.0",
-    "main": "dist/index.js",
-    "types": "dist/index.d.ts",
-    "exports": {
-        ".": "./dist/index.js",
-        "./styles.css": "./dist/styles.css"
-    },
-    "license": "ISC",
-    "dependencies": {
-        "@heroicons/react": "^2.0.15",
-        "@sqrzro/components": "workspace:bz",
-        "@sqrzro/hooks": "workspace:bz",
-        "@sqrzro/interfaces": "workspace:bz",
-        "@sqrzro/server": "workspace:bz",
-        "@sqrzro/utility": "workspace:bz",
-        "bcrypt": "^5.1.1",
-        "clsx": "^1.2.1",
-        "date-fns": "^2.29.3",
-        "joi": "^17.11.0",
-        "jose": "^4.15.4",
-        "next": "^14.0.0",
-        "react": "^18.2.0",
-        "react-dom": "^18.2.0",
-        "use-deep-compare-effect": "^1.8.1"
-    },
-    "devDependencies": {
-        "@babel/core": "^7.20.12",
-        "@babel/preset-env": "^7.21.4",
-        "@babel/preset-react": "^7.18.6",
-        "@babel/preset-typescript": "^7.21.4",
-        "@sqrzro/eslint-plugin": "workspace:bz",
-        "@sqrzro/prettier-config": "workspace:bz",
-        "@sqrzro/tailwind-plugin": "workspace:bz",
-        "@storybook/addon-actions": "^7.0.7",
-        "@storybook/addon-essentials": "^7.0.7",
-        "@storybook/addon-interactions": "^7.0.7",
-        "@storybook/addon-links": "^7.0.7",
-        "@storybook/addon-mdx-gfm": "7.0.7",
-        "@storybook/react": "^7.0.7",
-        "@storybook/react-webpack5": "7.0.7",
-        "@storybook/testing-library": "^0.1.0",
-        "@testing-library/dom": "^8.20.0",
-        "@testing-library/jest-dom": "^5.16.5",
-        "@testing-library/react": "^13.4.0",
-        "@testing-library/user-event": "^14.4.3",
-        "@types/bcrypt": "^5.0.1",
-        "@types/react": "^18.2.32",
-        "babel-loader": "^8.3.0",
-        "concurrently": "^7.6.0",
-        "eslint": "^8.55.0",
-        "jest": "^29.5.0",
-        "mockdate": "^3.0.5",
-        "prettier": "^2.8.4",
-        "rimraf": "^4.1.2",
-        "storybook": "^7.0.7",
-        "tailwindcss": "^3.2.6",
-        "typescript": "^5.2.2"
-    },
-    "scripts": {
-        "build:css": "tailwindcss -i \"./src/styles/tailwind.css\" -o \"./dist/styles.css\"",
-        "build:ts": "tsc -p tsconfig.build.json",
-        "build": "pnpm clean && pnpm build:css && pnpm build:ts",
-        "clean": "rimraf ./dist",
-        "dev:css": "tailwindcss -i \"./src/styles/tailwind.css\" -o \"./dist/styles.css\" --watch",
-        "dev:storybook": "storybook dev -p 6006",
-        "dev:ts": "tsc -p tsconfig.build.json -w",
-        "dev": "concurrently \"pnpm:dev:css\" \"pnpm:dev:ts\"",
-        "docs": "concurrently \"pnpm:dev:css\" \"pnpm:dev:storybook\"",
-        "lint": "tsc --noEmit && eslint \"./src/**/*.tsx\" \"./src/**/*.ts\"",
-        "prepublishOnly": "pnpm build",
-        "prettier": "prettier --write \"./src/**/*.tsx\" \"./src/**/*.ts\"",
-        "start": "pnpm dev",
-        "test": "jest"
-    }
-}
+  "name": "@sqrzro/admin",
+  "version": "2.1.0-bz.11",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "license": "ISC",
+  "files": [
+    "dist",
+    "postcss.js",
+    "tailwind.js",
+    "tailwind.d.ts"
+  ],
+  "dependencies": {
+    "@sqrzro/components": "bz",
+    "@sqrzro/hooks": "bz",
+    "@sqrzro/interfaces": "bz",
+    "next": "^14.1.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.23.9",
+    "@babel/preset-env": "^7.23.9",
+    "@babel/preset-react": "^7.23.3",
+    "@babel/preset-typescript": "^7.23.3",
+    "@sqrzro/eslint-plugin": "bz",
+    "@sqrzro/prettier-config": "bz",
+    "@sqrzro/tailwind-plugin": "bz",
+    "@storybook/addon-actions": "^7.6.17",
+    "@storybook/addon-essentials": "^7.6.17",
+    "@storybook/addon-interactions": "^7.6.17",
+    "@storybook/addon-links": "^7.6.17",
+    "@storybook/addon-mdx-gfm": "7.0.7",
+    "@storybook/react": "^7.6.17",
+    "@storybook/react-webpack5": "7.0.7",
+    "@storybook/testing-library": "^0.1.0",
+    "@testing-library/dom": "^8.20.1",
+    "@testing-library/jest-dom": "^5.17.0",
+    "@testing-library/react": "^13.4.0",
+    "@testing-library/user-event": "^14.5.2",
+    "@types/bcrypt": "^5.0.2",
+    "@types/jest": "^29.5.12",
+    "@types/node": "18.14.6",
+    "@types/react": "^18.2.57",
+    "babel-loader": "^8.3.0",
+    "concurrently": "^7.6.0",
+    "eslint": "^8.56.0",
+    "jest": "^29.7.0",
+    "mockdate": "^3.0.5",
+    "prettier": "^3.2.5",
+    "rimraf": "^4.4.1",
+    "storybook": "^7.6.17",
+    "tailwindcss": "^3.4.1",
+    "typescript": "^5.3.3"
+  },
+  "scripts": {
+    "build": "pnpm clean && tsc -p tsconfig.build.json",
+    "clean": "rimraf ./dist",
+    "dev": "tsc -p tsconfig.build.json -w",
+    "docs": "storybook dev -p 6006",
+    "lint": "tsc --noEmit && eslint \"./src/**/*.tsx\" \"./src/**/*.ts\"",
+    "prettier": "prettier --write \"./src/**/*.tsx\" \"./src/**/*.ts\"",
+    "start": "pnpm dev",
+    "test": "jest",
+    "test:coverage": "jest --coverage"
+  }
+}

package/postcss.js

@@ -0,0 +1,3 @@
+module.exports = {
+    plugins: { tailwindcss: {} },
+};

package/tailwind.d.ts

@@ -0,0 +1 @@
+export * from './dist/styles/tailwind';

package/tailwind.js

@@ -0,0 +1 @@
+module.exports = require('./dist/styles/tailwind');

package/.babelrc.json

@@ -1,16 +0,0 @@
-{
-    "sourceType": "unambiguous",
-    "presets": [
-        [
-            "@babel/preset-env",
-            {
-                "targets": {
-                    "chrome": 100
-                }
-            }
-        ],
-        "@babel/preset-typescript",
-        "@babel/preset-react"
-    ],
-    "plugins": []
-}

package/.eslintignore

@@ -1,6 +0,0 @@
-dist
-jest.config.js
-node_modules
-prettier.config.js
-scripts/*.js
-tailwind.config.js

package/.eslintrc

@@ -1,5 +0,0 @@
-{
-    "root": true,
-    "plugins": ["@sqrzro"],
-    "extends": ["plugin:@sqrzro/react"]
-}