asab_webui_components 25.1.1

package/CHANGELOG.md

@@ -0,0 +1,295 @@
+# CHANGELOG for ASAB WebUI Components
+
+## v24.47
+
+### Releases
+
+- v24.47-alpha31
+- v24.47-alpha30
+- v24.47-alpha21
+- v24.47-alpha17
+- v24.47-alpha16
+- v24.47-alpha10
+- v24.47-alpha9
+- v24.47-alpha8
+- v24.47-alpha3
+
+### Refactor
+
+- Make message rendering in `problemMarkers` more performant (!493, INDIGO Sprint 241220, v24.47-alpha31)
+- Add fallback on undefined endColumn of problem markers (!471, INDIGO Sprint 241122, v24.47-alpha17)
+- Add possiblity for additional styling by adding a custom class to `CellContentLoader` (!441, INDIGO Sprint 241108, v24.47-alpha8)
+
+### Features
+
+- Update default Generic renderer to have a fallback on values which are objects (!475, INDIGO Sprint 241122, v24.47-alpha21)
+- Create reusable `problemMarkers` monaco editor util which returns the list of the problem markers (!467, INDIGO Sprint 241122, v24.47-alpha16)
+- Create `FullscreenButton` that can be added to components to trigger fullscreen mode (!444, INDIGO Sprint 241108, v24.47-alpha9)
+- Modify datatable's advanced filtering, so that title in Dropdown and Badges are aligned and readable for the user (!426, INDIGO Sprint 241108, v24.47-alpha3)
+
+
+### Bugfix
+
+- Fix on incorrect condition in problem markers util when rendering the end column value (!492, INDIGO Sprint 241220, v24.47-alpha30)
+- Update `@import` to `@use` to eliminate sass-related warning (!443, INDIGO Sprint 241122, v24.47-alpha10)
+
+## v24.43
+
+### Releases
+
+- v24.43-alpha7
+- v24.43-alpha4
+- v24.43-alpha1
+
+### Breaking changes
+
+- ASAB Config WebUI `v24.43-alpha1` and higher requires LM.io Common Library `v24.40-alpha3` or higher
+
+### Refactor
+
+- Refactor Input select of Configuration to be compatible with new schema for default values and selection dropdown values (the selection dropdown values should be added into `enum` part of the schema) (!428, INDIGO Sprint 241004, v24.43-alpha1)
+
+### Features
+
+- Add styling for fullscreen card mode (!439, INDIGO Sprint 241030, v24.43-alpha7)
+
+### Bugfix
+
+- Refactor `isValidIP` to a function that manually checks the structure of IP addresses instead of using regex expression (!436, INDIGO Sprint 241004, v24.43-alpha4)
+
+## v24.38
+
+### Releases
+
+- v24.38-alpha22
+- v24.38-alpha21
+- v24.38-alpha18
+- v24.38-alpha10
+- v24.38-alpha3
+- v24.38-alpha2
+
+### Refactor
+
+- Rename `TerminalCard` component to `ConsoleCard` (!430, INDIGO Sprint 241004, v24.38-alpha21)
+
+### Features
+
+- Implemented `rowStyle` prop for DataTable2, add info to documentation about new prop (!407, INDIGO Sprint 241004, v24.38-alpha18)
+- Add function `isValidIP` that checks if a given IP address is valid (!403, INDIGO Sprint 240913, v24.38-alpha10)
+- Add Tree menu documentation. Renamed `flatTree` => `flatten`  (!406, INDIGO Sprint 240913, v24.38-alpha3)
+- Implement Attention required badge (!390, INDIGO Sprint 240913, v24.38-alpha2)
+
+### Refactor
+
+- Update Credentials component, display userName without SeaCatAdminFederationModule (!423, INDIGO Sprint 241004, v24.38-alpha22)
+- Updated `formatIntoTree` function, added sorting nodes (!424, INDIGO Sprint 241004, v24.38-alpha20)
+
+## v24.34
+
+### Releases
+
+- v24.34-alpha14
+- v24.34-alpha9
+- v24.34-alpha3
+- v24.34-alpha2
+
+### Feature
+
+- Add Tree menu util removeTreeContent  that hides folders and files specified in it and new formated data functions `formatIntoTree` and `formatIntoLeafTree` (!392, INDIGO Sprint 240830, v24.34-alpha9)
+- Add Tree menu util and prop which will flatten the Tree menu structure (!358, INDIGO Sprint 240816, v24.34-alpha2)
+
+### Refactor
+
+- Change background and font color of the `TerminalCard` (!401, INDIGO Sprint 240913, v24.34-alpha14)
+- Change font color of info alert, button and badge in dark mode to make it more visible (!380, INDIGO Sprint 240802, v24.34-alpha3)
+
+## v24.28
+
+## Releases
+
+- v24.28-alpha29
+- v24.28-alpha28
+- v24.28-alpha23
+- v24.28-alpha16
+- v24.28-alpha11
+- v24.28-alpha10
+- v24.28-alpha8
+- v24.28-alpha1
+
+### Refactor
+
+- Prevent wrapping of timestamp onto a new line in `DateTime` component (!349, INDIGO Sprint 240621, v24.28-alpha1)
+
+### Features
+
+- Add list of country ISO codes with their corresponding full names (!351, INDIGO Sprint 240719, v24.28-alpha29)
+- Implement `removeFileExtension` component for removing extension (!374, INDIGO Sprint 240802, v24.28-alpha28)
+- Implement saving of open nodes in TreeMenu to sessionStorage (!337, INDIGO Sprint 240719, v24.28-alpha23)
+- Add function `isPrivateIP` that checks if a given IP address is private (!350, INDIGO Sprint 240621, v24.28-alpha11)
+- Implement `TerminalCard` component (!276, INDIGO Sprint 240621, v24.28-alpha10)
+- Implement option to specify `disableParams` property to use state to store parameters of DataTable2 instead of usage of searchParams. (!338, INDIGO Sprint 240621, v24.28-alpha8)
+- Implement deepMerge util component. (!338, INDIGO Sprint 240621, v24.28-alpha8)
+
+### Bugfix
+
+- Fix deprecation warning in stylesheet regarding nested rules (!366, INDIGO Sprint 240719, v24.28-alpha16)
+
+## v24.19
+
+### Releases
+
+- v24.19-alpha29
+- v24.19-alpha28
+- v24.19-alpha22
+- v24.19-alpha18
+- v24.19-alpha12
+- v24.19-alpha10
+- v24.19-alpha8
+
+### Features
+
+- Add `hexToString` function that convertes a hexadecimal string into its corresponding ASCII string (!334, INDIGO Sprint 240607, v24.19-alpha29)
+- Set width of the columns based on the content in the DataTable2 (!249, INDIGO Sprint 240607, v24.19-alpha22)
+- Implement `itemExtensionHandler` function (!253, INDIGO Sprint 240607, v24.19-alpha18)
+- Implement `isResourceValid` function. Create utils folder and replace `authz.js`, updated paths for import `authz.js` (!302, INDIGO Sprint 240527, v24.19-alpha8)
+
+### Refactor
+
+- Updated pagination callback in `DataTable2` if no count comes. (!330, INDIGO Sprint 240621, v24.19-alpha28)
+- Rename `ErrorMessageHandler` to `ErrorHandler` (!299, INDIGO Sprint 240527, v24.19-alpha12)
+- Rename `isResourceValid` to `isAuthorized` (!317, INDIGO Sprint 240527, v24.19-alpha10)
+
+## v24.08
+
+- v24.08-alpha46
+- v24.08-alpha45
+- v24.08-alpha40
+- v24.08-alpha35
+- v24.08-alpha32
+- v24.08-alpha22
+- v24.08-alpha19
+- v24.08-alpha15
+- v24.08-alpha11
+- v24.08-alpha10
+- v24.08-alpha9
+- v24.08-alpha1
+
+### Features
+
+- Add application object into the Renderer constructor (!287, INDIGO Sprint 240430, v24.08-alpha45)
+- Implement PubSub messaging, create package.json file to share PubSub messages and functions accross applications (!244, INDIGO Sprint 240411, v24.08-alpha40)
+- Implement print styles for DataTable2 (!245, INDIGO Sprint 240411, v24.08-alpha35)
+- Implement AdvancedCard component (!238, INDIGO Sprint 240315, v24.08-alpha19)
+
+### Refactor
+
+- Change card header color to text color so it does not resemble a clickable link (!284, INDIGO Sprint 240430, v24.08-alpha46)
+- Move local styling of the monaco hover from `asab_library_webui` and `lmio_parser_builder_webui` to `asab_webui_components` (!257, INDIGO Sprint 240402, v24.08-alpha32)
+- ErrorMessageHandler moved to asab-component-webui from bs-query-webui (!231, INDIGO Sprint 240315, v24.08-alpha22)
+- Move the access validation with `validateAccess` to be imported from ASAB WebUI instead of handling it locally (!228, INDIGO Sprint 240301, v24.08-alpha15)
+- Change height of ResultCard and remove top margin to prevent scrolling (!122, INDIGO Sprint 240216, v24.08-alpha10)
+- Unify `parseInt` in the DataTable2. Create `parseParam` function. Overflow-x style correction for the DataTableCard2 (!225, INDIGO Sprint 240301, v24.08-alpha9)
+- The obsolete TreeMenu has been completely replaced by the new TreeMenu. TreeMenu2 is renamed to TreeMenu and the old code is removed. Add ability to add custom FolderIcon and FileIcon (!117, INDIGO Sprint 240216, v24.08-alpha1)
+
+### Bugfix
+
+- Remove button border of outline buttons in dropdowns (!227, INDIGO Sprint 240301, v24.08-alpha11)
+
+## v24.03
+
+### Releases
+
+- v24.03-alpha17
+- v24.03-alpha13
+- v24.03-alpha3
+
+### Features
+
+- Update DataTable with alternative approach of retreiving data from loader method using setRows and setCount hooks (!181, INDIGO Sprint 240119, v24.03-alpha17)
+
+### Refactor
+
+- Refactor error message to avoid duplication (!199, INDIGO Sprint 240105, v24.03-alpha16)
+- Refactor Humanize component - change naming to "Invalid value", correct validation of value, add non-breaking space before unit (!184, INDIGO Sprint 240119, v24.03-alpha13)
+- Refactor reusable ResultCard so that the redirection will take the user to the present screen (!163, INDIGO Sprint 240105, v24.03-alpha3)
+
+## v23.48
+
+### Releases
+
+- v23.48-alpha36
+- v23.48-alpha35
+- v23.48-alpha34
+- v23.48-alpha29
+- v23.48-alpha24
+- v23.48-alpha20
+- v23.48-alpha15
+- v23.48-alpha14
+- v23.48-alpha10
+- v23.48-alpha9
+- v23.48-alpha5
+
+### Features
+
+- Implement TreeMenuCard component (!169, INDIGO Sprint 240105, v23.48-alpha34)
+- Add new prop `reload` for updating data in the DataTable2 (!156, INDIGO Sprint 240105, v23.48-alpha29)
+- Implement route replace on DataTable initialization to avoid removal of search parameters when navigating back in browser's history to initial state (!157, INDIGO Sprint 231208, v23.48-alpha20)
+- Implement advanced filtering to DataTable2, refactor serialization of the search parameters in the browser and in REST API request (!96, INDIGO Sprint 231124, v23.48-alpha15)
+- Create resusable ResultCard, to give user information about successful/unsuccessful change (!147, INDIGO Sprint 231124, v23.48-alpha14)
+- Implement option to specify own datetime format in DateTime component (!142, INDIGO Sprint 231124, v23.48-alpha5)
+
+### Refactor
+
+- Remove demo part (!126, INDIGO Sprint 231124, v23.48-alpha10)
+
+- Refactor x-icons for deleting to trash-icons (!133, INDIGO Sprint 231110, v23.48-alpha9)
+
+- Refactor Humanize component to import a new component which will return value as a string (!171, INDIGO Sprint 240105, v23.48-alpha35)
+
+### Bugfix
+
+- Implement fallback when URL limit parameter is missing/invalid in DataTable2 (!179, INDIGO Sprint 240105, v23.48-alpha36)
+- Add missing name attribut to inputs (!162, INDIGO Sprint 231208, v23.48-alpha24)
+
+## v23.45
+
+### Releases
+
+- v23.45-alpha5
+- v23.45-alpha1
+
+### Breaking changes
+
+- After migration from react-router-dom v5 to react-router-dom v6, some of the routing components are not being supported. For more info, please see https://reactrouter.com/en/main/upgrading/v5
+
+### Features
+
+- Implement addAlertFromException method to render additional information from exceptions in Alert message (!106, INDIGO Sprint 231110, v23.45-alpha6)
+- Migrate react-router-dom from v5 to v6 (!98, INDIGO Sprint 231027, v23.45-alpha1)
+
+### Refactor
+
+- Refactor implementation of bootstrap placeholder and change of its background color (!127, INDIGO Sprint 231110, v23.45-alpha5)
+
+## v23.44
+
+### Releases
+
+- v23.44-alpha11
+- v23.44-alpha9
+- v23.44-alpha8
+- v23.44-alpha7
+- v23.44-alpha6
+- v23.44-alpha3
+
+### Refactoring
+
+- Refactor ContentLoader to prevent from having negative values in viewBox (!97, INDIGO Sprint 231027, v23.44-alpha3)
+
+- Change color of primary button :active state (!113, INDIGO Sprint 231027, v23.44-alpha6)
+
+- Refactor disabled button pointer events to show title (!118, INDIGO Sprint 231027, v23.44-alpha7)
+
+- Refactor react-content-loader to Bootstrap placeholder (!121, INDIGO Sprint 231027, v23.44-alpha8)
+
+- Refactor theme-print styles (!55, INDIGO Sprint 231027, v23.44-alpha9, v23.44-alpha11)

package/LICENSE

@@ -0,0 +1,28 @@
+BSD 3-Clause License
+
+Copyright (c) 2025, TeskaLabs
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice, this
+   list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright notice,
+   this list of conditions and the following disclaimer in the documentation
+   and/or other materials provided with the distribution.
+
+3. Neither the name of the copyright holder nor the names of its
+   contributors may be used to endorse or promote products derived from
+   this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

package/README.md

@@ -0,0 +1,3 @@
+# Asab WebUI Components Library
+
+Components library of ASAB used in WebUI projects.

package/dist/abc/Module.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Module = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var Module = exports.Module = /*#__PURE__*/function () {
+  function Module(app, name) {
+    (0, _classCallCheck2["default"])(this, Module);
+    this.App = app;
+    this.Name = name;
+  }
+  return (0, _createClass2["default"])(Module, [{
+    key: "initialize",
+    value: function initialize() {}
+  }]);
+}();

package/dist/abc/Renderer.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof3 = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Renderer = void 0;
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactJsonView = _interopRequireDefault(require("react-json-view"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+var Renderer = exports.Renderer = /*#__PURE__*/function (_Component) {
+  // Renderer defaults
+  function Renderer(app) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, Renderer);
+    _this = _callSuper(this, Renderer); // Call super() for React component initialization
+    _this.App = app;
+    return _this;
+  }
+  (0, _inherits2["default"])(Renderer, _Component);
+  return (0, _createClass2["default"])(Renderer, [{
+    key: "render",
+    value: function render(key, value, schemaField) {
+      // Render ReactJson component if value is a object
+      if ((0, _typeof2["default"])(value) === 'object') {
+        var theme = this.App.Store.getState().theme;
+        return /*#__PURE__*/_react["default"].createElement(_reactJsonView["default"], {
+          src: value,
+          name: false,
+          collapsed: false,
+          displayDataTypes: false,
+          displayArrayKey: false,
+          quotesOnKeys: false,
+          enableClipboard: false,
+          indentWidth: 8,
+          theme: theme === 'dark' ? "chalk" : "rjv-default"
+        });
+      }
+      // Render span with value inside as a default
+      return /*#__PURE__*/_react["default"].createElement("span", null, value);
+    }
+  }, {
+    key: "plain",
+    value: function plain(key, value, schemaField) {
+      // Render stringified component if value is a object
+      if ((0, _typeof2["default"])(value) === 'object') {
+        try {
+          return JSON.stringify(value);
+        } catch (e) {
+          console.warn('Failed to stringify the renderer value:', value, e);
+          return value;
+        }
+      }
+      return value;
+    }
+  }]);
+}(_react.Component);

package/dist/abc/Service.js

@@ -0,0 +1,24 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Service = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var Service = exports.Service = /*#__PURE__*/function () {
+  function Service(app, serviceName) {
+    (0, _classCallCheck2["default"])(this, Service);
+    this.Name = serviceName;
+    this.App = app;
+    app.registerService(this);
+  }
+  return (0, _createClass2["default"])(Service, [{
+    key: "initialize",
+    value: function initialize() {
+      // Override this method in your service
+      // At this point it is ensured, that Redux Store exists at App.Store
+    }
+  }]);
+}();

package/dist/components/AdvancedCard/AdvancedCard.js

@@ -0,0 +1,38 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AdvancedCard = AdvancedCard;
+var _react = _interopRequireDefault(require("react"));
+var _reactRedux = require("react-redux");
+var _reactJsonView = _interopRequireDefault(require("react-json-view"));
+var _reactstrap = require("reactstrap");
+// This is a card that displays data on the page in JSON format after hotkeys are pressed `ctrl + shift + 1`
+function AdvancedCard(_ref) {
+  var data = _ref.data,
+    _ref$cardClassname = _ref.cardClassname,
+    cardClassname = _ref$cardClassname === void 0 ? '' : _ref$cardClassname;
+  var theme = (0, _reactRedux.useSelector)(function (state) {
+    return state.theme;
+  });
+  var advmode = (0, _reactRedux.useSelector)(function (state) {
+    var _state$advmode;
+    return (_state$advmode = state.advmode) === null || _state$advmode === void 0 ? void 0 : _state$advmode.enabled;
+  });
+  return advmode ? /*#__PURE__*/_react["default"].createElement(_reactstrap.Card, {
+    className: "".concat(cardClassname)
+  }, /*#__PURE__*/_react["default"].createElement(_reactstrap.CardHeader, {
+    className: "card-header-flex"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "flex-fill"
+  }, /*#__PURE__*/_react["default"].createElement("h3", null, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "bi bi-code-slash pe-2"
+  }), "JSON"))), /*#__PURE__*/_react["default"].createElement(_reactstrap.CardBody, null, /*#__PURE__*/_react["default"].createElement(_reactJsonView["default"], {
+    src: data,
+    theme: theme === 'dark' ? 'chalk' : 'rjv-default',
+    name: false,
+    collapsed: false
+  }))) : null;
+}

package/dist/components/AdvancedCard/AdvancedCard.jsx

@@ -0,0 +1,34 @@
+import React from 'react';
+import { useSelector } from 'react-redux';
+import ReactJson from 'react-json-view';
+import { Card, CardHeader, CardBody } from 'reactstrap';
+
+// This is a card that displays data on the page in JSON format after hotkeys are pressed `ctrl + shift + 1`
+export function AdvancedCard ({ data, cardClassname='' }) {
+	const theme = useSelector(state => state.theme);
+	const advmode = useSelector(state => state.advmode?.enabled);
+
+	return (
+		advmode ?
+			<Card className={`${cardClassname}`}>
+				<CardHeader className='card-header-flex'>
+					<div className='flex-fill'>
+						<h3>
+							<i className='bi bi-code-slash pe-2' />
+							JSON
+						</h3>
+					</div>
+				</CardHeader>
+				<CardBody>
+					<ReactJson
+						src={data}
+						theme={(theme === 'dark') ? 'chalk' : 'rjv-default'}
+						name={false}
+						collapsed={false}
+					/>
+				</CardBody>
+			</Card>
+		:
+			null
+	)
+}

package/dist/components/AttentionRequired/AttentionRequiredBadge.js

@@ -0,0 +1,22 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AttentionBadge = AttentionBadge;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _reactstrap = require("reactstrap");
+var _excluded = ["content"];
+// Component for Attention badge rendereing
+function AttentionBadge(_ref) {
+  var content = _ref.content,
+    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var level = (content === null || content === void 0 ? void 0 : content.level) || 'danger';
+  return /*#__PURE__*/_react["default"].createElement(_reactstrap.Badge, (0, _extends2["default"])({
+    className: "attention-required-badge",
+    color: level
+  }, props), content === null || content === void 0 ? void 0 : content.count);
+}

package/dist/components/AttentionRequired/AttentionRequiredBadge.jsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { Badge } from 'reactstrap';
+
+// Component for Attention badge rendereing
+export function AttentionBadge({ content, ...props }) {
+	const level = content?.level || 'danger';
+
+	return(
+		<Badge
+			className='attention-required-badge'
+			color={level}
+			{...props} // Spread the additional props like onClick, etc.
+		>
+			{content?.count}
+		</Badge>
+	)
+}

package/dist/components/Authz/ButtonWithAuthz.js

@@ -0,0 +1,81 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ButtonWithAuthz = ButtonWithAuthz;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactstrap = require("reactstrap");
+var _authz = require("./utils/authz");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function ownKeys(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; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+/*
+	ButtonWithAutz component emulates the functionality of reactstrap <Button/> component
+	and extend it by disable feature based on resources.
+
+	* resource
+		* the resource to distinguish access rights, e.g. yourproduct:yourcomponent:write
+
+	* resources
+		* the list of resources from the userinfo
+
+	* hideOnUnauthorizedAccess
+		* the option to hide the button completely instead of disabling it, default is false
+
+	* Language localisations for generic `unauthorized message` can be added to the translation.json files of
+	  public/locales/en & public/locales/cs of the product where component ButtonWithAuthz is used. The default
+	  message is `You do not have rights` and it can be re-set in locales as e.g.
+
+	  {
+		"You do not have access rights to perform this action": "You do not have access rights to perform this action"
+	  }
+
+---
+
+	Example:
+
+	import { ButtonWithAuthz } from 'asab_webui_components';
+	import { useSelector } from 'react-redux';
+
+	...
+
+	const resources = useSelector(state => state.auth?.resources);
+
+	...
+
+	return(
+		...
+			<ButtonWithAuthz
+				title={t('MyApp|Delete')}
+				color="danger"
+				size="sm"
+				onClick={() => { deleteApp() }}
+				resource="myapp:mylist:write"
+				resources={resources}
+				hideOnUnauthorizedAccess={true}
+				>
+				<span className="bi bi-code-slash pe-2" />
+				{t('MyApp|Delete')}
+			</ButtonWithAuthz>
+		...
+	)
+
+*/
+
+function ButtonWithAuthz(props) {
+  var childProps = _objectSpread({}, props); // Create a new child component to have option to remove props
+  var authzObj = (0, _authz.authz)(childProps);
+  var disabled = authzObj.disabled;
+  var hide = authzObj.hide;
+  var title = authzObj.title;
+  return hide && disabled ? null : /*#__PURE__*/_react["default"].createElement(_reactstrap.Button, (0, _extends2["default"])({}, childProps, {
+    title: title,
+    disabled: disabled
+  }), childProps.children);
+}