@bigbinary/neeto-molecules 4.0.58 → 4.0.60
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/FloatingActionMenu.js +160 -47
- package/dist/FloatingActionMenu.js.map +1 -1
- package/dist/ProductEmbed.js +94 -58
- package/dist/ProductEmbed.js.map +1 -1
- package/dist/cjs/FloatingActionMenu.js +157 -44
- package/dist/cjs/FloatingActionMenu.js.map +1 -1
- package/dist/cjs/ProductEmbed.js +92 -56
- package/dist/cjs/ProductEmbed.js.map +1 -1
- package/package.json +1 -1
- package/types/ProductEmbed.d.ts +40 -18
|
@@ -21,12 +21,12 @@ var Input = require('@bigbinary/neetoui/Input');
|
|
|
21
21
|
var Typography = require('@bigbinary/neetoui/Typography');
|
|
22
22
|
var reactI18next = require('react-i18next');
|
|
23
23
|
var Spinner = require('@bigbinary/neetoui/Spinner');
|
|
24
|
-
var reactQuery = require('@tanstack/react-query');
|
|
25
|
-
var axios = require('axios');
|
|
26
24
|
var Neeto = require('@bigbinary/neeto-icons/typeface-logos/Neeto');
|
|
27
25
|
var AppIcons = require('@bigbinary/neeto-icons/typeface-logos');
|
|
28
26
|
var injectCss = require('./inject-css-B6qYtOJe.js');
|
|
29
27
|
var jsxRuntime = require('react/jsx-runtime');
|
|
28
|
+
var reactQuery = require('@tanstack/react-query');
|
|
29
|
+
var axios = require('axios');
|
|
30
30
|
var i18next = require('i18next');
|
|
31
31
|
var Book = require('@bigbinary/neeto-icons/Book');
|
|
32
32
|
var Community = require('@bigbinary/neeto-icons/Community');
|
|
@@ -70,44 +70,32 @@ function _interopNamespaceDefault(e) {
|
|
|
70
70
|
|
|
71
71
|
var AppIcons__namespace = /*#__PURE__*/_interopNamespaceDefault(AppIcons);
|
|
72
72
|
|
|
73
|
-
var
|
|
74
|
-
return axios.get("/api/v1/neeto_apps");
|
|
75
|
-
};
|
|
76
|
-
var neetoAppsApi = {
|
|
77
|
-
fetch: fetch$1
|
|
78
|
-
};
|
|
79
|
-
|
|
80
|
-
var QUERY_KEYS$1 = {
|
|
81
|
-
NEETO_APPS_LIST: "neeto-apps-list"
|
|
82
|
-
};
|
|
83
|
-
|
|
84
|
-
function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
85
|
-
function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
86
|
-
var useFetchNeetoApps = function useFetchNeetoApps(options) {
|
|
87
|
-
return reactQuery.useQuery(_objectSpread$5({
|
|
88
|
-
queryKey: [QUERY_KEYS$1.NEETO_APPS_LIST],
|
|
89
|
-
queryFn: neetoAppsApi.fetch
|
|
90
|
-
}, options));
|
|
91
|
-
};
|
|
92
|
-
|
|
93
|
-
var css$1 = ".neeto-molecules-product-switcher__wrapper{align-items:flex-start;background-color:rgb(var(--neeto-ui-white));display:flex;flex-direction:column;justify-content:flex-start;max-width:100%;overflow-y:auto;padding:24px;position:relative;transition:all .3s;width:100%}@media screen and (max-width:768px){.neeto-molecules-product-switcher__wrapper{padding:16px}}.neeto-molecules-product-switcher__grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(288px,1fr))}@media only screen and (max-width:992px){.neeto-molecules-product-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(248px,1fr))}}@media only screen and (max-width:640px){.neeto-molecules-product-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(100%,1fr))}}.neeto-molecules-product-switcher__header{align-items:center;display:flex;gap:32px;justify-content:space-between;margin-bottom:32px;position:relative;width:100%}@media only screen and (max-width:768px){.neeto-molecules-product-switcher__header{align-items:flex-start;flex-direction:column;gap:24px}}@media only screen and (max-width:640px){.neeto-molecules-product-switcher__header h1{font-size:24px}}@media only screen and (max-width:768px){.neeto-molecules-product-switcher_modal-container .neeto-molecules-product-switcher__header-mobile{align-items:flex-start;margin-bottom:24px}}.neeto-molecules-product-switcher_modal-container .neeto-molecules-product-switcher__wrapper{padding:0}.neeto-molecules-product-switcher__close-btn{position:absolute;right:12px;top:12px}.neeto-molecules-product-switcher__search-wrapper{flex-grow:1}@media only screen and (min-width:992px){.neeto-molecules-product-switcher__search-wrapper{flex-grow:0;width:296px}}.neeto-molecules-product-switcher__body{display:flex;flex-direction:column;font-size:var(--neeto-ui-text-sm);gap:12px;margin-bottom:24px;width:100%}.neeto-molecules-product-switcher-link{background-color:rgb(var(--neeto-ui-white));border-color:rgb(var(--neeto-ui-gray-200));border-radius:var(--neeto-ui-rounded-lg);border-style:solid;border-width:1px;cursor:pointer;display:flex;flex-direction:column;gap:16px;max-width:100%;padding:10px 8px;text-decoration:none;transition:all .3s ease-in-out;width:100%}.neeto-molecules-product-switcher-link:focus,.neeto-molecules-product-switcher-link:focus-visible{outline:none}.neeto-molecules-product-switcher-link:focus-visible{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-product-switcher-link:not(.neeto-molecules-product-switcher-link--active):hover{border-color:rgb(var(--neeto-ui-primary-500))}.neeto-molecules-product-switcher-link--active{background-color:rgb(var(--neeto-ui-primary-50));border-color:rgb(var(--neeto-ui-primary-500))}.neeto-molecules-product-switcher-link__icon-holder{flex-grow:1;flex-shrink:0}.neeto-molecules-product-switcher-link__icon-holder svg{height:36px;width:auto}.neeto-molecules-product-switcher-link__icon-holder .neeto-molecules-product-switcher-link__icon-default{height:24px}.neeto-molecules-product-switcher-link__content{flex-shrink:0}.neeto-molecules-product-switcher-link__content span{display:block}.neeto-molecules-product-switcher_modal{z-index:100000}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen{display:flex;flex-direction:column;height:100dvh!important;width:100vw!important}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen .neeto-ui-modal__header{flex-shrink:0}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen .neeto-ui-modal__body{--neeto-ui-modal-body-padding-top:24px;flex-grow:1;min-height:0;overflow-y:auto}.neeto-ui-theme--dark .neeto-molecules-product-switcher__wrapper [data-dark-mode-color=true]{fill:rgb(var(--neeto-ui-black))}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal{--neeto-molecules-product-switcher-modal-padding-y:24px;align-items:flex-start;padding-bottom:var(--neeto-molecules-product-switcher-modal-padding-y);padding-top:var(--neeto-molecules-product-switcher-modal-padding-y)}@media only screen and (min-width:1024px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal{--neeto-molecules-product-switcher-modal-padding-y:40px}}@media only screen and (min-width:1536px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal{--neeto-molecules-product-switcher-modal-padding-y:80px}}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large{--neeto-ui-modal-body-padding-top:24px;--neeto-ui-modal-body-padding-bottom:24px;--neeto-ui-modal-close-btn-top:12px;--neeto-ui-modal-close-btn-right:12px;--neeto-ui-modal-body-padding-x:0;--neeto-ui-text-h1:24px}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher-link__icon-holder svg{height:32px}@media only screen and (min-width:1024px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large{--neeto-ui-modal-wrapper-width:960px}}@media only screen and (min-width:1280px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large{--neeto-ui-modal-wrapper-width:1024px}}@media only screen and (min-width:1536px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large{--neeto-ui-modal-wrapper-width:1280px}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher-link__icon-holder svg{height:36px}}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__header{background-color:rgb(var(--neeto-ui-white));margin-bottom:32px;padding-left:24px;padding-right:56px}@media only screen and (max-width:768px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__header{gap:16px;margin-bottom:16px}}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__body{height:calc(100vh - var(--neeto-molecules-product-switcher-modal-padding-y) - 164px);margin-bottom:0;overflow-y:auto;padding-left:24px;padding-right:24px}@media only screen and (max-width:768px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__body{height:calc(90vh - var(--neeto-molecules-product-switcher-modal-padding-y) - 164px)}}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-ui-modal__close{z-index:2}";
|
|
73
|
+
var css$1 = ".neeto-molecules-product-switcher__wrapper{align-items:flex-start;background-color:rgb(var(--neeto-ui-white));display:flex;flex-direction:column;justify-content:flex-start;max-width:100%;overflow-y:auto;padding:24px;position:relative;transition:all .3s;width:100%}@media screen and (max-width:768px){.neeto-molecules-product-switcher__wrapper{padding:16px}}.neeto-molecules-product-switcher__grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(288px,1fr))}@media only screen and (max-width:992px){.neeto-molecules-product-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(248px,1fr))}}@media only screen and (max-width:640px){.neeto-molecules-product-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(100%,1fr))}}.neeto-molecules-product-switcher__header{align-items:center;display:flex;gap:32px;justify-content:space-between;margin-bottom:32px;position:relative;width:100%}@media only screen and (max-width:768px){.neeto-molecules-product-switcher__header{align-items:flex-start;flex-direction:column;gap:24px}}@media only screen and (max-width:640px){.neeto-molecules-product-switcher__header h1{font-size:24px}}@media only screen and (max-width:768px){.neeto-molecules-product-switcher_modal-container .neeto-molecules-product-switcher__header-mobile{align-items:flex-start;margin-bottom:24px}}.neeto-molecules-product-switcher_modal-container .neeto-molecules-product-switcher__wrapper{padding:0}.neeto-molecules-product-switcher__close-btn{position:absolute;right:12px;top:12px}.neeto-molecules-product-switcher__search-wrapper{flex-grow:1}@media only screen and (min-width:992px){.neeto-molecules-product-switcher__search-wrapper{flex-grow:0;width:296px}}.neeto-molecules-product-switcher__body{display:flex;flex-direction:column;font-size:var(--neeto-ui-text-sm);gap:12px;margin-bottom:24px;width:100%}.neeto-molecules-product-switcher-link{background-color:rgb(var(--neeto-ui-white));border-color:rgb(var(--neeto-ui-gray-200));border-radius:var(--neeto-ui-rounded-lg);border-style:solid;border-width:1px;cursor:pointer;display:flex;flex-direction:column;gap:16px;max-width:100%;padding:10px 8px;text-decoration:none;transition:all .3s ease-in-out;width:100%}.neeto-molecules-product-switcher-link:focus,.neeto-molecules-product-switcher-link:focus-visible{outline:none}.neeto-molecules-product-switcher-link:focus-visible{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-product-switcher-link:not(.neeto-molecules-product-switcher-link--active):hover{border-color:rgb(var(--neeto-ui-primary-500))}.neeto-molecules-product-switcher-link--active{background-color:rgb(var(--neeto-ui-primary-50));border-color:rgb(var(--neeto-ui-primary-500))}.neeto-molecules-product-switcher-link--highlighted{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-product-switcher-link__icon-holder{flex-grow:1;flex-shrink:0}.neeto-molecules-product-switcher-link__icon-holder svg{height:36px;width:auto}.neeto-molecules-product-switcher-link__icon-holder .neeto-molecules-product-switcher-link__icon-default{height:24px}.neeto-molecules-product-switcher-link__content{flex-shrink:0}.neeto-molecules-product-switcher-link__content span{display:block}.neeto-molecules-product-switcher_modal{z-index:100000}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen{display:flex;flex-direction:column;height:100dvh!important;width:100vw!important}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen .neeto-ui-modal__header{flex-shrink:0}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen .neeto-ui-modal__body{--neeto-ui-modal-body-padding-top:24px;flex-grow:1;min-height:0;overflow-y:auto}.neeto-ui-theme--dark .neeto-molecules-product-switcher__wrapper [data-dark-mode-color=true]{fill:rgb(var(--neeto-ui-black))}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal{--neeto-molecules-product-switcher-modal-padding-y:24px;align-items:flex-start;padding-bottom:var(--neeto-molecules-product-switcher-modal-padding-y);padding-top:var(--neeto-molecules-product-switcher-modal-padding-y)}@media only screen and (min-width:1024px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal{--neeto-molecules-product-switcher-modal-padding-y:40px}}@media only screen and (min-width:1536px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal{--neeto-molecules-product-switcher-modal-padding-y:80px}}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large{--neeto-ui-modal-body-padding-top:24px;--neeto-ui-modal-body-padding-bottom:24px;--neeto-ui-modal-close-btn-top:12px;--neeto-ui-modal-close-btn-right:12px;--neeto-ui-modal-body-padding-x:0;--neeto-ui-text-h1:24px}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher-link__icon-holder svg{height:32px}@media only screen and (min-width:1024px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large{--neeto-ui-modal-wrapper-width:960px}}@media only screen and (min-width:1280px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large{--neeto-ui-modal-wrapper-width:1024px}}@media only screen and (min-width:1536px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large{--neeto-ui-modal-wrapper-width:1280px}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher-link__icon-holder svg{height:36px}}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__header{background-color:rgb(var(--neeto-ui-white));margin-bottom:32px;padding-left:24px;padding-right:56px}@media only screen and (max-width:768px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__header{gap:16px;margin-bottom:16px}}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__body{height:calc(100dvh - var(--neeto-molecules-product-switcher-modal-padding-y)*2 - 124px);margin-bottom:0;overflow-y:auto;padding-left:24px;padding-right:24px}@media only screen and (max-width:768px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__body{height:calc(90dvh - var(--neeto-molecules-product-switcher-modal-padding-y)*2 - 124px)}}.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-ui-modal__close{z-index:2}@media only screen and (min-width:1280px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__search-wrapper{width:420px}}@media only screen and (min-width:1536px){.neeto-ui-modal__backdrop.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper.neeto-ui-modal__wrapper--large .neeto-molecules-product-switcher__search-wrapper{width:500px}}";
|
|
94
74
|
injectCss.n(css$1,{});
|
|
95
75
|
|
|
76
|
+
var _excluded$2 = ["name", "description", "url", "isHighlighted"];
|
|
77
|
+
function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
78
|
+
function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
96
79
|
var ProductLink = function ProductLink(_ref) {
|
|
97
80
|
var name = _ref.name,
|
|
98
81
|
description = _ref.description,
|
|
99
|
-
url = _ref.url
|
|
82
|
+
url = _ref.url,
|
|
83
|
+
_ref$isHighlighted = _ref.isHighlighted,
|
|
84
|
+
isHighlighted = _ref$isHighlighted === void 0 ? false : _ref$isHighlighted,
|
|
85
|
+
props = _objectWithoutProperties(_ref, _excluded$2);
|
|
100
86
|
var appName = "Neeto".concat(name.charAt(0)).concat(name.slice(1).toLowerCase());
|
|
101
87
|
var AppIcon = AppIcons__namespace[appName];
|
|
102
|
-
return /*#__PURE__*/jsxRuntime.jsxs("a", {
|
|
88
|
+
return /*#__PURE__*/jsxRuntime.jsxs("a", _objectSpread$6(_objectSpread$6({
|
|
103
89
|
"data-cy": "".concat(name, "-app-link"),
|
|
104
|
-
"data-
|
|
90
|
+
"data-testid": "neetoapp-link-".concat(name),
|
|
105
91
|
href: url,
|
|
106
92
|
rel: "noreferrer",
|
|
107
93
|
target: "_blank",
|
|
108
94
|
className: classnames("neeto-molecules-product-switcher-link", {
|
|
109
|
-
"neeto-molecules-product-switcher-link--active": globalProps.appName.includes(name)
|
|
110
|
-
|
|
95
|
+
"neeto-molecules-product-switcher-link--active": globalProps.appName.includes(name),
|
|
96
|
+
"neeto-molecules-product-switcher-link--highlighted": isHighlighted
|
|
97
|
+
})
|
|
98
|
+
}, props), {}, {
|
|
111
99
|
children: [/*#__PURE__*/jsxRuntime.jsx("div", {
|
|
112
100
|
className: "neeto-molecules-product-switcher-link__icon-holder",
|
|
113
101
|
children: AppIcon ? /*#__PURE__*/jsxRuntime.jsx(AppIcon, {}) : /*#__PURE__*/jsxRuntime.jsx(Neeto, {
|
|
@@ -123,24 +111,18 @@ var ProductLink = function ProductLink(_ref) {
|
|
|
123
111
|
children: description
|
|
124
112
|
})
|
|
125
113
|
})]
|
|
126
|
-
});
|
|
114
|
+
}));
|
|
127
115
|
};
|
|
128
116
|
var ProductLink$1 = /*#__PURE__*/React.memo(ProductLink);
|
|
129
117
|
|
|
130
|
-
function ownKeys$
|
|
131
|
-
function _objectSpread$
|
|
118
|
+
function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
119
|
+
function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
132
120
|
var Content = function Content(_ref) {
|
|
133
|
-
var
|
|
121
|
+
var highlightedIndex = _ref.highlightedIndex,
|
|
122
|
+
filteredApps = _ref.filteredApps,
|
|
123
|
+
isLoading = _ref.isLoading;
|
|
134
124
|
var _useTranslation = reactI18next.useTranslation(),
|
|
135
125
|
t = _useTranslation.t;
|
|
136
|
-
var _useFetchNeetoApps = useFetchNeetoApps(),
|
|
137
|
-
data = _useFetchNeetoApps.data,
|
|
138
|
-
isLoading = _useFetchNeetoApps.isLoading;
|
|
139
|
-
var substring = searchTerm.replace(/ /g, "").toLowerCase();
|
|
140
|
-
var filteredApps = data === null || data === void 0 ? void 0 : data.neetoApps.filter(function (_ref2) {
|
|
141
|
-
var name = _ref2.name;
|
|
142
|
-
return name.toLowerCase().includes(substring);
|
|
143
|
-
});
|
|
144
126
|
if (isLoading) {
|
|
145
127
|
return /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
146
128
|
className: "flex items-center justify-center py-8",
|
|
@@ -149,8 +131,11 @@ var Content = function Content(_ref) {
|
|
|
149
131
|
}
|
|
150
132
|
return (filteredApps === null || filteredApps === void 0 ? void 0 : filteredApps.length) > 0 ? /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
151
133
|
className: "neeto-molecules-product-switcher__grid",
|
|
152
|
-
children: filteredApps.map(function (app) {
|
|
153
|
-
return /*#__PURE__*/jsxRuntime.jsx(ProductLink$1, _objectSpread$
|
|
134
|
+
children: filteredApps.map(function (app, index) {
|
|
135
|
+
return /*#__PURE__*/jsxRuntime.jsx(ProductLink$1, _objectSpread$5(_objectSpread$5({}, app), {}, {
|
|
136
|
+
"data-highlighted-index": index,
|
|
137
|
+
isHighlighted: index === highlightedIndex
|
|
138
|
+
}), app.name);
|
|
154
139
|
})
|
|
155
140
|
}) : /*#__PURE__*/jsxRuntime.jsx(Typography, {
|
|
156
141
|
className: "neeto-ui-text-center",
|
|
@@ -160,6 +145,115 @@ var Content = function Content(_ref) {
|
|
|
160
145
|
});
|
|
161
146
|
};
|
|
162
147
|
|
|
148
|
+
var fetch$1 = function fetch() {
|
|
149
|
+
return axios.get("/api/v1/neeto_apps");
|
|
150
|
+
};
|
|
151
|
+
var neetoAppsApi = {
|
|
152
|
+
fetch: fetch$1
|
|
153
|
+
};
|
|
154
|
+
|
|
155
|
+
var QUERY_KEYS$1 = {
|
|
156
|
+
NEETO_APPS_LIST: "neeto-apps-list"
|
|
157
|
+
};
|
|
158
|
+
|
|
159
|
+
function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
160
|
+
function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
161
|
+
var useFetchNeetoApps = function useFetchNeetoApps(options) {
|
|
162
|
+
return reactQuery.useQuery(_objectSpread$4({
|
|
163
|
+
queryKey: [QUERY_KEYS$1.NEETO_APPS_LIST],
|
|
164
|
+
queryFn: neetoAppsApi.fetch
|
|
165
|
+
}, options));
|
|
166
|
+
};
|
|
167
|
+
|
|
168
|
+
var useProductSwitcherNavigation = function useProductSwitcherNavigation() {
|
|
169
|
+
var filteredApps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
170
|
+
var _useState = React.useState(0),
|
|
171
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
172
|
+
highlightedIndex = _useState2[0],
|
|
173
|
+
setHighlightedIndex = _useState2[1];
|
|
174
|
+
var scrollContainerRef = React.useRef(null);
|
|
175
|
+
React.useEffect(function () {
|
|
176
|
+
return setHighlightedIndex(0);
|
|
177
|
+
}, [filteredApps]);
|
|
178
|
+
React.useEffect(function () {
|
|
179
|
+
if (!scrollContainerRef.current || ramda.isEmpty(filteredApps)) return;
|
|
180
|
+
var container = scrollContainerRef.current;
|
|
181
|
+
var highlightedElement = container.querySelector("[data-highlighted-index=\"".concat(highlightedIndex, "\"]"));
|
|
182
|
+
if (!highlightedElement) return;
|
|
183
|
+
var containerRect = container.getBoundingClientRect();
|
|
184
|
+
var elRect = highlightedElement.getBoundingClientRect();
|
|
185
|
+
if (elRect.top < containerRect.top) {
|
|
186
|
+
container.scrollTop += elRect.top - containerRect.top;
|
|
187
|
+
} else if (elRect.bottom > containerRect.bottom) {
|
|
188
|
+
container.scrollTop += elRect.bottom - containerRect.bottom;
|
|
189
|
+
}
|
|
190
|
+
}, [highlightedIndex, filteredApps]);
|
|
191
|
+
var getColumnsPerRow = function getColumnsPerRow() {
|
|
192
|
+
var width = window.innerWidth;
|
|
193
|
+
if (width < 768) return 1;
|
|
194
|
+
if (width < 1024) return 2;
|
|
195
|
+
if (width < 1536) return 3;
|
|
196
|
+
return 4;
|
|
197
|
+
};
|
|
198
|
+
var handleOpenHighlightedApp = function handleOpenHighlightedApp() {
|
|
199
|
+
var app = filteredApps[highlightedIndex];
|
|
200
|
+
if (!(app !== null && app !== void 0 && app.url)) return;
|
|
201
|
+
window.open(app.url, "_blank", "noopener,noreferrer");
|
|
202
|
+
};
|
|
203
|
+
var navigationHandlers = {
|
|
204
|
+
left: function left(prev) {
|
|
205
|
+
return prev === 0 ? filteredApps.length - 1 : prev - 1;
|
|
206
|
+
},
|
|
207
|
+
right: function right(prev) {
|
|
208
|
+
return prev === filteredApps.length - 1 ? 0 : prev + 1;
|
|
209
|
+
},
|
|
210
|
+
up: function up(prev) {
|
|
211
|
+
var columnsPerRow = getColumnsPerRow();
|
|
212
|
+
var newIndex = prev - columnsPerRow;
|
|
213
|
+
if (newIndex >= 0) return newIndex;
|
|
214
|
+
var currentCol = prev % columnsPerRow;
|
|
215
|
+
var lastIndex = filteredApps.length - 1;
|
|
216
|
+
return lastIndex - (lastIndex - currentCol) % columnsPerRow;
|
|
217
|
+
},
|
|
218
|
+
down: function down(prev) {
|
|
219
|
+
var columnsPerRow = getColumnsPerRow();
|
|
220
|
+
var newIndex = prev + columnsPerRow;
|
|
221
|
+
if (newIndex < filteredApps.length) return newIndex;
|
|
222
|
+
return prev % columnsPerRow;
|
|
223
|
+
}
|
|
224
|
+
};
|
|
225
|
+
var keyActions = {
|
|
226
|
+
Enter: handleOpenHighlightedApp,
|
|
227
|
+
ArrowLeft: function ArrowLeft() {
|
|
228
|
+
return setHighlightedIndex(navigationHandlers["left"]);
|
|
229
|
+
},
|
|
230
|
+
ArrowRight: function ArrowRight() {
|
|
231
|
+
return setHighlightedIndex(navigationHandlers["right"]);
|
|
232
|
+
},
|
|
233
|
+
ArrowUp: function ArrowUp() {
|
|
234
|
+
return setHighlightedIndex(navigationHandlers["up"]);
|
|
235
|
+
},
|
|
236
|
+
ArrowDown: function ArrowDown() {
|
|
237
|
+
return setHighlightedIndex(navigationHandlers["down"]);
|
|
238
|
+
},
|
|
239
|
+
Tab: function Tab(e) {
|
|
240
|
+
return setHighlightedIndex(navigationHandlers[e.shiftKey ? "left" : "right"]);
|
|
241
|
+
}
|
|
242
|
+
};
|
|
243
|
+
var handleKeyDown = function handleKeyDown(e) {
|
|
244
|
+
var action = keyActions[e.key];
|
|
245
|
+
if (!action) return;
|
|
246
|
+
e.preventDefault();
|
|
247
|
+
e.stopPropagation();
|
|
248
|
+
if (neetoCist.isNotEmpty(filteredApps)) action(e);
|
|
249
|
+
};
|
|
250
|
+
return {
|
|
251
|
+
highlightedIndex: highlightedIndex,
|
|
252
|
+
handleKeyDown: handleKeyDown,
|
|
253
|
+
scrollContainerRef: scrollContainerRef
|
|
254
|
+
};
|
|
255
|
+
};
|
|
256
|
+
|
|
163
257
|
var Menu$3 = function Menu(_ref) {
|
|
164
258
|
var _ref$isMobile = _ref.isMobile,
|
|
165
259
|
isMobile = _ref$isMobile === void 0 ? false : _ref$isMobile,
|
|
@@ -170,6 +264,21 @@ var Menu$3 = function Menu(_ref) {
|
|
|
170
264
|
_useState2 = _slicedToArray(_useState, 2),
|
|
171
265
|
searchTerm = _useState2[0],
|
|
172
266
|
setSearchTerm = _useState2[1];
|
|
267
|
+
var _useFetchNeetoApps = useFetchNeetoApps(),
|
|
268
|
+
data = _useFetchNeetoApps.data,
|
|
269
|
+
isLoading = _useFetchNeetoApps.isLoading;
|
|
270
|
+
var substring = searchTerm.replace(/ /g, "").toLowerCase();
|
|
271
|
+
var filteredApps = React.useMemo(function () {
|
|
272
|
+
if (!data) return [];
|
|
273
|
+
return data === null || data === void 0 ? void 0 : data.neetoApps.filter(function (_ref2) {
|
|
274
|
+
var name = _ref2.name;
|
|
275
|
+
return name.toLowerCase().includes(substring);
|
|
276
|
+
});
|
|
277
|
+
}, [data, substring]);
|
|
278
|
+
var _useProductSwitcherNa = useProductSwitcherNavigation(filteredApps),
|
|
279
|
+
highlightedIndex = _useProductSwitcherNa.highlightedIndex,
|
|
280
|
+
handleKeyDown = _useProductSwitcherNa.handleKeyDown,
|
|
281
|
+
scrollContainerRef = _useProductSwitcherNa.scrollContainerRef;
|
|
173
282
|
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
174
283
|
className: "neeto-molecules-product-switcher__wrapper",
|
|
175
284
|
"data-cy": "switcher-wrapper",
|
|
@@ -195,13 +304,17 @@ var Menu$3 = function Menu(_ref) {
|
|
|
195
304
|
value: searchTerm,
|
|
196
305
|
onChange: function onChange(e) {
|
|
197
306
|
return setSearchTerm(e.target.value);
|
|
198
|
-
}
|
|
307
|
+
},
|
|
308
|
+
onKeyDown: handleKeyDown
|
|
199
309
|
})
|
|
200
310
|
})]
|
|
201
311
|
}), /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
312
|
+
ref: scrollContainerRef,
|
|
202
313
|
className: classnames("neeto-molecules-product-switcher__body", _defineProperty({}, "neeto-molecules-product-switcher__body-mobile", isMobile)),
|
|
203
314
|
children: /*#__PURE__*/jsxRuntime.jsx(Content, {
|
|
204
|
-
|
|
315
|
+
filteredApps: filteredApps,
|
|
316
|
+
highlightedIndex: highlightedIndex,
|
|
317
|
+
isLoading: isLoading
|
|
205
318
|
})
|
|
206
319
|
})]
|
|
207
320
|
}, "switcher-wrapper");
|