@sqrzro/admin 2.1.0-bz.9 → 2.1.0-r19.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (126) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +8 -5
  3. package/assets/images/check-white.svg +3 -0
  4. package/assets/images/chevron.svg +3 -0
  5. package/assets/images/close.svg +3 -0
  6. package/assets/images/danger.svg +3 -0
  7. package/assets/images/eye.svg +12 -0
  8. package/assets/images/info.svg +3 -0
  9. package/assets/images/success.svg +3 -0
  10. package/assets/images/warning.svg +3 -0
  11. package/dist/components/AppLayout/index.d.ts +2 -2
  12. package/dist/components/AppLayout/index.js +7 -5
  13. package/dist/components/AppNavigation/index.d.ts +4 -2
  14. package/dist/components/AppNavigation/index.js +4 -13
  15. package/dist/components/AppNavigationComponent/index.d.ts +11 -0
  16. package/dist/components/AppNavigationComponent/index.js +19 -0
  17. package/dist/components/AppNavigationSub/index.d.ts +11 -0
  18. package/dist/components/AppNavigationSub/index.js +12 -0
  19. package/dist/components/Auth/index.d.ts +10 -0
  20. package/dist/components/Auth/index.js +10 -0
  21. package/dist/components/Badge/index.d.ts +1 -2
  22. package/dist/components/Badge/index.js +16 -7
  23. package/dist/components/BooleanFilter/index.d.ts +0 -1
  24. package/dist/components/Dashboard/index.d.ts +0 -1
  25. package/dist/components/Dashboard/index.js +1 -1
  26. package/dist/components/DataTable/index.d.ts +5 -0
  27. package/dist/components/DataTable/index.js +5 -0
  28. package/dist/components/DateFilter/index.d.ts +0 -1
  29. package/dist/components/DateFilter/index.js +24 -1
  30. package/dist/components/DropdownFilter/index.d.ts +0 -1
  31. package/dist/components/FilterBar/index.d.ts +4 -3
  32. package/dist/components/FilterBar/index.js +30 -3
  33. package/dist/components/FilterBarClearButton/index.d.ts +5 -0
  34. package/dist/components/FilterBarClearButton/index.js +5 -0
  35. package/dist/components/FilterBarItem/index.d.ts +4 -3
  36. package/dist/components/FilterBarItem/index.js +6 -5
  37. package/dist/components/GridList/index.d.ts +2 -3
  38. package/dist/components/GridListItem/index.d.ts +1 -2
  39. package/dist/components/GridListItem/index.js +3 -2
  40. package/dist/components/InfoPanel/index.d.ts +2 -2
  41. package/dist/components/InfoPanel/index.js +18 -6
  42. package/dist/components/List/index.d.ts +4 -20
  43. package/dist/components/List/index.js +13 -17
  44. package/dist/components/ListActions/index.d.ts +6 -4
  45. package/dist/components/ListActions/index.js +16 -3
  46. package/dist/components/ListClientComponent/index.d.ts +13 -0
  47. package/dist/components/ListClientComponent/index.js +14 -0
  48. package/dist/components/ListComponent/index.d.ts +13 -0
  49. package/dist/components/ListComponent/index.js +21 -0
  50. package/dist/components/ListItem/index.d.ts +19 -10
  51. package/dist/components/ListItem/index.js +18 -5
  52. package/dist/components/ListSkeleton/index.d.ts +4 -0
  53. package/dist/components/ListSkeleton/index.js +5 -0
  54. package/dist/components/MeActions/index.d.ts +4 -2
  55. package/dist/components/MeActions/index.js +4 -11
  56. package/dist/components/MePanel/index.d.ts +3 -2
  57. package/dist/components/MePanel/index.js +3 -2
  58. package/dist/components/Menu/index.d.ts +7 -0
  59. package/dist/components/Menu/index.js +7 -0
  60. package/dist/components/MenuItem/index.d.ts +4 -0
  61. package/dist/components/MenuItem/index.js +20 -0
  62. package/dist/components/Page/index.d.ts +4 -3
  63. package/dist/components/Page/index.js +6 -3
  64. package/dist/components/PageActions/index.d.ts +0 -1
  65. package/dist/components/PaginatedList/index.d.ts +8 -0
  66. package/dist/components/PaginatedList/index.js +18 -0
  67. package/dist/components/PaginatedListComponent/index.d.ts +13 -0
  68. package/dist/components/PaginatedListComponent/index.js +20 -0
  69. package/dist/components/Pagination/index.d.ts +7 -0
  70. package/dist/components/Pagination/index.js +40 -0
  71. package/dist/components/PaginationItem/index.d.ts +9 -0
  72. package/dist/components/PaginationItem/index.js +16 -0
  73. package/dist/components/Panel/index.d.ts +3 -2
  74. package/dist/components/Panel/index.js +13 -2
  75. package/dist/components/RootLayout/index.d.ts +2 -2
  76. package/dist/components/RootLayout/index.js +6 -12
  77. package/dist/components/SettingsForm/index.d.ts +6 -0
  78. package/dist/components/SettingsForm/index.js +14 -0
  79. package/dist/components/SettingsPage/index.d.ts +2 -0
  80. package/dist/components/SettingsPage/index.js +9 -0
  81. package/dist/components/Table/index.d.ts +6 -7
  82. package/dist/components/Table/index.js +16 -14
  83. package/dist/components/TableClientComponent/index.d.ts +0 -1
  84. package/dist/components/TableClientComponent/index.js +2 -11
  85. package/dist/components/TableComponent/index.d.ts +11 -0
  86. package/dist/components/TableComponent/index.js +17 -0
  87. package/dist/components/Tabs/index.d.ts +2 -7
  88. package/dist/components/Tabs/index.js +5 -22
  89. package/dist/components/TabsComponent/index.d.ts +7 -0
  90. package/dist/components/TabsComponent/index.js +9 -0
  91. package/dist/components/index.d.ts +12 -5
  92. package/dist/components/index.js +5 -2
  93. package/dist/hooks/useNavigation.d.ts +11 -0
  94. package/dist/hooks/useNavigation.js +27 -0
  95. package/dist/index.cjs +1266 -0
  96. package/dist/index.cjs.map +1 -0
  97. package/dist/index.js.map +1 -0
  98. package/dist/interfaces.d.ts +8 -2
  99. package/dist/services/ConfigService.d.ts +8 -3
  100. package/dist/services/ConfigService.js +6 -6
  101. package/dist/services/PermissionService.d.ts +3 -0
  102. package/dist/services/PermissionService.js +30 -0
  103. package/dist/services/SettingsService.d.ts +8 -0
  104. package/dist/services/SettingsService.js +9 -0
  105. package/dist/styles/config.js +119 -47
  106. package/dist/styles/tailwind.d.ts +9 -1
  107. package/dist/styles/tailwind.js +16 -3
  108. package/package.json +46 -45
  109. package/dist/components/Icon/index.d.ts +0 -8
  110. package/dist/components/Icon/index.js +0 -22
  111. package/dist/components/LoginForm/index.d.ts +0 -8
  112. package/dist/components/LoginForm/index.js +0 -7
  113. package/dist/icons/ErrorIcon/index.d.ts +0 -3
  114. package/dist/icons/ErrorIcon/index.js +0 -5
  115. package/dist/icons/InfoIcon/index.d.ts +0 -3
  116. package/dist/icons/InfoIcon/index.js +0 -5
  117. package/dist/icons/SuccessIcon/index.d.ts +0 -3
  118. package/dist/icons/SuccessIcon/index.js +0 -5
  119. package/dist/icons/WarningIcon/index.d.ts +0 -3
  120. package/dist/icons/WarningIcon/index.js +0 -5
  121. package/dist/services/AuthService.d.ts +0 -1
  122. package/dist/services/AuthService.js +0 -5
  123. package/dist/utility/formatters.d.ts +0 -1
  124. package/dist/utility/formatters.js +0 -8
  125. /package/{postcss.js → postcss.cjs} +0 -0
  126. /package/{tailwind.js → tailwind.cjs} +0 -0
@@ -1,19 +1,19 @@
1
1
  'use client';
2
- import clsx from 'clsx';
3
- const classNames = {
2
+ import { tw, twx } from '@sqrzro/components';
3
+ const classNames = twx({
4
4
  actionList: () => ({
5
5
  root: 'flex gap-2',
6
6
  }),
7
7
  button: (props) => ({
8
8
  root: {
9
- danger: 'bg-red-500 border-red-500 text-white',
10
- default: clsx('bg-white h-10 px-5 rounded text-md text-slate-600 border border-slate-300', props?.isFullWidth ? 'w-full' : null),
11
- primary: 'bg-primary font-semibold text-slate-800 border-none shadow-[inset_rgba(255,255,255,0.2)_0_20px]',
9
+ danger: 'border-red-500 bg-red-500 text-white',
10
+ default: tw('text-md h-10 rounded border border-slate-300 bg-white px-5 text-slate-600', props?.isFullWidth ? 'w-full' : null),
11
+ primary: 'bg-button-bg text-button-text border-none font-semibold',
12
12
  },
13
13
  }),
14
14
  calendar: () => ({
15
- root: 'text-sm text-slate-600 p-4 pb-3',
16
- head: 'text-xs text-center pb-2 text-slate-400',
15
+ root: 'p-4 pb-3 text-sm text-slate-600',
16
+ head: 'pb-2 text-center text-xs text-slate-400',
17
17
  month: 'w-full table-fixed',
18
18
  day: {
19
19
  default: 'h-10 border border-slate-200',
@@ -22,33 +22,62 @@ const classNames = {
22
22
  },
23
23
  }),
24
24
  calendarNavigation: () => ({
25
- root: 'flex justify-between items-center mb-6',
26
- title: 'font-semibold text-base',
27
- control: 'h-6 w-6 border border-slate-300 rounded-full',
25
+ root: 'mb-6 flex items-center justify-between',
26
+ title: 'text-base font-semibold',
27
+ control: 'h-6 w-6 rounded-full border border-slate-300',
28
28
  previous: '-order-1',
29
29
  }),
30
+ checkboxInput: (props) => ({
31
+ root: tw('flex', props?.isInline ? 'gap-6' : 'flex-col gap-2'),
32
+ icon: {
33
+ default: 'h-5 w-5 rounded border border-slate-300',
34
+ checked: 'border-primary bg-primary relative before:absolute before:inset-0.5 before:bg-[url(/admin/images/check-white.svg)] before:bg-contain',
35
+ },
36
+ label: 'flex min-h-5 items-center pl-2',
37
+ }),
38
+ codeInput: () => ({
39
+ input: {
40
+ default: 'focus:border-primary h-10 rounded border border-slate-300 text-center',
41
+ error: 'border-red-500',
42
+ },
43
+ }),
44
+ definitionList: () => ({
45
+ root: 'flex flex-col gap-4',
46
+ row: 'relative border-b border-slate-200 pb-4',
47
+ term: 'pb-1 text-slate-500',
48
+ }),
49
+ dropdown: () => ({
50
+ list: 'overflow-hidden rounded',
51
+ item: {
52
+ default: 'block border-b border-slate-100 p-3 text-sm text-slate-700',
53
+ selected: 'bg-slate-100',
54
+ },
55
+ title: 'block leading-none',
56
+ meta: 'mt-1.5 block text-xs leading-none text-slate-500',
57
+ icon: 'mr-2 h-5 w-5 bg-[url(/admin/images/chevron.svg)] bg-contain bg-center bg-no-repeat',
58
+ clear: 'mr-2 h-4 w-4 bg-[url(/admin/images/close.svg)] bg-contain bg-center bg-no-repeat',
59
+ }),
30
60
  editableFieldset: () => ({
31
- root: 'bg-panel p-8 shadow rounded grid grid-cols-[30%_1fr]',
61
+ root: 'bg-panel grid grid-cols-[25%_1fr] gap-20 rounded p-8 shadow',
32
62
  title: 'mb-8 text-lg font-semibold leading-none text-slate-700',
33
- actions: 'flex gap-2 justify-end border-t border-slate-200 pt-4',
63
+ description: 'text-slate-600',
64
+ actions: 'flex justify-end gap-2 border-t border-slate-200 pt-4',
34
65
  }),
35
66
  editableFormField: () => ({
36
67
  root: 'grid grid-cols-[25%_1fr] border-t border-slate-200 py-4',
37
- label: 'font-semibold leading-none flex items-center',
38
- field: 'min-h-10 flex items-center',
39
- }),
40
- emptyMessage: () => ({
41
- root: 'relative text-center text-slate-500 mt-4 mx-auto py-16 bg-white rounded max-w-xl w-full shadow before:absolute before:inset-2 before:border-dashed before:border-2 before:pointer-events-none',
42
- title: 'text-xl font-semibold mb-2 leading-none',
68
+ label: 'flex items-center font-semibold leading-none',
69
+ field: 'flex min-h-10 items-center',
70
+ }),
71
+ emptyMessage: (props) => ({
72
+ root: tw('@md:p-16 relative mx-auto mt-4 w-full max-w-2xl p-4 text-center text-slate-500', props?.isMinimal
73
+ ? null
74
+ : 'rounded bg-white shadow before:pointer-events-none before:absolute before:inset-2 before:border-2 before:border-dashed'),
75
+ title: '@md:text-xl mb-2 text-pretty font-semibold leading-tight',
76
+ description: '@md:text-sm text-pretty text-xs',
43
77
  action: 'mt-6 flex justify-center',
44
78
  }),
45
- dropdown: () => ({
46
- item: { default: 'text-slate-700 block p-3 text-sm', selected: 'bg-slate-100' },
47
- title: 'block leading-none',
48
- meta: 'block mt-0.5 leading-none text-xs text-slate-500',
49
- }),
50
79
  fieldset: () => ({
51
- root: 'bg-white p-8 shadow rounded',
80
+ root: 'rounded bg-white p-8 shadow',
52
81
  title: 'mb-8 text-lg font-semibold leading-none text-slate-700',
53
82
  }),
54
83
  form: () => ({
@@ -56,61 +85,104 @@ const classNames = {
56
85
  }),
57
86
  formField: (props) => ({
58
87
  root: {
59
- default: props?.isEditable
60
- ? 'grid grid-cols-[25%_1fr] border-t border-slate-200 py-4'
61
- : '',
88
+ default: tw(props?.isEditable ? 'grid grid-cols-[25%_1fr] border-t border-slate-200 py-4' : ''),
62
89
  },
63
- label: clsx('flex font-semibold leading-none', props?.isEditable ? 'items-center' : 'justify-between mb-2'),
64
- details: 'text-xs text-slate-500 font-normal mb-2 leading-none',
65
- optional: 'pl-2 text-xs text-slate-500 font-normal leading-none',
66
- 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',
90
+ label: tw('flex font-semibold leading-none', props?.isEditable ? 'items-center' : 'mb-2 justify-between'),
91
+ field: tw(props?.isEditable ? 'flex min-h-10 flex-col justify-center' : ''),
92
+ details: tw('text-xs font-normal text-slate-500', props?.isEditable ? 'col-start-2 row-start-2 mt-2' : 'mb-2'),
93
+ optional: 'pl-2 text-xs font-normal leading-none text-slate-500',
94
+ error: tw('mt-2 flex items-start gap-1.5 text-red-600 before:mt-0.5 before:h-4 before:w-4 before:flex-none before:rounded-full before:bg-[url(/admin/images/danger.svg)] before:bg-contain', props?.isEditable ? 'col-start-2' : ''),
67
95
  }),
68
96
  imageInput: () => ({
69
97
  root: 'h-64 rounded border border-slate-300 bg-slate-50 p-8',
70
- icon: 'mx-auto mb-2 block h-12 w-12 border-2 border-slate-300 rounded-full',
98
+ icon: 'mx-auto mb-2 block h-12 w-12 rounded-full border-2 border-slate-300',
71
99
  title: 'mb-1 font-semibold',
72
100
  description: 'text-xs italic text-slate-700',
73
101
  }),
74
102
  inputPanel: () => ({
75
- root: 'show origin-top bg-white border border-slate-300 shadow-md rounded mt-1',
103
+ root: 'show my-1 origin-top rounded border border-slate-300 bg-white shadow-md',
76
104
  }),
77
- modal: () => ({
105
+ loadingModal: () => ({
78
106
  root: 'open:backdrop:fade py-16 backdrop:bg-slate-700/50 backdrop:backdrop-blur-sm',
79
- panel: 'show mx-auto w-full max-w-lg rounded bg-panel p-6 text-left shadow-xl row-start-2',
80
- title: 'mb-6 text-lg font-semibold',
81
- actions: 'flex justify-end',
107
+ panel: 'text-center text-lg font-semibold text-white',
108
+ }),
109
+ modal: () => ({
110
+ root: 'open:backdrop:fade py-16 backdrop:bg-slate-700/50',
111
+ panel: 'show bg-panel row-start-2 mx-auto flex w-full max-w-lg flex-col gap-6 rounded p-6 text-left shadow-xl',
112
+ content: 'flex flex-col gap-6',
113
+ title: 'text-lg font-semibold',
114
+ actions: 'flex justify-end border-t border-slate-200 pt-6',
82
115
  }),
83
116
  multiInput: () => ({
84
- root: 'flex flex-col gap-2',
117
+ root: 'flex flex-col gap-2 pt-2',
85
118
  row: 'grid grid-cols-[1fr_auto] has-[>_button]:gap-2',
86
119
  }),
120
+ objectInput: () => ({
121
+ root: 'flex flex-col gap-2',
122
+ }),
123
+ passwordInput: () => ({
124
+ action: {
125
+ default: 'mr-2 h-6 w-6 overflow-hidden bg-[url(/admin/images/eye.svg)] bg-no-repeat indent-12',
126
+ selected: 'bg-bottom',
127
+ },
128
+ }),
129
+ radioInput: (props) => ({
130
+ root: tw('flex', props?.isInline ? 'gap-6' : 'flex-col gap-2'),
131
+ icon: {
132
+ default: 'h-5 w-5 rounded border border-slate-300',
133
+ checked: 'border-primary bg-primary relative before:absolute before:inset-0.5 before:bg-[url(/admin/images/check-white.svg)] before:bg-contain',
134
+ },
135
+ label: 'flex min-h-5 items-center pl-2',
136
+ }),
87
137
  staticTextInput: () => ({
88
- root: { default: 'bg-white border border-slate-300 h-10 px-3 rounded text-md' },
138
+ root: {
139
+ default: 'text-md flex min-h-10 flex-col justify-center rounded border border-slate-300 bg-white p-3',
140
+ error: 'border-red-500',
141
+ },
142
+ label: 'block leading-none',
143
+ meta: 'mt-1 block text-xs leading-none text-slate-500',
144
+ placeholder: 'block leading-none text-slate-500',
89
145
  }),
90
146
  switch: () => ({
91
- root: {
92
- default: 'cursor-pointer w-10 h-6 bg-slate-300 rounded-full p-1 transition-colors my-2',
93
- checked: 'bg-green-500',
147
+ root: 'flex gap-4',
148
+ input: {
149
+ default: 'h-6 w-10 flex-none cursor-pointer rounded-full bg-slate-300 p-1 transition-colors',
150
+ checked: 'bg-primary',
94
151
  },
95
152
  control: {
96
- default: 'w-4 h-4 bg-white rounded-full shadow-md transform translate-x-0 transition-transform',
153
+ default: 'h-4 w-4 translate-x-0 transform rounded-full bg-white shadow-md transition-transform',
97
154
  checked: 'translate-x-full',
98
155
  },
156
+ label: 'block flex min-h-6 flex-col justify-center',
157
+ details: 'mt-1 block text-xs text-slate-500',
158
+ }),
159
+ textArea: () => ({
160
+ root: {
161
+ default: 'text-md focus:border-primary rounded border border-slate-300 px-3 py-2',
162
+ error: 'border-red-500',
163
+ },
99
164
  }),
100
165
  textButton: () => ({
101
166
  root: { danger: 'text-red-600' },
102
167
  }),
103
168
  textInput: () => ({
104
169
  root: {
105
- default: 'border border-slate-300 h-10 px-3 rounded text-md focus:border-primary',
106
- error: 'border-red-700',
170
+ default: 'text-md focus:border-primary h-10 rounded border border-slate-300 px-3',
171
+ error: 'border-red-500',
172
+ },
173
+ prefix: {
174
+ default: 'peer-focus:border-primary relative -mr-1 rounded-l border border-slate-300 bg-white px-3 text-sm text-slate-600',
175
+ },
176
+ suffix: {
177
+ default: 'peer-focus:border-primary relative -ml-1 rounded-r border border-slate-300 bg-white px-3 text-sm text-slate-600',
107
178
  },
108
179
  }),
109
180
  toast: () => ({
110
181
  root: {
111
182
  default: 'rounded border px-4 py-2',
112
- success: 'bg-green-100 border-green-300 text-green-700',
183
+ success: 'border-green-300 bg-green-100 text-green-700',
184
+ error: 'border-red-300 bg-red-100 text-red-700',
113
185
  },
114
186
  }),
115
- };
187
+ });
116
188
  export default classNames;
@@ -1,2 +1,10 @@
1
- declare function config(resolves: string[]): Record<string, unknown>;
1
+ interface Theme {
2
+ colors?: Partial<{
3
+ 'button-bg': string;
4
+ 'button-text': string;
5
+ link: string;
6
+ primary: string;
7
+ }>;
8
+ }
9
+ declare function config(resolves: string[], customization: Theme, plugins?: unknown[]): Record<string, unknown>;
2
10
  export default config;
@@ -1,6 +1,6 @@
1
1
  import path from 'path';
2
- import plugin from 'tailwindcss/plugin';
3
- function config(resolves) {
2
+ import plugin from 'tailwindcss/plugin'; // eslint-disable-line import/no-extraneous-dependencies
3
+ function config(resolves, customization, plugins) {
4
4
  return {
5
5
  content: [
6
6
  './app/**/*.tsx',
@@ -12,8 +12,11 @@ function config(resolves) {
12
12
  theme: {
13
13
  extend: {
14
14
  colors: {
15
+ 'button-bg': 'var(--color-button-bg)',
16
+ 'button-text': 'var(--color-button-text)',
17
+ link: 'var(--color-link)',
15
18
  panel: 'var(--color-panel)',
16
- primary: '#1ec2d4',
19
+ primary: 'var(--color-primary)',
17
20
  },
18
21
  fontFamily: {
19
22
  sans: ['var(--font-inter)'],
@@ -21,14 +24,24 @@ function config(resolves) {
21
24
  },
22
25
  },
23
26
  plugins: [
27
+ ...(plugins || []),
24
28
  plugin(({ addBase, addUtilities, theme }) => {
25
29
  addBase({
26
30
  body: {
31
+ '--color-button-bg': customization?.colors?.['button-bg'] ||
32
+ customization?.colors?.primary ||
33
+ theme('colors.indigo.800'),
34
+ '--color-button-text': customization?.colors?.['button-text'] || theme('colors.white'),
35
+ '--color-link': customization?.colors?.link || theme('colors.indigo.800'),
27
36
  '--color-panel': theme('colors.white'),
37
+ '--color-primary': customization?.colors?.primary || theme('colors.indigo.800'),
28
38
  },
29
39
  'body.dark': {
30
40
  '--color-panel': theme('colors.gray.700'),
31
41
  },
42
+ strong: {
43
+ fontWeight: theme('fontWeight.semibold'),
44
+ },
32
45
  });
33
46
  addUtilities({
34
47
  '@keyframes show': {
package/package.json CHANGED
@@ -1,65 +1,66 @@
1
1
  {
2
2
  "name": "@sqrzro/admin",
3
- "version": "2.1.0-bz.9",
3
+ "type": "module",
4
+ "version": "2.1.0-r19.3",
4
5
  "main": "dist/index.js",
5
6
  "types": "dist/index.d.ts",
6
7
  "license": "ISC",
8
+ "exports": {
9
+ ".": "./dist/index.js",
10
+ "./postcss": "./postcss.cjs",
11
+ "./tailwind": "./tailwind.cjs"
12
+ },
7
13
  "files": [
8
- "dist",
9
- "postcss.js",
10
- "tailwind.js",
14
+ "assets/**/*",
15
+ "dist/**/*",
16
+ "postcss.cjs",
17
+ "tailwind.cjs",
11
18
  "tailwind.d.ts"
12
19
  ],
13
20
  "dependencies": {
14
- "@sqrzro/components": "bz",
15
- "@sqrzro/hooks": "bz",
16
- "@sqrzro/interfaces": "bz",
17
- "@sqrzro/server": "bz",
18
- "@sqrzro/utility": "bz",
19
- "clsx": "^1.2.1",
20
- "next": "^14.0.0",
21
- "react": "^18.2.0",
22
- "react-dom": "^18.2.0"
21
+ "@sqrzro/components": "r19",
22
+ "@sqrzro/hooks": "r19",
23
+ "@sqrzro/interfaces": "r19",
24
+ "@sqrzro/server": "r19",
25
+ "@sqrzro/utility": "r19",
26
+ "next": "^15.1.5",
27
+ "react": "^19.0.0",
28
+ "react-dom": "^19.0.0"
23
29
  },
24
30
  "devDependencies": {
25
- "@babel/core": "^7.20.12",
26
- "@babel/preset-env": "^7.21.4",
27
- "@babel/preset-react": "^7.18.6",
28
- "@babel/preset-typescript": "^7.21.4",
29
- "@sqrzro/eslint-plugin": "bz",
30
- "@sqrzro/prettier-config": "bz",
31
- "@sqrzro/tailwind-plugin": "bz",
32
- "@storybook/addon-actions": "^7.0.7",
33
- "@storybook/addon-essentials": "^7.0.7",
34
- "@storybook/addon-interactions": "^7.0.7",
35
- "@storybook/addon-links": "^7.0.7",
36
- "@storybook/addon-mdx-gfm": "7.0.7",
37
- "@storybook/react": "^7.0.7",
38
- "@storybook/react-webpack5": "7.0.7",
39
- "@storybook/testing-library": "^0.1.0",
40
- "@testing-library/dom": "^8.20.0",
41
- "@testing-library/jest-dom": "^5.16.5",
42
- "@testing-library/react": "^13.4.0",
43
- "@testing-library/user-event": "^14.4.3",
44
- "@types/bcrypt": "^5.0.1",
45
- "@types/jest": "^29.5.12",
31
+ "@babel/core": "^7.26.0",
32
+ "@babel/preset-env": "^7.26.0",
33
+ "@babel/preset-react": "^7.26.3",
34
+ "@babel/preset-typescript": "^7.26.0",
35
+ "@sqrzro/eslint-plugin": "r19",
36
+ "@sqrzro/prettier-config": "r19",
37
+ "@sqrzro/tailwind-plugin": "r19",
38
+ "@tailwindcss/container-queries": "^0.1.1",
39
+ "@testing-library/dom": "^8.20.1",
40
+ "@testing-library/jest-dom": "^5.17.0",
41
+ "@testing-library/react": "^16.2.0",
42
+ "@testing-library/user-event": "^14.6.0",
43
+ "@types/bcrypt": "^5.0.2",
44
+ "@types/jest": "^29.5.14",
46
45
  "@types/node": "18.14.6",
47
- "@types/react": "^18.2.32",
48
- "babel-loader": "^8.3.0",
46
+ "@types/react": "^19.0.7",
47
+ "@types/react-dom": "^19.0.3",
48
+ "babel-loader": "^8.4.1",
49
49
  "concurrently": "^7.6.0",
50
- "eslint": "^8.55.0",
51
- "jest": "^29.5.0",
50
+ "eslint": "^8.57.1",
51
+ "jest": "^29.7.0",
52
52
  "mockdate": "^3.0.5",
53
- "prettier": "^2.8.4",
54
- "rimraf": "^4.1.2",
55
- "storybook": "^7.0.7",
56
- "tailwindcss": "^3.2.6",
57
- "typescript": "^5.2.2"
53
+ "prettier": "^3.4.2",
54
+ "rimraf": "^4.4.1",
55
+ "tailwindcss": "^3.4.17",
56
+ "tslib": "^2.8.1",
57
+ "tsup": "^8.3.5",
58
+ "typescript": "^5.7.3"
58
59
  },
59
60
  "scripts": {
60
- "build": "pnpm clean && tsc -p tsconfig.build.json",
61
+ "build": "tsc -p tsconfig.build.json",
61
62
  "clean": "rimraf ./dist",
62
- "dev": "tsc -p tsconfig.build.json -w",
63
+ "dev": "pnpm build --watch",
63
64
  "docs": "storybook dev -p 6006",
64
65
  "lint": "tsc --noEmit && eslint \"./src/**/*.tsx\" \"./src/**/*.ts\"",
65
66
  "prettier": "prettier --write \"./src/**/*.tsx\" \"./src/**/*.ts\"",
@@ -1,8 +0,0 @@
1
- /// <reference types="react" />
2
- export type IconType = 'error' | 'info' | 'success' | 'warning';
3
- declare const icons: Record<IconType, () => React.ReactElement>;
4
- export interface IconProps {
5
- type?: keyof typeof icons;
6
- }
7
- declare function Icon({ type }: Readonly<IconProps>): React.ReactElement | null;
8
- export default Icon;
@@ -1,22 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import ErrorIcon from '../../icons/ErrorIcon';
3
- import InfoIcon from '../../icons/InfoIcon';
4
- import SuccessIcon from '../../icons/SuccessIcon';
5
- import WarningIcon from '../../icons/WarningIcon';
6
- const icons = {
7
- error: ErrorIcon,
8
- info: InfoIcon,
9
- success: SuccessIcon,
10
- warning: WarningIcon,
11
- };
12
- function Icon({ type }) {
13
- if (!type) {
14
- return null;
15
- }
16
- const IconComponent = icons[type];
17
- if (!IconComponent) {
18
- return null;
19
- }
20
- return _jsx(IconComponent, {});
21
- }
22
- export default Icon;
@@ -1,8 +0,0 @@
1
- /// <reference types="react" />
2
- import type { UseFormReturn } from '@sqrzro/hooks';
3
- import type { UserObject } from '@sqrzro/server';
4
- export interface LoginFormProps extends UseFormReturn<UserObject> {
5
- logo?: () => React.ReactElement;
6
- }
7
- declare function LoginForm({ fieldProps, formProps, logo }: Readonly<LoginFormProps>): React.ReactElement;
8
- export default LoginForm;
@@ -1,7 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { Form, FormField, FormSubmit, PasswordInput, TextInput } from '@sqrzro/components';
4
- function LoginForm({ fieldProps, formProps, logo }) {
5
- return (_jsxs("div", { className: "flex h-screen flex-col items-center justify-center bg-slate-800 pb-[10vh]", children: [_jsx("div", { className: "mx-auto mb-8 flex h-12 w-32 items-end", children: logo?.() }), _jsxs("div", { className: "w-full max-w-sm rounded bg-white p-8 shadow-lg", children: [_jsx("h1", { className: "mb-8 text-center text-xl font-semibold", children: "Sign in to continue" }), _jsxs(Form, { ...formProps, children: [_jsx(FormField, { label: "Email", ...fieldProps('email'), render: TextInput }), _jsx(FormField, { label: "Password", ...fieldProps('password'), render: PasswordInput }), _jsxs("div", { className: "text-center", children: [_jsx("a", { className: "text-primary mb-6 block font-semibold", href: "/#", children: "Forgot Password?" }), _jsx(FormSubmit, { isFullWidth: true, children: "Sign In" })] })] })] })] }));
6
- }
7
- export default LoginForm;
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- declare function ErrorIcon(): React.ReactElement;
3
- export default ErrorIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- function ErrorIcon() {
3
- return (_jsx("svg", { "aria-hidden": "true", className: "h-5 w-5 text-red-400", fill: "currentColor", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { clipRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z", fillRule: "evenodd" }) }));
4
- }
5
- export default ErrorIcon;
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- declare function InfoIcon(): React.ReactElement;
3
- export default InfoIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- function InfoIcon() {
3
- return (_jsx("svg", { "aria-hidden": "true", className: "h-5 w-5 text-blue-400", fill: "currentColor", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { clipRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z", fillRule: "evenodd" }) }));
4
- }
5
- export default InfoIcon;
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- declare function SuccessIcon(): React.ReactElement;
3
- export default SuccessIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- function SuccessIcon() {
3
- return (_jsx("svg", { "aria-hidden": "true", className: "h-5 w-5 text-green-400", fill: "currentColor", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { clipRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z", fillRule: "evenodd" }) }));
4
- }
5
- export default SuccessIcon;
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- declare function WarningIcon(): React.ReactElement;
3
- export default WarningIcon;
@@ -1,5 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- function WarningIcon() {
3
- return (_jsx("svg", { "aria-hidden": "true", className: "h-5 w-5 text-yellow-400", fill: "currentColor", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { clipRule: "evenodd", d: "M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495zM10 5a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 0110 5zm0 9a1 1 0 100-2 1 1 0 000 2z", fillRule: "evenodd" }) }));
4
- }
5
- export default WarningIcon;
@@ -1 +0,0 @@
1
- export declare function logout(): Promise<boolean>;
@@ -1,5 +0,0 @@
1
- 'use server';
2
- import { deleteAuthUserSession } from '@sqrzro/server';
3
- export async function logout() {
4
- return deleteAuthUserSession();
5
- }
@@ -1 +0,0 @@
1
- export declare function formatDate(value?: Date): string;
@@ -1,8 +0,0 @@
1
- export function formatDate(value) {
2
- if (!value) {
3
- return '';
4
- }
5
- return `${value.getDate().toString().padStart(2, '0')}/${(value.getMonth() + 1)
6
- .toString()
7
- .padStart(2, '0')}/${value.getFullYear()}`;
8
- }
File without changes
File without changes