@umituz/web-dashboard 5.0.1 → 6.0.0

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 (34) hide show
  1. package/package.json +2 -12
  2. package/src/index.ts +0 -10
  3. package/src/styles/dashboard.css +0 -460
  4. package/src/domains/auth/components/AuthLayout.tsx +0 -99
  5. package/src/domains/auth/components/ForgotPasswordForm.tsx +0 -167
  6. package/src/domains/auth/components/LoginForm.tsx +0 -222
  7. package/src/domains/auth/components/RegisterForm.tsx +0 -281
  8. package/src/domains/auth/components/ResetPasswordForm.tsx +0 -173
  9. package/src/domains/auth/components/index.ts +0 -11
  10. package/src/domains/auth/components/shared/AuthErrorBanner.tsx +0 -25
  11. package/src/domains/auth/components/shared/EmailInput.tsx +0 -73
  12. package/src/domains/auth/components/shared/PasswordInput.tsx +0 -100
  13. package/src/domains/auth/components/shared/PasswordStrengthIndicator.tsx +0 -63
  14. package/src/domains/auth/components/shared/SocialLoginButtons.tsx +0 -44
  15. package/src/domains/auth/components/shared/SocialProviderIcons.tsx +0 -48
  16. package/src/domains/auth/components/shared/index.ts +0 -20
  17. package/src/domains/auth/hooks/index.ts +0 -8
  18. package/src/domains/auth/hooks/useAuth.ts +0 -230
  19. package/src/domains/auth/index.ts +0 -62
  20. package/src/domains/auth/types/auth.ts +0 -302
  21. package/src/domains/auth/types/index.ts +0 -25
  22. package/src/domains/auth/utils/auth.test.ts +0 -188
  23. package/src/domains/auth/utils/auth.ts +0 -221
  24. package/src/domains/auth/utils/i18nKeys.ts +0 -109
  25. package/src/domains/auth/utils/index.ts +0 -29
  26. package/src/domains/auth/utils/secureToken.ts +0 -33
  27. package/src/domains/auth/utils/validationKeys.ts +0 -23
  28. package/src/domains/session/DemoLogin.tsx +0 -42
  29. package/src/domains/session/OrgSwitcher.tsx +0 -102
  30. package/src/domains/session/SessionContext.tsx +0 -150
  31. package/src/domains/session/inMemoryAuthAdapter.ts +0 -53
  32. package/src/domains/session/index.ts +0 -18
  33. package/src/domains/session/types.ts +0 -47
  34. package/src/domains/session/utils/i18nKeys.ts +0 -12
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@umituz/web-dashboard",
3
- "version": "5.0.1",
4
- "description": "Installable app skeleton for the fleet — layouts, auth, analytics (dependency-free SVG charts), calendar, i18n via @umituz/web-localization, permissions/session/module registry; udb-* stylesheet on design-system tokens",
3
+ "version": "6.0.0",
4
+ "description": "Installable app skeleton for the fleet — layouts, analytics (dependency-free SVG charts), calendar, i18n via @umituz/web-localization, permissions/module registry; udb-* stylesheet on design-system tokens (auth lives in @umituz/web-auth)",
5
5
  "type": "module",
6
6
  "main": "./src/index.ts",
7
7
  "types": "./src/index.ts",
@@ -12,7 +12,6 @@
12
12
  ".": "./src/index.ts",
13
13
  "./styles.css": "./src/styles/dashboard.css",
14
14
  "./permissions": "./src/domains/permissions/index.ts",
15
- "./session": "./src/domains/session/index.ts",
16
15
  "./modules": "./src/domains/modules/index.ts",
17
16
  "./layouts": "./src/domains/layouts/index.ts",
18
17
  "./layouts/components": "./src/domains/layouts/components/index.ts",
@@ -25,11 +24,6 @@
25
24
  "./settings/hooks": "./src/domains/settings/hooks/index.ts",
26
25
  "./settings/utils": "./src/domains/settings/utils/index.ts",
27
26
  "./settings/types": "./src/domains/settings/types/index.ts",
28
- "./auth": "./src/domains/auth/index.ts",
29
- "./auth/components": "./src/domains/auth/components/index.ts",
30
- "./auth/hooks": "./src/domains/auth/hooks/index.ts",
31
- "./auth/utils": "./src/domains/auth/utils/index.ts",
32
- "./auth/types": "./src/domains/auth/types/index.ts",
33
27
  "./analytics": "./src/domains/analytics/index.ts",
34
28
  "./analytics/components": "./src/domains/analytics/components/index.ts",
35
29
  "./analytics/hooks": "./src/domains/analytics/hooks/index.ts",
@@ -83,10 +77,6 @@
83
77
  "dashboard",
84
78
  "layout",
85
79
  "settings",
86
- "auth",
87
- "authentication",
88
- "login",
89
- "register",
90
80
  "analytics",
91
81
  "analytics-services",
92
82
  "cohort-analysis",
package/src/index.ts CHANGED
@@ -1,16 +1,6 @@
1
1
  export * from './domains/layouts';
2
2
  export * from './domains/settings';
3
3
  export * from './domains/calendar';
4
- export {
5
- AuthLayout,
6
- LoginForm,
7
- RegisterForm,
8
- useAuth,
9
- type LoginCredentials,
10
- type RegisterData,
11
- type User,
12
- } from './domains/auth';
13
-
14
4
  export {
15
5
  useAnalytics,
16
6
  MetricCard,
@@ -697,165 +697,6 @@
697
697
  margin: var(--udb-space-2) 0;
698
698
  background: var(--color-border);
699
699
  }
700
- .udb-auth {
701
- display: flex;
702
- flex-direction: column;
703
- min-height: 100dvh;
704
- background: var(--color-background);
705
- }
706
- .udb-auth__header {
707
- display: flex;
708
- align-items: center;
709
- justify-content: space-between;
710
- gap: var(--udb-space-3);
711
- padding: var(--udb-space-4) var(--udb-space-6);
712
- }
713
- .udb-auth__brand {
714
- display: flex;
715
- align-items: center;
716
- gap: var(--udb-space-2);
717
- }
718
- .udb-auth__brand-name {
719
- font-size: var(--udb-font-size-lg);
720
- font-weight: var(--font-weight-bold);
721
- letter-spacing: -0.02em;
722
- color: var(--color-foreground);
723
- }
724
- .udb-auth__home-link {
725
- font-size: var(--udb-font-size-md);
726
- color: var(--color-muted-foreground);
727
- text-decoration: none;
728
- }
729
- .udb-auth__home-link:hover {
730
- color: var(--color-foreground);
731
- text-decoration: underline;
732
- }
733
- .udb-auth__main {
734
- display: flex;
735
- flex: 1;
736
- align-items: center;
737
- justify-content: center;
738
- padding: var(--udb-space-6) var(--udb-space-4);
739
- }
740
- .udb-auth__column {
741
- display: flex;
742
- flex-direction: column;
743
- width: 100%;
744
- max-width: 420px;
745
- }
746
- .udb-auth__card {
747
- background: var(--color-card);
748
- border: 1px solid var(--color-border);
749
- border-radius: var(--radius-xl);
750
- box-shadow: var(--shadow-lg);
751
- padding: var(--udb-space-8) var(--udb-space-7);
752
- }
753
- .udb-auth__tagline {
754
- margin: 0 0 var(--udb-space-5);
755
- text-align: center;
756
- font-size: var(--udb-font-size-xs);
757
- font-weight: var(--font-weight-bold);
758
- text-transform: uppercase;
759
- letter-spacing: 0.1em;
760
- color: var(--color-primary);
761
- }
762
- .udb-auth__social {
763
- margin-top: var(--udb-space-5);
764
- }
765
- .udb-auth__footer {
766
- padding: var(--udb-space-4) var(--udb-space-6);
767
- }
768
- .udb-auth__footer-inner {
769
- display: flex;
770
- flex-direction: column;
771
- align-items: center;
772
- gap: var(--udb-space-2);
773
- text-align: center;
774
- font-size: var(--udb-font-size-xs);
775
- color: var(--color-muted-foreground);
776
- }
777
- .udb-auth__footer-inner > p {
778
- margin: 0;
779
- }
780
- .udb-auth__footer-links {
781
- display: flex;
782
- align-items: center;
783
- justify-content: center;
784
- flex-wrap: wrap;
785
- gap: var(--udb-space-4);
786
- }
787
- .udb-auth__footer-link {
788
- font-size: var(--udb-font-size-xs);
789
- color: var(--color-muted-foreground);
790
- text-decoration: none;
791
- }
792
- .udb-auth__footer-link:hover {
793
- color: var(--color-foreground);
794
- text-decoration: underline;
795
- }
796
- .udb-divider-row {
797
- display: flex;
798
- align-items: center;
799
- gap: var(--udb-space-3);
800
- margin: var(--udb-space-5) 0;
801
- }
802
- .udb-divider-row::before,
803
- .udb-divider-row::after {
804
- content: "";
805
- flex: 1;
806
- height: 1px;
807
- background: var(--color-border);
808
- }
809
- .udb-divider-row__label {
810
- font-size: var(--udb-font-size-xs);
811
- font-weight: var(--font-weight-medium);
812
- text-transform: uppercase;
813
- letter-spacing: 0.06em;
814
- color: var(--color-muted-foreground);
815
- white-space: nowrap;
816
- }
817
- .udb-social-grid {
818
- display: grid;
819
- grid-template-columns: repeat(2, minmax(0, 1fr));
820
- gap: var(--udb-space-3);
821
- }
822
- .udb-social-grid__btn {
823
- width: 100%;
824
- }
825
- .udb-social-grid__icon {
826
- width: 16px;
827
- height: 16px;
828
- flex-shrink: 0;
829
- }
830
- .udb-social-btn {
831
- display: inline-flex;
832
- align-items: center;
833
- justify-content: center;
834
- gap: var(--udb-space-2);
835
- height: 40px;
836
- padding: 0 var(--udb-space-3);
837
- border: 1px solid var(--udb-border-strong);
838
- border-radius: var(--radius-md);
839
- background: var(--color-card);
840
- color: var(--color-foreground);
841
- font-family: inherit;
842
- font-size: var(--udb-font-size-md);
843
- font-weight: var(--font-weight-medium);
844
- cursor: pointer;
845
- }
846
- .udb-social-btn:hover {
847
- background: var(--color-muted);
848
- }
849
- .udb-social-btn__icon {
850
- display: inline-flex;
851
- align-items: center;
852
- justify-content: center;
853
- flex-shrink: 0;
854
- }
855
- .udb-social-btn__icon svg {
856
- width: 16px;
857
- height: 16px;
858
- }
859
700
  @keyframes udb-spin {
860
701
  to {
861
702
  transform: rotate(360deg);
@@ -864,271 +705,6 @@
864
705
  .udb-spin {
865
706
  animation: udb-spin 1s linear infinite;
866
707
  }
867
- .udb-form {
868
- display: flex;
869
- flex-direction: column;
870
- gap: var(--udb-space-4);
871
- width: 100%;
872
- }
873
- .udb-form__header {
874
- display: flex;
875
- flex-direction: column;
876
- gap: var(--udb-space-1);
877
- text-align: center;
878
- }
879
- .udb-form__title {
880
- margin: 0;
881
- font-size: var(--udb-font-size-2xl);
882
- font-weight: var(--font-weight-bold);
883
- letter-spacing: -0.02em;
884
- line-height: 1.2;
885
- color: var(--color-foreground);
886
- }
887
- .udb-form__title--lg {
888
- font-size: var(--udb-font-size-3xl);
889
- }
890
- .udb-form__subtitle {
891
- margin: 0;
892
- font-size: var(--udb-font-size-md);
893
- color: var(--color-muted-foreground);
894
- }
895
- .udb-form__subtitle-strong {
896
- color: var(--color-foreground);
897
- font-weight: var(--font-weight-medium);
898
- }
899
- .udb-form__row {
900
- display: flex;
901
- align-items: center;
902
- justify-content: space-between;
903
- gap: var(--udb-space-3);
904
- font-size: var(--udb-font-size-md);
905
- }
906
- .udb-form__footer-text {
907
- margin: 0;
908
- text-align: center;
909
- font-size: var(--udb-font-size-md);
910
- color: var(--color-muted-foreground);
911
- }
912
- .udb-form__group {
913
- display: flex;
914
- flex-direction: column;
915
- gap: var(--udb-space-3);
916
- }
917
- .udb-field {
918
- display: flex;
919
- flex-direction: column;
920
- gap: 6px;
921
- }
922
- .udb-field__label {
923
- font-size: var(--udb-font-size-md);
924
- font-weight: var(--font-weight-medium);
925
- color: var(--color-foreground);
926
- }
927
- .udb-field__required {
928
- margin-left: 2px;
929
- color: var(--color-destructive);
930
- }
931
- .udb-field__error {
932
- margin: 0;
933
- font-size: var(--udb-font-size-sm);
934
- color: var(--color-destructive);
935
- }
936
- .udb-form-alert {
937
- display: flex;
938
- align-items: flex-start;
939
- gap: var(--udb-space-2);
940
- padding: 10px var(--udb-space-3);
941
- border-radius: var(--radius-md);
942
- background: var(--color-destructive-soft, color-mix(in srgb, var(--color-destructive, #dc2626) 10%, transparent));
943
- color: var(--color-destructive);
944
- font-size: var(--udb-font-size-md);
945
- }
946
- .udb-form-alert__icon {
947
- width: 16px;
948
- height: 16px;
949
- flex-shrink: 0;
950
- margin-top: 2px;
951
- }
952
- .udb-check-label {
953
- display: flex;
954
- align-items: center;
955
- gap: var(--udb-space-2);
956
- font-size: var(--udb-font-size-md);
957
- color: var(--color-muted-foreground);
958
- cursor: pointer;
959
- }
960
- .udb-check-label--multiline {
961
- align-items: flex-start;
962
- }
963
- .udb-check-label__text {
964
- flex: 1;
965
- line-height: 1.45;
966
- }
967
- .udb-link-btn {
968
- display: inline;
969
- border: none;
970
- padding: 0;
971
- background: transparent;
972
- font-family: inherit;
973
- font-size: var(--udb-font-size-md);
974
- color: var(--color-primary);
975
- cursor: pointer;
976
- }
977
- .udb-link-btn:hover {
978
- text-decoration: underline;
979
- }
980
- .udb-link-btn:disabled {
981
- pointer-events: none;
982
- opacity: 0.55;
983
- }
984
- .udb-link-btn--strong {
985
- font-weight: 600;
986
- }
987
- .udb-text-link {
988
- color: var(--color-primary);
989
- text-decoration: none;
990
- }
991
- .udb-text-link:hover {
992
- text-decoration: underline;
993
- }
994
- .udb-submit-btn {
995
- width: 100%;
996
- height: 44px;
997
- }
998
- .udb-submit-btn--pill {
999
- height: 48px;
1000
- border-radius: var(--udb-radius-pill);
1001
- }
1002
- .udb-btn__spinner {
1003
- animation: udb-spin 1s linear infinite;
1004
- }
1005
- .udb-password-wrap {
1006
- position: relative;
1007
- width: 100%;
1008
- }
1009
- .udb-input--with-toggle {
1010
- padding-right: 44px;
1011
- }
1012
- .udb-password-toggle {
1013
- position: absolute;
1014
- right: 2px;
1015
- top: 50%;
1016
- transform: translateY(-50%);
1017
- }
1018
- .udb-password-toggle__icon {
1019
- width: 16px;
1020
- height: 16px;
1021
- color: var(--color-muted-foreground);
1022
- }
1023
- .udb-input--error {
1024
- border-color: var(--color-destructive);
1025
- }
1026
- .udb-input--error:focus-visible {
1027
- border-color: var(--color-destructive);
1028
- box-shadow: 0 0 0 3px var(--color-destructive-soft, color-mix(in srgb, var(--color-destructive, #dc2626) 10%, transparent));
1029
- }
1030
- .udb-strength {
1031
- display: flex;
1032
- flex-direction: column;
1033
- gap: 6px;
1034
- margin-top: var(--udb-space-1);
1035
- }
1036
- .udb-strength__bars {
1037
- display: grid;
1038
- grid-template-columns: repeat(4, minmax(0, 1fr));
1039
- gap: var(--udb-space-2);
1040
- }
1041
- .udb-strength__bar {
1042
- height: 4px;
1043
- border-radius: var(--udb-radius-pill);
1044
- background: var(--udb-border-strong);
1045
- transition: background-color 0.2s ease;
1046
- }
1047
- .udb-strength__bar--weak {
1048
- background: var(--color-destructive);
1049
- }
1050
- .udb-strength__bar--fair {
1051
- background: var(--color-warning);
1052
- }
1053
- .udb-strength__bar--good {
1054
- background: var(--color-primary);
1055
- }
1056
- .udb-strength__bar--strong {
1057
- background: var(--color-success);
1058
- }
1059
- .udb-strength__label {
1060
- margin: 0;
1061
- font-size: var(--udb-font-size-xs);
1062
- color: var(--color-muted-foreground);
1063
- }
1064
- .udb-strength__label--weak {
1065
- color: var(--color-destructive);
1066
- }
1067
- .udb-strength__label--fair {
1068
- color: var(--color-warning);
1069
- }
1070
- .udb-strength__label--good {
1071
- color: var(--color-primary);
1072
- }
1073
- .udb-strength__label--strong {
1074
- color: var(--color-success);
1075
- }
1076
- .udb-success-badge {
1077
- display: flex;
1078
- align-items: center;
1079
- justify-content: center;
1080
- width: 48px;
1081
- height: 48px;
1082
- margin: 0 auto var(--udb-space-4);
1083
- border-radius: 50%;
1084
- background: var(--color-success-soft, color-mix(in srgb, var(--color-success, #16a34a) 12%, transparent));
1085
- }
1086
- .udb-success-badge__icon {
1087
- width: 24px;
1088
- height: 24px;
1089
- color: var(--color-success);
1090
- }
1091
- .udb-steps-list {
1092
- display: flex;
1093
- flex-direction: column;
1094
- gap: var(--udb-space-3);
1095
- margin: var(--udb-space-4) 0 0;
1096
- padding: 0;
1097
- list-style: none;
1098
- }
1099
- .udb-steps-list__item {
1100
- display: flex;
1101
- align-items: flex-start;
1102
- gap: var(--udb-space-2);
1103
- font-size: var(--udb-font-size-md);
1104
- color: var(--color-foreground);
1105
- }
1106
- .udb-steps-list__icon {
1107
- width: 16px;
1108
- height: 16px;
1109
- flex-shrink: 0;
1110
- margin-top: 2px;
1111
- color: var(--color-success);
1112
- }
1113
- .udb-back-link {
1114
- display: inline-flex;
1115
- align-items: center;
1116
- gap: 6px;
1117
- margin-top: var(--udb-space-4);
1118
- border: none;
1119
- padding: 0;
1120
- background: transparent;
1121
- font-family: inherit;
1122
- font-size: var(--udb-font-size-md);
1123
- color: var(--color-muted-foreground);
1124
- cursor: pointer;
1125
- }
1126
- .udb-back-link:hover {
1127
- color: var(--color-foreground);
1128
- }
1129
- .udb-back-link__icon {
1130
- width: 14px;
1131
- height: 14px;
1132
708
  }
1133
709
  .udb-settings {
1134
710
  display: flex;
@@ -1616,42 +1192,6 @@
1616
1192
  .udb-table__td--center {
1617
1193
  text-align: center;
1618
1194
  }
1619
- .udb-org {
1620
- display: flex;
1621
- flex-direction: column;
1622
- align-items: flex-start;
1623
- line-height: 1.2;
1624
- }
1625
- .udb-org__name {
1626
- font-size: var(--udb-font-size-md);
1627
- font-weight: var(--font-weight-medium);
1628
- color: var(--color-foreground);
1629
- }
1630
- .udb-org__meta {
1631
- font-size: 10px;
1632
- text-transform: capitalize;
1633
- color: var(--color-muted-foreground);
1634
- }
1635
- .udb-org-menu {
1636
- padding: var(--udb-space-2);
1637
- }
1638
- .udb-org-menu__label {
1639
- flex: 1;
1640
- min-width: 0;
1641
- overflow: hidden;
1642
- text-overflow: ellipsis;
1643
- white-space: nowrap;
1644
- }
1645
- .udb-org-menu__check {
1646
- width: 14px;
1647
- height: 14px;
1648
- color: var(--color-primary);
1649
- }
1650
- .udb-menu__item--active {
1651
- background: var(--color-primary-soft, color-mix(in srgb, var(--color-primary, #2563eb) 10%, transparent));
1652
- color: var(--color-primary);
1653
- font-weight: var(--font-weight-medium);
1654
- }
1655
1195
  .udb-matrix__cell {
1656
1196
  display: inline-flex;
1657
1197
  align-items: center;
@@ -1,99 +0,0 @@
1
- import { BrandLogo } from "../../layouts/components";
2
- import { cn } from "@umituz/web-design-system/utils/cn";
3
- import { AUTH_KEYS } from "../utils/i18nKeys";
4
- import type { AuthLayoutProps, Translate } from "../types/auth";
5
-
6
- const DEFAULT_STRINGS: Record<string, string> = {
7
- [AUTH_KEYS.layout.backToHome]: "Back to home",
8
- [AUTH_KEYS.layout.orContinueWith]: "Or continue with",
9
- [AUTH_KEYS.layout.allRightsReserved]: "All rights reserved.",
10
- };
11
-
12
- export const AuthLayout = ({
13
- config,
14
- translate,
15
- onSocialLogin,
16
- children,
17
- }: AuthLayoutProps) => {
18
- const t: Translate = translate ?? ((key) => DEFAULT_STRINGS[key] ?? key);
19
- const homeRoute = config.homeRoute ?? config.afterLoginRoute;
20
- const footerLinks = config.footerLinks ?? [];
21
-
22
- return (
23
- <div className="udb-root udb-auth">
24
- <header className="udb-auth__header">
25
- <div className="udb-auth__brand">
26
- <BrandLogo size={32} />
27
- <span className="udb-auth__brand-name">{config.brandName}</span>
28
- </div>
29
-
30
- {homeRoute && (
31
- <a href={homeRoute} className="udb-auth__home-link">
32
- {t(AUTH_KEYS.layout.backToHome)}
33
- </a>
34
- )}
35
- </header>
36
-
37
- <main className="udb-auth__main">
38
- <div className="udb-auth__column">
39
- <div className="udb-auth__card">
40
- {config.brandTagline && (
41
- <p className="udb-auth__tagline">
42
- {config.brandTagline}
43
- </p>
44
- )}
45
-
46
- {children}
47
- </div>
48
-
49
- {config.showSocialLogin && config.socialProviders && config.socialProviders.length > 0 && (
50
- <div className="udb-auth__social">
51
- <div className="udb-divider-row">
52
- <span className="udb-divider-row__label">
53
- {t(AUTH_KEYS.layout.orContinueWith)}
54
- </span>
55
- </div>
56
-
57
- <div className="udb-social-grid">
58
- {config.socialProviders.map((provider) => (
59
- <button
60
- key={provider.id}
61
- type="button"
62
- className={cn("udb-social-btn")}
63
- onClick={() => onSocialLogin?.(provider.id)}
64
- >
65
- <span className="udb-social-btn__icon">{provider.icon}</span>
66
- <span>{provider.name}</span>
67
- </button>
68
- ))}
69
- </div>
70
- </div>
71
- )}
72
- </div>
73
- </main>
74
-
75
- <footer className="udb-auth__footer">
76
- <div className="udb-auth__footer-inner">
77
- <p>
78
- © {new Date().getFullYear()} {config.brandName}. {t(AUTH_KEYS.layout.allRightsReserved)}
79
- </p>
80
- {footerLinks.length > 0 && (
81
- <div className="udb-auth__footer-links">
82
- {footerLinks.map((link) => (
83
- <a
84
- key={link.href}
85
- href={link.href}
86
- className="udb-auth__footer-link"
87
- >
88
- {link.label}
89
- </a>
90
- ))}
91
- </div>
92
- )}
93
- </div>
94
- </footer>
95
- </div>
96
- );
97
- };
98
-
99
- export default AuthLayout;