@nulogy/components 11.2.0 → 11.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/main.js CHANGED
@@ -45028,57 +45028,61 @@
45028
45028
  };
45029
45029
  }, addStyledProps);
45030
45030
 
45031
- var ApplicationFrame = function ApplicationFrame(_a) {
45032
- var navBar = _a.navBar,
45033
- children = _a.children,
45034
- environment = _a.environment,
45035
- props = __rest$3(_a, ["navBar", "children", "environment"]);
45036
-
45037
- return /*#__PURE__*/React__default["default"].createElement(Flex, Object.assign({
45038
- flexDirection: "column",
45039
- minHeight: "100vh"
45040
- }, props), /*#__PURE__*/React__default["default"].createElement(Box, {
45041
- position: "sticky",
45042
- top: "0",
45043
- zIndex: "navBar"
45044
- }, environment && /*#__PURE__*/React__default["default"].createElement(EnvironmentBanner, null, environment), navBar), /*#__PURE__*/React__default["default"].createElement(Flex, {
45045
- flexDirection: "column",
45046
- position: "relative",
45047
- flexGrow: 1
45048
- }, children));
45049
- };
45031
+ function useMediaQuery(q) {
45032
+ var _a;
45050
45033
 
45051
- function useMediaQuery(query) {
45052
45034
  var isUnsupported = typeof window === "undefined" || typeof window.matchMedia === "undefined";
45053
-
45054
- var getMatches = function getMatches(query) {
45035
+ var theme = styled.useTheme();
45036
+ var query = ((_a = theme === null || theme === void 0 ? void 0 : theme.breakpoints) === null || _a === void 0 ? void 0 : _a[q]) ? "(min-width: " + theme.breakpoints[q] + ")" : q;
45037
+ var getMatches = React.useCallback(function (query) {
45055
45038
  if (isUnsupported) {
45056
45039
  return false;
45057
45040
  }
45058
45041
 
45059
45042
  return window.matchMedia(query).matches;
45060
- };
45043
+ }, [isUnsupported]);
45061
45044
 
45062
45045
  var _useState = React.useState(getMatches(query)),
45063
45046
  matches = _useState[0],
45064
45047
  setMatches = _useState[1];
45065
45048
 
45066
- function handleChange() {
45067
- setMatches(getMatches(query));
45068
- }
45069
-
45070
45049
  React.useEffect(function () {
45071
45050
  if (isUnsupported) return;
45072
45051
  var matchMedia = window.matchMedia(query);
45052
+
45053
+ function handleChange() {
45054
+ setMatches(getMatches(query));
45055
+ }
45056
+
45073
45057
  handleChange();
45074
45058
  matchMedia.addEventListener("change", handleChange);
45075
45059
  return function () {
45076
45060
  matchMedia.removeEventListener("change", handleChange);
45077
45061
  };
45078
- }, [query]);
45062
+ }, [getMatches, isUnsupported, query]);
45079
45063
  return matches;
45080
45064
  }
45081
45065
 
45066
+ var ApplicationFrame = function ApplicationFrame(_a) {
45067
+ var navBar = _a.navBar,
45068
+ children = _a.children,
45069
+ environment = _a.environment,
45070
+ props = __rest$3(_a, ["navBar", "children", "environment"]);
45071
+
45072
+ return /*#__PURE__*/React__default["default"].createElement(Flex, Object.assign({
45073
+ flexDirection: "column",
45074
+ minHeight: "100vh"
45075
+ }, props), /*#__PURE__*/React__default["default"].createElement(Box, {
45076
+ position: "sticky",
45077
+ top: "0",
45078
+ zIndex: "navBar"
45079
+ }, environment && /*#__PURE__*/React__default["default"].createElement(EnvironmentBanner, null, environment), navBar), /*#__PURE__*/React__default["default"].createElement(Flex, {
45080
+ flexDirection: "column",
45081
+ position: "relative",
45082
+ flexGrow: 1
45083
+ }, children));
45084
+ };
45085
+
45082
45086
  var Header = function Header(_a) {
45083
45087
  var _b, _c;
45084
45088
 
@@ -49829,6 +49833,7 @@
49829
49833
 
49830
49834
  var de_DE = {
49831
49835
  "close menu": "Men\xFC schlie\xDFen",
49836
+ "menu options": "Men\xFCoptionen",
49832
49837
  close: "Schlie\xDFen",
49833
49838
  "collapse row": "Zeile verbergen",
49834
49839
  "date range": "Datumsbereich",
@@ -49870,6 +49875,7 @@
49870
49875
  };
49871
49876
  var en_US = {
49872
49877
  "close menu": "Close menu",
49878
+ "menu options": "Menu options",
49873
49879
  close: "Close",
49874
49880
  "collapse row": "Collapse row",
49875
49881
  "date range": "Date range",
@@ -49911,6 +49917,7 @@
49911
49917
  };
49912
49918
  var es_MX = {
49913
49919
  "close menu": "Cerrar men\xFA",
49920
+ "menu options": "Opciones del men\xFA",
49914
49921
  close: "Cerrar",
49915
49922
  "collapse row": "Colapsar fila",
49916
49923
  "date range": "Rango de fechas",
@@ -49952,6 +49959,7 @@
49952
49959
  };
49953
49960
  var fr_FR = {
49954
49961
  "close menu": "Fermer le menu",
49962
+ "menu options": "Options du menu",
49955
49963
  close: "Fermer",
49956
49964
  "collapse row": "R\xE9duire la ligne",
49957
49965
  "date range": "Plage de dates",
@@ -49993,6 +50001,7 @@
49993
50001
  };
49994
50002
  var nl_NL = {
49995
50003
  "close menu": "Menu sluiten",
50004
+ "menu options": "Menu-opties",
49996
50005
  close: "Sluiten",
49997
50006
  "collapse row": "Rij samenvouwen",
49998
50007
  "date range": "Datumbereik",
@@ -50034,6 +50043,7 @@
50034
50043
  };
50035
50044
  var pl_PL = {
50036
50045
  "close menu": "Zamknij menu",
50046
+ "menu options": "Opcje menu",
50037
50047
  close: "Zamknij",
50038
50048
  "collapse row": "Zwi\u0144 wiersz",
50039
50049
  "date range": "Zakres daty",
@@ -50075,6 +50085,7 @@
50075
50085
  };
50076
50086
  var pt_BR = {
50077
50087
  "close menu": "Fechar menu",
50088
+ "menu options": "Op\xE7\xF5es do menu",
50078
50089
  close: "Fechar",
50079
50090
  "collapse row": "Recolher fila",
50080
50091
  "date range": "Intervalo de datas",
@@ -50115,7 +50126,8 @@
50115
50126
  "time range": "Intervalo de hor\xE1rios"
50116
50127
  };
50117
50128
  var ro_RO = {
50118
- "close menu": "Close menu",
50129
+ "close menu": "\xCEnchidere meniu",
50130
+ "menu options": "Op\u021Biuni meniu",
50119
50131
  close: "\xCEnchidere",
50120
50132
  "collapse row": "Restr\xE2ngere r\xE2nd",
50121
50133
  "date range": "Interval dat\u0103",
@@ -50157,6 +50169,7 @@
50157
50169
  };
50158
50170
  var zh_CN = {
50159
50171
  "close menu": "\u5173\u95ED\u83DC\u5355",
50172
+ "menu options": "\u83DC\u5355\u9009\u9879",
50160
50173
  close: "\u5173\u95ED",
50161
50174
  "collapse row": "\u6298\u53E0\u884C",
50162
50175
  "date range": "\u65E5\u671F\u8303\u56F4",
@@ -50321,7 +50334,13 @@
50321
50334
  small: "768px",
50322
50335
  medium: "1024px",
50323
50336
  large: "1360px",
50324
- extraLarge: "1920px"
50337
+ extraLarge: "1920px",
50338
+ phonePortrait: "320px",
50339
+ phoneLandscape: "640px",
50340
+ tabletPortrait: "768px",
50341
+ tabletLandscape: "1024px",
50342
+ laptop: "1280px",
50343
+ desktop: "1440px"
50325
50344
  },
50326
50345
  zIndices: {
50327
50346
  content: 100,
@@ -50469,7 +50488,13 @@
50469
50488
  small: "768px",
50470
50489
  medium: "1024px",
50471
50490
  large: "1360px",
50472
- extraLarge: "1920px"
50491
+ extraLarge: "1920px",
50492
+ phonePortrait: "320px",
50493
+ phoneLandscape: "640px",
50494
+ tabletPortrait: "768px",
50495
+ tabletLandscape: "1024px",
50496
+ laptop: "1280px",
50497
+ desktop: "1440px"
50473
50498
  },
50474
50499
  zIndices: {
50475
50500
  content: 100,
@@ -50617,7 +50642,13 @@
50617
50642
  small: "768px",
50618
50643
  medium: "1024px",
50619
50644
  large: "1360px",
50620
- extraLarge: "1920px"
50645
+ extraLarge: "1920px",
50646
+ phonePortrait: "320px",
50647
+ phoneLandscape: "640px",
50648
+ tabletPortrait: "768px",
50649
+ tabletLandscape: "1024px",
50650
+ laptop: "1280px",
50651
+ desktop: "1440px"
50621
50652
  },
50622
50653
  zIndices: {
50623
50654
  content: 100,
@@ -50765,7 +50796,13 @@
50765
50796
  small: "768px",
50766
50797
  medium: "1024px",
50767
50798
  large: "1360px",
50768
- extraLarge: "1920px"
50799
+ extraLarge: "1920px",
50800
+ phonePortrait: "320px",
50801
+ phoneLandscape: "640px",
50802
+ tabletPortrait: "768px",
50803
+ tabletLandscape: "1024px",
50804
+ laptop: "1280px",
50805
+ desktop: "1440px"
50769
50806
  },
50770
50807
  zIndices: {
50771
50808
  content: 100,
@@ -54558,6 +54595,7 @@
54558
54595
  exports.TruncatedText = TruncatedText;
54559
54596
  exports.addStyledProps = addStyledProps;
54560
54597
  exports.toast = toast;
54598
+ exports.useMediaQuery = useMediaQuery;
54561
54599
  exports.useWindowDimensions = useWindowDimensions;
54562
54600
 
54563
54601
  Object.defineProperty(exports, '__esModule', { value: true });
@@ -45011,57 +45011,61 @@ var Divider$1 = styled.hr.withConfig({
45011
45011
  };
45012
45012
  }, addStyledProps);
45013
45013
 
45014
- var ApplicationFrame = function ApplicationFrame(_a) {
45015
- var navBar = _a.navBar,
45016
- children = _a.children,
45017
- environment = _a.environment,
45018
- props = __rest$3(_a, ["navBar", "children", "environment"]);
45019
-
45020
- return /*#__PURE__*/React__default.createElement(Flex, Object.assign({
45021
- flexDirection: "column",
45022
- minHeight: "100vh"
45023
- }, props), /*#__PURE__*/React__default.createElement(Box, {
45024
- position: "sticky",
45025
- top: "0",
45026
- zIndex: "navBar"
45027
- }, environment && /*#__PURE__*/React__default.createElement(EnvironmentBanner, null, environment), navBar), /*#__PURE__*/React__default.createElement(Flex, {
45028
- flexDirection: "column",
45029
- position: "relative",
45030
- flexGrow: 1
45031
- }, children));
45032
- };
45014
+ function useMediaQuery(q) {
45015
+ var _a;
45033
45016
 
45034
- function useMediaQuery(query) {
45035
45017
  var isUnsupported = typeof window === "undefined" || typeof window.matchMedia === "undefined";
45036
-
45037
- var getMatches = function getMatches(query) {
45018
+ var theme = useTheme();
45019
+ var query = ((_a = theme === null || theme === void 0 ? void 0 : theme.breakpoints) === null || _a === void 0 ? void 0 : _a[q]) ? "(min-width: " + theme.breakpoints[q] + ")" : q;
45020
+ var getMatches = useCallback(function (query) {
45038
45021
  if (isUnsupported) {
45039
45022
  return false;
45040
45023
  }
45041
45024
 
45042
45025
  return window.matchMedia(query).matches;
45043
- };
45026
+ }, [isUnsupported]);
45044
45027
 
45045
45028
  var _useState = useState(getMatches(query)),
45046
45029
  matches = _useState[0],
45047
45030
  setMatches = _useState[1];
45048
45031
 
45049
- function handleChange() {
45050
- setMatches(getMatches(query));
45051
- }
45052
-
45053
45032
  useEffect(function () {
45054
45033
  if (isUnsupported) return;
45055
45034
  var matchMedia = window.matchMedia(query);
45035
+
45036
+ function handleChange() {
45037
+ setMatches(getMatches(query));
45038
+ }
45039
+
45056
45040
  handleChange();
45057
45041
  matchMedia.addEventListener("change", handleChange);
45058
45042
  return function () {
45059
45043
  matchMedia.removeEventListener("change", handleChange);
45060
45044
  };
45061
- }, [query]);
45045
+ }, [getMatches, isUnsupported, query]);
45062
45046
  return matches;
45063
45047
  }
45064
45048
 
45049
+ var ApplicationFrame = function ApplicationFrame(_a) {
45050
+ var navBar = _a.navBar,
45051
+ children = _a.children,
45052
+ environment = _a.environment,
45053
+ props = __rest$3(_a, ["navBar", "children", "environment"]);
45054
+
45055
+ return /*#__PURE__*/React__default.createElement(Flex, Object.assign({
45056
+ flexDirection: "column",
45057
+ minHeight: "100vh"
45058
+ }, props), /*#__PURE__*/React__default.createElement(Box, {
45059
+ position: "sticky",
45060
+ top: "0",
45061
+ zIndex: "navBar"
45062
+ }, environment && /*#__PURE__*/React__default.createElement(EnvironmentBanner, null, environment), navBar), /*#__PURE__*/React__default.createElement(Flex, {
45063
+ flexDirection: "column",
45064
+ position: "relative",
45065
+ flexGrow: 1
45066
+ }, children));
45067
+ };
45068
+
45065
45069
  var Header = function Header(_a) {
45066
45070
  var _b, _c;
45067
45071
 
@@ -49812,6 +49816,7 @@ var i18next = new I18n();
49812
49816
 
49813
49817
  var de_DE = {
49814
49818
  "close menu": "Men\xFC schlie\xDFen",
49819
+ "menu options": "Men\xFCoptionen",
49815
49820
  close: "Schlie\xDFen",
49816
49821
  "collapse row": "Zeile verbergen",
49817
49822
  "date range": "Datumsbereich",
@@ -49853,6 +49858,7 @@ var de_DE = {
49853
49858
  };
49854
49859
  var en_US = {
49855
49860
  "close menu": "Close menu",
49861
+ "menu options": "Menu options",
49856
49862
  close: "Close",
49857
49863
  "collapse row": "Collapse row",
49858
49864
  "date range": "Date range",
@@ -49894,6 +49900,7 @@ var en_US = {
49894
49900
  };
49895
49901
  var es_MX = {
49896
49902
  "close menu": "Cerrar men\xFA",
49903
+ "menu options": "Opciones del men\xFA",
49897
49904
  close: "Cerrar",
49898
49905
  "collapse row": "Colapsar fila",
49899
49906
  "date range": "Rango de fechas",
@@ -49935,6 +49942,7 @@ var es_MX = {
49935
49942
  };
49936
49943
  var fr_FR = {
49937
49944
  "close menu": "Fermer le menu",
49945
+ "menu options": "Options du menu",
49938
49946
  close: "Fermer",
49939
49947
  "collapse row": "R\xE9duire la ligne",
49940
49948
  "date range": "Plage de dates",
@@ -49976,6 +49984,7 @@ var fr_FR = {
49976
49984
  };
49977
49985
  var nl_NL = {
49978
49986
  "close menu": "Menu sluiten",
49987
+ "menu options": "Menu-opties",
49979
49988
  close: "Sluiten",
49980
49989
  "collapse row": "Rij samenvouwen",
49981
49990
  "date range": "Datumbereik",
@@ -50017,6 +50026,7 @@ var nl_NL = {
50017
50026
  };
50018
50027
  var pl_PL = {
50019
50028
  "close menu": "Zamknij menu",
50029
+ "menu options": "Opcje menu",
50020
50030
  close: "Zamknij",
50021
50031
  "collapse row": "Zwi\u0144 wiersz",
50022
50032
  "date range": "Zakres daty",
@@ -50058,6 +50068,7 @@ var pl_PL = {
50058
50068
  };
50059
50069
  var pt_BR = {
50060
50070
  "close menu": "Fechar menu",
50071
+ "menu options": "Op\xE7\xF5es do menu",
50061
50072
  close: "Fechar",
50062
50073
  "collapse row": "Recolher fila",
50063
50074
  "date range": "Intervalo de datas",
@@ -50098,7 +50109,8 @@ var pt_BR = {
50098
50109
  "time range": "Intervalo de hor\xE1rios"
50099
50110
  };
50100
50111
  var ro_RO = {
50101
- "close menu": "Close menu",
50112
+ "close menu": "\xCEnchidere meniu",
50113
+ "menu options": "Op\u021Biuni meniu",
50102
50114
  close: "\xCEnchidere",
50103
50115
  "collapse row": "Restr\xE2ngere r\xE2nd",
50104
50116
  "date range": "Interval dat\u0103",
@@ -50140,6 +50152,7 @@ var ro_RO = {
50140
50152
  };
50141
50153
  var zh_CN = {
50142
50154
  "close menu": "\u5173\u95ED\u83DC\u5355",
50155
+ "menu options": "\u83DC\u5355\u9009\u9879",
50143
50156
  close: "\u5173\u95ED",
50144
50157
  "collapse row": "\u6298\u53E0\u884C",
50145
50158
  "date range": "\u65E5\u671F\u8303\u56F4",
@@ -50304,7 +50317,13 @@ var themes = {
50304
50317
  small: "768px",
50305
50318
  medium: "1024px",
50306
50319
  large: "1360px",
50307
- extraLarge: "1920px"
50320
+ extraLarge: "1920px",
50321
+ phonePortrait: "320px",
50322
+ phoneLandscape: "640px",
50323
+ tabletPortrait: "768px",
50324
+ tabletLandscape: "1024px",
50325
+ laptop: "1280px",
50326
+ desktop: "1440px"
50308
50327
  },
50309
50328
  zIndices: {
50310
50329
  content: 100,
@@ -50452,7 +50471,13 @@ var themes = {
50452
50471
  small: "768px",
50453
50472
  medium: "1024px",
50454
50473
  large: "1360px",
50455
- extraLarge: "1920px"
50474
+ extraLarge: "1920px",
50475
+ phonePortrait: "320px",
50476
+ phoneLandscape: "640px",
50477
+ tabletPortrait: "768px",
50478
+ tabletLandscape: "1024px",
50479
+ laptop: "1280px",
50480
+ desktop: "1440px"
50456
50481
  },
50457
50482
  zIndices: {
50458
50483
  content: 100,
@@ -50600,7 +50625,13 @@ var themes = {
50600
50625
  small: "768px",
50601
50626
  medium: "1024px",
50602
50627
  large: "1360px",
50603
- extraLarge: "1920px"
50628
+ extraLarge: "1920px",
50629
+ phonePortrait: "320px",
50630
+ phoneLandscape: "640px",
50631
+ tabletPortrait: "768px",
50632
+ tabletLandscape: "1024px",
50633
+ laptop: "1280px",
50634
+ desktop: "1440px"
50604
50635
  },
50605
50636
  zIndices: {
50606
50637
  content: 100,
@@ -50748,7 +50779,13 @@ var themes = {
50748
50779
  small: "768px",
50749
50780
  medium: "1024px",
50750
50781
  large: "1360px",
50751
- extraLarge: "1920px"
50782
+ extraLarge: "1920px",
50783
+ phonePortrait: "320px",
50784
+ phoneLandscape: "640px",
50785
+ tabletPortrait: "768px",
50786
+ tabletLandscape: "1024px",
50787
+ laptop: "1280px",
50788
+ desktop: "1440px"
50752
50789
  },
50753
50790
  zIndices: {
50754
50791
  content: 100,
@@ -54442,4 +54479,4 @@ var TruncatedText = function TruncatedText(_a) {
54442
54479
  }, props), children);
54443
54480
  };
54444
54481
 
54445
- export { ALL_NDS_LOCALES, Alert$1 as Alert, AnimatedBox, ApplicationFrame, AsyncSelect, Banner, BottomSheet, BottomSheetParts, Box, BrandLogoContainer, NavBar as BrandedNavBar, Branding, Breadcrumbs, Button, ButtonGroup, Card, CardSet, Checkbox, CheckboxGroup, ControlIcon, DangerButton, DatePicker, DateRange, DesktopMenu, Divider$1 as Divider, DropdownButton, DropdownItem, DropdownLink, DropdownMenu, DropdownText, EnvironmentBanner, Field, FieldLabel, Fieldset, Flex, Form, FormSection, Header, Heading1, Heading2, Heading3, Heading4, HelpText$1 as HelpText, Icon, IconicButton, InlineIcon, InlineValidation, Input, Link, List, ListItem, LoadingAnimation, MenuTrigger, Modal, NDSProvider, NavBarBackground, NotificationTypes, Overlay, Page, Pagination, PrimaryButton, QuietButton, Radio, RadioGroup, RangeContainer, RequirementText, ReactSelect as Select, SelectClearIndicator, SelectContainer, SelectControl, SelectDropdownIndicator, SelectInput, SelectMenu, SelectMultiValue, SelectOption$1 as SelectOption, Sidebar, SmallNavBar, SortingTable, StatusIndicator, StatusIndicatorValues, Summary, SummaryDivider, SummaryItem, Switch$1 as Switch, Switcher, Tab, Table, Tabs, Text, Textarea, TimePicker, TimeRange, Toast, ToastContainer, ToggleComponent as Toggle, Tooltip, TruncatedText, addStyledProps, toast, useWindowDimensions };
54482
+ export { ALL_NDS_LOCALES, Alert$1 as Alert, AnimatedBox, ApplicationFrame, AsyncSelect, Banner, BottomSheet, BottomSheetParts, Box, BrandLogoContainer, NavBar as BrandedNavBar, Branding, Breadcrumbs, Button, ButtonGroup, Card, CardSet, Checkbox, CheckboxGroup, ControlIcon, DangerButton, DatePicker, DateRange, DesktopMenu, Divider$1 as Divider, DropdownButton, DropdownItem, DropdownLink, DropdownMenu, DropdownText, EnvironmentBanner, Field, FieldLabel, Fieldset, Flex, Form, FormSection, Header, Heading1, Heading2, Heading3, Heading4, HelpText$1 as HelpText, Icon, IconicButton, InlineIcon, InlineValidation, Input, Link, List, ListItem, LoadingAnimation, MenuTrigger, Modal, NDSProvider, NavBarBackground, NotificationTypes, Overlay, Page, Pagination, PrimaryButton, QuietButton, Radio, RadioGroup, RangeContainer, RequirementText, ReactSelect as Select, SelectClearIndicator, SelectContainer, SelectControl, SelectDropdownIndicator, SelectInput, SelectMenu, SelectMultiValue, SelectOption$1 as SelectOption, Sidebar, SmallNavBar, SortingTable, StatusIndicator, StatusIndicatorValues, Summary, SummaryDivider, SummaryItem, Switch$1 as Switch, Switcher, Tab, Table, Tabs, Text, Textarea, TimePicker, TimeRange, Toast, ToastContainer, ToggleComponent as Toggle, Tooltip, TruncatedText, addStyledProps, toast, useMediaQuery, useWindowDimensions };
@@ -0,0 +1,16 @@
1
+ import React from "react";
2
+ import { BackLink } from "./components/BackLink";
3
+ import { Menu } from "./components/Menu";
4
+ import { MenuItem } from "./components/MenuItem";
5
+ import { PageTitle } from "./components/PageTitle";
6
+ export interface TopBarProps {
7
+ children?: React.ReactNode;
8
+ }
9
+ export default function Root({ children }: TopBarProps): React.JSX.Element;
10
+ export declare const TopBar: {
11
+ Root: typeof Root;
12
+ PageTitle: typeof PageTitle;
13
+ BackLink: typeof BackLink;
14
+ Menu: typeof Menu;
15
+ MenuItem: typeof MenuItem;
16
+ };
@@ -0,0 +1,18 @@
1
+ /// <reference types="react" />
2
+ import { StyledProps } from "../StyledProps";
3
+ declare const MenuItemList: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
4
+ declare const Header: import("styled-components").StyledComponent<"header", import("styled-components").DefaultTheme, {}, never>;
5
+ declare const Navigation: import("styled-components").StyledComponent<"nav", import("styled-components").DefaultTheme, {}, never>;
6
+ declare const StylelessButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, StyledProps, never>;
7
+ declare const MenuButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, StyledProps, never>;
8
+ declare const NavigationItemsList: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
9
+ declare const StyledBackLink: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, {}, never>;
10
+ declare const StyledPageTitle: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {}, never>;
11
+ declare const Overlay: import("styled-components").StyledComponent<import("framer-motion").CustomDomComponent<import("@reach/utils/dist/declarations/src/polymorphic").Merge<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
12
+ ref?: import("react").Ref<HTMLDivElement>;
13
+ }, import("@reach/dialog/dist/declarations/src").DialogOverlayProps & {
14
+ as?: "div";
15
+ }>>, import("styled-components").DefaultTheme, {}, never>;
16
+ declare const TileLink: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, {}, never>;
17
+ declare const StyledMenuItem: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLLIElement, import("framer-motion").HTMLMotionProps<"li">>, import("styled-components").DefaultTheme, {}, never>;
18
+ export { Navigation, Header, NavigationItemsList, StyledBackLink, StyledPageTitle, Overlay, TileLink, StylelessButton, MenuItemList, MenuButton, StyledMenuItem, };
@@ -0,0 +1,7 @@
1
+ import React, { ComponentProps } from "react";
2
+ import { MaxWidthProps } from "styled-system";
3
+ import { StyledBackLink } from "../TopBar.styled";
4
+ interface BackLinkProps extends MaxWidthProps, ComponentProps<typeof StyledBackLink> {
5
+ }
6
+ export declare function BackLink({ children, maxWidth, ...props }: BackLinkProps): React.JSX.Element;
7
+ export {};
@@ -0,0 +1,6 @@
1
+ import React from "react";
2
+ export declare function Menu({ children, defaultOpened, ...props }: {
3
+ defaultOpened?: boolean;
4
+ children: React.ReactNode;
5
+ "aria-label"?: string;
6
+ }): React.JSX.Element;
@@ -0,0 +1,11 @@
1
+ import { IconName } from "@nulogy/icons";
2
+ import React, { ComponentProps } from "react";
3
+ import { TileLink } from "../TopBar.styled";
4
+ interface MenuItemProps extends ComponentProps<typeof TileLink> {
5
+ title: string;
6
+ description?: string;
7
+ icon: IconName;
8
+ }
9
+ export declare function MenuItem({ description, title, icon, ...props }: MenuItemProps): React.JSX.Element;
10
+ export type MenuItems = MenuItemProps[];
11
+ export {};
@@ -0,0 +1,3 @@
1
+ import React, { ComponentProps } from "react";
2
+ import { StyledPageTitle } from "../TopBar.styled";
3
+ export declare function PageTitle({ children, ...props }: ComponentProps<typeof StyledPageTitle>): React.JSX.Element;
@@ -0,0 +1,3 @@
1
+ export declare const TOPBAR: {
2
+ themedHeight: string;
3
+ };
@@ -0,0 +1,19 @@
1
+ import React from "react";
2
+ declare const _default: {
3
+ parameters: {
4
+ layout: string;
5
+ chromatic: {
6
+ modes: {
7
+ locale: string;
8
+ desktopScale: string;
9
+ theme: string;
10
+ viewports: number[];
11
+ };
12
+ };
13
+ };
14
+ title: string;
15
+ };
16
+ export default _default;
17
+ export declare const WithNoLabel: () => React.JSX.Element;
18
+ export declare const WithACustomMaxWidth: () => React.JSX.Element;
19
+ export declare const WithARouterLink: () => React.JSX.Element;
@@ -0,0 +1,22 @@
1
+ import React from "react";
2
+ declare const _default: {
3
+ parameters: {
4
+ layout: string;
5
+ chromatic: {
6
+ delay: number;
7
+ modes: {
8
+ locale: string;
9
+ desktopScale: string;
10
+ theme: string;
11
+ viewports: number[];
12
+ };
13
+ };
14
+ };
15
+ title: string;
16
+ };
17
+ export default _default;
18
+ export declare const withDefaultOpenMenu: () => React.JSX.Element;
19
+ export declare const WithOneMenuItem: () => React.JSX.Element;
20
+ export declare const WithTwoItems: () => React.JSX.Element;
21
+ export declare const WithThreeItems: () => React.JSX.Element;
22
+ export declare const WithRouterLinks: () => React.JSX.Element;
@@ -0,0 +1,19 @@
1
+ import React from "react";
2
+ declare const _default: {
3
+ title: string;
4
+ parameters: {
5
+ layout: string;
6
+ chromatic: {
7
+ modes: {
8
+ locale: string;
9
+ desktopScale: string;
10
+ theme: string;
11
+ viewports: number[];
12
+ };
13
+ };
14
+ };
15
+ };
16
+ export default _default;
17
+ export declare const Default: () => React.JSX.Element;
18
+ export declare const WithALongTitle: () => React.JSX.Element;
19
+ export declare const WithAnApplicationFrame: () => React.JSX.Element;
@@ -0,0 +1,2 @@
1
+ import { MenuItems } from "../components/MenuItem";
2
+ export declare const menuItems: MenuItems;
@@ -1,2 +1,4 @@
1
- declare function useMediaQuery(query: string): boolean;
1
+ import { Breakpoints } from "../../theme";
2
+ type Query = keyof Breakpoints | (string & {});
3
+ declare function useMediaQuery(q: Query): boolean;
2
4
  export default useMediaQuery;
@@ -20,6 +20,7 @@ export { DropdownButton, DropdownItem, DropdownLink, DropdownMenu, DropdownText
20
20
  export { FieldLabel, HelpText, RequirementText } from "./FieldLabel";
21
21
  export { Flex } from "./Flex";
22
22
  export { Field, Fieldset, Form, FormSection } from "./Form";
23
+ export { default as useMediaQuery } from "./hooks/useMediaQuery";
23
24
  export { Icon, InlineIcon } from "./Icon";
24
25
  export { Input } from "./Input";
25
26
  export { ApplicationFrame, Header, Page, Sidebar } from "./Layout";
@@ -112,6 +112,12 @@ export interface Breakpoints {
112
112
  medium: string;
113
113
  large: string;
114
114
  extraLarge: string;
115
+ phonePortrait: string;
116
+ phoneLandscape: string;
117
+ tabletPortrait: string;
118
+ tabletLandscape: string;
119
+ laptop: string;
120
+ desktop: string;
115
121
  }
116
122
  interface ZIndices {
117
123
  content: number;
@@ -8,6 +8,12 @@ export declare const buildBreakPoints: (breakpointsConfig: Readonly<Breakpoints>
8
8
  medium: string;
9
9
  large: string;
10
10
  extraLarge: string;
11
+ phonePortrait: string;
12
+ phoneLandscape: string;
13
+ tabletPortrait: string;
14
+ tabletLandscape: string;
15
+ laptop: string;
16
+ desktop: string;
11
17
  };
12
18
  export declare const getThemeByVariant: (variant: ComponentVariant, isTabletSize: boolean, featureFlags: FeatureFlags) => DefaultNDSThemeType;
13
19
  export declare function useNDSTheme(variant?: ComponentVariant, customTheme?: ThemeType): DefaultNDSThemeType;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nulogy/components",
3
- "version": "11.2.0",
3
+ "version": "11.3.0",
4
4
  "description": "Component library for the Nulogy Design System - http://nulogy.design",
5
5
  "private": false,
6
6
  "publishConfig": {
@@ -16,7 +16,8 @@
16
16
  "clean:storybook": "rm -rf node_modules/.cache/storybook && rm -rf ./storybook-static",
17
17
  "build": "rollup -c",
18
18
  "build:storybook": "build-storybook",
19
- "check": "yarn check:types && yarn check:lint && yarn check:format",
19
+ "warn:prepush": "echo \"Make sure you also run all the other CI steps before pushing by running 'yarn ci'\"",
20
+ "check": "yarn warn:prepush && yarn check:types && yarn check:lint && yarn check:format",
20
21
  "check:types": "tsc && cd cypress && tsc --noEmit",
21
22
  "check:lint": "eslint --config ./.eslintrc .'*/**/*.{js,ts,tsx}'",
22
23
  "check:format": "prettier -c .",
@@ -68,7 +69,7 @@
68
69
  "@babel/preset-env": "7.3.1",
69
70
  "@babel/preset-typescript": "^7.10.4",
70
71
  "@nulogy/eslint-config-nulogy": "^1.0.0",
71
- "@nulogy/icons": "^4.36.0",
72
+ "@nulogy/icons": "^4.37.2",
72
73
  "@rollup/plugin-babel": "^5.0.0",
73
74
  "@rollup/plugin-node-resolve": "^7.1.3",
74
75
  "@semantic-release/changelog": "^6.0.2",
@@ -173,7 +174,7 @@
173
174
  },
174
175
  "husky": {
175
176
  "hooks": {
176
- "pre-push": "yarn run ci"
177
+ "pre-push": "yarn run check"
177
178
  }
178
179
  },
179
180
  "jest": {