@cashub/ui 0.48.22 → 0.48.23

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cashub/ui",
-  "version": "0.48.22",
+  "version": "0.48.23",
   "private": false,
   "author": "CasHUB Team",
   "description": "CasHUB UI components library",

package/select/Select.js

@@ -18,6 +18,7 @@ var _media = _interopRequireDefault(require("../styles/mixin/media"));
 var _SelectedSingle = _interopRequireDefault(require("./subComponent/SelectedSingle"));
 var _SelectedMultipleTags = _interopRequireDefault(require("./subComponent/SelectedMultipleTags"));
 var _SelectedMultipleText = _interopRequireDefault(require("./subComponent/SelectedMultipleText"));
+var _SelectedMultipleCount = _interopRequireDefault(require("./subComponent/SelectedMultipleCount"));
 var _ListBox = _interopRequireDefault(require("./subComponent/ListBox"));
 var _SearchBox = _interopRequireDefault(require("./subComponent/SearchBox"));
 var _Options = _interopRequireDefault(require("./subComponent/Options"));
@@ -304,6 +305,12 @@ const Select = _ref => {
             children: text
           });
         }
+        if (displayMode === 'count') {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectedMultipleCount.default, {
+            placeholder: placeholder,
+            count: selectedOptions.length
+          });
+        }
         if (selectedOptions[0].id === allOptionId) {
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectedMultipleTags.default, {
             content: renderOptionContent(selectedOptions[0]),

package/select/subComponent/SelectedMultipleCount.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject, _templateObject2;
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
+const SelectedMultipleCount = _ref => {
+  let {
+    placeholder,
+    count
+  } = _ref;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Text, {
+    children: [placeholder, count > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(CountBadge, {
+      children: count
+    })]
+  });
+};
+const Text = _styledComponents.default.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: var(--font-on-background);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: flex;\n  align-items: center;\n"])));
+const CountBadge = _styledComponents.default.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: inline-block;\n  margin-left: 6px;\n  padding: 0 6px;\n  border-radius: var(--border-radius-l);\n  background: var(--color-primary);\n  color: #fff;\n  font-size: var(--font-caption);\n  line-height: 18px;\n"])));
+var _default = exports.default = SelectedMultipleCount;