@mjhls/mjh-framework 1.0.162 → 1.0.164

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +1 -1
  2. package/dist/index.es.js +93 -30
  3. package/dist/index.es.js.map +1 -1
  4. package/dist/index.js +93 -30
  5. package/dist/index.js.map +1 -1
  6. package/package.json +1 -1
package/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
 
2
- # mjh-framework v. 1.0.162
2
+ # mjh-framework v. 1.0.164
3
3
 
4
4
 
5
5
 
package/dist/index.es.js CHANGED
@@ -9994,7 +9994,7 @@ var NavMagazine = function NavMagazine(props) {
9994
9994
  React__default.createElement(
9995
9995
  'style',
9996
9996
  { jsx: 'true' },
9997
- '\n .sticky-home {\n position: relative;\n top: -3px;\n left: -6px;\n cursor: pointer;\n }\n .nav-item svg {\n margin-bottom: 2px;\n }\n #nav-login,\n #nav-logout,\n #nav-register {\n padding: 0.5rem;\n cursor: pointer;\n }\n #nav-mobile-login,\n #nav-mobile-logout,\n #nav-mobile-register {\n display: none;\n }\n #nav-mobile-logout,\n #nav-mobile-login {\n position: absolute;\n right: 1rem;\n }\n #nav-mobile-register {\n position: absolute;\n left: 1rem;\n }\n\n @media screen and (max-width: 1199px) {\n #nav-mobile-login,\n #nav-mobile-logout,\n #nav-mobile-register {\n display: block;\n }\n .navbar-top {\n flex-direction: row;\n justify-content: space-around !important;\n align-items: center;\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n width: 100%;\n }\n }\n\n @media screen and (max-width: 991px) {\n .mobile-nav .nav-toggle {\n width: 100%;\n }\n\n .android-nav {\n max-height: 80vh;\n }\n\n .ios-nav {\n max-height: none;\n }\n\n .navbar.bg-primary {\n overflow: auto;\n }\n\n .mobile-nav .nav-toggle .navbar-toggler {\n float: left;\n height: 45px;\n }\n .mobile-nav .nav-toggle .form-inline {\n float: right;\n margin: 4px 0px 0px 0px;\n }\n .mobile-nav .form-inline .mobile-search {\n width: auto;\n }\n .sticky-home {\n display: none;\n }\n .dropdown-menu {\n max-height: 315px;\n overflow: auto;\n }\n ::-webkit-scrollbar {\n width: 10px;\n }\n ::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background-color: rgba(214, 214, 214, 0.8);\n box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n }\n .navbar-expand-lg .show#basic-navbar-sub {\n display: block;\n }\n .navbar .mobile-nav .navbar-collapse.show {\n padding-bottom: 10px;\n border-bottom: 0.5px solid white;\n }\n .navbar .mobile-nav .navbar-collapse .form-inline {\n display: none;\n }\n .navbar .mobile-nav .navbar-collapse {\n margin-top: 15px;\n }\n .navbar .mobile-nav .navbar-collapse:last-child {\n border-bottom: none;\n margin-bottom: 0px;\n padding-bottom: 0px;\n margin-top: 0px;\n padding-top: 10px;\n }\n .navbar .mobile-nav .navbar-collapse .nav-footer ul {\n list-style-type: none;\n padding: inherit;\n margin-bottom: 0rem;\n }\n .navbar .mobile-nav .navbar-collapse .nav-footer .nav-link {\n text-transform: capitalize !important;\n font-weight: 300;\n }\n .navbar .mobile-nav .dropdown-item:focus {\n background-color: #696969;\n }\n .navbar .mobile-nav .dropdown-menu .dropdown-item {\n color: white;\n }\n .navbar .mobile-nav .dropdown-menu {\n background: inherit;\n border: none;\n }\n .navbar .mobile-nav .dropdown-menu.show {\n max-height: 100px;\n }\n }\n @media screen and (min-width: 992px) {\n #basic-navbar-sub {\n display: none !important;\n }\n .navbar .mobile-nav .dropdown-menu .dropdown-item {\n color: #696969;\n }\n .navbar .mobile-nav .dropdown-menu {\n background: white;\n border: 1 px solid #708090;\n }\n .mobile-nav .nav-toggle .form-inline {\n display: none;\n }\n }\n\n @media screen and (max-width: 376px) {\n .mobile-nav .nav-toggle .form-inline .mobile-search {\n width: 60%;\n }\n .mobile-nav .nav-toggle .form-inline {\n width: 70%;\n }\n }\n @media screen and (max-width: 328px) {\n .mobile-nav .nav-toggle .form-inline .mobile-search {\n margin-right: 5px;\n }\n }\n @media screen and (max-width: 767px) {\n .logo {\n width: 100%;\n padding-left: 10px;\n padding-right: 10px;\n }\n }\n '
9997
+ '\n .sticky-home {\n position: relative;\n top: -3px;\n left: -6px;\n cursor: pointer;\n }\n .nav-item svg {\n margin-bottom: 2px;\n }\n #nav-login,\n #nav-logout,\n #nav-register {\n padding: 0.5rem;\n cursor: pointer;\n }\n #nav-mobile-login,\n #nav-mobile-logout,\n #nav-mobile-register {\n display: none;\n }\n #nav-mobile-logout,\n #nav-mobile-login {\n position: absolute;\n right: 1rem;\n }\n #nav-mobile-register {\n position: absolute;\n left: 1rem;\n }\n\n @media screen and (max-width: 1199px) {\n #nav-mobile-login,\n #nav-mobile-logout,\n #nav-mobile-register {\n display: block;\n }\n .navbar-top {\n flex-direction: row;\n justify-content: space-around !important;\n align-items: center;\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n width: 100%;\n }\n }\n\n @media screen and (max-width: 991px) {\n .mobile-nav .nav-toggle {\n width: 100%;\n }\n\n .android-nav {\n max-height: 80vh;\n }\n\n .ios-nav {\n max-height: none;\n }\n\n .navbar.bg-primary {\n overflow: auto;\n }\n\n .mobile-nav .nav-toggle .navbar-toggler {\n float: left;\n height: 45px;\n }\n .mobile-nav .nav-toggle .form-inline {\n float: right;\n margin: 4px 0px 0px 0px;\n }\n .mobile-nav .form-inline .mobile-search {\n width: auto;\n }\n .sticky-home {\n display: none;\n }\n .dropdown-menu {\n max-height: 315px;\n overflow: auto;\n }\n ::-webkit-scrollbar {\n width: 10px;\n }\n ::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background-color: rgba(214, 214, 214, 0.8);\n box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n }\n .navbar-expand-lg .show#basic-navbar-sub {\n display: block;\n }\n .navbar .mobile-nav .navbar-collapse.show {\n padding-bottom: 10px;\n border-bottom: 0.5px solid white;\n }\n .navbar .mobile-nav .navbar-collapse .form-inline {\n display: none;\n }\n .navbar .mobile-nav .navbar-collapse {\n margin-top: 15px;\n }\n .navbar .mobile-nav .navbar-collapse:last-child {\n border-bottom: none;\n margin-bottom: 0px;\n padding-bottom: 0px;\n margin-top: 0px;\n padding-top: 10px;\n }\n .navbar .mobile-nav .navbar-collapse .nav-footer ul {\n list-style-type: none;\n padding: inherit;\n margin-bottom: 0rem;\n }\n .navbar .mobile-nav .navbar-collapse .nav-footer .nav-link {\n text-transform: capitalize !important;\n font-weight: 300;\n }\n .navbar .mobile-nav .dropdown-item:focus {\n background-color: #696969;\n }\n .navbar .mobile-nav .dropdown-menu .dropdown-item {\n color: white;\n }\n .navbar .mobile-nav .dropdown-menu {\n background: inherit;\n border: none;\n }\n .navbar .mobile-nav .dropdown-menu.show {\n max-height: 100px;\n }\n }\n @media screen and (min-width: 992px) {\n #basic-navbar-sub {\n display: none !important;\n }\n .navbar .mobile-nav .dropdown-menu .dropdown-item {\n color: #696969;\n }\n .navbar .mobile-nav .dropdown-menu {\n background: white;\n border: 1 px solid #708090;\n }\n .mobile-nav .nav-toggle .form-inline {\n display: none;\n }\n }\n\n @media screen and (max-width: 376px) {\n .mobile-nav .nav-toggle .form-inline .mobile-search {\n width: 60%;\n }\n .mobile-nav .nav-toggle .form-inline {\n width: 70%;\n }\n }\n @media screen and (max-width: 328px) {\n .mobile-nav .nav-toggle .form-inline .mobile-search {\n margin-right: 5px;\n }\n }\n @media screen and (max-width: 767px) {\n .logo {\n max-width: 100%;\n padding-left: 10px;\n padding-right: 10px;\n }\n }\n '
9998
9998
  )
9999
9999
  );
10000
10000
  };
@@ -14873,6 +14873,8 @@ var Poll = function Poll(_ref) {
14873
14873
  );
14874
14874
  };
14875
14875
 
14876
+ var numberOfPaginations = main_35 ? 4 : 10;
14877
+
14876
14878
  var Quiz = function Quiz(_ref) {
14877
14879
  var quizzes = _ref.quizzes,
14878
14880
  serializerArguments = _ref.serializerArguments;
@@ -14889,45 +14891,106 @@ var Quiz = function Quiz(_ref) {
14889
14891
  showAnswer = _useState4[0],
14890
14892
  setShowAnswer = _useState4[1];
14891
14893
 
14892
- var changePage = function changePage(page) {
14893
- if (page > 0 && page <= pageCount) {
14894
- setShowAnswer(false);
14895
- setCurrentPage(page);
14896
- }
14894
+ var _useState5 = useState(0),
14895
+ _useState6 = slicedToArray(_useState5, 2),
14896
+ startIndex = _useState6[0],
14897
+ setStartIndex = _useState6[1];
14898
+
14899
+ var _useState7 = useState(numberOfPaginations - 1),
14900
+ _useState8 = slicedToArray(_useState7, 2),
14901
+ endIndex = _useState8[0],
14902
+ setEndIndex = _useState8[1];
14903
+
14904
+ var _useState9 = useState([]),
14905
+ _useState10 = slicedToArray(_useState9, 2),
14906
+ pages = _useState10[0],
14907
+ setPages = _useState10[1];
14908
+
14909
+ useEffect(function () {
14910
+ var totalPages = Array.from({ length: pageCount }, function (v, k) {
14911
+ return k + 1;
14912
+ });
14913
+ var filteredPages = totalPages.slice(startIndex, endIndex + 1);
14914
+ setPages(filteredPages);
14915
+ }, [startIndex, endIndex, pageCount]);
14916
+
14917
+ var validateIndex = function validateIndex(index) {
14918
+ return index >= 0 && index <= pageCount - 1;
14897
14919
  };
14898
14920
 
14899
- var renderPagination = function renderPagination() {
14900
- var pages = [];
14901
-
14902
- var _loop = function _loop(i) {
14903
- pages.push(React__default.createElement(
14904
- Pagination.Item,
14905
- { onClick: function onClick() {
14906
- return changePage(i);
14907
- }, active: i === currentPage },
14908
- i
14909
- ));
14910
- };
14921
+ var changePage = function changePage(control) {
14922
+ setShowAnswer(false);
14923
+ switch (control) {
14924
+ case 'first':
14925
+ setCurrentPage(1);
14926
+ setStartIndex(0);
14927
+ setEndIndex(numberOfPaginations - 1);
14928
+ break;
14929
+ case 'last':
14930
+ setCurrentPage(pageCount);
14931
+ setStartIndex(pageCount - pageCount % numberOfPaginations);
14932
+ setEndIndex(pageCount - pageCount % numberOfPaginations + numberOfPaginations - 1);
14933
+ break;
14934
+ case 'next':
14935
+ setCurrentPage(currentPage + 1);
14936
+ if (currentPage % numberOfPaginations === 0) {
14937
+ setStartIndex(startIndex + numberOfPaginations);
14938
+ setEndIndex(endIndex + numberOfPaginations);
14939
+ }
14940
+ break;
14941
+ case 'prev':
14942
+ setCurrentPage(currentPage - 1);
14943
+ if (currentPage % numberOfPaginations === 1) {
14944
+ setStartIndex(startIndex - numberOfPaginations);
14945
+ setEndIndex(endIndex - numberOfPaginations);
14946
+ }
14947
+ break;
14948
+ default:
14949
+ setCurrentPage(control);
14950
+ }
14951
+ };
14911
14952
 
14912
- for (var i = 1; i <= pageCount; i++) {
14913
- _loop(i);
14953
+ var renderNewPages = function renderNewPages(section) {
14954
+ if (section === 'prev') {
14955
+ setStartIndex(startIndex - numberOfPaginations);
14956
+ setEndIndex(endIndex - numberOfPaginations);
14957
+ } else if (section === 'next') {
14958
+ setStartIndex(startIndex + numberOfPaginations);
14959
+ setEndIndex(endIndex + numberOfPaginations);
14914
14960
  }
14961
+ };
14962
+
14963
+ var renderPagination = function renderPagination() {
14915
14964
  return React__default.createElement(
14916
14965
  Pagination,
14917
- { className: 'p-0 m-0' },
14966
+ { className: 'p-0 m-0', size: main_35 && 'sm' },
14918
14967
  React__default.createElement(Pagination.First, { onClick: function onClick() {
14919
- return changePage(1);
14920
- } }),
14968
+ return changePage('first');
14969
+ }, disabled: currentPage === 1 }),
14921
14970
  React__default.createElement(Pagination.Prev, { onClick: function onClick() {
14922
- return changePage(currentPage - 1);
14923
- } }),
14924
- pages,
14971
+ return changePage('prev');
14972
+ }, disabled: currentPage === 1 }),
14973
+ React__default.createElement(Pagination.Ellipsis, { onClick: function onClick() {
14974
+ return renderNewPages('prev');
14975
+ }, disabled: !validateIndex(startIndex - numberOfPaginations) }),
14976
+ pages.map(function (page) {
14977
+ return React__default.createElement(
14978
+ Pagination.Item,
14979
+ { key: page, active: page === currentPage, onClick: function onClick() {
14980
+ return changePage(page);
14981
+ } },
14982
+ page
14983
+ );
14984
+ }),
14985
+ React__default.createElement(Pagination.Ellipsis, { onClick: function onClick() {
14986
+ return renderNewPages('next');
14987
+ }, disabled: !validateIndex(startIndex + numberOfPaginations) }),
14925
14988
  React__default.createElement(Pagination.Next, { onClick: function onClick() {
14926
- return changePage(currentPage + 1);
14927
- } }),
14989
+ return changePage('next');
14990
+ }, disabled: currentPage === pageCount }),
14928
14991
  React__default.createElement(Pagination.Last, { onClick: function onClick() {
14929
- return changePage(pageCount);
14930
- } })
14992
+ return changePage('last');
14993
+ }, disabled: currentPage === pageCount })
14931
14994
  );
14932
14995
  };
14933
14996