esewa-ui-library 1.10.2 → 1.10.4

package/dist/index.modern.js

@@ -122,9 +122,11 @@ var ESewaAlertCard = function ESewaAlertCard(_ref) {
     className: 'alert-card--description--icon'
   }, typeof descriptionIcon === 'string' ? React__default.createElement("i", {
     className: descriptionIcon
-  }) : descriptionIcon), description && React__default.createElement("p", {
+  }) : descriptionIcon), description && (typeof description === 'string' ? React__default.createElement("p", {
     className: 'card-text body2'
-  }, description)), showCardFooter && React__default.createElement("div", {
+  }, description) : React__default.createElement("div", {
+    className: 'card-text body2'
+  }, description))), showCardFooter && React__default.createElement("div", {
     className: 'alert-card--footer'
   }, React__default.createElement(ESewaButton, {
     className: 'border-radius-8',
@@ -7005,7 +7007,7 @@ var ESewaCarousel = function ESewaCarousel(_ref) {
 
 var _templateObject$k, _templateObject2;
 var ChipContainer = styled.div(_templateObject$k || (_templateObject$k = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  padding: 8px;\n"])));
-var Chip = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 8px 12px;\n  border-radius: 16px;\n  cursor: pointer;\n  font-size: 14px;\n  background-color: ", ";\n  color: ", ";\n  &.border-radius-0 {\n    border-radius: var(--values-value-0);\n  }\n  &.border-radius-2 {\n    border-radius: var(--values-value-2);\n  }\n  &.border-radius-4 {\n    border-radius: var(--values-value-4);\n  }\n  &.border-radius-8 {\n    border-radius: var(--values-value-8);\n  }\n  &.border-radius-16 {\n    border-radius: var(--values-value-16);\n  }\n  i{\n    font-size: var(--values-value-12);\n  }\n  .chip__icon {\n    display: flex;\n    align-items: center;\n    font-size: var(--values-value-12);\n  }\n"])), function (_ref) {
+var Chip = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 8px 12px;\n  border-radius: 16px;\n  cursor: pointer;\n  font-size: 14px;\n  background-color: ", ";\n  color: ", ";\n  &.border-radius-0 {\n    border-radius: var(--values-value-0);\n  }\n  &.border-radius-2 {\n    border-radius: var(--values-value-2);\n  }\n  &.border-radius-4 {\n    border-radius: var(--values-value-4);\n  }\n  &.border-radius-8 {\n    border-radius: var(--values-value-8);\n  }\n  &.border-radius-16 {\n    border-radius: var(--values-value-16);\n  }\n  i {\n    font-size: var(--values-value-12);\n  }\n  .chip__icon {\n    display: flex;\n    align-items: center;\n    font-size: var(--values-value-12);\n  }\n"])), function (_ref) {
   var selected = _ref.selected;
   return selected ? 'var(--primary-500)' : 'var(--secondary-bg-light)';
 }, function (_ref2) {
@@ -7029,6 +7031,16 @@ var ESewaChipGroup = function ESewaChipGroup(_ref3) {
   var _useState = useState(initialSelectedChips),
     selectedChips = _useState[0],
     setSelectedChips = _useState[1];
+  useEffect(function () {
+    var newSelected = function () {
+      if (defaultValue === undefined) return [];
+      if (selection === 'single') {
+        return typeof defaultValue === 'number' ? [defaultValue] : [];
+      }
+      return Array.isArray(defaultValue) ? defaultValue : [];
+    }();
+    setSelectedChips(newSelected);
+  }, [defaultValue, selection]);
   var handleSelectChip = function handleSelectChip(id) {
     if (selection === 'single') {
       setSelectedChips([id]);
@@ -7061,7 +7073,7 @@ var ESewaChipGroup = function ESewaChipGroup(_ref3) {
         return handleSelectChip(chip.id);
       }
     }, chip.showIcon && chip.icon && React__default.createElement("span", {
-      className: "chip__icon"
+      className: 'chip__icon'
     }, typeof chip.icon === 'string' ? React__default.createElement("i", {
       className: chip.icon
     }) : chip.icon), chip.text);