@bigbinary/neeto-team-members-frontend 2.5.4 → 2.5.5

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/README.md CHANGED
@@ -12,13 +12,13 @@ functioning of the package. Install all the peer dependencies using the below
12
12
  command:
13
13
 
14
14
  ```zsh
15
- yarn add @bigbinary/neeto-commons-frontend@2.0.25 @bigbinary/neeto-icons@1.9.1 @bigbinary/neetoui@4.1.43 @honeybadger-io/js@4.8.2 @honeybadger-io/react@4.8.2 axios@1.2.2 classnames@2.3.2 formik@2.2.9 ramda@0.28.0 react-helmet@6.1.0 react-query@3.39.2 react-router-dom@5.3.3 react-toastify@8.2.0 yup@0.32.11
15
+ yarn add @bigbinary/neeto-commons-frontend@2.0.25 @bigbinary/neeto-icons@1.9.1 @bigbinary/neetoui@4.1.44 @honeybadger-io/js@4.9.0 @honeybadger-io/react@4.9.0 axios@1.2.3 classnames@2.3.2 formik@2.2.9 ramda@0.28.0 react-helmet@6.1.0 react-query@3.39.2 react-router-dom@5.3.4 react-toastify@8.2.0 yup@0.32.11
16
16
  ```
17
17
 
18
18
  2. Now install the latest **neetoTeamMembers** package using the below command:
19
19
 
20
20
  ```zsh
21
- yarn add @bigbinary/neeto-team-members-frontend@2.5.4
21
+ yarn add @bigbinary/neeto-team-members-frontend@2.5.5
22
22
  ```
23
23
 
24
24
  ## Usage
package/dist/index.cjs.js CHANGED
@@ -2822,7 +2822,7 @@ var localStorageAvailable = function localStorageAvailable() {
2822
2822
  }
2823
2823
  return hasLocalStorageSupport;
2824
2824
  };
2825
- var localStorage$1 = {
2825
+ var localStorage = {
2826
2826
  name: 'localStorage',
2827
2827
  lookup: function lookup(options) {
2828
2828
  var found;
@@ -2976,7 +2976,7 @@ var Browser = /*#__PURE__*/function () {
2976
2976
  this.i18nOptions = i18nOptions;
2977
2977
  this.addDetector(cookie$1);
2978
2978
  this.addDetector(querystring);
2979
- this.addDetector(localStorage$1);
2979
+ this.addDetector(localStorage);
2980
2980
  this.addDetector(sessionStorage);
2981
2981
  this.addDetector(navigator$1);
2982
2982
  this.addDetector(htmlTag);
@@ -3761,6 +3761,7 @@ var helpers$1 = {
3761
3761
  noRolesFound: "No roles found.",
3762
3762
  searchRoles: "Search roles",
3763
3763
  selectedMembersCount: "{{count}} {{metaName}} selected of",
3764
+ themeSelector: "Theme selector",
3764
3765
  visitToKnowMoreAboutPermissions: "Visit to know more about permissions"
3765
3766
  };
3766
3767
  var metaNames$1 = {
@@ -3861,6 +3862,7 @@ var helpers = {
3861
3862
  searchRoles: "Rechercher des rôles",
3862
3863
  selectedMembersCount_one: "{{count}} {{metaName}} sélectionné sur",
3863
3864
  selectedMembersCount_other: "{{count}} {{metaName}} sélectionnés sur",
3865
+ themeSelector: "Sélecteur de thème",
3864
3866
  visitToKnowMoreAboutPermissions: "Visitez pour en savoir plus sur les autorisations"
3865
3867
  };
3866
3868
  var metaNames = {
@@ -5694,6 +5696,7 @@ const New = _ref => {
5694
5696
  const _useTranslation = useTranslation(),
5695
5697
  t = _useTranslation.t;
5696
5698
  const formReference = e$1.useRef(null);
5699
+ const inputReference = e$1.useRef(null);
5697
5700
  const _useCreateRole = useCreateRole({
5698
5701
  onSuccess: onClose
5699
5702
  }),
@@ -5708,6 +5711,7 @@ const New = _ref => {
5708
5711
  });
5709
5712
  };
5710
5713
  return /*#__PURE__*/e__default["default"].createElement(neetoui.Pane, {
5714
+ initialFocusRef: inputReference,
5711
5715
  isOpen: isOpen,
5712
5716
  onClose: onClose
5713
5717
  }, /*#__PURE__*/e__default["default"].createElement(neetoui.Pane.Header, null, /*#__PURE__*/e__default["default"].createElement(neetoui.Typography, {
@@ -5736,7 +5740,8 @@ const New = _ref => {
5736
5740
  name: "name",
5737
5741
  placeholder: t("placeholders.enter_", {
5738
5742
  what: t("common.name").toLocaleLowerCase()
5739
- })
5743
+ }),
5744
+ ref: inputReference
5740
5745
  }), /*#__PURE__*/e__default["default"].createElement(formik$1.Textarea, {
5741
5746
  "data-cy": "ntm-add-role-description-text-field",
5742
5747
  label: t("common.description"),
@@ -5944,6 +5949,7 @@ const Edit = _ref => {
5944
5949
  const _useTranslation = useTranslation(),
5945
5950
  t = _useTranslation.t;
5946
5951
  const formReference = e$1.useRef(null);
5952
+ const inputReference = e$1.useRef(null);
5947
5953
  const _useUpdateRole = useUpdateRole({
5948
5954
  onSuccess: onClose
5949
5955
  }),
@@ -5965,6 +5971,7 @@ const Edit = _ref => {
5965
5971
  });
5966
5972
  };
5967
5973
  return /*#__PURE__*/e__default["default"].createElement(neetoui.Pane, {
5974
+ initialFocusRef: inputReference,
5968
5975
  isOpen: isOpen,
5969
5976
  onClose: onClose
5970
5977
  }, /*#__PURE__*/e__default["default"].createElement(neetoui.Pane.Header, null, /*#__PURE__*/e__default["default"].createElement(neetoui.Typography, {
@@ -5990,7 +5997,8 @@ const Edit = _ref => {
5990
5997
  label: t("common.name"),
5991
5998
  maxLength: 40,
5992
5999
  name: "name",
5993
- placeholder: t("placeholders.enterRoleName")
6000
+ placeholder: t("placeholders.enterRoleName"),
6001
+ ref: inputReference
5994
6002
  }), /*#__PURE__*/e__default["default"].createElement(formik$1.Textarea, {
5995
6003
  "data-cy": "ntm-update-role-description-text-field",
5996
6004
  label: t("common.description"),
@@ -6014,7 +6022,7 @@ const Edit = _ref => {
6014
6022
  }));
6015
6023
  };
6016
6024
 
6017
- const Columns$1 = _ref => {
6025
+ const Columns = _ref => {
6018
6026
  let config = _ref.config,
6019
6027
  filteredGroupPermissions = _ref.filteredGroupPermissions,
6020
6028
  filteredRoles = _ref.filteredRoles,
@@ -6229,7 +6237,7 @@ const Table = _ref => {
6229
6237
  }),
6230
6238
  onClick: () => setIsNewRolePaneOpen(true)
6231
6239
  }
6232
- })) : /*#__PURE__*/e__default["default"].createElement(Columns$1, {
6240
+ })) : /*#__PURE__*/e__default["default"].createElement(Columns, {
6233
6241
  config: config,
6234
6242
  filteredGroupPermissions: filteredGroupPermissions,
6235
6243
  filteredRoles: filteredRoles,
@@ -8539,7 +8547,8 @@ function Re(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Obj
8539
8547
 
8540
8548
  const FIXED_COLUMNS = ["actions"];
8541
8549
  const COLUMNS_DROPDOWN_PROPS = {
8542
- label: instance.t("common.column", PLURAL)
8550
+ label: instance.t("common.column", PLURAL),
8551
+ buttonStyle: "text"
8543
8552
  };
8544
8553
  const COLUMNS_SEARCH_PROPS = {
8545
8554
  placeholder: instance.t("columns.search")
@@ -8577,134 +8586,6 @@ const Header = _ref => {
8577
8586
  }))));
8578
8587
  };
8579
8588
 
8580
- const useDebounce = function (value) {
8581
- let delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 350;
8582
- const _useState = e$1.useState(value),
8583
- _useState2 = _slicedToArray(_useState, 2),
8584
- debouncedValue = _useState2[0],
8585
- setDebouncedValue = _useState2[1];
8586
- e$1.useEffect(() => {
8587
- const handler = setTimeout(() => setDebouncedValue(value), delay);
8588
- return () => clearTimeout(handler);
8589
- }, [value, delay]);
8590
- return debouncedValue;
8591
- };
8592
-
8593
- const getStorageValue = (key, defaultValue) => {
8594
- const saved = localStorage.getItem(key);
8595
- return JSON.parse(saved) || defaultValue;
8596
- };
8597
- const useLocalStorage = (key, defaultValue) => {
8598
- const _useState = e$1.useState(() => getStorageValue(key, defaultValue)),
8599
- _useState2 = _slicedToArray(_useState, 2),
8600
- storedValue = _useState2[0],
8601
- setStoredValue = _useState2[1];
8602
- const setValue = value => {
8603
- if (ramda.isNil(value)) {
8604
- localStorage.removeItem(key);
8605
- } else {
8606
- localStorage.setItem(key, JSON.stringify(value));
8607
- }
8608
- setStoredValue(value);
8609
- };
8610
- return [storedValue, setValue];
8611
- };
8612
-
8613
- const removeFixedColumns = (fixedColumns, columnData) => pure.removeBy({
8614
- dataIndex: ramda.includes(ramda.__, fixedColumns)
8615
- }, columnData);
8616
- const filterBySearchTerm$1 = (searchTerm, columns) => ramda.filter(_ref => {
8617
- let title = _ref.title;
8618
- return ramda.includes(ramda.trim(ramda.toLower(searchTerm)), ramda.trim(ramda.toLower(title)));
8619
- }, columns);
8620
-
8621
- const Columns = _ref => {
8622
- let actionBlock = _ref.actionBlock,
8623
- _ref$checkboxProps = _ref.checkboxProps,
8624
- checkboxProps = _ref$checkboxProps === void 0 ? {} : _ref$checkboxProps,
8625
- _ref$columnData = _ref.columnData,
8626
- columnData = _ref$columnData === void 0 ? [] : _ref$columnData,
8627
- _ref$dropdownProps = _ref.dropdownProps,
8628
- dropdownProps = _ref$dropdownProps === void 0 ? {} : _ref$dropdownProps,
8629
- _ref$fixedColumns = _ref.fixedColumns,
8630
- fixedColumns = _ref$fixedColumns === void 0 ? [] : _ref$fixedColumns,
8631
- _ref$isSearchable = _ref.isSearchable,
8632
- isSearchable = _ref$isSearchable === void 0 ? false : _ref$isSearchable,
8633
- _ref$localStorageKey = _ref.localStorageKey,
8634
- localStorageKey = _ref$localStorageKey === void 0 ? "" : _ref$localStorageKey,
8635
- _ref$noColumnMessage = _ref.noColumnMessage,
8636
- noColumnMessage = _ref$noColumnMessage === void 0 ? "No columns found!" : _ref$noColumnMessage,
8637
- _ref$onChange = _ref.onChange,
8638
- onChange = _ref$onChange === void 0 ? ramda.identity : _ref$onChange,
8639
- _ref$searchProps = _ref.searchProps,
8640
- searchProps = _ref$searchProps === void 0 ? {} : _ref$searchProps;
8641
- // @ts-ignore
8642
- const Divider = neetoui.Dropdown.Divider,
8643
- Menu = neetoui.Dropdown.Menu,
8644
- MenuItem = neetoui.Dropdown.MenuItem;
8645
- const _useLocalStorage = useLocalStorage(localStorageKey, []),
8646
- _useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
8647
- hiddenColumns = _useLocalStorage2[0],
8648
- setHiddenColumns = _useLocalStorage2[1];
8649
- const _useState = e$1.useState(""),
8650
- _useState2 = _slicedToArray(_useState, 2),
8651
- searchTerm = _useState2[0],
8652
- setSearchTerm = _useState2[1];
8653
- const columns = removeFixedColumns(fixedColumns, columnData);
8654
- const filteredColumns = filterBySearchTerm$1(searchTerm, columns);
8655
- const handleChange = _ref2 => {
8656
- let _ref2$target = _ref2.target,
8657
- dataIndex = _ref2$target.name,
8658
- checked = _ref2$target.checked;
8659
- return checked ? setHiddenColumns(ramda.without([dataIndex], hiddenColumns)) : setHiddenColumns(ramda.append(dataIndex, hiddenColumns));
8660
- };
8661
- const handleSearch = _ref3 => {
8662
- let value = _ref3.target.value;
8663
- return setSearchTerm(value);
8664
- };
8665
- e$1.useEffect(() => {
8666
- onChange(pure.removeBy({
8667
- dataIndex: ramda.includes(ramda.__, hiddenColumns)
8668
- }, columnData));
8669
- }, [columnData, hiddenColumns]); // eslint-disable-line react-hooks/exhaustive-deps
8670
-
8671
- return /*#__PURE__*/e__default["default"].createElement(neetoui.Dropdown, _extends({
8672
- buttonSize: "medium",
8673
- buttonStyle: "secondary",
8674
- closeOnSelect: false,
8675
- label: "Columns",
8676
- onClose: () => setSearchTerm(""),
8677
- position: "bottom-end"
8678
- }, dropdownProps), /*#__PURE__*/e__default["default"].createElement(Menu, null, /*#__PURE__*/e__default["default"].createElement("div", null, isSearchable && /*#__PURE__*/e__default["default"].createElement(neetoui.Input, _extends({
8679
- className: "neeto-ui-px-3 neeto-ui-py-2",
8680
- "data-cy": "neeto-ui-columns-search",
8681
- onChange: handleSearch,
8682
- placeholder: "Search columns",
8683
- prefix: /*#__PURE__*/e__default["default"].createElement(neetoIcons.Search, null),
8684
- type: "search",
8685
- value: searchTerm
8686
- }, searchProps)), pure.isNotEmpty(filteredColumns) ? filteredColumns.map(_ref4 => {
8687
- let dataIndex = _ref4.dataIndex,
8688
- key = _ref4.key,
8689
- title = _ref4.title;
8690
- return /*#__PURE__*/e__default["default"].createElement(MenuItem, {
8691
- key: key
8692
- }, /*#__PURE__*/e__default["default"].createElement(neetoui.Label, {
8693
- className: "neeto-ui-w-full neeto-ui-px-3 neeto-ui-py-2 hover:neeto-ui-bg-gray-200 neeto-ui-cursor-pointer",
8694
- htmlFor: dataIndex
8695
- }, /*#__PURE__*/e__default["default"].createElement(neetoui.Checkbox, _extends({
8696
- id: dataIndex,
8697
- name: dataIndex,
8698
- checked: !hiddenColumns.includes(dataIndex),
8699
- "data-cy": "neeto-ui-columns-checkbox",
8700
- label: title,
8701
- onChange: handleChange
8702
- }, checkboxProps))));
8703
- }) : /*#__PURE__*/e__default["default"].createElement("span", {
8704
- className: "neeto-ui-flex neeto-ui-flex-col neeto-ui-items-center neeto-ui-p-2"
8705
- }, noColumnMessage), !!actionBlock && /*#__PURE__*/e__default["default"].createElement(e__default["default"].Fragment, null, /*#__PURE__*/e__default["default"].createElement(Divider, null), actionBlock))));
8706
- };
8707
-
8708
8589
  const filterBySearchTerm = (searchTerm, roles) => ramda.filter(_ref => {
8709
8590
  let name = _ref.name;
8710
8591
  return ramda.includes(ramda.trim(ramda.toLower(searchTerm)), ramda.trim(ramda.toLower(name)));
@@ -8941,7 +8822,7 @@ const Right = _ref2 => {
8941
8822
  handleNeetoFilterChange = _ref2.handleNeetoFilterChange,
8942
8823
  setIsFiltersPaneOpen = _ref2.setIsFiltersPaneOpen,
8943
8824
  isFiltersPaneOpen = _ref2.isFiltersPaneOpen;
8944
- return /*#__PURE__*/e__default["default"].createElement(e__default["default"].Fragment, null, /*#__PURE__*/e__default["default"].createElement(Columns, {
8825
+ return /*#__PURE__*/e__default["default"].createElement(e__default["default"].Fragment, null, /*#__PURE__*/e__default["default"].createElement(reactUtils.Columns, {
8945
8826
  columnData: columns,
8946
8827
  dropdownProps: COLUMNS_DROPDOWN_PROPS,
8947
8828
  fixedColumns: FIXED_COLUMNS,
@@ -9770,6 +9651,7 @@ const renderPayload = function (_ref) {
9770
9651
  const MultipleEmailInput = _ref => {
9771
9652
  var _head;
9772
9653
  let emails = _ref.emails,
9654
+ innerRef = _ref.innerRef,
9773
9655
  selectedMember = _ref.selectedMember;
9774
9656
  return /*#__PURE__*/e__default["default"].createElement("div", {
9775
9657
  className: "neeto-ui-w-full"
@@ -9787,7 +9669,8 @@ const MultipleEmailInput = _ref => {
9787
9669
  helpText: instance.t("helpers.enterMultipleEmails"),
9788
9670
  label: `${instance.t("common.email", PLURAL)}*`,
9789
9671
  name: "emails",
9790
- placeholder: instance.t("placeholders.email")
9672
+ placeholder: instance.t("placeholders.email"),
9673
+ ref: innerRef
9791
9674
  }));
9792
9675
  };
9793
9676
  MultipleEmailInput.defaultProps = {
@@ -9851,7 +9734,10 @@ const ManageMember = _ref => {
9851
9734
  hasSubmitted = _useState2[0],
9852
9735
  setHasSubmitted = _useState2[1];
9853
9736
  const formReference = e$1.useRef(null);
9854
- const manageMemberComponentConfig = _objectSpread$2(_objectSpread$2({}, DEFAULT_COMPONENT_CONFIG), componentConfig);
9737
+ const emailInputReference = e$1.useRef(null);
9738
+ const manageMemberComponentConfig = _objectSpread$2(_objectSpread$2({}, DEFAULT_COMPONENT_CONFIG), {}, {
9739
+ initialFocusRef: emailInputReference
9740
+ }, componentConfig);
9855
9741
  const Component = MEMBERS_FORM_COMPONENT_MAPPER[manageMemberComponentConfig.type || "pane"];
9856
9742
  const handleClose = () => {
9857
9743
  onComplete();
@@ -9912,7 +9798,8 @@ const ManageMember = _ref => {
9912
9798
  "data-cy": "ntm-manage-members-pane-wrapper",
9913
9799
  isOpen: manageMemberComponentConfig.isOpen,
9914
9800
  onClose: handleClose,
9915
- className: manageMemberComponentConfig.className
9801
+ className: manageMemberComponentConfig.className,
9802
+ initialFocusRef: manageMemberComponentConfig.initialFocusRef
9916
9803
  }, /*#__PURE__*/e__default["default"].createElement(Component.Header, manageMemberComponentConfig.headerProps, /*#__PURE__*/e__default["default"].createElement(neetoui.Typography, {
9917
9804
  className: "ntm-members-form__header",
9918
9805
  "data-cy": "ntm-manage-members-pane-header",
@@ -9938,6 +9825,7 @@ const ManageMember = _ref => {
9938
9825
  className: ie__default["default"](["ntm-members-form__body", (_manageMemberComponen = manageMemberComponentConfig.bodyProps) === null || _manageMemberComponen === void 0 ? void 0 : _manageMemberComponen.className])
9939
9826
  }), /*#__PURE__*/e__default["default"].createElement(MultipleEmailInput, {
9940
9827
  emails: emails,
9828
+ innerRef: emailInputReference,
9941
9829
  selectedMember: selectedMember
9942
9830
  }), /*#__PURE__*/e__default["default"].createElement(RolesRadioGroup, {
9943
9831
  role: role,
@@ -9997,7 +9885,7 @@ const useFilters = _ref => {
9997
9885
  _useState2 = _slicedToArray(_useState, 2),
9998
9886
  filters = _useState2[0],
9999
9887
  setFilters = _useState2[1];
10000
- const debouncedSearch = useDebounce(filters.search, 750);
9888
+ const debouncedSearch = reactUtils.useDebounce(filters.search, 750);
10001
9889
  const shouldFetchFilterOptions = ramda.isNil(config === null || config === void 0 ? void 0 : config.filterColumns);
10002
9890
  const _useFetchFilterOption = useFetchFilterOptions({
10003
9891
  options: {
@@ -10298,7 +10186,7 @@ const VALIDATION_SCHEMA = {
10298
10186
 
10299
10187
  var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
10300
10188
 
10301
- var css = ":root {\n --ntm-roles-table-default-scroll: 15px;\n --ntm-roles-table-cell-height: 68px;\n}\n\n.ntm-dropdown__button {\n border-radius: 0 !important;\n font-weight: var(--neeto-ui-font-normal);\n min-height: 34px;\n min-width: 150px;\n text-align: left;\n width: 100%;\n}\n\n.ntm-scrollbar__inner {\n width: 100%;\n height: 200px;\n}\n.ntm-scrollbar__outer {\n position: \"absolute\";\n top: 0px;\n left: 0px;\n width: 200px;\n height: 150px;\n overflow: \"hidden\";\n visibility: \"hidden\";\n}\n\n.ntm-empty-state {\n align-items: center;\n display: flex;\n height: 100%;\n justify-content: center;\n width: 100%;\n}\n.ntm-empty-state__image {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-bottom: 2rem;\n}\n.ntm-empty-state__title--with-action-block {\n margin-bottom: 1rem;\n}\n.ntm-empty-state__action-block {\n display: flex;\n justify-content: center;\n}\n\n.ntm-members {\n overflow: auto;\n width: 100%;\n}\n.ntm-members-wrapper {\n display: flex;\n}\n.ntm-members-page-loader {\n width: 100%;\n height: 100vh;\n}\n.ntm-members__table-wrapper {\n height: calc(100vh - 205px);\n width: 100%;\n}\n.ntm-members-table__column {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n.ntm-members-form__header {\n margin-bottom: 0.5rem;\n}\n.ntm-members-form__body {\n width: 100%;\n padding-bottom: 1rem;\n}\n.ntm-members-form__body > * + * {\n margin-top: 1rem;\n}\n.ntm-members-form__footer {\n display: flex;\n gap: 0.5rem;\n}\n\n.ntm-members-radio-group {\n width: 100%;\n}\n.ntm-members-radio-group .neeto-ui-radio__container--stacked {\n width: 100%;\n}\n.ntm-members-radio-group__label {\n padding-right: 4px;\n}\n.ntm-members-radio-group__icon {\n cursor: pointer;\n}\n\n.ntm-members-form-radio-item__wrapper {\n width: 100%;\n cursor: pointer;\n padding: 8px 0px !important;\n}\n.ntm-members-form-radio-item__wrapper:first-child {\n padding-top: 0px !important;\n}\n.ntm-members-form-radio-item__label {\n margin-bottom: 0 !important;\n}\n.ntm-members-form-radio-item__description {\n color: rgb(var(--neeto-ui-gray-700));\n}\n\n.ntm-roles-table__wrapper {\n width: 100%;\n height: calc(100vh - var(--neeto-ui-main-header-with-breadcrumbs-height));\n display: flex;\n padding: 0 1.5rem;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__sidebar {\n width: 396px;\n min-width: 396px;\n border-right: thin solid rgb(var(--neeto-ui-gray-300));\n border-left: thin solid rgb(var(--neeto-ui-gray-300));\n border-top: thin solid rgb(var(--neeto-ui-gray-300));\n}\n.ntm-roles-table__wrapper .ntm-roles-table__sidebar .ntm-roles-table-sidebar__search {\n padding: 20px 24px;\n height: 72px;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__sidebar .ntm-roles-table-sidebar__list {\n height: calc(\n 100vh - var(--neeto-ui-main-header-with-breadcrumbs-height) - 72px -\n var(--ntm-roles-table-default-scroll)\n );\n overflow-y: auto;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__sidebar .ntm-roles-table-sidebar__list .ntm-roles-table-sidebar__list-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px 24px;\n min-height: var(--ntm-roles-table-cell-height);\n}\n.ntm-roles-table__wrapper .ntm-roles-table__sidebar .ntm-roles-table-sidebar__list .ntm-roles-table-sidebar__list-item.ntm-roles-table-sidebar__list-item--highlighted {\n background-color: rgb(var(--neeto-ui-primary-100));\n padding: 12px 24px;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__sidebar .ntm-roles-table-sidebar__list .ntm-roles-table-sidebar__list-item:not(.ntm-roles-table-sidebar__list-item--highlighted) {\n border-bottom: thin solid rgb(var(--neeto-ui-gray-300));\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns {\n width: calc(\n 100vw - var(--neeto-ui-sidebar-width) - 396px - 24px\n );\n overflow: hidden;\n border-top: thin solid rgb(var(--neeto-ui-gray-300));\n border-bottom: thin solid rgb(var(--neeto-ui-gray-300));\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__cell {\n width: 100%;\n min-width: 200px;\n height: var(--ntm-roles-table-cell-height);\n padding: 12px 8px;\n display: flex;\n justify-content: center;\n align-items: center;\n border-right: thin solid rgb(var(--neeto-ui-gray-300));\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table-cell__checkbox-wrapper {\n position: absolute;\n height: 1rem;\n width: 1rem;\n margin: auto;\n z-index: 10;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table-cell__checkbox {\n z-index: 10;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__header {\n display: flex;\n align-items: center;\n overflow-x: auto;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__header .ntm-roles-table__cell {\n height: 72px;\n padding-left: 24px;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__header .ntm-roles-table-header-cell__container {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n gap: 1rem;\n overflow: hidden;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__header .ntm-roles-table-header__dropdown {\n margin: 3px;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__header .ntm-roles-table-header__role-name {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows {\n width: 100%;\n height: calc(\n 100vh - var(--neeto-ui-main-header-with-breadcrumbs-height) - 72px -\n var(--ntm-roles-table-default-scroll)\n );\n overflow-y: auto;\n scrollbar-width: none;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows::-webkit-scrollbar {\n width: 0px;\n height: 0px;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows::-webkit-scrollbar-thumb {\n background: rgb(var(--neeto-ui-gray-300));\n border-radius: 50px;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows::-webkit-scrollbar-thumb:hover {\n border-radius: 50px;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows::-webkit-scrollbar-track {\n background: rgb(var(--neeto-ui-gray-300));\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows .ntm-roles-table__row {\n display: flex;\n align-items: center;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows .ntm-roles-table__row .ntm-roles-table__cell {\n overflow: hidden;\n position: relative;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows .ntm-roles-table__row .ntm-roles-table__cell p {\n opacity: 0;\n width: 340px;\n min-width: 340px;\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows .ntm-roles-table__row.ntm-roles-table__row--highlighted .ntm-roles-table__cell {\n background-color: rgb(var(--neeto-ui-primary-100));\n}\n.ntm-roles-table__wrapper .ntm-roles-table__columns .ntm-roles-table__rows .ntm-roles-table__row:not(.ntm-roles-table__row--highlighted) .ntm-roles-table__cell {\n border-bottom: thin solid rgb(var(--neeto-ui-gray-300));\n}\n\n.ntm-roles-table-sidebar__drop-down-button {\n color: rgb(var(--neeto-ui-gray-600));\n cursor: pointer;\n}\n\n.ntm-roles-modal__body > * + * {\n margin-top: 1rem;\n}\n.ntm-roles-modal__footer {\n display: flex;\n gap: 0.5rem;\n}\n\n.ntm-roles-pane__body {\n width: 100%;\n margin-bottom: 1.5rem;\n}\n.ntm-roles-pane__body-wrapper > * + * {\n margin-top: 1rem;\n}\n.ntm-roles-pane__body > * + * {\n margin-top: 1.5rem;\n}\n.ntm-roles-pane__footer {\n display: flex;\n gap: 0.5rem;\n}\n\n.ntm-roles-permission > * + * {\n margin: 0.5rem 0;\n}\n.ntm-roles-permission__heading {\n color: rgb(var(--neeto-ui-gray-500));\n text-transform: uppercase;\n}\n.ntm-roles-permission__card {\n background-color: rgb(var(--neeto-ui-white));\n align-items: center;\n border-radius: var(--neeto-ui-rounded);\n border-width: 1px;\n border-color: rgb(var(--neeto-ui-gray-300));\n cursor: pointer;\n display: flex;\n gap: 0.75rem;\n padding: 1rem 0.75rem;\n}\n.ntm-roles-permission__card--description {\n flex-grow: 1;\n}\n.ntm-roles-permission__card--checkbox {\n padding: 0 0.5rem;\n}\n\n.ntm-roles-help-url-wrapper {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n padding: 1rem 0;\n}\n\n.neeto-ui-subheader .neeto-ui-subheader__left-wrapper .neeto-ui-subheader__left {\n max-width: none;\n}\n\ntd.ant-table-column-sort {\n background: transparent;\n}";
10189
+ var css = ":root {\n --ntm-roles-table-default-scroll: 15px;\n --ntm-roles-table-cell-height: 68px;\n --ntm-roles-sidebar-width: 396px;\n --ntm-roles-table-header-height: 72px;\n}\n\n.ntm-scrollbar__inner {\n width: 100%;\n height: 200px;\n}\n.ntm-scrollbar__outer {\n position: \"absolute\";\n top: 0px;\n left: 0px;\n width: 200px;\n height: 150px;\n overflow: \"hidden\";\n visibility: \"hidden\";\n}\n\ntd.ant-table-column-sort {\n background: transparent;\n}\n\n.ntm-empty-state {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.ntm-members {\n overflow: auto;\n width: 100%;\n}\n.ntm-members-wrapper {\n display: flex;\n}\n.ntm-members-page-loader {\n width: 100%;\n height: 100vh;\n}\n.ntm-members__table-wrapper {\n height: calc(100vh - 205px);\n width: 100%;\n}\n.ntm-members-table__column {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n.ntm-members-form__header {\n margin-bottom: 0.5rem;\n}\n.ntm-members-form__body {\n width: 100%;\n padding-bottom: 1rem;\n}\n.ntm-members-form__body > * + * {\n margin-top: 1rem;\n}\n.ntm-members-form__footer {\n display: flex;\n gap: 0.5rem;\n}\n\n.ntm-members-radio-group {\n width: 100%;\n}\n.ntm-members-radio-group .neeto-ui-radio__container--stacked {\n width: 100%;\n}\n.ntm-members-radio-group__label {\n padding-right: 4px;\n}\n.ntm-members-radio-group__icon {\n cursor: pointer;\n}\n\n.ntm-members-form-radio-item__wrapper {\n width: 100%;\n cursor: pointer;\n padding: 8px 0px !important;\n}\n.ntm-members-form-radio-item__wrapper:first-child {\n padding-top: 0px !important;\n}\n.ntm-members-form-radio-item__label {\n margin-bottom: 0 !important;\n}\n.ntm-members-form-radio-item__description {\n color: rgb(var(--neeto-ui-gray-700));\n}\n\n.ntm-roles-table__wrapper {\n width: 100%;\n height: calc(100vh - var(--neeto-ui-main-header-with-breadcrumbs-height));\n display: flex;\n padding: 0 1.5rem;\n}\n\n.ntm-roles-table__sidebar {\n width: var(--ntm-roles-sidebar-width);\n min-width: var(--ntm-roles-sidebar-width);\n border-right: thin solid rgb(var(--neeto-ui-gray-300));\n border-left: thin solid rgb(var(--neeto-ui-gray-300));\n border-top: thin solid rgb(var(--neeto-ui-gray-300));\n}\n\n.ntm-roles-table-sidebar__search {\n padding: 20px 24px;\n height: var(--ntm-roles-table-header-height);\n}\n\n.ntm-roles-table-sidebar__list {\n height: calc(\n 100vh - var(--neeto-ui-main-header-with-breadcrumbs-height) - var(\n --ntm-roles-table-header-height\n ) - var(--ntm-roles-table-default-scroll)\n );\n overflow-y: auto;\n}\n\n.ntm-roles-table-sidebar__list-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px 24px;\n min-height: var(--ntm-roles-table-cell-height);\n}\n.ntm-roles-table-sidebar__list-item.ntm-roles-table-sidebar__list-item--highlighted {\n background-color: rgb(var(--neeto-ui-primary-100));\n padding: 12px 24px;\n}\n.ntm-roles-table-sidebar__list-item:not(.ntm-roles-table-sidebar__list-item--highlighted) {\n border-bottom: thin solid rgb(var(--neeto-ui-gray-300));\n}\n\n.ntm-roles-table__columns {\n width: calc(\n 100vw - var(--neeto-ui-sidebar-width) - var(--ntm-roles-sidebar-width) - 24px\n );\n overflow: hidden;\n border-top: thin solid rgb(var(--neeto-ui-gray-300));\n border-bottom: thin solid rgb(var(--neeto-ui-gray-300));\n}\n\n.ntm-roles-table__cell {\n width: 100%;\n min-width: 200px;\n height: var(--ntm-roles-table-cell-height);\n padding: 12px 8px;\n display: flex;\n justify-content: center;\n align-items: center;\n border-right: thin solid rgb(var(--neeto-ui-gray-300));\n}\n\n.ntm-roles-table-cell__checkbox-wrapper {\n position: absolute;\n height: 1rem;\n width: 1rem;\n margin: auto;\n z-index: 10;\n}\n\n.ntm-roles-table-cell__checkbox {\n z-index: 10;\n}\n\n.ntm-roles-table__header {\n display: flex;\n align-items: center;\n overflow-x: auto;\n}\n.ntm-roles-table__header .ntm-roles-table__cell {\n height: var(--ntm-roles-table-header-height);\n padding-left: 24px;\n}\n\n.ntm-roles-table-header-cell__container {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n gap: 1rem;\n overflow: hidden;\n}\n\n.ntm-roles-table-header__dropdown {\n margin: 3px;\n flex-shrink: 0;\n}\n\n.ntm-roles-table-header__role-name {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.ntm-roles-table__rows {\n width: 100%;\n height: calc(\n 100vh - var(--neeto-ui-main-header-with-breadcrumbs-height) - var(\n --ntm-roles-table-header-height\n ) - var(--ntm-roles-table-default-scroll)\n );\n overflow-y: auto;\n scrollbar-width: none;\n}\n.ntm-roles-table__rows::-webkit-scrollbar {\n width: 0px;\n height: 0px;\n}\n.ntm-roles-table__rows::-webkit-scrollbar-thumb {\n background: rgb(var(--neeto-ui-gray-300));\n border-radius: 50px;\n}\n.ntm-roles-table__rows::-webkit-scrollbar-thumb:hover {\n border-radius: 50px;\n}\n.ntm-roles-table__rows::-webkit-scrollbar-track {\n background: rgb(var(--neeto-ui-gray-300));\n}\n\n.ntm-roles-table__row {\n display: flex;\n align-items: center;\n}\n.ntm-roles-table__row .ntm-roles-table__cell {\n overflow: hidden;\n position: relative;\n}\n.ntm-roles-table__row .ntm-roles-table__cell p {\n opacity: 0;\n width: 340px;\n min-width: 340px;\n}\n.ntm-roles-table__row.ntm-roles-table__row--highlighted .ntm-roles-table__cell {\n background-color: rgb(var(--neeto-ui-primary-100));\n}\n.ntm-roles-table__row:not(.ntm-roles-table__row--highlighted) .ntm-roles-table__cell {\n border-bottom: thin solid rgb(var(--neeto-ui-gray-300));\n}\n\n.ntm-roles-table-sidebar__drop-down-button {\n color: rgb(var(--neeto-ui-gray-600));\n cursor: pointer;\n}\n\n.ntm-roles-modal__body > * + * {\n margin-top: 1rem;\n}\n.ntm-roles-modal__footer {\n display: flex;\n gap: 0.5rem;\n}\n\n.ntm-roles-pane__body {\n width: 100%;\n margin-bottom: 1.5rem;\n}\n.ntm-roles-pane__body-wrapper > * + * {\n margin-top: 1rem;\n}\n.ntm-roles-pane__body > * + * {\n margin-top: 1.5rem;\n}\n.ntm-roles-pane__footer {\n display: flex;\n gap: 0.5rem;\n}\n\n.ntm-roles-permission > * + * {\n margin: 0.5rem 0;\n}\n.ntm-roles-permission__heading {\n color: rgb(var(--neeto-ui-gray-500));\n text-transform: uppercase;\n}\n.ntm-roles-permission__card {\n background-color: rgb(var(--neeto-ui-white));\n align-items: center;\n border-radius: var(--neeto-ui-rounded);\n border-width: 1px;\n border-color: rgb(var(--neeto-ui-gray-300));\n cursor: pointer;\n display: flex;\n gap: 0.75rem;\n padding: 1rem 0.75rem;\n}\n.ntm-roles-permission__card--description {\n flex-grow: 1;\n}\n.ntm-roles-permission__card--checkbox {\n padding: 0 0.5rem;\n}\n\n.ntm-roles-help-url-wrapper {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n padding: 1rem 0;\n}";
10302
10190
  n(css,{});
10303
10191
 
10304
10192
  exports.ManageMember = ManageMember;