@codebit-programando-solucoes/codebit-web-antd 1.1.40 → 1.1.43

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.
package/dist/index.cjs CHANGED
@@ -298,10 +298,11 @@ var __webpack_exports__ = {};
298
298
  LoggedMainContainer: ()=>LoggedMainContainer,
299
299
  CodebitThemeProvider: ()=>CodebitThemeProvider,
300
300
  Login: ()=>Login,
301
- useErrorModal: ()=>useErrorModal,
301
+ UserMenu: ()=>UserMenu,
302
302
  ErrorRetry: ()=>ErrorRetry,
303
303
  CodebitThemeContext: ()=>CodebitThemeContext,
304
304
  LocalLoginChangePasswordResult: ()=>LocalLoginChangePasswordResult,
305
+ useErrorModal: ()=>useErrorModal,
305
306
  ChangePassword: ()=>ChangePassword,
306
307
  ListCard: ()=>ListCard,
307
308
  ForgotPassword: ()=>ForgotPassword,
@@ -326,6 +327,9 @@ var __webpack_exports__ = {};
326
327
  logout: 'Sair',
327
328
  version: 'Versão'
328
329
  },
330
+ UserMenu: {
331
+ openMenu: 'Abrir menu do usuário'
332
+ },
329
333
  HandleError: {
330
334
  notFoundTitle: 'Página não encontrada',
331
335
  forbiddenTitle: 'Acesso negado',
@@ -391,7 +395,7 @@ var __webpack_exports__ = {};
391
395
  passwordUpperCase: 'uma letra maiúscula',
392
396
  passwordLowerCase: 'uma letra minúscula',
393
397
  passwordNumbers: 'um número',
394
- passwordSpecialChars: 'um caractere especial (!@#$%^&*)',
398
+ passwordSpecialChars: 'um caractere especial (ex: !@#$%=+)',
395
399
  passwordWeak: 'Senha fraca: Deve ter pelo menos {{requirements}}',
396
400
  passwordsNotMatch: 'As senhas digitadas não coincidem!',
397
401
  tokenInvalidTitle: 'Token inválido',
@@ -467,6 +471,9 @@ var __webpack_exports__ = {};
467
471
  logout: 'Logout',
468
472
  version: 'Version'
469
473
  },
474
+ UserMenu: {
475
+ openMenu: 'Open user menu'
476
+ },
470
477
  HandleError: {
471
478
  notFoundTitle: 'Page not found',
472
479
  forbiddenTitle: 'Access denied',
@@ -532,7 +539,7 @@ var __webpack_exports__ = {};
532
539
  passwordUpperCase: 'an uppercase letter',
533
540
  passwordLowerCase: 'a lowercase letter',
534
541
  passwordNumbers: 'a number',
535
- passwordSpecialChars: 'a special character (!@#$%^&*)',
542
+ passwordSpecialChars: 'a special character (e.g. !@#$%=+)',
536
543
  passwordWeak: 'Weak password: Must have at least {{requirements}}',
537
544
  passwordsNotMatch: 'The passwords do not match!',
538
545
  tokenInvalidTitle: 'Invalid Token',
@@ -613,7 +620,7 @@ var __webpack_exports__ = {};
613
620
  const codebit_web_namespaceObject = require("@codebit-programando-solucoes/codebit-web");
614
621
  const logger = new codebit_web_namespaceObject.Logger('CodebitConfigContext');
615
622
  const CodebitConfigContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
616
- function CodebitConfigProvider({ children, menuItems, version = '1.0', showVersion = ()=>true, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, doLogout, checkLogin, onMenuClick }) {
623
+ function CodebitConfigProvider({ children, menuItems, version = '1.0', showVersion = ()=>true, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, userMenuItems, doLogout, checkLogin, onMenuClick }) {
617
624
  const [isLogged, setIsLogged] = (0, external_react_.useState)(null);
618
625
  const [user, setUser] = (0, external_react_.useState)(null);
619
626
  const logout = async ()=>{
@@ -658,6 +665,7 @@ var __webpack_exports__ = {};
658
665
  secondarySidebar,
659
666
  secondarySidebarWidth,
660
667
  bottomMenuItems,
668
+ userMenuItems,
661
669
  onMenuClick
662
670
  }), [
663
671
  menuItems,
@@ -668,6 +676,7 @@ var __webpack_exports__ = {};
668
676
  secondarySidebar,
669
677
  secondarySidebarWidth,
670
678
  bottomMenuItems,
679
+ userMenuItems,
671
680
  onMenuClick
672
681
  ]);
673
682
  return /*#__PURE__*/ (0, jsx_runtime.jsx)(CodebitConfigContext.Provider, {
@@ -683,10 +692,188 @@ var __webpack_exports__ = {};
683
692
  secondarySidebar: external_prop_types_default().func,
684
693
  secondarySidebarWidth: external_prop_types_default().number,
685
694
  bottomMenuItems: external_prop_types_default().func,
695
+ userMenuItems: external_prop_types_default().func,
686
696
  doLogout: external_prop_types_default().func.isRequired,
687
697
  checkLogin: external_prop_types_default().func.isRequired,
688
698
  onMenuClick: external_prop_types_default().func
689
699
  };
700
+ const CodebitThemeContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
701
+ const DEFAULT_THEME_COLORS = {
702
+ primary: {
703
+ light: '#29D266',
704
+ dark: '#3F6F53'
705
+ },
706
+ primaryHover: {
707
+ light: '#3FE67F',
708
+ dark: '#6DB589'
709
+ },
710
+ primaryActive: {
711
+ light: '#1FBF4D',
712
+ dark: '#4A8361'
713
+ },
714
+ selectedText: {
715
+ light: '#FAFAFA',
716
+ dark: '#FAFAFA'
717
+ },
718
+ siderBg: {
719
+ light: '#001529',
720
+ dark: '#1a1a1a'
721
+ }
722
+ };
723
+ const CodebitThemeProvider = ({ children, storeThemeInLocalStorage = true, containerId = 'root', forcedTheme = null, colors = {}, ...props })=>{
724
+ const hasLoaded = (0, external_react_.useRef)(false);
725
+ const [isDarkMode, setIsDarkMode] = (0, external_react_.useState)(()=>{
726
+ if (forcedTheme) return 'dark' === forcedTheme;
727
+ try {
728
+ if (storeThemeInLocalStorage) {
729
+ const savedTheme = localStorage?.getItem('theme');
730
+ if (null !== savedTheme) return 'dark' === savedTheme;
731
+ }
732
+ return globalThis.matchMedia?.('(prefers-color-scheme: dark)')?.matches ?? false;
733
+ } finally{
734
+ hasLoaded.current = true;
735
+ }
736
+ });
737
+ (0, external_react_.useEffect)(()=>{
738
+ if (forcedTheme) {
739
+ const mode = 'dark' === forcedTheme;
740
+ setIsDarkMode(mode);
741
+ }
742
+ }, [
743
+ forcedTheme
744
+ ]);
745
+ const toggleTheme = ()=>{
746
+ setIsDarkMode((prev)=>!prev);
747
+ };
748
+ const resolvedColors = (0, external_react_.useMemo)(()=>({
749
+ primary: {
750
+ ...DEFAULT_THEME_COLORS.primary,
751
+ ...colors.primary
752
+ },
753
+ primaryHover: {
754
+ ...DEFAULT_THEME_COLORS.primaryHover,
755
+ ...colors.primaryHover
756
+ },
757
+ primaryActive: {
758
+ ...DEFAULT_THEME_COLORS.primaryActive,
759
+ ...colors.primaryActive
760
+ },
761
+ selectedText: {
762
+ ...DEFAULT_THEME_COLORS.selectedText,
763
+ ...colors.selectedText
764
+ },
765
+ siderBg: {
766
+ ...DEFAULT_THEME_COLORS.siderBg,
767
+ ...colors.siderBg
768
+ }
769
+ }), [
770
+ colors
771
+ ]);
772
+ (0, external_react_.useEffect)(()=>{
773
+ const target = document.getElementById(containerId);
774
+ if (!target) return;
775
+ if (isDarkMode) {
776
+ document.documentElement.classList.add('dark-theme');
777
+ target.classList.add('dark-theme');
778
+ } else {
779
+ document.documentElement.classList.remove('dark-theme');
780
+ target.classList.remove('dark-theme');
781
+ }
782
+ document.documentElement.style.setProperty('--color-primary', resolvedColors.primary[isDarkMode ? 'dark' : 'light']);
783
+ }, [
784
+ isDarkMode,
785
+ containerId,
786
+ resolvedColors
787
+ ]);
788
+ (0, external_react_.useEffect)(()=>{
789
+ if (hasLoaded.current && storeThemeInLocalStorage) localStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
790
+ if (hasLoaded.current && storeThemeInLocalStorage && !forcedTheme) localStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
791
+ }, [
792
+ isDarkMode,
793
+ storeThemeInLocalStorage,
794
+ forcedTheme
795
+ ]);
796
+ const themeContextValue = (0, external_react_.useMemo)(()=>({
797
+ isDarkMode,
798
+ toggleTheme,
799
+ setIsDarkMode
800
+ }), [
801
+ isDarkMode
802
+ ]);
803
+ return /*#__PURE__*/ (0, jsx_runtime.jsx)(CodebitThemeContext.Provider, {
804
+ value: themeContextValue,
805
+ children: /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.ConfigProvider, {
806
+ theme: {
807
+ algorithm: isDarkMode ? external_antd_namespaceObject.theme.darkAlgorithm : external_antd_namespaceObject.theme.defaultAlgorithm,
808
+ token: {
809
+ colorPrimary: resolvedColors.primary[isDarkMode ? 'dark' : 'light'],
810
+ colorInfo: resolvedColors.primary[isDarkMode ? 'dark' : 'light'],
811
+ colorLink: resolvedColors.primary[isDarkMode ? 'dark' : 'light']
812
+ },
813
+ components: {
814
+ Menu: {
815
+ itemSelectedBg: resolvedColors.primary[isDarkMode ? 'dark' : 'light'],
816
+ itemSelectedColor: resolvedColors.selectedText.light,
817
+ darkItemSelectedBg: resolvedColors.primary[isDarkMode ? 'dark' : 'light'],
818
+ darkItemSelectedColor: resolvedColors.selectedText.dark
819
+ },
820
+ Button: {
821
+ colorPrimary: resolvedColors.primary[isDarkMode ? 'dark' : 'light'],
822
+ colorPrimaryHover: resolvedColors.primaryHover[isDarkMode ? 'dark' : 'light'],
823
+ colorPrimaryActive: resolvedColors.primaryActive[isDarkMode ? 'dark' : 'light']
824
+ },
825
+ Layout: {
826
+ siderBg: resolvedColors.siderBg[isDarkMode ? 'dark' : 'light'],
827
+ triggerBg: resolvedColors.primary[isDarkMode ? 'dark' : 'light'],
828
+ triggerColor: resolvedColors.selectedText[isDarkMode ? 'dark' : 'light']
829
+ },
830
+ Header: {
831
+ colorPrimary: resolvedColors.primary[isDarkMode ? 'dark' : 'light']
832
+ }
833
+ }
834
+ },
835
+ ...props,
836
+ children: [
837
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(CssTokenBridge, {
838
+ containerId: containerId
839
+ }),
840
+ children
841
+ ]
842
+ })
843
+ });
844
+ };
845
+ CodebitThemeProvider.propTypes = {
846
+ children: external_prop_types_default().node.isRequired,
847
+ storeThemeInLocalStorage: external_prop_types_default().bool,
848
+ containerId: external_prop_types_default().string,
849
+ forcedTheme: external_prop_types_default().oneOf([
850
+ 'dark',
851
+ 'light',
852
+ null
853
+ ]),
854
+ colors: external_prop_types_default().shape({
855
+ primary: external_prop_types_default().shape({
856
+ light: external_prop_types_default().string,
857
+ dark: external_prop_types_default().string
858
+ }),
859
+ primaryHover: external_prop_types_default().shape({
860
+ light: external_prop_types_default().string,
861
+ dark: external_prop_types_default().string
862
+ }),
863
+ primaryActive: external_prop_types_default().shape({
864
+ light: external_prop_types_default().string,
865
+ dark: external_prop_types_default().string
866
+ }),
867
+ selectedText: external_prop_types_default().shape({
868
+ light: external_prop_types_default().string,
869
+ dark: external_prop_types_default().string
870
+ }),
871
+ siderBg: external_prop_types_default().shape({
872
+ light: external_prop_types_default().string,
873
+ dark: external_prop_types_default().string
874
+ })
875
+ })
876
+ };
690
877
  const ThemeToggle = ()=>{
691
878
  const config = (0, external_react_.useContext)(CodebitThemeContext);
692
879
  if (!config) throw new Error('ThemeToggle must be used within CodebitThemeContext');
@@ -725,533 +912,960 @@ var __webpack_exports__ = {};
725
912
  const useCodebitWebAntdTranslation = ()=>(0, external_react_i18next_namespaceObject.useTranslation)('codebitWebAntd', {
726
913
  i18n: i18n
727
914
  });
728
- function useErrorMessage() {
729
- const { t } = useCodebitWebAntdTranslation();
730
- const getErrorMessage = (error)=>{
731
- let status = 'error';
732
- const responseStatus = error?.response?.status || null;
733
- let errorMessage = t('Error.defaultError');
734
- let retryText = t('Error.retryButton');
735
- let onRetryAction = null;
736
- if (error?.errorCode) switch(error.errorCode){
737
- case codebit_web_namespaceObject.ErrorCode.ERR_NETWORK:
738
- errorMessage = t('Error.networkError');
739
- break;
740
- case codebit_web_namespaceObject.ErrorCode.ERR_TIMEOUT:
741
- errorMessage = t('Error.timeoutError');
742
- break;
743
- }
744
- else if (responseStatus) switch(responseStatus){
745
- case 400:
746
- errorMessage = t('Error.badRequestError');
747
- break;
748
- case 403:
749
- errorMessage = t('Error.forbiddenError');
750
- retryText = t('Error.reloadPageButton');
751
- status = 403;
752
- onRetryAction = ()=>{
753
- globalThis.location.reload();
754
- };
755
- break;
756
- case 404:
757
- errorMessage = t('Error.notFoundError');
758
- status = 404;
759
- break;
760
- case 500:
761
- errorMessage = t('Error.internalServerError');
762
- status = 500;
763
- break;
764
- case 401:
765
- errorMessage = t('Error.sessionExpiredError');
766
- retryText = t('Error.reloadPageButton');
767
- onRetryAction = ()=>{
768
- globalThis.location.reload();
769
- };
770
- break;
771
- }
772
- return {
773
- errorMessage,
774
- status,
775
- retryText,
776
- onRetryAction
777
- };
778
- };
779
- return {
780
- getErrorMessage
781
- };
782
- }
783
- const ErrorRetry_logger = new codebit_web_namespaceObject.Logger('ErrorRetry');
784
- function ErrorRetry({ error, onRetry }) {
785
- if (error && error instanceof Error) {
786
- ErrorRetry_logger.error('Fail to load.', error);
787
- react_namespaceObject.captureException(error);
788
- }
789
- const { getErrorMessage } = useErrorMessage();
790
- const { status, errorMessage, retryText, onRetryAction } = getErrorMessage(error);
791
- return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Card, {
792
- children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Result, {
793
- status: status,
794
- title: errorMessage,
795
- extra: [
796
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
797
- type: 'primary',
798
- onClick: onRetryAction ?? onRetry,
799
- icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.ReloadOutlined, {}),
800
- children: retryText
801
- }, 'retry')
802
- ]
803
- })
804
- });
805
- }
806
- ErrorRetry.propTypes = {
807
- error: external_prop_types_default().object.isRequired,
808
- onRetry: external_prop_types_default().func.isRequired
809
- };
810
- const ListCard_module = {
811
- listCard: "listCard-ISftFd",
812
- headerRow: "headerRow-UsZAzP",
813
- actions: "actions-ig53s2",
814
- filtersRow: "filtersRow-f3Xk5a",
815
- expandArea: "expandArea-czOoFS"
915
+ const UserMenu_module = {
916
+ trigger: "trigger-tlcps4",
917
+ avatar: "avatar-Tmnqa_",
918
+ caret: "caret-OWS8_0",
919
+ panel: "panel-GCcfCo",
920
+ userInfo: "userInfo-fDuDn1",
921
+ userName: "userName-sIs1iq",
922
+ userSubtitle: "userSubtitle-Fflhaw",
923
+ divider: "divider-JJjJVy",
924
+ menu: "menu-cuORr_"
816
925
  };
817
- const { Title } = external_antd_namespaceObject.Typography;
818
- function ListCard({ title, onClearFilters, headerContainer, tableContainer, actions }) {
819
- const { token } = external_antd_namespaceObject.theme.useToken();
820
- const { t } = (0, external_react_i18next_namespaceObject.useTranslation)('codebitWebAntd');
821
- const margin = token['margin'];
822
- return /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Card, {
823
- className: ListCard_module.listCard,
926
+ const OPEN_KEYS = new Set([
927
+ 'Enter',
928
+ ' '
929
+ ]);
930
+ const { Text } = external_antd_namespaceObject.Typography;
931
+ function getInitials(name) {
932
+ const parts = name?.trim().split(/\s+/).filter(Boolean) ?? [];
933
+ if (0 === parts.length) return '';
934
+ const first = [
935
+ ...parts[0]
936
+ ];
937
+ if (1 === parts.length) return first.slice(0, 2).join('').toUpperCase();
938
+ const last = [
939
+ ...parts.at(-1)
940
+ ];
941
+ return `${first[0]}${last[0]}`.toUpperCase();
942
+ }
943
+ function UserMenuPanel({ user, items, onItemClick }) {
944
+ return /*#__PURE__*/ (0, jsx_runtime.jsxs)("div", {
945
+ className: UserMenu_module.panel,
824
946
  children: [
825
- /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Row, {
826
- gutter: margin,
827
- align: 'middle',
828
- className: ListCard_module.headerRow,
947
+ /*#__PURE__*/ (0, jsx_runtime.jsxs)("div", {
948
+ className: UserMenu_module.userInfo,
829
949
  children: [
830
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Col, {
831
- xs: 24,
832
- sm: 24,
833
- md: 12,
834
- children: /*#__PURE__*/ (0, jsx_runtime.jsx)(Title, {
835
- level: 4,
836
- children: title
837
- })
950
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(Text, {
951
+ className: UserMenu_module.userName,
952
+ strong: true,
953
+ children: user?.name
838
954
  }),
839
- (!!onClearFilters || !!actions) && /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Col, {
840
- xs: 24,
841
- sm: 24,
842
- md: 12,
843
- className: ListCard_module.actions,
844
- children: [
845
- !!onClearFilters && /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
846
- icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.ClearOutlined, {}),
847
- onClick: onClearFilters,
848
- children: t('ListCard.clearFilters')
849
- }),
850
- actions
851
- ]
955
+ user?.subtitle && /*#__PURE__*/ (0, jsx_runtime.jsx)(Text, {
956
+ className: UserMenu_module.userSubtitle,
957
+ type: 'secondary',
958
+ children: user.subtitle
852
959
  })
853
960
  ]
854
961
  }),
855
- !!headerContainer && /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Row, {
856
- gutter: margin,
857
- className: ListCard_module.filtersRow,
858
- children: headerContainer
962
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Divider, {
963
+ className: UserMenu_module.divider
859
964
  }),
860
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Layout, {
861
- className: ListCard_module.expandArea,
862
- children: tableContainer
965
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Menu, {
966
+ className: UserMenu_module.menu,
967
+ items: items,
968
+ onClick: ({ key })=>onItemClick?.(key)
863
969
  })
864
970
  ]
865
971
  });
866
972
  }
867
- ListCard.propTypes = {
868
- title: external_prop_types_default().string.isRequired,
869
- onClearFilters: external_prop_types_default().func,
870
- headerContainer: external_prop_types_default().node,
871
- tableContainer: external_prop_types_default().node,
872
- actions: external_prop_types_default().node
873
- };
874
- ListCard.defaultProps = {
875
- onClearFilters: null,
876
- headerContainer: null,
877
- tableContainer: null,
878
- actions: null
973
+ UserMenuPanel.propTypes = {
974
+ user: external_prop_types_default().shape({
975
+ name: external_prop_types_default().string,
976
+ subtitle: external_prop_types_default().string
977
+ }),
978
+ items: external_prop_types_default().arrayOf(external_prop_types_default().object).isRequired,
979
+ onItemClick: external_prop_types_default().func
879
980
  };
880
- const CssTokenBridge = ({ containerId })=>{
881
- const { token } = external_antd_namespaceObject.theme.useToken();
882
- (0, external_react_.useLayoutEffect)(()=>{
883
- const root = containerId ? document.getElementById(containerId) ?? document.documentElement : document.documentElement;
884
- root.style.setProperty('--antd-color-bg-base', token['colorBgBase']);
885
- root.style.setProperty('--antd-color-bg-container', token['colorBgContainer']);
886
- root.style.setProperty('--antd-color-bg-elevated', token['colorBgElevated']);
887
- root.style.setProperty('--antd-color-bg-layout', token['colorBgLayout']);
888
- root.style.setProperty('--antd-color-bg-mask', token['colorBgMask']);
889
- root.style.setProperty('--antd-color-bg-spotlight', token['colorBgSpotlight']);
890
- root.style.setProperty('--antd-color-primary', token['colorPrimary']);
891
- root.style.setProperty('--antd-color-success', token['colorSuccess']);
892
- root.style.setProperty('--antd-color-success-bg', token['colorSuccessBg']);
893
- root.style.setProperty('--antd-color-success-border', token['colorSuccessBorder']);
894
- root.style.setProperty('--antd-color-success-text', token['colorSuccessText']);
895
- root.style.setProperty('--antd-color-warning', token['colorWarning']);
896
- root.style.setProperty('--antd-color-warning-bg', token['colorWarningBg']);
897
- root.style.setProperty('--antd-color-warning-border', token['colorWarningBorder']);
898
- root.style.setProperty('--antd-color-warning-text', token['colorWarningText']);
899
- root.style.setProperty('--antd-color-error', token['colorError']);
900
- root.style.setProperty('--antd-color-error-bg', token['colorErrorBg']);
901
- root.style.setProperty('--antd-color-error-border', token['colorErrorBorder']);
902
- root.style.setProperty('--antd-color-error-text', token['colorErrorText']);
903
- root.style.setProperty('--antd-color-info', token['colorInfo']);
904
- root.style.setProperty('--antd-color-info-bg', token['colorInfoBg']);
905
- root.style.setProperty('--antd-color-info-border', token['colorInfoBorder']);
906
- root.style.setProperty('--antd-color-info-text', token['colorInfoText']);
907
- root.style.setProperty('--antd-color-text', token['colorText']);
908
- root.style.setProperty('--antd-color-text-secondary', token['colorTextSecondary']);
909
- root.style.setProperty('--antd-color-text-tertiary', token['colorTextTertiary']);
910
- root.style.setProperty('--antd-color-text-quaternary', token['colorTextQuaternary']);
911
- root.style.setProperty('--antd-color-text-disabled', token['colorTextDisabled']);
912
- root.style.setProperty('--antd-color-border', token['colorBorder']);
913
- root.style.setProperty('--antd-color-border-secondary', token['colorBorderSecondary']);
914
- root.style.setProperty('--antd-color-border-hover', token['colorBorderHover']);
915
- root.style.setProperty('--antd-color-border-secondary-hover', token['colorBorderSecondaryHover']);
916
- root.style.setProperty('--antd-color-border-disabled', token['colorBorderDisabled']);
917
- root.style.setProperty('--antd-color-split', token['colorSplit']);
918
- root.style.setProperty('--antd-color-link', token['colorLink']);
919
- root.style.setProperty('--antd-color-link-hover', token['colorLinkHover']);
920
- root.style.setProperty('--antd-color-link-active', token['colorLinkActive']);
921
- root.style.setProperty('--antd-color-fill', token['colorFill']);
922
- root.style.setProperty('--antd-color-fill-secondary', token['colorFillSecondary']);
923
- root.style.setProperty('--antd-color-fill-tertiary', token['colorFillTertiary']);
924
- root.style.setProperty('--antd-color-fill-quaternary', token['colorFillQuaternary']);
925
- root.style.setProperty('--antd-color-fill-content', token['colorFillContent']);
926
- root.style.setProperty('--antd-color-fill-content-hover', token['colorFillContentHover']);
927
- root.style.setProperty('--antd-color-fill-content-selected', token['colorFillContentSelected']);
928
- root.style.setProperty('--antd-color-fill-alter', token['colorFillAlter']);
929
- root.style.setProperty('--antd-color-fill-alter-hover', token['colorFillAlterHover']);
930
- root.style.setProperty('--antd-color-fill-alter-active', token['colorFillAlterActive']);
931
- root.style.setProperty('--antd-color-fill-alter-selected', token['colorFillAlterSelected']);
932
- root.style.setProperty('--antd-color-fill-alter-disabled', token['colorFillAlterDisabled']);
933
- root.style.setProperty('--antd-color-white', token['colorWhite']);
934
- root.style.setProperty('--antd-color-black', token['colorBlack']);
935
- root.style.setProperty('--antd-margin-xxs', `${token['marginXXS']}px`);
936
- root.style.setProperty('--antd-margin-xs', `${token['marginXS']}px`);
937
- root.style.setProperty('--antd-margin-sm', `${token['marginSM']}px`);
938
- root.style.setProperty('--antd-margin', `${token['margin']}px`);
939
- root.style.setProperty('--antd-margin-md', `${token['marginMD']}px`);
940
- root.style.setProperty('--antd-margin-lg', `${token['marginLG']}px`);
941
- root.style.setProperty('--antd-margin-xl', `${token['marginXL']}px`);
942
- root.style.setProperty('--antd-margin-xxl', `${token['marginXXL']}px`);
943
- root.style.setProperty('--antd-padding-xxs', `${token['paddingXXS']}px`);
944
- root.style.setProperty('--antd-padding-xs', `${token['paddingXS']}px`);
945
- root.style.setProperty('--antd-padding-sm', `${token['paddingSM']}px`);
946
- root.style.setProperty('--antd-padding', `${token['padding']}px`);
947
- root.style.setProperty('--antd-padding-md', `${token['paddingMD']}px`);
948
- root.style.setProperty('--antd-padding-lg', `${token['paddingLG']}px`);
949
- root.style.setProperty('--antd-padding-xl', `${token['paddingXL']}px`);
950
- root.style.setProperty('--antd-font-size-xxs', '8px');
951
- root.style.setProperty('--antd-font-size-xs', '10px');
952
- root.style.setProperty('--antd-font-size-sm', `${token['fontSizeSM']}px`);
953
- root.style.setProperty('--antd-font-size', `${token['fontSize']}px`);
954
- root.style.setProperty('--antd-font-size-lg', `${token['fontSizeLG']}px`);
955
- root.style.setProperty('--antd-font-size-xl', `${token['fontSizeXL']}px`);
956
- root.style.setProperty('--antd-font-size-xxl', `${token['fontSizeXXL']}px`);
957
- root.style.setProperty('--antd-font-size-heading1', `${token['fontSizeHeading1']}px`);
958
- root.style.setProperty('--antd-font-size-heading2', `${token['fontSizeHeading2']}px`);
959
- root.style.setProperty('--antd-font-size-heading3', `${token['fontSizeHeading3']}px`);
960
- root.style.setProperty('--antd-font-size-heading4', `${token['fontSizeHeading4']}px`);
961
- root.style.setProperty('--antd-font-size-heading5', `${token['fontSizeHeading5']}px`);
962
- root.style.setProperty('--antd-line-height', token['lineHeight']);
963
- root.style.setProperty('--antd-line-height-lg', token['lineHeightLG']);
964
- root.style.setProperty('--antd-control-height-sm', `${token['controlHeightSM']}px`);
965
- root.style.setProperty('--antd-control-height', `${token['controlHeight']}px`);
966
- root.style.setProperty('--antd-control-height-lg', `${token['controlHeightLG']}px`);
967
- root.style.setProperty('--antd-border-radius-sm', `${token['borderRadiusSM']}px`);
968
- root.style.setProperty('--antd-border-radius', `${token['borderRadius']}px`);
969
- root.style.setProperty('--antd-border-radius-lg', `${token['borderRadiusLG']}px`);
970
- }, [
971
- containerId,
972
- token
973
- ]);
974
- return null;
975
- };
976
- CssTokenBridge.propTypes = {
977
- containerId: external_prop_types_default().string
978
- };
979
- const TableContainer_module = {
980
- tableContainer: "tableContainer-EhNwOm"
981
- };
982
- function isPaginationNode(node) {
983
- if (node.nodeType !== Node.ELEMENT_NODE) return false;
984
- const element = node;
985
- return element.classList?.contains('ant-table-pagination') || element.querySelector?.('.ant-table-pagination');
986
- }
987
- function hasPaginationInMutation(mutation) {
988
- return Array.from(mutation.addedNodes).some(isPaginationNode);
989
- }
990
- function TableContainer({ children }) {
991
- const containerRef = (0, external_react_.useRef)(null);
992
- const containerHeightRef = (0, external_react_.useRef)(null);
993
- const [scrollY, setScrollY] = (0, external_react_.useState)(void 0);
994
- (0, external_react_.useLayoutEffect)(()=>{
995
- const calculateHeights = ()=>{
996
- if (!containerRef.current) return;
997
- containerHeightRef.current = containerRef.current.offsetHeight;
998
- const thead = containerRef.current.querySelector('thead');
999
- let theadHeight = 0;
1000
- if (thead) {
1001
- const rect = thead.getBoundingClientRect();
1002
- const styles = globalThis.getComputedStyle(thead);
1003
- const marginTop = Number.parseFloat(styles.marginTop) || 0;
1004
- const marginBottom = Number.parseFloat(styles.marginBottom) || 0;
1005
- theadHeight = rect.height + marginTop + marginBottom;
1006
- }
1007
- const pagination = containerRef.current.querySelector('.ant-table-pagination');
1008
- let paginationHeight = 0;
1009
- if (pagination) {
1010
- const rect = pagination.getBoundingClientRect();
1011
- const styles = globalThis.getComputedStyle(pagination);
1012
- const marginTop = Number.parseFloat(styles.marginTop) || 0;
1013
- const marginBottom = Number.parseFloat(styles.marginBottom) || 0;
1014
- paginationHeight = rect.height + marginTop + marginBottom;
1015
- }
1016
- const availableHeight = Math.ceil(containerHeightRef.current) - Math.ceil(theadHeight) - Math.ceil(paginationHeight) - 1;
1017
- setScrollY(availableHeight);
1018
- };
1019
- calculateHeights();
1020
- const observer = new MutationObserver((mutations)=>{
1021
- const hasPagination = mutations.some(hasPaginationInMutation);
1022
- if (hasPagination) calculateHeights();
1023
- });
1024
- if (containerRef.current) observer.observe(containerRef.current, {
1025
- childList: true,
1026
- subtree: true
981
+ function createPopupRender(user, items, onItemClick) {
982
+ return ()=>/*#__PURE__*/ (0, jsx_runtime.jsx)(UserMenuPanel, {
983
+ user: user,
984
+ items: items,
985
+ onItemClick: onItemClick
1027
986
  });
1028
- globalThis.addEventListener('resize', calculateHeights);
1029
- return ()=>{
1030
- observer.disconnect();
1031
- globalThis.removeEventListener('resize', calculateHeights);
1032
- };
1033
- }, []);
1034
- const enhancedChildren = scrollY ? /*#__PURE__*/ (0, external_react_.cloneElement)(children, {
1035
- scroll: {
1036
- ...children.props?.scroll,
1037
- y: scrollY,
1038
- x: 'max-content'
1039
- }
1040
- }) : children;
1041
- return /*#__PURE__*/ (0, jsx_runtime.jsx)("div", {
1042
- ref: containerRef,
1043
- className: TableContainer_module.tableContainer,
1044
- children: enhancedChildren
1045
- });
1046
987
  }
1047
- TableContainer.propTypes = {
1048
- children: external_prop_types_default().element.isRequired
1049
- };
1050
- function FilterContainer({ children, ...props }) {
1051
- const { token } = external_antd_namespaceObject.theme.useToken();
1052
- return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Card, {
1053
- styles: {
1054
- body: {
1055
- padding: token['paddingXS'] + 'px'
1056
- }
1057
- },
1058
- ...props,
1059
- children: children
988
+ function UserMenu({ user, items = [], onItemClick, caretIcon = /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.DownOutlined, {}) }) {
989
+ const { t } = useCodebitWebAntdTranslation();
990
+ const [open, setOpen] = (0, external_react_.useState)(false);
991
+ const initials = getInitials(user?.name);
992
+ const handleItemClick = (key)=>{
993
+ setOpen(false);
994
+ onItemClick?.(key);
995
+ };
996
+ const avatar = /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Avatar, {
997
+ className: UserMenu_module.avatar,
998
+ children: initials || /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.UserOutlined, {})
999
+ });
1000
+ if (!items.length) return avatar;
1001
+ return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Dropdown, {
1002
+ trigger: [
1003
+ 'click'
1004
+ ],
1005
+ open: open,
1006
+ onOpenChange: setOpen,
1007
+ placement: 'bottomRight',
1008
+ popupRender: createPopupRender(user, items, handleItemClick),
1009
+ children: /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Space, {
1010
+ className: UserMenu_module.trigger,
1011
+ role: 'button',
1012
+ tabIndex: 0,
1013
+ "aria-haspopup": 'menu',
1014
+ "aria-expanded": open,
1015
+ "aria-label": t('UserMenu.openMenu'),
1016
+ onKeyDown: (event)=>{
1017
+ if (!OPEN_KEYS.has(event.key)) return;
1018
+ event.preventDefault();
1019
+ setOpen((wasOpen)=>!wasOpen);
1020
+ },
1021
+ children: [
1022
+ avatar,
1023
+ /*#__PURE__*/ (0, jsx_runtime.jsx)("span", {
1024
+ className: UserMenu_module.caret,
1025
+ children: caretIcon
1026
+ })
1027
+ ]
1028
+ })
1060
1029
  });
1061
1030
  }
1062
- FilterContainer.propTypes = {
1063
- children: external_prop_types_default().node.isRequired,
1064
- ...external_antd_namespaceObject.Card.propTypes
1031
+ UserMenu.propTypes = {
1032
+ user: external_prop_types_default().shape({
1033
+ name: external_prop_types_default().string,
1034
+ email: external_prop_types_default().string,
1035
+ id: external_prop_types_default().string,
1036
+ roles: external_prop_types_default().arrayOf(external_prop_types_default().string),
1037
+ subtitle: external_prop_types_default().string
1038
+ }),
1039
+ items: external_prop_types_default().arrayOf(external_prop_types_default().object),
1040
+ onItemClick: external_prop_types_default().func,
1041
+ caretIcon: external_prop_types_default().node
1065
1042
  };
1066
- const external_date_fns_namespaceObject = require("date-fns");
1067
- const AudioPlayer_module = {
1068
- audioPlayer: "audioPlayer-a4xARM",
1069
- durationTimeContainer: "durationTimeContainer-kmkK6M",
1070
- slider: "slider-bdta4v"
1043
+ const LoggedMainContainer_module = {
1044
+ layout: "layout-mL5o6I",
1045
+ drawer: "drawer-oj0mJX",
1046
+ drawerBody: "drawerBody-YtAN37",
1047
+ drawerFlex: "drawerFlex-AGTAax",
1048
+ sider: "sider-BDy1Bs",
1049
+ siderLayout: "siderLayout-C8H0uI",
1050
+ secondarySidebar: "secondarySidebar-P6J_Xn",
1051
+ menu: "menu-KMvPt7",
1052
+ menuContainer: "menuContainer-ahnhBu",
1053
+ menuLabel: "menuLabel-csBJTc",
1054
+ menuDescription: "menuDescription-d6BFBO",
1055
+ menuSpacer: "menuSpacer-RIB3II",
1056
+ versionMenu: "versionMenu-NM4uyG",
1057
+ bottomMenu: "bottomMenu-VtOktS",
1058
+ header: "header-vgc67L",
1059
+ mobile: "mobile-mKGxb5",
1060
+ headerSpace: "headerSpace-Fd_iha",
1061
+ headerDivider: "headerDivider-yfEwNN",
1062
+ content: "content-OZHp2h"
1071
1063
  };
1072
- const AudioPlayer = ({ audioUrl })=>{
1073
- const [isMuted, setIsMuted] = (0, external_react_.useState)(false);
1074
- const [duration, setDuration] = (0, external_react_.useState)(0);
1075
- const [currentTime, setCurrentTime] = (0, external_react_.useState)(0);
1076
- const [isPlaying, setIsPlaying] = (0, external_react_.useState)(false);
1064
+ const { Header, Sider, Content } = external_antd_namespaceObject.Layout;
1065
+ const { Text: LoggedMainContainer_Text } = external_antd_namespaceObject.Typography;
1066
+ const MENU_KEY_APP_LOGOUT = 'app-logout';
1067
+ function filterMenuItemsByRole(items, user) {
1068
+ return items.filter((item)=>{
1069
+ if (!item.roles) return true;
1070
+ if (!user?.roles) return false;
1071
+ return item.roles.some((role)=>user.roles.includes(role));
1072
+ });
1073
+ }
1074
+ function LoggedMainContainer({ children }) {
1075
+ const [collapsed, setCollapsed] = (0, external_react_.useState)(true);
1076
+ const [isMobile, setIsMobile] = (0, external_react_.useState)(false);
1077
+ const [drawerVisible, setDrawerVisible] = (0, external_react_.useState)(false);
1078
+ const [secondarySidebarDrawerVisible, setSecondarySidebarDrawerVisible] = (0, external_react_.useState)(false);
1077
1079
  const { t } = useCodebitWebAntdTranslation();
1078
- const audioRef = (0, external_react_.useRef)(null);
1079
- const hasSource = !!audioUrl;
1080
- const formatTime = (seconds)=>{
1081
- const sec = Math.max(0, Math.floor(seconds));
1082
- const date = (0, external_date_fns_namespaceObject.addSeconds)(new Date(0), sec);
1083
- const h = Math.floor(sec / 3600);
1084
- const timeFormat = h > 0 ? 'H:mm:ss' : 'm:ss';
1085
- return (0, external_date_fns_namespaceObject.format)(date, timeFormat);
1086
- };
1087
- const togglePlay = async ()=>{
1088
- if (!audioRef.current || !hasSource) return;
1089
- if (audioRef.current.paused) {
1090
- await audioRef.current.play();
1091
- setIsPlaying(true);
1092
- } else {
1093
- audioRef.current.pause();
1094
- setIsPlaying(false);
1095
- }
1096
- };
1097
- const toggleMute = ()=>{
1098
- if (!audioRef.current) return;
1099
- audioRef.current.muted = !audioRef.current.muted;
1100
- setIsMuted(audioRef.current.muted);
1101
- };
1102
- const handleSliderChange = (value)=>{
1103
- if (!audioRef.current) return;
1104
- const safeValue = Math.min(Math.round(value), Math.round(duration));
1105
- audioRef.current.currentTime = safeValue;
1106
- setCurrentTime(safeValue);
1107
- };
1080
+ const configCodebit = (0, external_react_.useContext)(CodebitConfigContext);
1081
+ const configTheme = (0, external_react_.useContext)(CodebitThemeContext);
1082
+ const navigate = (0, external_react_router_namespaceObject.useNavigate)();
1083
+ const location = (0, external_react_router_namespaceObject.useLocation)();
1084
+ if (!configCodebit || !configTheme) throw new Error('LoggedContainer must be used within CodebitConfigProvider and CodebitThemeContext');
1085
+ const { logout, user, menuItems, version, showVersion, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, userMenuItems, onMenuClick } = configCodebit;
1086
+ const { isDarkMode } = configTheme;
1087
+ const theme = isDarkMode ? 'dark' : 'light';
1088
+ const allMenuItems = (0, external_react_.useMemo)(()=>[
1089
+ ...menuItems(user),
1090
+ ...bottomMenuItems?.(user) ?? []
1091
+ ], [
1092
+ menuItems,
1093
+ user,
1094
+ bottomMenuItems
1095
+ ]);
1096
+ const filteredMenuItems = (0, external_react_.useMemo)(()=>filterMenuItemsByRole(menuItems(user), user), [
1097
+ menuItems,
1098
+ user
1099
+ ]);
1100
+ const filteredBottomMenuItems = (0, external_react_.useMemo)(()=>{
1101
+ if (!bottomMenuItems) return [];
1102
+ return filterMenuItemsByRole(bottomMenuItems(user), user);
1103
+ }, [
1104
+ bottomMenuItems,
1105
+ user
1106
+ ]);
1107
+ const filteredUserMenuItems = (0, external_react_.useMemo)(()=>{
1108
+ if (!userMenuItems) return [];
1109
+ return filterMenuItemsByRole(userMenuItems(user), user);
1110
+ }, [
1111
+ userMenuItems,
1112
+ user
1113
+ ]);
1114
+ const memoizedBottomMenuItems = (0, external_react_.useMemo)(()=>[
1115
+ ...filteredBottomMenuItems,
1116
+ {
1117
+ key: MENU_KEY_APP_LOGOUT,
1118
+ icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.LogoutOutlined, {}),
1119
+ label: t('LoggedMainContainer.logout'),
1120
+ danger: true
1121
+ }
1122
+ ], [
1123
+ filteredBottomMenuItems,
1124
+ t
1125
+ ]);
1126
+ const [selectedKeys, setSelectedKeys] = (0, external_react_.useState)('');
1108
1127
  (0, external_react_.useEffect)(()=>{
1109
- if (audioRef.current && audioUrl) {
1110
- audioRef.current.pause();
1111
- audioRef.current.currentTime = 0;
1112
- audioRef.current.src = audioUrl;
1113
- audioRef.current.load();
1128
+ const computeSelectedKey = ()=>{
1129
+ const match = allMenuItems.find((item)=>item.key ? (0, external_react_router_namespaceObject.matchPath)({
1130
+ path: item.key,
1131
+ end: true
1132
+ }, location.pathname) : false);
1133
+ return match?.key ?? '';
1134
+ };
1135
+ setSelectedKeys(computeSelectedKey());
1136
+ }, [
1137
+ location.pathname,
1138
+ allMenuItems
1139
+ ]);
1140
+ const handleLogout = (0, external_react_.useCallback)(async ()=>{
1141
+ await logout?.();
1142
+ if (isMobile) setDrawerVisible(false);
1143
+ navigate('/');
1144
+ }, [
1145
+ logout,
1146
+ isMobile,
1147
+ setDrawerVisible,
1148
+ navigate
1149
+ ]);
1150
+ const handleMenuClick = (0, external_react_.useCallback)(async (key)=>{
1151
+ if (onMenuClick?.(key) === false) return;
1152
+ try {
1153
+ if (key === MENU_KEY_APP_LOGOUT) return void await handleLogout();
1154
+ navigate(key);
1155
+ } finally{
1156
+ if (isMobile) setDrawerVisible(false);
1114
1157
  }
1115
- setIsPlaying(false);
1116
- setCurrentTime(0);
1117
- setDuration(0);
1118
1158
  }, [
1119
- audioUrl
1159
+ onMenuClick,
1160
+ handleLogout,
1161
+ navigate,
1162
+ isMobile,
1163
+ setDrawerVisible
1120
1164
  ]);
1121
- const handleLoadedMetadata = ()=>{
1122
- if (!audioRef.current) return;
1123
- const audio = audioRef.current;
1124
- if (audio.duration !== 1 / 0 && Number.isFinite(audio.duration)) {
1125
- if (audio.duration > 0) setDuration(audio.duration);
1126
- } else {
1127
- audio.currentTime = 1e101;
1128
- const timeUpdateHandler = ()=>{
1129
- audio.removeEventListener('timeupdate', timeUpdateHandler);
1130
- audio.currentTime = 0;
1131
- setDuration(audio.duration || 0);
1132
- };
1133
- audio.addEventListener('timeupdate', timeUpdateHandler);
1134
- }
1165
+ const handleUserMenuItemClick = (0, external_react_.useCallback)((key)=>{
1166
+ onMenuClick?.(key);
1167
+ }, [
1168
+ onMenuClick
1169
+ ]);
1170
+ const primaryMenu = (0, external_react_.useMemo)(()=>/*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Menu, {
1171
+ theme: theme,
1172
+ mode: 'inline',
1173
+ selectedKeys: selectedKeys ? [
1174
+ selectedKeys
1175
+ ] : [],
1176
+ onClick: ({ key })=>handleMenuClick(key),
1177
+ items: filteredMenuItems,
1178
+ className: LoggedMainContainer_module.menu
1179
+ }, 'primary-menu'), [
1180
+ selectedKeys,
1181
+ filteredMenuItems,
1182
+ theme,
1183
+ handleMenuClick
1184
+ ]);
1185
+ (0, external_react_.useEffect)(()=>{
1186
+ const checkScreenSize = ()=>setIsMobile(window.innerWidth < 768);
1187
+ checkScreenSize();
1188
+ window.addEventListener('resize', checkScreenSize);
1189
+ return ()=>window.removeEventListener('resize', checkScreenSize);
1190
+ }, []);
1191
+ const menuContent = /*#__PURE__*/ (0, jsx_runtime.jsxs)(jsx_runtime.Fragment, {
1192
+ children: [
1193
+ primaryMenu,
1194
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Layout.Content, {
1195
+ className: LoggedMainContainer_module.menuSpacer
1196
+ }),
1197
+ showVersion?.(user) && version && /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Menu, {
1198
+ motion: false,
1199
+ theme: theme,
1200
+ mode: 'horizontal',
1201
+ className: LoggedMainContainer_module.versionMenu,
1202
+ disabled: true,
1203
+ items: [
1204
+ {
1205
+ icon: collapsed ? version : `${t('LoggedMainContainer.version')}: ${version}`,
1206
+ title: ''
1207
+ }
1208
+ ]
1209
+ }, 'version-menu'),
1210
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Menu, {
1211
+ motion: false,
1212
+ theme: theme,
1213
+ mode: 'inline',
1214
+ selectedKeys: selectedKeys ? [
1215
+ selectedKeys
1216
+ ] : [],
1217
+ onClick: ({ key })=>handleMenuClick(key),
1218
+ className: LoggedMainContainer_module.bottomMenu,
1219
+ items: memoizedBottomMenuItems
1220
+ }, 'bottom-menu')
1221
+ ]
1222
+ });
1223
+ const renderMenuContent = ()=>{
1224
+ if (isMobile) return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Drawer, {
1225
+ placement: 'left',
1226
+ onClose: ()=>setDrawerVisible(false),
1227
+ open: drawerVisible,
1228
+ size: 250,
1229
+ className: LoggedMainContainer_module.drawer,
1230
+ classNames: {
1231
+ body: LoggedMainContainer_module.drawerBody
1232
+ },
1233
+ children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Flex, {
1234
+ vertical: true,
1235
+ className: LoggedMainContainer_module.drawerFlex,
1236
+ children: menuContent
1237
+ })
1238
+ });
1239
+ return /*#__PURE__*/ (0, jsx_runtime.jsx)(Sider, {
1240
+ theme: theme,
1241
+ trigger: null,
1242
+ collapsible: true,
1243
+ collapsed: collapsed,
1244
+ breakpoint: 'lg',
1245
+ collapsedWidth: 80,
1246
+ className: LoggedMainContainer_module.sider,
1247
+ children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Layout, {
1248
+ className: LoggedMainContainer_module.siderLayout,
1249
+ children: menuContent
1250
+ })
1251
+ });
1135
1252
  };
1136
- return /*#__PURE__*/ (0, jsx_runtime.jsxs)("div", {
1137
- className: AudioPlayer_module.audioPlayer,
1253
+ const renderSecondarySidebar = ()=>{
1254
+ if (!secondarySidebar) return null;
1255
+ if (isMobile) return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Drawer, {
1256
+ placement: 'right',
1257
+ onClose: ()=>setSecondarySidebarDrawerVisible(false),
1258
+ open: secondarySidebarDrawerVisible,
1259
+ size: 280,
1260
+ className: LoggedMainContainer_module.drawer,
1261
+ title: null,
1262
+ closeIcon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.CloseOutlined, {}),
1263
+ children: secondarySidebar(user)
1264
+ });
1265
+ return /*#__PURE__*/ (0, jsx_runtime.jsx)(Sider, {
1266
+ theme: theme,
1267
+ width: secondarySidebarWidth,
1268
+ children: secondarySidebar(user)
1269
+ });
1270
+ };
1271
+ return /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Layout, {
1272
+ className: LoggedMainContainer_module.layout,
1138
1273
  children: [
1139
- /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Space, {
1140
- orientation: 'vertical',
1141
- size: 'middle',
1274
+ renderMenuContent(),
1275
+ renderSecondarySidebar(),
1276
+ /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Layout, {
1142
1277
  children: [
1143
- /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Space, {
1144
- align: 'center',
1278
+ /*#__PURE__*/ (0, jsx_runtime.jsxs)(Header, {
1279
+ className: `${LoggedMainContainer_module.header} ${isMobile ? LoggedMainContainer_module.mobile : ''}`,
1145
1280
  children: [
1146
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1147
- type: 'primary',
1148
- shape: 'circle',
1149
- icon: isPlaying ? /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.PauseCircleOutlined, {}) : /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.PlayCircleOutlined, {}),
1150
- onClick: togglePlay,
1151
- disabled: !hasSource,
1152
- title: isPlaying ? t('AudioPlayer.pause') : t('AudioPlayer.play'),
1153
- "aria-label": isPlaying ? t('AudioPlayer.pauseAudio') : t('AudioPlayer.playAudio')
1154
- }),
1155
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Slider, {
1156
- min: 0,
1157
- max: duration,
1158
- value: currentTime,
1159
- onChange: handleSliderChange,
1160
- tooltip: {
1161
- open: false
1162
- },
1163
- disabled: 0 === duration,
1164
- className: AudioPlayer_module.slider
1281
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Space, {
1282
+ children: isMobile ? /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1283
+ type: 'text',
1284
+ icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MenuOutlined, {}),
1285
+ onClick: ()=>setDrawerVisible(true)
1286
+ }) : /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1287
+ type: 'text',
1288
+ icon: collapsed ? /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MenuUnfoldOutlined, {}) : /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MenuFoldOutlined, {}),
1289
+ onClick: ()=>setCollapsed(!collapsed)
1290
+ })
1165
1291
  }),
1166
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1167
- shape: 'circle',
1168
- icon: isMuted ? /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MutedOutlined, {}) : /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.SoundOutlined, {}),
1169
- onClick: toggleMute,
1170
- disabled: !hasSource,
1171
- title: isMuted ? t('AudioPlayer.unmute') : t('AudioPlayer.mute'),
1172
- "aria-label": isMuted ? t('AudioPlayer.unmuteAudio') : t('AudioPlayer.muteAudio')
1292
+ /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Space, {
1293
+ size: isMobile ? 'small' : 'middle',
1294
+ className: `${LoggedMainContainer_module.headerSpace} ${isMobile ? LoggedMainContainer_module.mobile : ''}`,
1295
+ children: [
1296
+ secondarySidebar && isMobile && /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1297
+ type: 'text',
1298
+ icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.WechatOutlined, {}),
1299
+ onClick: ()=>setSecondarySidebarDrawerVisible(true)
1300
+ }),
1301
+ !isMobile && /*#__PURE__*/ (0, jsx_runtime.jsx)(LoggedMainContainer_Text, {
1302
+ children: t('LoggedMainContainer.theme')
1303
+ }),
1304
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(ThemeToggle, {}),
1305
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Divider, {
1306
+ type: 'vertical',
1307
+ className: LoggedMainContainer_module.headerDivider
1308
+ }),
1309
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(UserMenu, {
1310
+ user: user,
1311
+ items: filteredUserMenuItems,
1312
+ onItemClick: handleUserMenuItemClick
1313
+ })
1314
+ ]
1173
1315
  })
1174
1316
  ]
1175
1317
  }),
1176
- /*#__PURE__*/ (0, jsx_runtime.jsx)("div", {
1177
- className: AudioPlayer_module.durationTimeContainer,
1178
- children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Typography.Text, {
1179
- children: `${formatTime(currentTime)} / ${formatTime(duration)}`
1180
- })
1318
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(Content, {
1319
+ className: `${LoggedMainContainer_module.content} ${isMobile ? LoggedMainContainer_module.mobile : ''}`,
1320
+ children: children
1181
1321
  })
1182
1322
  ]
1183
- }),
1184
- /*#__PURE__*/ (0, jsx_runtime.jsx)("audio", {
1185
- ref: audioRef,
1186
- onTimeUpdate: (e)=>{
1187
- if (!isPlaying) return;
1188
- const audioElement = e.target;
1189
- setCurrentTime(audioElement.currentTime);
1190
- },
1191
- onLoadedMetadata: handleLoadedMetadata,
1192
- onEnded: ()=>{
1193
- setIsPlaying(false);
1194
- setCurrentTime(0);
1195
- },
1196
- onPlay: ()=>setIsPlaying(true),
1197
- onPause: ()=>setIsPlaying(false),
1198
- muted: isMuted,
1199
- children: /*#__PURE__*/ (0, jsx_runtime.jsx)("track", {
1200
- kind: 'captions'
1201
- })
1202
1323
  })
1203
1324
  ]
1204
1325
  });
1326
+ }
1327
+ LoggedMainContainer.propTypes = {
1328
+ children: external_prop_types_default().node.isRequired
1205
1329
  };
1206
- AudioPlayer.propTypes = {
1207
- audioUrl: external_prop_types_default().string.isRequired
1208
- };
1209
- const COUNTRIES = [
1210
- {
1211
- code: 'BR',
1212
- dialCode: '55',
1213
- flag: '🇧🇷',
1214
- maxLocalDigits: 11
1215
- },
1216
- {
1217
- code: 'US',
1218
- dialCode: '1',
1219
- flag: '🇺🇸',
1220
- maxLocalDigits: 10
1221
- },
1222
- {
1223
- code: 'CA',
1224
- dialCode: '1',
1225
- flag: '🇨🇦',
1226
- maxLocalDigits: 10
1227
- },
1228
- {
1229
- code: 'MX',
1230
- dialCode: '52',
1231
- flag: '🇲🇽',
1232
- maxLocalDigits: 10
1233
- },
1234
- {
1235
- code: 'AR',
1236
- dialCode: '54',
1237
- flag: '🇦🇷',
1238
- maxLocalDigits: 10
1239
- },
1240
- {
1241
- code: 'CL',
1242
- dialCode: '56',
1243
- flag: '🇨🇱',
1244
- maxLocalDigits: 9
1245
- },
1246
- {
1247
- code: 'CO',
1248
- dialCode: '57',
1249
- flag: '🇨🇴',
1250
- maxLocalDigits: 10
1251
- },
1252
- {
1253
- code: 'PE',
1254
- dialCode: '51',
1330
+ function useErrorMessage() {
1331
+ const { t } = useCodebitWebAntdTranslation();
1332
+ const getErrorMessage = (error)=>{
1333
+ let status = 'error';
1334
+ const responseStatus = error?.response?.status || null;
1335
+ let errorMessage = t('Error.defaultError');
1336
+ let retryText = t('Error.retryButton');
1337
+ let onRetryAction = null;
1338
+ if (error?.errorCode) switch(error.errorCode){
1339
+ case codebit_web_namespaceObject.ErrorCode.ERR_NETWORK:
1340
+ errorMessage = t('Error.networkError');
1341
+ break;
1342
+ case codebit_web_namespaceObject.ErrorCode.ERR_TIMEOUT:
1343
+ errorMessage = t('Error.timeoutError');
1344
+ break;
1345
+ }
1346
+ else if (responseStatus) switch(responseStatus){
1347
+ case 400:
1348
+ errorMessage = t('Error.badRequestError');
1349
+ break;
1350
+ case 403:
1351
+ errorMessage = t('Error.forbiddenError');
1352
+ retryText = t('Error.reloadPageButton');
1353
+ status = 403;
1354
+ onRetryAction = ()=>{
1355
+ globalThis.location.reload();
1356
+ };
1357
+ break;
1358
+ case 404:
1359
+ errorMessage = t('Error.notFoundError');
1360
+ status = 404;
1361
+ break;
1362
+ case 500:
1363
+ errorMessage = t('Error.internalServerError');
1364
+ status = 500;
1365
+ break;
1366
+ case 401:
1367
+ errorMessage = t('Error.sessionExpiredError');
1368
+ retryText = t('Error.reloadPageButton');
1369
+ onRetryAction = ()=>{
1370
+ globalThis.location.reload();
1371
+ };
1372
+ break;
1373
+ }
1374
+ return {
1375
+ errorMessage,
1376
+ status,
1377
+ retryText,
1378
+ onRetryAction
1379
+ };
1380
+ };
1381
+ return {
1382
+ getErrorMessage
1383
+ };
1384
+ }
1385
+ const ErrorRetry_logger = new codebit_web_namespaceObject.Logger('ErrorRetry');
1386
+ function ErrorRetry({ error, onRetry }) {
1387
+ if (error && error instanceof Error) {
1388
+ ErrorRetry_logger.error('Fail to load.', error);
1389
+ react_namespaceObject.captureException(error);
1390
+ }
1391
+ const { getErrorMessage } = useErrorMessage();
1392
+ const { status, errorMessage, retryText, onRetryAction } = getErrorMessage(error);
1393
+ return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Card, {
1394
+ children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Result, {
1395
+ status: status,
1396
+ title: errorMessage,
1397
+ extra: [
1398
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1399
+ type: 'primary',
1400
+ onClick: onRetryAction ?? onRetry,
1401
+ icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.ReloadOutlined, {}),
1402
+ children: retryText
1403
+ }, 'retry')
1404
+ ]
1405
+ })
1406
+ });
1407
+ }
1408
+ ErrorRetry.propTypes = {
1409
+ error: external_prop_types_default().object.isRequired,
1410
+ onRetry: external_prop_types_default().func.isRequired
1411
+ };
1412
+ const ListCard_module = {
1413
+ listCard: "listCard-ISftFd",
1414
+ headerRow: "headerRow-UsZAzP",
1415
+ actions: "actions-ig53s2",
1416
+ filtersRow: "filtersRow-f3Xk5a",
1417
+ expandArea: "expandArea-czOoFS"
1418
+ };
1419
+ const { Title } = external_antd_namespaceObject.Typography;
1420
+ function ListCard({ title, onClearFilters, headerContainer, tableContainer, actions }) {
1421
+ const { token } = external_antd_namespaceObject.theme.useToken();
1422
+ const { t } = (0, external_react_i18next_namespaceObject.useTranslation)('codebitWebAntd');
1423
+ const margin = token['margin'];
1424
+ return /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Card, {
1425
+ className: ListCard_module.listCard,
1426
+ children: [
1427
+ /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Row, {
1428
+ gutter: margin,
1429
+ align: 'middle',
1430
+ className: ListCard_module.headerRow,
1431
+ children: [
1432
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Col, {
1433
+ xs: 24,
1434
+ sm: 24,
1435
+ md: 12,
1436
+ children: /*#__PURE__*/ (0, jsx_runtime.jsx)(Title, {
1437
+ level: 4,
1438
+ children: title
1439
+ })
1440
+ }),
1441
+ (!!onClearFilters || !!actions) && /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Col, {
1442
+ xs: 24,
1443
+ sm: 24,
1444
+ md: 12,
1445
+ className: ListCard_module.actions,
1446
+ children: [
1447
+ !!onClearFilters && /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1448
+ icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.ClearOutlined, {}),
1449
+ onClick: onClearFilters,
1450
+ children: t('ListCard.clearFilters')
1451
+ }),
1452
+ actions
1453
+ ]
1454
+ })
1455
+ ]
1456
+ }),
1457
+ !!headerContainer && /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Row, {
1458
+ gutter: margin,
1459
+ className: ListCard_module.filtersRow,
1460
+ children: headerContainer
1461
+ }),
1462
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Layout, {
1463
+ className: ListCard_module.expandArea,
1464
+ children: tableContainer
1465
+ })
1466
+ ]
1467
+ });
1468
+ }
1469
+ ListCard.propTypes = {
1470
+ title: external_prop_types_default().string.isRequired,
1471
+ onClearFilters: external_prop_types_default().func,
1472
+ headerContainer: external_prop_types_default().node,
1473
+ tableContainer: external_prop_types_default().node,
1474
+ actions: external_prop_types_default().node
1475
+ };
1476
+ ListCard.defaultProps = {
1477
+ onClearFilters: null,
1478
+ headerContainer: null,
1479
+ tableContainer: null,
1480
+ actions: null
1481
+ };
1482
+ const CssTokenBridge = ({ containerId })=>{
1483
+ const { token } = external_antd_namespaceObject.theme.useToken();
1484
+ (0, external_react_.useLayoutEffect)(()=>{
1485
+ const scopedContainer = containerId ? document.getElementById(containerId) : null;
1486
+ const targets = scopedContainer ? [
1487
+ document.documentElement,
1488
+ scopedContainer
1489
+ ] : [
1490
+ document.documentElement
1491
+ ];
1492
+ const setVar = (name, value)=>{
1493
+ for (const target of targets)target.style.setProperty(name, value);
1494
+ };
1495
+ setVar('--antd-color-bg-base', token['colorBgBase']);
1496
+ setVar('--antd-color-bg-container', token['colorBgContainer']);
1497
+ setVar('--antd-color-bg-elevated', token['colorBgElevated']);
1498
+ setVar('--antd-color-bg-layout', token['colorBgLayout']);
1499
+ setVar('--antd-color-bg-mask', token['colorBgMask']);
1500
+ setVar('--antd-color-bg-spotlight', token['colorBgSpotlight']);
1501
+ setVar('--antd-color-primary', token['colorPrimary']);
1502
+ setVar('--antd-color-success', token['colorSuccess']);
1503
+ setVar('--antd-color-success-bg', token['colorSuccessBg']);
1504
+ setVar('--antd-color-success-border', token['colorSuccessBorder']);
1505
+ setVar('--antd-color-success-text', token['colorSuccessText']);
1506
+ setVar('--antd-color-warning', token['colorWarning']);
1507
+ setVar('--antd-color-warning-bg', token['colorWarningBg']);
1508
+ setVar('--antd-color-warning-border', token['colorWarningBorder']);
1509
+ setVar('--antd-color-warning-text', token['colorWarningText']);
1510
+ setVar('--antd-color-error', token['colorError']);
1511
+ setVar('--antd-color-error-bg', token['colorErrorBg']);
1512
+ setVar('--antd-color-error-border', token['colorErrorBorder']);
1513
+ setVar('--antd-color-error-text', token['colorErrorText']);
1514
+ setVar('--antd-color-info', token['colorInfo']);
1515
+ setVar('--antd-color-info-bg', token['colorInfoBg']);
1516
+ setVar('--antd-color-info-border', token['colorInfoBorder']);
1517
+ setVar('--antd-color-info-text', token['colorInfoText']);
1518
+ setVar('--antd-color-text', token['colorText']);
1519
+ setVar('--antd-color-text-secondary', token['colorTextSecondary']);
1520
+ setVar('--antd-color-text-tertiary', token['colorTextTertiary']);
1521
+ setVar('--antd-color-text-quaternary', token['colorTextQuaternary']);
1522
+ setVar('--antd-color-text-disabled', token['colorTextDisabled']);
1523
+ setVar('--antd-color-border', token['colorBorder']);
1524
+ setVar('--antd-color-border-secondary', token['colorBorderSecondary']);
1525
+ setVar('--antd-color-border-hover', token['colorBorderHover']);
1526
+ setVar('--antd-color-border-disabled', token['colorBorderDisabled']);
1527
+ setVar('--antd-color-split', token['colorSplit']);
1528
+ setVar('--antd-color-link', token['colorLink']);
1529
+ setVar('--antd-color-link-hover', token['colorLinkHover']);
1530
+ setVar('--antd-color-link-active', token['colorLinkActive']);
1531
+ setVar('--antd-color-fill', token['colorFill']);
1532
+ setVar('--antd-color-fill-secondary', token['colorFillSecondary']);
1533
+ setVar('--antd-color-fill-tertiary', token['colorFillTertiary']);
1534
+ setVar('--antd-color-fill-quaternary', token['colorFillQuaternary']);
1535
+ setVar('--antd-color-fill-content', token['colorFillContent']);
1536
+ setVar('--antd-color-fill-content-hover', token['colorFillContentHover']);
1537
+ setVar('--antd-color-fill-content-selected', token['colorFillContentSelected']);
1538
+ setVar('--antd-color-fill-alter', token['colorFillAlter']);
1539
+ setVar('--antd-color-fill-alter-hover', token['colorFillAlterHover']);
1540
+ setVar('--antd-color-fill-alter-active', token['colorFillAlterActive']);
1541
+ setVar('--antd-color-fill-alter-selected', token['colorFillAlterSelected']);
1542
+ setVar('--antd-color-fill-alter-disabled', token['colorFillAlterDisabled']);
1543
+ setVar('--antd-color-white', token['colorWhite']);
1544
+ setVar('--antd-color-black', token['colorBlack']);
1545
+ setVar('--antd-margin-xxs', `${token['marginXXS']}px`);
1546
+ setVar('--antd-margin-xs', `${token['marginXS']}px`);
1547
+ setVar('--antd-margin-sm', `${token['marginSM']}px`);
1548
+ setVar('--antd-margin', `${token['margin']}px`);
1549
+ setVar('--antd-margin-md', `${token['marginMD']}px`);
1550
+ setVar('--antd-margin-lg', `${token['marginLG']}px`);
1551
+ setVar('--antd-margin-xl', `${token['marginXL']}px`);
1552
+ setVar('--antd-margin-xxl', `${token['marginXXL']}px`);
1553
+ setVar('--antd-padding-xxs', `${token['paddingXXS']}px`);
1554
+ setVar('--antd-padding-xs', `${token['paddingXS']}px`);
1555
+ setVar('--antd-padding-sm', `${token['paddingSM']}px`);
1556
+ setVar('--antd-padding', `${token['padding']}px`);
1557
+ setVar('--antd-padding-md', `${token['paddingMD']}px`);
1558
+ setVar('--antd-padding-lg', `${token['paddingLG']}px`);
1559
+ setVar('--antd-padding-xl', `${token['paddingXL']}px`);
1560
+ setVar('--antd-font-size-xxs', '8px');
1561
+ setVar('--antd-font-size-xs', '10px');
1562
+ setVar('--antd-font-size-sm', `${token['fontSizeSM']}px`);
1563
+ setVar('--antd-font-size', `${token['fontSize']}px`);
1564
+ setVar('--antd-font-size-lg', `${token['fontSizeLG']}px`);
1565
+ setVar('--antd-font-size-xl', `${token['fontSizeXL']}px`);
1566
+ setVar('--antd-font-size-xxl', `${token['fontSizeXXL']}px`);
1567
+ setVar('--antd-font-size-heading1', `${token['fontSizeHeading1']}px`);
1568
+ setVar('--antd-font-size-heading2', `${token['fontSizeHeading2']}px`);
1569
+ setVar('--antd-font-size-heading3', `${token['fontSizeHeading3']}px`);
1570
+ setVar('--antd-font-size-heading4', `${token['fontSizeHeading4']}px`);
1571
+ setVar('--antd-font-size-heading5', `${token['fontSizeHeading5']}px`);
1572
+ setVar('--antd-line-height-sm', token['lineHeightSM']);
1573
+ setVar('--antd-line-height', token['lineHeight']);
1574
+ setVar('--antd-line-height-lg', token['lineHeightLG']);
1575
+ setVar('--antd-control-height-xs', `${token['controlHeightXS']}px`);
1576
+ setVar('--antd-control-height-sm', `${token['controlHeightSM']}px`);
1577
+ setVar('--antd-control-height', `${token['controlHeight']}px`);
1578
+ setVar('--antd-control-height-lg', `${token['controlHeightLG']}px`);
1579
+ setVar('--antd-border-radius-sm', `${token['borderRadiusSM']}px`);
1580
+ setVar('--antd-border-radius', `${token['borderRadius']}px`);
1581
+ setVar('--antd-border-radius-lg', `${token['borderRadiusLG']}px`);
1582
+ setVar('--antd-shadow', token['boxShadow']);
1583
+ setVar('--antd-shadow-lg', token['boxShadowSecondary']);
1584
+ }, [
1585
+ containerId,
1586
+ token
1587
+ ]);
1588
+ return null;
1589
+ };
1590
+ CssTokenBridge.propTypes = {
1591
+ containerId: external_prop_types_default().string
1592
+ };
1593
+ const TableContainer_module = {
1594
+ tableContainer: "tableContainer-EhNwOm"
1595
+ };
1596
+ function isPaginationNode(node) {
1597
+ if (node.nodeType !== Node.ELEMENT_NODE) return false;
1598
+ const element = node;
1599
+ return element.classList?.contains('ant-table-pagination') || element.querySelector?.('.ant-table-pagination');
1600
+ }
1601
+ function hasPaginationInMutation(mutation) {
1602
+ return Array.from(mutation.addedNodes).some(isPaginationNode);
1603
+ }
1604
+ function TableContainer({ children }) {
1605
+ const containerRef = (0, external_react_.useRef)(null);
1606
+ const containerHeightRef = (0, external_react_.useRef)(null);
1607
+ const [scrollY, setScrollY] = (0, external_react_.useState)(void 0);
1608
+ (0, external_react_.useLayoutEffect)(()=>{
1609
+ const calculateHeights = ()=>{
1610
+ if (!containerRef.current) return;
1611
+ containerHeightRef.current = containerRef.current.offsetHeight;
1612
+ const thead = containerRef.current.querySelector('thead');
1613
+ let theadHeight = 0;
1614
+ if (thead) {
1615
+ const rect = thead.getBoundingClientRect();
1616
+ const styles = globalThis.getComputedStyle(thead);
1617
+ const marginTop = Number.parseFloat(styles.marginTop) || 0;
1618
+ const marginBottom = Number.parseFloat(styles.marginBottom) || 0;
1619
+ theadHeight = rect.height + marginTop + marginBottom;
1620
+ }
1621
+ const pagination = containerRef.current.querySelector('.ant-table-pagination');
1622
+ let paginationHeight = 0;
1623
+ if (pagination) {
1624
+ const rect = pagination.getBoundingClientRect();
1625
+ const styles = globalThis.getComputedStyle(pagination);
1626
+ const marginTop = Number.parseFloat(styles.marginTop) || 0;
1627
+ const marginBottom = Number.parseFloat(styles.marginBottom) || 0;
1628
+ paginationHeight = rect.height + marginTop + marginBottom;
1629
+ }
1630
+ const availableHeight = Math.ceil(containerHeightRef.current) - Math.ceil(theadHeight) - Math.ceil(paginationHeight) - 1;
1631
+ setScrollY(availableHeight);
1632
+ };
1633
+ calculateHeights();
1634
+ const observer = new MutationObserver((mutations)=>{
1635
+ const hasPagination = mutations.some(hasPaginationInMutation);
1636
+ if (hasPagination) calculateHeights();
1637
+ });
1638
+ if (containerRef.current) observer.observe(containerRef.current, {
1639
+ childList: true,
1640
+ subtree: true
1641
+ });
1642
+ globalThis.addEventListener('resize', calculateHeights);
1643
+ return ()=>{
1644
+ observer.disconnect();
1645
+ globalThis.removeEventListener('resize', calculateHeights);
1646
+ };
1647
+ }, []);
1648
+ const enhancedChildren = scrollY ? /*#__PURE__*/ (0, external_react_.cloneElement)(children, {
1649
+ scroll: {
1650
+ ...children.props?.scroll,
1651
+ y: scrollY,
1652
+ x: 'max-content'
1653
+ }
1654
+ }) : children;
1655
+ return /*#__PURE__*/ (0, jsx_runtime.jsx)("div", {
1656
+ ref: containerRef,
1657
+ className: TableContainer_module.tableContainer,
1658
+ children: enhancedChildren
1659
+ });
1660
+ }
1661
+ TableContainer.propTypes = {
1662
+ children: external_prop_types_default().element.isRequired
1663
+ };
1664
+ function FilterContainer({ children, ...props }) {
1665
+ const { token } = external_antd_namespaceObject.theme.useToken();
1666
+ return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Card, {
1667
+ styles: {
1668
+ body: {
1669
+ padding: token['paddingXS'] + 'px'
1670
+ }
1671
+ },
1672
+ ...props,
1673
+ children: children
1674
+ });
1675
+ }
1676
+ FilterContainer.propTypes = {
1677
+ children: external_prop_types_default().node.isRequired,
1678
+ ...external_antd_namespaceObject.Card.propTypes
1679
+ };
1680
+ const external_date_fns_namespaceObject = require("date-fns");
1681
+ const AudioPlayer_module = {
1682
+ audioPlayer: "audioPlayer-a4xARM",
1683
+ durationTimeContainer: "durationTimeContainer-kmkK6M",
1684
+ slider: "slider-bdta4v"
1685
+ };
1686
+ const AudioPlayer = ({ audioUrl })=>{
1687
+ const [isMuted, setIsMuted] = (0, external_react_.useState)(false);
1688
+ const [duration, setDuration] = (0, external_react_.useState)(0);
1689
+ const [currentTime, setCurrentTime] = (0, external_react_.useState)(0);
1690
+ const [isPlaying, setIsPlaying] = (0, external_react_.useState)(false);
1691
+ const { t } = useCodebitWebAntdTranslation();
1692
+ const audioRef = (0, external_react_.useRef)(null);
1693
+ const hasSource = !!audioUrl;
1694
+ const formatTime = (seconds)=>{
1695
+ const sec = Math.max(0, Math.floor(seconds));
1696
+ const date = (0, external_date_fns_namespaceObject.addSeconds)(new Date(0), sec);
1697
+ const h = Math.floor(sec / 3600);
1698
+ const timeFormat = h > 0 ? 'H:mm:ss' : 'm:ss';
1699
+ return (0, external_date_fns_namespaceObject.format)(date, timeFormat);
1700
+ };
1701
+ const togglePlay = async ()=>{
1702
+ if (!audioRef.current || !hasSource) return;
1703
+ if (audioRef.current.paused) {
1704
+ await audioRef.current.play();
1705
+ setIsPlaying(true);
1706
+ } else {
1707
+ audioRef.current.pause();
1708
+ setIsPlaying(false);
1709
+ }
1710
+ };
1711
+ const toggleMute = ()=>{
1712
+ if (!audioRef.current) return;
1713
+ audioRef.current.muted = !audioRef.current.muted;
1714
+ setIsMuted(audioRef.current.muted);
1715
+ };
1716
+ const handleSliderChange = (value)=>{
1717
+ if (!audioRef.current) return;
1718
+ const safeValue = Math.min(Math.round(value), Math.round(duration));
1719
+ audioRef.current.currentTime = safeValue;
1720
+ setCurrentTime(safeValue);
1721
+ };
1722
+ (0, external_react_.useEffect)(()=>{
1723
+ if (audioRef.current && audioUrl) {
1724
+ audioRef.current.pause();
1725
+ audioRef.current.currentTime = 0;
1726
+ audioRef.current.src = audioUrl;
1727
+ audioRef.current.load();
1728
+ }
1729
+ setIsPlaying(false);
1730
+ setCurrentTime(0);
1731
+ setDuration(0);
1732
+ }, [
1733
+ audioUrl
1734
+ ]);
1735
+ const handleLoadedMetadata = ()=>{
1736
+ if (!audioRef.current) return;
1737
+ const audio = audioRef.current;
1738
+ if (audio.duration !== 1 / 0 && Number.isFinite(audio.duration)) {
1739
+ if (audio.duration > 0) setDuration(audio.duration);
1740
+ } else {
1741
+ audio.currentTime = 1e101;
1742
+ const timeUpdateHandler = ()=>{
1743
+ audio.removeEventListener('timeupdate', timeUpdateHandler);
1744
+ audio.currentTime = 0;
1745
+ setDuration(audio.duration || 0);
1746
+ };
1747
+ audio.addEventListener('timeupdate', timeUpdateHandler);
1748
+ }
1749
+ };
1750
+ return /*#__PURE__*/ (0, jsx_runtime.jsxs)("div", {
1751
+ className: AudioPlayer_module.audioPlayer,
1752
+ children: [
1753
+ /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Space, {
1754
+ orientation: 'vertical',
1755
+ size: 'middle',
1756
+ children: [
1757
+ /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Space, {
1758
+ align: 'center',
1759
+ children: [
1760
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1761
+ type: 'primary',
1762
+ shape: 'circle',
1763
+ icon: isPlaying ? /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.PauseCircleOutlined, {}) : /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.PlayCircleOutlined, {}),
1764
+ onClick: togglePlay,
1765
+ disabled: !hasSource,
1766
+ title: isPlaying ? t('AudioPlayer.pause') : t('AudioPlayer.play'),
1767
+ "aria-label": isPlaying ? t('AudioPlayer.pauseAudio') : t('AudioPlayer.playAudio')
1768
+ }),
1769
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Slider, {
1770
+ min: 0,
1771
+ max: duration,
1772
+ value: currentTime,
1773
+ onChange: handleSliderChange,
1774
+ tooltip: {
1775
+ open: false
1776
+ },
1777
+ disabled: 0 === duration,
1778
+ className: AudioPlayer_module.slider
1779
+ }),
1780
+ /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1781
+ shape: 'circle',
1782
+ icon: isMuted ? /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MutedOutlined, {}) : /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.SoundOutlined, {}),
1783
+ onClick: toggleMute,
1784
+ disabled: !hasSource,
1785
+ title: isMuted ? t('AudioPlayer.unmute') : t('AudioPlayer.mute'),
1786
+ "aria-label": isMuted ? t('AudioPlayer.unmuteAudio') : t('AudioPlayer.muteAudio')
1787
+ })
1788
+ ]
1789
+ }),
1790
+ /*#__PURE__*/ (0, jsx_runtime.jsx)("div", {
1791
+ className: AudioPlayer_module.durationTimeContainer,
1792
+ children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Typography.Text, {
1793
+ children: `${formatTime(currentTime)} / ${formatTime(duration)}`
1794
+ })
1795
+ })
1796
+ ]
1797
+ }),
1798
+ /*#__PURE__*/ (0, jsx_runtime.jsx)("audio", {
1799
+ ref: audioRef,
1800
+ onTimeUpdate: (e)=>{
1801
+ if (!isPlaying) return;
1802
+ const audioElement = e.target;
1803
+ setCurrentTime(audioElement.currentTime);
1804
+ },
1805
+ onLoadedMetadata: handleLoadedMetadata,
1806
+ onEnded: ()=>{
1807
+ setIsPlaying(false);
1808
+ setCurrentTime(0);
1809
+ },
1810
+ onPlay: ()=>setIsPlaying(true),
1811
+ onPause: ()=>setIsPlaying(false),
1812
+ muted: isMuted,
1813
+ children: /*#__PURE__*/ (0, jsx_runtime.jsx)("track", {
1814
+ kind: 'captions'
1815
+ })
1816
+ })
1817
+ ]
1818
+ });
1819
+ };
1820
+ AudioPlayer.propTypes = {
1821
+ audioUrl: external_prop_types_default().string.isRequired
1822
+ };
1823
+ const COUNTRIES = [
1824
+ {
1825
+ code: 'BR',
1826
+ dialCode: '55',
1827
+ flag: '🇧🇷',
1828
+ maxLocalDigits: 11
1829
+ },
1830
+ {
1831
+ code: 'US',
1832
+ dialCode: '1',
1833
+ flag: '🇺🇸',
1834
+ maxLocalDigits: 10
1835
+ },
1836
+ {
1837
+ code: 'CA',
1838
+ dialCode: '1',
1839
+ flag: '🇨🇦',
1840
+ maxLocalDigits: 10
1841
+ },
1842
+ {
1843
+ code: 'MX',
1844
+ dialCode: '52',
1845
+ flag: '🇲🇽',
1846
+ maxLocalDigits: 10
1847
+ },
1848
+ {
1849
+ code: 'AR',
1850
+ dialCode: '54',
1851
+ flag: '🇦🇷',
1852
+ maxLocalDigits: 10
1853
+ },
1854
+ {
1855
+ code: 'CL',
1856
+ dialCode: '56',
1857
+ flag: '🇨🇱',
1858
+ maxLocalDigits: 9
1859
+ },
1860
+ {
1861
+ code: 'CO',
1862
+ dialCode: '57',
1863
+ flag: '🇨🇴',
1864
+ maxLocalDigits: 10
1865
+ },
1866
+ {
1867
+ code: 'PE',
1868
+ dialCode: '51',
1255
1869
  flag: '🇵🇪',
1256
1870
  maxLocalDigits: 9
1257
1871
  },
@@ -1430,462 +2044,88 @@ var __webpack_exports__ = {};
1430
2044
  function detectCountry(fullDigits) {
1431
2045
  if (!fullDigits) return COUNTRIES[0];
1432
2046
  const sorted = [
1433
- ...COUNTRIES
1434
- ].sort((a, b)=>b.dialCode.length - a.dialCode.length);
1435
- for (const c of sorted)if (fullDigits.startsWith(c.dialCode)) return c;
1436
- return COUNTRIES[0];
1437
- }
1438
- const PhoneInput = ({ value, onChange, disabled, size, placeholder })=>{
1439
- const { t } = useCodebitWebAntdTranslation();
1440
- const countrySearchLabel = (c)=>{
1441
- const name = t(`PhoneInput.countries.${c.code}`);
1442
- return `${c.flag} ${name} +${c.dialCode}`;
1443
- };
1444
- const [selectedCountry, setSelectedCountry] = (0, external_react_.useState)(()=>detectCountry(value));
1445
- const [displayValue, setDisplayValue] = (0, external_react_.useState)(()=>{
1446
- if (!value) return '';
1447
- const country = detectCountry(value);
1448
- const localDigits = value.slice(country.dialCode.length);
1449
- return applyMask(localDigits, country.code);
1450
- });
1451
- (0, external_react_.useEffect)(()=>{
1452
- if (!value) return void setDisplayValue('');
1453
- const country = detectCountry(value);
1454
- setSelectedCountry(country);
1455
- const localDigits = value.slice(country.dialCode.length);
1456
- setDisplayValue(applyMask(localDigits, country.code));
1457
- }, [
1458
- value
1459
- ]);
1460
- const handleCountryChange = (countryCode)=>{
1461
- const country = COUNTRIES.find((c)=>c.code === countryCode) ?? COUNTRIES[0];
1462
- setSelectedCountry(country);
1463
- setDisplayValue('');
1464
- onChange?.('');
1465
- };
1466
- const handleInputChange = (e)=>{
1467
- const rawDigits = e.target.value.replaceAll(/\D/g, '').slice(0, selectedCountry.maxLocalDigits);
1468
- setDisplayValue(applyMask(rawDigits, selectedCountry.code));
1469
- onChange?.(selectedCountry.dialCode + rawDigits);
1470
- };
1471
- const countrySelector = /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Select, {
1472
- value: selectedCountry.code,
1473
- onChange: handleCountryChange,
1474
- disabled: disabled,
1475
- size: size,
1476
- style: {
1477
- width: 110
1478
- },
1479
- popupMatchSelectWidth: false,
1480
- showSearch: true,
1481
- filterOption: (input, option)=>option?.searchLabel?.toLowerCase().includes(input.toLowerCase()) ?? false,
1482
- options: COUNTRIES.map((c)=>({
1483
- value: c.code,
1484
- label: `${c.flag} +${c.dialCode}`,
1485
- searchLabel: countrySearchLabel(c)
1486
- })),
1487
- optionRender: (option)=>option.data.searchLabel
1488
- });
1489
- return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Input, {
1490
- addonBefore: countrySelector,
1491
- value: displayValue,
1492
- onChange: handleInputChange,
1493
- disabled: disabled,
1494
- size: size,
1495
- placeholder: placeholder
1496
- });
1497
- };
1498
- PhoneInput.propTypes = {
1499
- value: external_prop_types_default().string,
1500
- onChange: external_prop_types_default().func,
1501
- disabled: external_prop_types_default().bool,
1502
- size: external_prop_types_default().oneOf([
1503
- 'large',
1504
- 'middle',
1505
- 'small'
1506
- ]),
1507
- placeholder: external_prop_types_default().string
1508
- };
1509
- PhoneInput.format = (fullDigits)=>{
1510
- if (!fullDigits) return '';
1511
- const country = detectCountry(fullDigits);
1512
- const localDigits = fullDigits.slice(country.dialCode.length);
1513
- const masked = applyMask(localDigits, country.code);
1514
- return `${country.flag} +${country.dialCode} ${masked}`;
1515
- };
1516
- const CodebitThemeContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
1517
- const CodebitThemeProvider = ({ children, storeThemeInLocalStorage = true, containerId = 'root', forcedTheme = null, ...props })=>{
1518
- const hasLoaded = (0, external_react_.useRef)(false);
1519
- const [isDarkMode, setIsDarkMode] = (0, external_react_.useState)(()=>{
1520
- if (forcedTheme) return 'dark' === forcedTheme;
1521
- try {
1522
- if (storeThemeInLocalStorage) {
1523
- const savedTheme = localStorage?.getItem('theme');
1524
- if (null !== savedTheme) return 'dark' === savedTheme;
1525
- }
1526
- return globalThis.matchMedia?.('(prefers-color-scheme: dark)')?.matches ?? false;
1527
- } finally{
1528
- hasLoaded.current = true;
1529
- }
1530
- });
1531
- (0, external_react_.useEffect)(()=>{
1532
- if (forcedTheme) {
1533
- const mode = 'dark' === forcedTheme;
1534
- setIsDarkMode(mode);
1535
- }
1536
- }, [
1537
- forcedTheme
1538
- ]);
1539
- const toggleTheme = ()=>{
1540
- setIsDarkMode((prev)=>!prev);
1541
- };
1542
- (0, external_react_.useEffect)(()=>{
1543
- const target = document.getElementById(containerId);
1544
- if (!target) return;
1545
- if (isDarkMode) {
1546
- document.documentElement.classList.add('dark-theme');
1547
- target.classList.add('dark-theme');
1548
- } else {
1549
- document.documentElement.classList.remove('dark-theme');
1550
- target.classList.remove('dark-theme');
1551
- }
1552
- document.documentElement.style.setProperty('--color-primary', isDarkMode ? '#589C75' : '#29D266');
1553
- }, [
1554
- isDarkMode,
1555
- containerId
1556
- ]);
1557
- (0, external_react_.useEffect)(()=>{
1558
- if (hasLoaded.current && storeThemeInLocalStorage) localStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
1559
- if (hasLoaded.current && storeThemeInLocalStorage && !forcedTheme) localStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
1560
- }, [
1561
- isDarkMode,
1562
- storeThemeInLocalStorage,
1563
- forcedTheme
1564
- ]);
1565
- const themeContextValue = (0, external_react_.useMemo)(()=>({
1566
- isDarkMode,
1567
- toggleTheme,
1568
- setIsDarkMode
1569
- }), [
1570
- isDarkMode
1571
- ]);
1572
- return /*#__PURE__*/ (0, jsx_runtime.jsx)(CodebitThemeContext.Provider, {
1573
- value: themeContextValue,
1574
- children: /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.ConfigProvider, {
1575
- theme: {
1576
- algorithm: isDarkMode ? external_antd_namespaceObject.theme.darkAlgorithm : external_antd_namespaceObject.theme.defaultAlgorithm,
1577
- token: {
1578
- colorPrimary: isDarkMode ? '#589C75' : '#29D266',
1579
- colorInfo: isDarkMode ? '#589C75' : '#29D266',
1580
- colorLink: isDarkMode ? '#589C75' : '#29D266'
1581
- },
1582
- components: {
1583
- Menu: {
1584
- itemSelectedBg: isDarkMode ? '#589C75' : '#29D266',
1585
- itemSelectedColor: '#FAFAFA',
1586
- darkItemSelectedBg: isDarkMode ? '#589C75' : '#29D266',
1587
- darkItemSelectedColor: '#FAFAFA'
1588
- },
1589
- Button: {
1590
- colorPrimary: isDarkMode ? '#589C75' : '#29D266',
1591
- colorPrimaryHover: isDarkMode ? '#6DB589' : '#3FE67F',
1592
- colorPrimaryActive: isDarkMode ? '#4A8361' : '#1FBF4D'
1593
- },
1594
- Layout: {
1595
- siderBg: isDarkMode ? '#1a1a1a' : '#001529',
1596
- triggerBg: isDarkMode ? '#589C75' : '#29D266',
1597
- triggerColor: '#FAFAFA'
1598
- },
1599
- Header: {
1600
- colorPrimary: isDarkMode ? '#589C75' : '#29D266'
1601
- }
1602
- }
1603
- },
1604
- ...props,
1605
- children: [
1606
- /*#__PURE__*/ (0, jsx_runtime.jsx)(CssTokenBridge, {
1607
- containerId: containerId
1608
- }),
1609
- children
1610
- ]
1611
- })
1612
- });
1613
- };
1614
- CodebitThemeProvider.propTypes = {
1615
- children: external_prop_types_default().node.isRequired,
1616
- storeThemeInLocalStorage: external_prop_types_default().bool,
1617
- containerId: external_prop_types_default().string,
1618
- forcedTheme: external_prop_types_default().oneOf([
1619
- 'dark',
1620
- 'light',
1621
- null
1622
- ])
1623
- };
1624
- const LoggedMainContainer_module = {
1625
- layout: "layout-mL5o6I",
1626
- drawer: "drawer-oj0mJX",
1627
- drawerBody: "drawerBody-YtAN37",
1628
- drawerFlex: "drawerFlex-AGTAax",
1629
- sider: "sider-BDy1Bs",
1630
- siderLayout: "siderLayout-C8H0uI",
1631
- secondarySidebar: "secondarySidebar-P6J_Xn",
1632
- menu: "menu-KMvPt7",
1633
- menuContainer: "menuContainer-ahnhBu",
1634
- menuLabel: "menuLabel-csBJTc",
1635
- menuDescription: "menuDescription-d6BFBO",
1636
- menuSpacer: "menuSpacer-RIB3II",
1637
- versionMenu: "versionMenu-NM4uyG",
1638
- bottomMenu: "bottomMenu-VtOktS",
1639
- header: "header-vgc67L",
1640
- mobile: "mobile-mKGxb5",
1641
- headerSpace: "headerSpace-Fd_iha",
1642
- content: "content-OZHp2h"
1643
- };
1644
- const { Header, Sider, Content } = external_antd_namespaceObject.Layout;
1645
- const { Text } = external_antd_namespaceObject.Typography;
1646
- const MENU_KEY_APP_LOGOUT = 'app-logout';
1647
- function LoggedMainContainer({ children }) {
1648
- const [collapsed, setCollapsed] = (0, external_react_.useState)(true);
1649
- const [isMobile, setIsMobile] = (0, external_react_.useState)(false);
1650
- const [drawerVisible, setDrawerVisible] = (0, external_react_.useState)(false);
1651
- const [secondarySidebarDrawerVisible, setSecondarySidebarDrawerVisible] = (0, external_react_.useState)(false);
1652
- const { t } = useCodebitWebAntdTranslation();
1653
- const configCodebit = (0, external_react_.useContext)(CodebitConfigContext);
1654
- const configTheme = (0, external_react_.useContext)(CodebitThemeContext);
1655
- const navigate = (0, external_react_router_namespaceObject.useNavigate)();
1656
- const location = (0, external_react_router_namespaceObject.useLocation)();
1657
- if (!configCodebit || !configTheme) throw new Error('LoggedContainer must be used within CodebitConfigProvider and CodebitThemeContext');
1658
- const { logout, user, menuItems, version, showVersion, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, onMenuClick } = configCodebit;
1659
- const { isDarkMode } = configTheme;
1660
- const theme = isDarkMode ? 'dark' : 'light';
1661
- const allMenuItems = (0, external_react_.useMemo)(()=>[
1662
- ...menuItems(user),
1663
- ...bottomMenuItems?.(user) ?? []
1664
- ], [
1665
- menuItems,
1666
- user,
1667
- bottomMenuItems
1668
- ]);
1669
- const filteredMenuItems = (0, external_react_.useMemo)(()=>menuItems(user).filter((item)=>{
1670
- if (!item.roles) return true;
1671
- if (!user?.roles) return false;
1672
- return item.roles.some((role)=>user.roles.includes(role));
1673
- }), [
1674
- menuItems,
1675
- user
1676
- ]);
1677
- const filteredBottomMenuItems = (0, external_react_.useMemo)(()=>{
1678
- if (!bottomMenuItems) return [];
1679
- return bottomMenuItems(user).filter((item)=>{
1680
- if (!item.roles) return true;
1681
- if (!user?.roles) return false;
1682
- return item.roles.some((role)=>user.roles.includes(role));
1683
- });
1684
- }, [
1685
- bottomMenuItems,
1686
- user
1687
- ]);
1688
- const memoizedBottomMenuItems = (0, external_react_.useMemo)(()=>[
1689
- ...filteredBottomMenuItems,
1690
- {
1691
- key: MENU_KEY_APP_LOGOUT,
1692
- icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.LogoutOutlined, {}),
1693
- label: t('LoggedMainContainer.logout'),
1694
- danger: true
1695
- }
1696
- ], [
1697
- filteredBottomMenuItems,
1698
- t
1699
- ]);
1700
- const [selectedKeys, setSelectedKeys] = (0, external_react_.useState)('');
2047
+ ...COUNTRIES
2048
+ ].sort((a, b)=>b.dialCode.length - a.dialCode.length);
2049
+ for (const c of sorted)if (fullDigits.startsWith(c.dialCode)) return c;
2050
+ return COUNTRIES[0];
2051
+ }
2052
+ const PhoneInput = ({ value, onChange, disabled, size, placeholder })=>{
2053
+ const { t } = useCodebitWebAntdTranslation();
2054
+ const countrySearchLabel = (c)=>{
2055
+ const name = t(`PhoneInput.countries.${c.code}`);
2056
+ return `${c.flag} ${name} +${c.dialCode}`;
2057
+ };
2058
+ const [selectedCountry, setSelectedCountry] = (0, external_react_.useState)(()=>detectCountry(value));
2059
+ const [displayValue, setDisplayValue] = (0, external_react_.useState)(()=>{
2060
+ if (!value) return '';
2061
+ const country = detectCountry(value);
2062
+ const localDigits = value.slice(country.dialCode.length);
2063
+ return applyMask(localDigits, country.code);
2064
+ });
1701
2065
  (0, external_react_.useEffect)(()=>{
1702
- const computeSelectedKey = ()=>{
1703
- const match = allMenuItems.find((item)=>item.key ? (0, external_react_router_namespaceObject.matchPath)({
1704
- path: item.key,
1705
- end: true
1706
- }, location.pathname) : false);
1707
- return match?.key ?? '';
1708
- };
1709
- setSelectedKeys(computeSelectedKey());
1710
- }, [
1711
- location.pathname,
1712
- allMenuItems
1713
- ]);
1714
- const handleLogout = (0, external_react_.useCallback)(async ()=>{
1715
- await logout?.();
1716
- if (isMobile) setDrawerVisible(false);
1717
- navigate('/');
1718
- }, [
1719
- logout,
1720
- isMobile,
1721
- setDrawerVisible,
1722
- navigate
1723
- ]);
1724
- const handleMenuClick = (0, external_react_.useCallback)(async (key)=>{
1725
- if (onMenuClick?.(key) === false) return;
1726
- try {
1727
- if (key === MENU_KEY_APP_LOGOUT) return void await handleLogout();
1728
- navigate(key);
1729
- } finally{
1730
- if (isMobile) setDrawerVisible(false);
1731
- }
2066
+ if (!value) return void setDisplayValue('');
2067
+ const country = detectCountry(value);
2068
+ setSelectedCountry(country);
2069
+ const localDigits = value.slice(country.dialCode.length);
2070
+ setDisplayValue(applyMask(localDigits, country.code));
1732
2071
  }, [
1733
- onMenuClick,
1734
- handleLogout,
1735
- navigate,
1736
- isMobile,
1737
- setDrawerVisible
1738
- ]);
1739
- const primaryMenu = (0, external_react_.useMemo)(()=>/*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Menu, {
1740
- theme: theme,
1741
- mode: 'inline',
1742
- selectedKeys: selectedKeys ? [
1743
- selectedKeys
1744
- ] : [],
1745
- onClick: ({ key })=>handleMenuClick(key),
1746
- items: filteredMenuItems,
1747
- className: LoggedMainContainer_module.menu
1748
- }, 'primary-menu'), [
1749
- selectedKeys,
1750
- filteredMenuItems,
1751
- theme,
1752
- handleMenuClick
2072
+ value
1753
2073
  ]);
1754
- (0, external_react_.useEffect)(()=>{
1755
- const checkScreenSize = ()=>setIsMobile(window.innerWidth < 768);
1756
- checkScreenSize();
1757
- window.addEventListener('resize', checkScreenSize);
1758
- return ()=>window.removeEventListener('resize', checkScreenSize);
1759
- }, []);
1760
- const menuContent = /*#__PURE__*/ (0, jsx_runtime.jsxs)(jsx_runtime.Fragment, {
1761
- children: [
1762
- primaryMenu,
1763
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Layout.Content, {
1764
- className: LoggedMainContainer_module.menuSpacer
1765
- }),
1766
- showVersion?.(user) && version && /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Menu, {
1767
- motion: false,
1768
- theme: theme,
1769
- mode: 'horizontal',
1770
- className: LoggedMainContainer_module.versionMenu,
1771
- disabled: true,
1772
- items: [
1773
- {
1774
- icon: collapsed ? version : `${t('LoggedMainContainer.version')}: ${version}`,
1775
- title: ''
1776
- }
1777
- ]
1778
- }, 'version-menu'),
1779
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Menu, {
1780
- motion: false,
1781
- theme: theme,
1782
- mode: 'inline',
1783
- selectedKeys: selectedKeys ? [
1784
- selectedKeys
1785
- ] : [],
1786
- onClick: ({ key })=>handleMenuClick(key),
1787
- className: LoggedMainContainer_module.bottomMenu,
1788
- items: memoizedBottomMenuItems
1789
- }, 'bottom-menu')
1790
- ]
1791
- });
1792
- const renderMenuContent = ()=>{
1793
- if (isMobile) return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Drawer, {
1794
- placement: 'left',
1795
- onClose: ()=>setDrawerVisible(false),
1796
- open: drawerVisible,
1797
- size: 250,
1798
- className: LoggedMainContainer_module.drawer,
1799
- classNames: {
1800
- body: LoggedMainContainer_module.drawerBody
1801
- },
1802
- children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Flex, {
1803
- vertical: true,
1804
- className: LoggedMainContainer_module.drawerFlex,
1805
- children: menuContent
1806
- })
1807
- });
1808
- return /*#__PURE__*/ (0, jsx_runtime.jsx)(Sider, {
1809
- theme: theme,
1810
- trigger: null,
1811
- collapsible: true,
1812
- collapsed: collapsed,
1813
- breakpoint: 'lg',
1814
- collapsedWidth: 80,
1815
- className: LoggedMainContainer_module.sider,
1816
- children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Layout, {
1817
- className: LoggedMainContainer_module.siderLayout,
1818
- children: menuContent
1819
- })
1820
- });
2074
+ const handleCountryChange = (countryCode)=>{
2075
+ const country = COUNTRIES.find((c)=>c.code === countryCode) ?? COUNTRIES[0];
2076
+ setSelectedCountry(country);
2077
+ setDisplayValue('');
2078
+ onChange?.('');
1821
2079
  };
1822
- const renderSecondarySidebar = ()=>{
1823
- if (!secondarySidebar) return null;
1824
- if (isMobile) return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Drawer, {
1825
- placement: 'right',
1826
- onClose: ()=>setSecondarySidebarDrawerVisible(false),
1827
- open: secondarySidebarDrawerVisible,
1828
- size: 280,
1829
- className: LoggedMainContainer_module.drawer,
1830
- title: null,
1831
- closeIcon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.CloseOutlined, {}),
1832
- children: secondarySidebar(user)
1833
- });
1834
- return /*#__PURE__*/ (0, jsx_runtime.jsx)(Sider, {
1835
- theme: theme,
1836
- width: secondarySidebarWidth,
1837
- children: secondarySidebar(user)
1838
- });
2080
+ const handleInputChange = (e)=>{
2081
+ const rawDigits = e.target.value.replaceAll(/\D/g, '').slice(0, selectedCountry.maxLocalDigits);
2082
+ setDisplayValue(applyMask(rawDigits, selectedCountry.code));
2083
+ onChange?.(selectedCountry.dialCode + rawDigits);
1839
2084
  };
1840
- return /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Layout, {
1841
- className: LoggedMainContainer_module.layout,
1842
- children: [
1843
- renderMenuContent(),
1844
- renderSecondarySidebar(),
1845
- /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Layout, {
1846
- children: [
1847
- /*#__PURE__*/ (0, jsx_runtime.jsxs)(Header, {
1848
- className: `${LoggedMainContainer_module.header} ${isMobile ? LoggedMainContainer_module.mobile : ''}`,
1849
- children: [
1850
- /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Space, {
1851
- children: isMobile ? /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1852
- type: 'text',
1853
- icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MenuOutlined, {}),
1854
- onClick: ()=>setDrawerVisible(true)
1855
- }) : /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1856
- type: 'text',
1857
- icon: collapsed ? /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MenuUnfoldOutlined, {}) : /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.MenuFoldOutlined, {}),
1858
- onClick: ()=>setCollapsed(!collapsed)
1859
- })
1860
- }),
1861
- /*#__PURE__*/ (0, jsx_runtime.jsxs)(external_antd_namespaceObject.Space, {
1862
- size: isMobile ? 'small' : 'middle',
1863
- className: `${LoggedMainContainer_module.headerSpace} ${isMobile ? LoggedMainContainer_module.mobile : ''}`,
1864
- children: [
1865
- secondarySidebar && isMobile && /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Button, {
1866
- type: 'text',
1867
- icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.WechatOutlined, {}),
1868
- onClick: ()=>setSecondarySidebarDrawerVisible(true)
1869
- }),
1870
- !isMobile && /*#__PURE__*/ (0, jsx_runtime.jsx)(Text, {
1871
- children: t('LoggedMainContainer.theme')
1872
- }),
1873
- /*#__PURE__*/ (0, jsx_runtime.jsx)(ThemeToggle, {})
1874
- ]
1875
- })
1876
- ]
1877
- }),
1878
- /*#__PURE__*/ (0, jsx_runtime.jsx)(Content, {
1879
- className: `${LoggedMainContainer_module.content} ${isMobile ? LoggedMainContainer_module.mobile : ''}`,
1880
- children: children
1881
- })
1882
- ]
1883
- })
1884
- ]
2085
+ const countrySelector = /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Select, {
2086
+ value: selectedCountry.code,
2087
+ onChange: handleCountryChange,
2088
+ disabled: disabled,
2089
+ size: size,
2090
+ style: {
2091
+ width: 110
2092
+ },
2093
+ popupMatchSelectWidth: false,
2094
+ showSearch: true,
2095
+ filterOption: (input, option)=>option?.searchLabel?.toLowerCase().includes(input.toLowerCase()) ?? false,
2096
+ options: COUNTRIES.map((c)=>({
2097
+ value: c.code,
2098
+ label: `${c.flag} +${c.dialCode}`,
2099
+ searchLabel: countrySearchLabel(c)
2100
+ })),
2101
+ optionRender: (option)=>option.data.searchLabel
1885
2102
  });
1886
- }
1887
- LoggedMainContainer.propTypes = {
1888
- children: external_prop_types_default().node.isRequired
2103
+ return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Input, {
2104
+ addonBefore: countrySelector,
2105
+ value: displayValue,
2106
+ onChange: handleInputChange,
2107
+ disabled: disabled,
2108
+ size: size,
2109
+ placeholder: placeholder
2110
+ });
2111
+ };
2112
+ PhoneInput.propTypes = {
2113
+ value: external_prop_types_default().string,
2114
+ onChange: external_prop_types_default().func,
2115
+ disabled: external_prop_types_default().bool,
2116
+ size: external_prop_types_default().oneOf([
2117
+ 'large',
2118
+ 'middle',
2119
+ 'small'
2120
+ ]),
2121
+ placeholder: external_prop_types_default().string
2122
+ };
2123
+ PhoneInput.format = (fullDigits)=>{
2124
+ if (!fullDigits) return '';
2125
+ const country = detectCountry(fullDigits);
2126
+ const localDigits = fullDigits.slice(country.dialCode.length);
2127
+ const masked = applyMask(localDigits, country.code);
2128
+ return `${country.flag} +${country.dialCode} ${masked}`;
1889
2129
  };
1890
2130
  const Login_module = {
1891
2131
  containerRow: "containerRow-lnjnDt",
@@ -2499,7 +2739,7 @@ var __webpack_exports__ = {};
2499
2739
  hasUpperCase: /[A-Z]/.test(value),
2500
2740
  hasLowerCase: /[a-z]/.test(value),
2501
2741
  hasNumbers: /\d/.test(value),
2502
- hasSpecialChars: /[!@#$%^&*(),.?":{}|<>]/.test(value)
2742
+ hasSpecialChars: /[^a-zA-Z0-9\s]/.test(value)
2503
2743
  };
2504
2744
  const failedChecks = Object.entries(strengthChecks).filter(([, passes])=>!passes).map(([key])=>key);
2505
2745
  if (0 === failedChecks.length) return Promise.resolve();
@@ -2688,6 +2928,7 @@ exports.OllamaOutlinedIcon = __webpack_exports__.OllamaOutlinedIcon;
2688
2928
  exports.PhoneInput = __webpack_exports__.PhoneInput;
2689
2929
  exports.TableContainer = __webpack_exports__.TableContainer;
2690
2930
  exports.ThemeToggle = __webpack_exports__.ThemeToggle;
2931
+ exports.UserMenu = __webpack_exports__.UserMenu;
2691
2932
  exports.useErrorMessage = __webpack_exports__.useErrorMessage;
2692
2933
  exports.useErrorModal = __webpack_exports__.useErrorModal;
2693
2934
  for(var __rspack_i in __webpack_exports__)if (-1 === [
@@ -2715,6 +2956,7 @@ for(var __rspack_i in __webpack_exports__)if (-1 === [
2715
2956
  "PhoneInput",
2716
2957
  "TableContainer",
2717
2958
  "ThemeToggle",
2959
+ "UserMenu",
2718
2960
  "useErrorMessage",
2719
2961
  "useErrorModal"
2720
2962
  ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];