@capillarytech/blaze-ui 0.1.6-alpha.32 → 0.1.6-alpha.33

package/components/CapUnifiedSelect/CapUnifiedSelect.js

@@ -7,6 +7,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _antd = require("antd");
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _image = _interopRequireDefault(require("./Utils/image.png"));
 var _icons = require("@ant-design/icons");
 var _withStyles = _interopRequireDefault(require("../../utils/withStyles"));
 var _styles = require("./styles");
@@ -17,30 +18,30 @@ const CapUnifiedSelect = _ref => {
   let {
     type,
     options = [],
-    treeData,
     value,
     onChange,
     placeholder = 'Select an option',
     className,
     style,
-    status,
-    statusMessage,
+    isError = false,
+    errorMessage,
+    popupClassName,
     allowClear = false,
-    label,
+    headerLabel,
     tooltip,
+    bylineText,
     disabled = false,
-    treeCheckable = false,
-    customPopupRender = false,
+    showUpload = false,
+    customPopupRender = true,
+    showSearch = true,
+    searchBasedOn = 'label',
     onConfirm,
-    onCancel
+    onCancel,
+    ...rest
   } = _ref;
-  const StyledSelect = (0, _styledComponents.default)(_antd.Select).withConfig({
-    displayName: "StyledSelect",
-    componentId: "sc-wsphu8-0"
-  })(["", ""], _styles.selectStyles);
   const StyledTreeSelect = (0, _styledComponents.default)(_antd.TreeSelect).withConfig({
     displayName: "StyledTreeSelect",
-    componentId: "sc-wsphu8-1"
+    componentId: "sc-wsphu8-0"
   })(["", ""], _styles.selectStyles);
   const [searchText, setSearchText] = (0, _react.useState)('');
   const [tempValue, setTempValue] = (0, _react.useState)(value);
@@ -48,9 +49,6 @@ const CapUnifiedSelect = _ref => {
   (0, _react.useEffect)(() => {
     setTempValue(value);
   }, [value]);
-  const selectVirtualizationProps = {
-    listHeight: 256
-  };
   const treeSelectVirtualizationProps = {
     listHeight: 256,
     listItemHeight: 32
@@ -81,10 +79,17 @@ const CapUnifiedSelect = _ref => {
   const getFilteredTreeData = (data, search) => {
     if (!search) return data;
     const filterNode = node => {
-      var _node$title, _node$label;
-      const titleText = ((_node$title = node.title) == null ? void 0 : _node$title.toLowerCase()) || '';
-      const labelText = ((_node$label = node.label) == null ? void 0 : _node$label.toLowerCase()) || '';
-      return titleText.includes(search.toLowerCase()) || labelText.includes(search.toLowerCase());
+      if (searchBasedOn === 'value') {
+        const valueText = String(node.value || '').toLowerCase();
+        return valueText.includes(search.toLowerCase());
+      } else if (searchBasedOn === 'key') {
+        const keyText = String(node.key || '').toLowerCase();
+        return keyText.includes(search.toLowerCase());
+      } else {
+        var _node$label;
+        const labelText = ((_node$label = node.label) == null ? void 0 : _node$label.toLowerCase()) || '';
+        return labelText.includes(search.toLowerCase());
+      }
     };
     const loop = data => data.map(item => {
       const children = item.children ? loop(item.children) : [];
@@ -98,98 +103,89 @@ const CapUnifiedSelect = _ref => {
     }).filter(Boolean);
     return loop(data);
   };
-  const flattenedLeafValues = nodes => (nodes == null ? void 0 : nodes.flatMap(node => node.children ? flattenedLeafValues(node.children) : [node.value])) || [];
-  const filteredTree = getFilteredTreeData(treeData || options, searchText);
-  const filteredOptions = !searchText ? options : options.filter(opt => {
-    var _opt$label;
-    return (_opt$label = opt.label) == null ? void 0 : _opt$label.toLowerCase().includes(searchText.toLowerCase());
-  });
-  const leafValues = flattenedLeafValues(filteredTree);
-  const handleSelectAll = function (isTree) {
-    if (isTree === void 0) {
-      isTree = false;
-    }
-    const availableValues = isTree ? leafValues : filteredOptions.map(opt => opt.value);
-    if (allSelected) {
-      setTempValue([]);
-    } else {
-      setTempValue(availableValues);
-    }
+  const flattenLeafValues = nodes => (nodes == null ? void 0 : nodes.flatMap(node => node.children ? flattenLeafValues(node.children) : [node.value])) || [];
+  const isMulti = type === 'multiSelect' || type === 'multiTreeSelect';
+  const isTree = type === 'treeSelect' || type === 'multiTreeSelect';
+  const dataSource = isTree ? options : options.map(opt => ({
+    title: opt.label,
+    value: opt.value,
+    key: opt.key || opt.value
+  }));
+  const filteredTree = getFilteredTreeData(dataSource, searchText);
+  const leafValues = flattenLeafValues(filteredTree);
+  const handleSelectAll = () => {
+    const availableValues = leafValues;
+    setTempValue(allSelected ? [] : availableValues);
     setAllSelected(!allSelected);
   };
   (0, _react.useEffect)(() => {
-    const isMultipleMode = type === 'multiSelect' || type === 'multiTreeSelect';
-    if (isMultipleMode && Array.isArray(tempValue)) {
-      const availableValues = type.includes('tree') ? leafValues : filteredOptions.map(opt => opt.value);
-      setAllSelected(tempValue.length > 0 && tempValue.length === availableValues.length);
+    if (isMulti && Array.isArray(tempValue)) {
+      setAllSelected(tempValue.length > 0 && tempValue.length === leafValues.length);
     }
-  }, [tempValue, filteredOptions, leafValues, type]);
+  }, [tempValue, leafValues, isMulti]);
   const handleConfirm = () => {
-    if (onConfirm) {
-      onConfirm(tempValue);
-    } else {
-      onChange(tempValue);
-    }
+    if (onConfirm) onConfirm(tempValue);else onChange(tempValue);
     setSearchText('');
   };
   const handleCancel = () => {
-    if (onCancel) {
-      onCancel();
-    }
+    if (onCancel) onCancel();
     setTempValue(value);
     setSearchText('');
   };
   const handleTempChange = newValue => {
     setTempValue(newValue);
   };
-  const suffix = (type === "multiTreeSelect" || type === "multiSelect") && Array.isArray(value) && value.length > 1 ? (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+  const suffix = isMulti && Array.isArray(value) && (value == null ? void 0 : value.length) > 1 ? (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: (0, _jsxRuntime.jsxs)("span", {
-      children: ["+", value.length - 1, " more", (0, _jsxRuntime.jsx)(_icons.DownOutlined, {})]
+      children: ["+", value.length - 1, " more ", (0, _jsxRuntime.jsx)(_icons.DownOutlined, {})]
     })
   }) : (0, _jsxRuntime.jsx)(_icons.DownOutlined, {});
   const prefix = () => {
-    if ((type === "multiTreeSelect" || type === "multiSelect") && Array.isArray(value) && value.length > 0) {
+    if (isMulti && Array.isArray(value) && (value == null ? void 0 : value.length) > 0) {
       const selectedLabels = options.filter(opt => value.includes(opt.value)).map(opt => opt.label);
       return selectedLabels[0];
-    } else {
-      return null;
     }
+    return null;
   };
   const renderHeader = () => {
-    if (!label && !tooltip) return null;
-    return (0, _jsxRuntime.jsxs)(_styles.HeaderWrapper, {
-      className: disabled ? 'disabled' : '',
-      children: [label && (0, _jsxRuntime.jsx)("label", {
-        type: "label16",
-        className: disabled ? 'disabled' : '',
-        children: label
-      }), tooltip && (0, _jsxRuntime.jsx)(_antd.Tooltip, {
-        title: tooltip,
-        children: (0, _jsxRuntime.jsx)(_icons.InfoCircleOutlined, {
-          className: disabled ? 'disabled' : '',
-          style: {
-            color: '#B3BAC5'
-          }
+    if (!headerLabel && !tooltip) return null;
+    return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [(0, _jsxRuntime.jsxs)(_styles.HeaderWrapper, {
+        className: (0, _classnames.default)(disabled ? 'disabled' : '', 'cap-unified-select-header'),
+        children: [headerLabel && (0, _jsxRuntime.jsx)("label", {
+          type: "label16",
+          className: (0, _classnames.default)(disabled ? 'disabled' : '', 'cap-unified-select-header-label'),
+          children: headerLabel
+        }), tooltip && (0, _jsxRuntime.jsx)(_antd.Tooltip, {
+          title: tooltip,
+          rootClassName: "cap-unified-tooltip",
+          className: (0, _classnames.default)(disabled ? 'disabled' : '', 'cap-unified-select-header-tooltip'),
+          children: (0, _jsxRuntime.jsx)(_icons.InfoCircleOutlined, {})
+        })]
+      }), (0, _jsxRuntime.jsx)("div", {
+        className: "cap-unified-select-header-byline-text",
+        children: bylineText && (0, _jsxRuntime.jsx)("label", {
+          className: (0, _classnames.default)(disabled ? 'disabled' : '', 'cap-unified-select-header-byline-text'),
+          children: bylineText
         })
       })]
     });
   };
   const renderDropdown = () => {
-    const isMultipleSelect = type === 'multiSelect' || type === 'multiTreeSelect';
-    const isTreeMode = type === 'treeSelect' || type === 'multiTreeSelect';
-    const currentItems = isTreeMode ? filteredTree : filteredOptions;
+    const currentItems = filteredTree;
     const selectedCount = Array.isArray(tempValue) ? tempValue.length : tempValue ? 1 : 0;
     const renderCustomDropdown = menu => {
       if (!customPopupRender) return menu;
-      return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [(0, _jsxRuntime.jsx)("div", {
+      return (0, _jsxRuntime.jsxs)("div", {
+        className: (0, _classnames.default)(popupClassName, `${type}-popup-container`),
+        children: [showSearch && (0, _jsxRuntime.jsx)("div", {
           style: {
             borderBottom: '1px solid #f0f0f0'
           },
           children: (0, _jsxRuntime.jsx)(_antd.Input, {
             prefix: (0, _jsxRuntime.jsx)(_icons.SearchOutlined, {
               style: {
-                color: "#B3BAC5"
+                color: '#B3BAC5'
               }
             }),
             placeholder: "Search",
@@ -198,7 +194,36 @@ const CapUnifiedSelect = _ref => {
             onChange: e => setSearchText(e.target.value),
             onKeyDown: e => e.stopPropagation()
           })
-        }), isMultipleSelect && currentItems.length > 0 && (0, _jsxRuntime.jsxs)("div", {
+        }), isMulti && showUpload && (0, _jsxRuntime.jsx)("div", {
+          style: {
+            cursor: 'pointer',
+            display: 'flex',
+            alignItems: 'center',
+            borderBottom: '1px solid #f0f0f0',
+            height: '36px'
+          },
+          children: (0, _jsxRuntime.jsx)(_antd.Button, {
+            type: "link",
+            icon: (0, _jsxRuntime.jsx)("img", {
+              src: _image.default,
+              alt: "upload",
+              style: {
+                width: "16px",
+                height: "20px"
+              }
+            }),
+            onClick: () => {},
+            style: {
+              color: '#2466EA',
+              display: 'flex',
+              alignItems: 'center',
+              fontSize: '14px',
+              fontWeight: '400',
+              lineHeight: '20px'
+            },
+            children: "Upload"
+          })
+        }), isMulti && currentItems.length > 0 && (0, _jsxRuntime.jsxs)("div", {
           style: {
             padding: '8px 12px',
             cursor: 'pointer',
@@ -208,7 +233,7 @@ const CapUnifiedSelect = _ref => {
           },
           onClick: e => {
             e.stopPropagation();
-            handleSelectAll(isTreeMode);
+            handleSelectAll();
           },
           children: [(0, _jsxRuntime.jsx)("input", {
             type: "checkbox",
@@ -225,7 +250,7 @@ const CapUnifiedSelect = _ref => {
             },
             children: "Select all"
           })]
-        }), currentItems.length === 0 ? (0, _jsxRuntime.jsx)(NoResult, {}) : menu, currentItems.length > 0 && isMultipleSelect && (0, _jsxRuntime.jsxs)("div", {
+        }), currentItems.length === 0 ? (0, _jsxRuntime.jsx)(NoResult, {}) : menu, currentItems.length > 0 && isMulti && (0, _jsxRuntime.jsxs)("div", {
           style: {
             display: 'flex',
             justifyContent: 'space-between',
@@ -264,65 +289,36 @@ const CapUnifiedSelect = _ref => {
         })]
       });
     };
-    if (type === 'treeSelect' || type === 'multiTreeSelect') {
-      return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [(0, _jsxRuntime.jsx)(StyledTreeSelect, {
-          treeData: filteredTree,
-          value: customPopupRender ? tempValue : value,
-          onChange: customPopupRender ? handleTempChange : onChange,
-          placeholder: placeholder,
-          maxTagCount: 0,
-          maxTagPlaceholder: () => null,
-          prefix: type === "multiTreeSelect" && value.length > 0 && prefix(),
-          suffixIcon: suffix,
-          className: (0, _classnames.default)(`cap-unified-tree-select ${className || ''}`),
-          style: style,
-          status: status,
-          allowClear: allowClear,
-          showSearch: false,
-          multiple: type === 'multiTreeSelect',
-          treeCheckable: treeCheckable,
-          showCheckedStrategy: _antd.TreeSelect.SHOW_PARENT,
-          virtual: true,
-          disabled: disabled,
-          filterTreeNode: false,
-          ...treeSelectVirtualizationProps,
-          popupRender: renderCustomDropdown
-        }), status === 'error' && (0, _jsxRuntime.jsx)("div", {
-          style: {
-            color: '#E83135'
-          },
-          className: "cap-unified-select-status",
-          children: statusMessage
-        })]
-      });
-    }
     return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [(0, _jsxRuntime.jsx)(StyledSelect, {
-        options: filteredOptions,
+      children: [(0, _jsxRuntime.jsx)(StyledTreeSelect, {
+        ...rest,
+        type: type,
+        treeData: filteredTree,
         value: customPopupRender ? tempValue : value,
         onChange: customPopupRender ? handleTempChange : onChange,
         placeholder: placeholder,
         maxTagCount: 0,
         maxTagPlaceholder: () => null,
-        prefix: type === "multiSelect" && value.length > 0 && prefix(),
+        prefix: isMulti && value.length > 0 && prefix(),
         suffixIcon: suffix,
-        className: (0, _classnames.default)('cap-unified-select', className),
+        className: (0, _classnames.default)(`cap-unified-tree-select ${className || ''}`),
         style: style,
+        status: isError ? 'error' : '',
         allowClear: allowClear,
-        showSearch: false,
-        mode: type === 'multiSelect' ? 'multiple' : undefined,
+        multiple: isMulti,
+        treeCheckable: isMulti,
+        showCheckedStrategy: _antd.TreeSelect.SHOW_PARENT,
         virtual: true,
         disabled: disabled,
-        status: status,
-        ...selectVirtualizationProps,
+        filterTreeNode: false,
+        ...treeSelectVirtualizationProps,
         popupRender: renderCustomDropdown
-      }), status === 'error' && (0, _jsxRuntime.jsx)("div", {
+      }), isError && (0, _jsxRuntime.jsx)("div", {
         style: {
           color: '#E83135'
         },
         className: "cap-unified-select-status",
-        children: statusMessage
+        children: errorMessage
       })]
     });
   };
@@ -334,26 +330,32 @@ const CapUnifiedSelect = _ref => {
 CapUnifiedSelect.propTypes = {
   type: _propTypes.default.oneOf(['select', 'multiSelect', 'treeSelect', 'multiTreeSelect']),
   options: _propTypes.default.array,
-  treeData: _propTypes.default.array,
   value: _propTypes.default.any,
   onChange: _propTypes.default.func,
   placeholder: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
   className: _propTypes.default.string,
   style: _propTypes.default.object,
   allowClear: _propTypes.default.bool,
-  label: _propTypes.default.string,
+  headerLabel: _propTypes.default.string,
   tooltip: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
   disabled: _propTypes.default.bool,
-  treeCheckable: _propTypes.default.bool,
   customPopupRender: _propTypes.default.bool,
+  showSearch: _propTypes.default.bool,
+  searchBasedOn: _propTypes.default.oneOf(['label', 'value', 'key']),
   onConfirm: _propTypes.default.func,
-  onCancel: _propTypes.default.func
+  onCancel: _propTypes.default.func,
+  isError: _propTypes.default.bool,
+  errorMessage: _propTypes.default.string,
+  popupClassName: _propTypes.default.string,
+  showUpload: _propTypes.default.bool
 };
 CapUnifiedSelect.defaultProps = {
   type: 'select',
   allowClear: false,
   customPopupRender: false,
-  treeCheckable: false,
-  className: ''
+  showSearch: true,
+  searchBasedOn: 'label',
+  className: '',
+  popupClassName: ''
 };
 var _default = exports.default = (0, _withStyles.default)(CapUnifiedSelect, _styles.selectStyles);

package/components/CapUnifiedSelect/styles.js

@@ -33,4 +33,4 @@ const StyledInfoIcon = exports.StyledInfoIcon = _styledComponents.default.span.w
   displayName: "StyledInfoIcon",
   componentId: "sc-3v7xpu-6"
 })(["color:", ";font-size:16px;cursor:help;margin-left:4px;display:flex;align-items:center;&:hover{color:", ";}&.disabled{cursor:not-allowed;&:hover{color:", ";}}"], styledVars.CAP_G05, styledVars.CAP_G03, styledVars.CAP_G05);
-const selectStyles = exports.selectStyles = (0, _styledComponents.css)(["&.cap-unified-select{width:100%;font-family:", ";}&.cap-unified-select-container{.ant-select-prefix{margin-left:-5px !important;font-size:14px !important;font-weight:400 !important;color:#091E42 !important;line-height:20px !important;}}"], styledVars.FONT_FAMILY);
+const selectStyles = exports.selectStyles = (0, _styledComponents.css)(["&.cap-unified-select-container{.cap-unified-tree-select{height:32px !important;width:340px !important;}.ant-select-prefix{font-size:14px !important;font-weight:400 !important;color:#091E42 !important;line-height:20px !important;}.cap-unified-select-header-label{font-family:", " !important;font-weight:500 !important;font-size:14px !important;line-height:20px !important;letter-spacing:0px !important;}.cap-unified-select-header-tooltip{width:16px !important;height:16px !important;color:#B3BAC5 !important;}.cap-unified-select-header-byline-text{font-family:", " !important;font-weight:400 !important;font-size:12px !important;margin-top:-10px;letter-spacing:0px !important;color:#97A0AF !important;}.cap-unified-tree-select .ant-select-selector:hover{border:1px solid #7A869A !important;}.cap-unified-tree-select .select-popup-container .ant-select-tree-switcher-noop,.cap-unified-tree-select .multiSelect-popup-container .ant-select-tree-switcher-noop{display:none !important;}.ant-tree-select-dropdown .treeSelect-popup-container .ant-select-tree .ant-select-tree-treenode{margin:0px !important;}.cap-unified-tree-select .multiSelect-popup-container .ant-tree-select-dropdown .ant-select-tree .ant-select-tree-treenode{margin-left:10px !important;}.multiSelect-popup-container .ant-select-tree-treenode{margin-left:10px !important;}}&.cap-unified-select{width:100%;font-family:", ";.ant-select-selector{border-radius:", ";transition:", ";padding:0 12px;min-height:32px;display:flex;align-items:center;&:hover{border-color:", ";}}.cap-unified-select-right-slot{display:flex;align-items:center;gap:8px;margin-left:8px;}&.ant-select-focused{.ant-select-selector{border-color:", " !important;box-shadow:none !important;}}&.ant-select-status-error{.ant-select-selector{border-color:", ";}}&.ant-select-disabled{.ant-select-selector{background-color:", ";cursor:not-allowed;}}.ant-select-dropdown,&.ant-select-dropdown,&.ant-select-dropdown-placement-bottomLeft{padding:0;border-radius:12px !important;box-shadow:0 4px 12px rgba(0,0,0,0.08);overflow:hidden;.ant-select-item-option{padding:10px 16px;font-size:14px;color:#1c2530;font-weight:500;background-color:transparent !important;&:not(.ant-select-item-option-disabled):hover{background-color:#fffbe6 !important;border-radius:4px;color:#1c2530 !important;}&:hover:not(.ant-select-item-option-disabled):not(.ant-select-item-option-selected){background-color:#fffbe6 !important;color:#1c2530 !important;border-radius:4px;}&-selected:not(.ant-select-item-option-disabled){background-color:#e9f0fe !important;color:#1c2530 !important;font-weight:500;}&-active:not(:hover):not(.ant-select-item-option-disabled){background-color:transparent !important;}}.ant-select-dropdown-search,.ant-select-search{padding:8px 12px;border-bottom:1px solid #f0f0f0;input{border-radius:", ";transition:", ";&:focus{border-color:", ";box-shadow:none;}}}.rc-virtual-list-scrollbar-thumb{background-color:#dcdcdc;border-radius:4px;}.ant-divider-horizontal{margin:0;}.no-result{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#8c8c8c;font-size:14px;}.dropdown-search{padding:8px;border-bottom:1px solid #f0f0f0;}.select-all-checkbox{display:flex;align-items:center;padding:8px 12px;cursor:pointer;font-weight:500;border-bottom:1px solid #f0f0f0;user-select:none;input[type=\"checkbox\"]{cursor:pointer;}}.dropdown-footer{display:flex;justify-content:space-between;align-items:center;padding:8px;border-top:1px solid #f0f0f0;}.selected-count{color:#8c8c8c;font-size:12px;}.ant-checkbox-inner{border-color:#42b040;}.ant-checkbox-checked .ant-checkbox-inner{background-color:#42b040;border-color:#42b040;}.ant-checkbox-checked .ant-checkbox-inner::after{border-color:#42b040;}}&.ant-select-multiple{.ant-select-selection-item{background-color:#e9f0fe !important;border:none;border-radius:", ";color:#1c2530;font-weight:500;margin:2px 4px 2px 0;padding:0 8px;height:24px;line-height:22px;&-remove{color:", ";&:hover{color:", ";}}}.ant-select-selection-overflow{flex-wrap:wrap;gap:4px;}}.ant-select-tree{padding:4px 0;.ant-select-tree-node-content-wrapper{padding:4px 8px;border-radius:", ";background-color:transparent !important;transition:background 0.3s;&:hover{background-color:#fffbe6 !important;color:#1c2530 !important;border-radius:4px;}&.ant-select-tree-node-selected{color:#1c2530;font-weight:500;}}.ant-select-tree-switcher{width:24px;height:24px;line-height:24px;}.ant-select-tree-checkbox{margin:4px 8px 4px 0;}.ant-select-tree-treenode{padding:2px 0;&:hover{background-color:transparent;}}.ant-select-tree-checkbox-checked .ant-select-tree-checkbox-inner{background-color:#42b040;border-color:#42b040;}.ant-select-tree-checkbox-checked .ant-select-tree-node-content-wrapper{background-color:#e9f0fe !important;color:#1c2530 !important;font-weight:500;}}&.ant-select-lg{.ant-select-selector{height:40px;padding:0 16px;}.ant-select-selection-item{height:28px;line-height:26px;}}&.ant-select-sm{.ant-select-selector{height:24px;padding:0 8px;}.ant-select-selection-item{height:20px;line-height:18px;}}&.ant-select-loading{.ant-select-arrow{.anticon-loading{color:", ";}}}&.cap-unified-tree-select .ant-select-selection-overflow{display:none;}&.cap-unified-tree-select .suffix-counter{color:#1c2530;font-weight:500;margin-right:12px;}}"], styledVars.FONT_FAMILY, styledVars.FONT_FAMILY, styledVars.FONT_FAMILY, styledVars.RADIUS_04, styledVars.TRANSITION_ALL, styledVars.CAP_G11, styledVars.CAP_G01, styledVars.CAP_RED, styledVars.CAP_G08, styledVars.RADIUS_04, styledVars.TRANSITION_ALL, styledVars.CAP_G01, styledVars.RADIUS_04, styledVars.CAP_PRIMARY.base, styledVars.CAP_PRIMARY.hover, styledVars.RADIUS_04, styledVars.CAP_PRIMARY.base);

package/dist/{components/CapUnifiedSelect → CapUnifiedSelect}/CapUnifiedSelect.js

@@ -9,10 +9,10 @@ var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _antd = require("antd");
-var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _icons = require("@ant-design/icons");
-var _withStyles = _interopRequireDefault(require("../utils/withStyles"));
 var _styles = require("./styles");
+var _withStyles = _interopRequireDefault(require("./withStyles"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -27,7 +27,6 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; } // Enhanced CapUnifiedSelect supporting 4 scenarios with advanced features
-// Updated import path
 var CapUnifiedSelect = function CapUnifiedSelect(_ref) {
   var type = _ref.type,
     _ref$options = _ref.options,

package/dist/esm/{components/CapUnifiedSelect → CapUnifiedSelect}/CapUnifiedSelect.js

@@ -16,10 +16,10 @@ import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { Select, TreeSelect, Tooltip, Input, Button } from 'antd';
-import styled from 'styled-components';
 import { InfoCircleOutlined, SearchOutlined, WarningFilled, DownOutlined } from '@ant-design/icons';
-import withStyles from '../utils/withStyles'; // Updated import path
 import { SelectWrapper, HeaderWrapper, selectStyles } from './styles';
+import withStyles from './withStyles';
+import styled from 'styled-components';
 var CapUnifiedSelect = function CapUnifiedSelect(_ref) {
   var type = _ref.type,
     _ref$options = _ref.options,

package/dist/esm/{components/index.js → index.js}

@@ -1,7 +1,6 @@
 // Import and export all components
 export { default as CapInput } from './CapInput';
 export { default as CapTable } from './CapTable';
-export { default as CapTestSelect } from './CapTestSelect'; // Test component for Ant Design v5 integration
 
 // Export utilities
 export { default as LocaleHoc } from './LocaleHoc';
@@ -9,7 +8,4 @@ export { default as LocaleHoc } from './LocaleHoc';
 // Export styled utilities
 import * as _styledVars from './styled/variables';
 export { _styledVars as styledVars };
-export { default as styled } from './styled';
-
-// Export utils
-export * from '../utils';
+export { default as styled } from './styled';

package/dist/{components/index.js → index.js}

@@ -4,14 +4,6 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-var _exportNames = {
-  CapInput: true,
-  CapTable: true,
-  CapTestSelect: true,
-  LocaleHoc: true,
-  styledVars: true,
-  styled: true
-};
 Object.defineProperty(exports, "CapInput", {
   enumerable: true,
   get: function get() {
@@ -24,12 +16,6 @@ Object.defineProperty(exports, "CapTable", {
     return _CapTable["default"];
   }
 });
-Object.defineProperty(exports, "CapTestSelect", {
-  enumerable: true,
-  get: function get() {
-    return _CapTestSelect["default"];
-  }
-});
 Object.defineProperty(exports, "LocaleHoc", {
   enumerable: true,
   get: function get() {
@@ -45,22 +31,9 @@ Object.defineProperty(exports, "styled", {
 exports.styledVars = void 0;
 var _CapInput = _interopRequireDefault(require("./CapInput"));
 var _CapTable = _interopRequireDefault(require("./CapTable"));
-var _CapTestSelect = _interopRequireDefault(require("./CapTestSelect"));
 var _LocaleHoc = _interopRequireDefault(require("./LocaleHoc"));
 var _styledVars = _interopRequireWildcard(require("./styled/variables"));
 exports.styledVars = _styledVars;
 var _styled = _interopRequireDefault(require("./styled"));
-var _utils = require("../utils");
-Object.keys(_utils).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _utils[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _utils[key];
-    }
-  });
-});
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/blaze-ui",
   "author": "Capillary Technologies",
-  "version": "0.1.6-alpha.32",
+  "version": "0.1.6-alpha.33",
   "description": "Capillary UI component library with Ant Design v5",
   "main": "./components/index.js",
   "sideEffects": [

package/dist/components/CapTestSelect/CapTestSelect.js

@@ -1,40 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _antd = require("antd");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-/**
- * Test component to verify Ant Design v5 Select integration
- * This is a simple wrapper for testing purposes only
- */
-var CapTestSelect = function CapTestSelect(props) {
-  return /*#__PURE__*/_react["default"].createElement(_antd.Select, props);
-};
-CapTestSelect.propTypes = {
-  // Common Select props from antd
-  allowClear: _propTypes["default"].bool,
-  defaultValue: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number, _propTypes["default"].arrayOf(_propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]))]),
-  disabled: _propTypes["default"].bool,
-  loading: _propTypes["default"].bool,
-  mode: _propTypes["default"].oneOf(['multiple', 'tags']),
-  placeholder: _propTypes["default"].string,
-  showSearch: _propTypes["default"].bool,
-  value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number, _propTypes["default"].arrayOf(_propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]))]),
-  options: _propTypes["default"].arrayOf(_propTypes["default"].shape({
-    label: _propTypes["default"].node,
-    value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-    disabled: _propTypes["default"].bool
-  }))
-};
-CapTestSelect.defaultProps = {
-  allowClear: false,
-  disabled: false,
-  loading: false,
-  showSearch: false
-};
-var _default = exports["default"] = CapTestSelect;

package/dist/components/CapTestSelect/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _CapTestSelect["default"];
-  }
-});
-var _CapTestSelect = _interopRequireDefault(require("./CapTestSelect"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }

package/dist/esm/components/CapTestSelect/CapTestSelect.js

@@ -1,34 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Select } from 'antd';
-
-/**
- * Test component to verify Ant Design v5 Select integration
- * This is a simple wrapper for testing purposes only
- */
-var CapTestSelect = function CapTestSelect(props) {
-  return /*#__PURE__*/React.createElement(Select, props);
-};
-CapTestSelect.propTypes = {
-  // Common Select props from antd
-  allowClear: PropTypes.bool,
-  defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))]),
-  disabled: PropTypes.bool,
-  loading: PropTypes.bool,
-  mode: PropTypes.oneOf(['multiple', 'tags']),
-  placeholder: PropTypes.string,
-  showSearch: PropTypes.bool,
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))]),
-  options: PropTypes.arrayOf(PropTypes.shape({
-    label: PropTypes.node,
-    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    disabled: PropTypes.bool
-  }))
-};
-CapTestSelect.defaultProps = {
-  allowClear: false,
-  disabled: false,
-  loading: false,
-  showSearch: false
-};
-export default CapTestSelect;

package/dist/esm/components/CapTestSelect/index.js

@@ -1 +0,0 @@
-export { default } from './CapTestSelect';

package/dist/esm/utils/index.js

@@ -1 +0,0 @@
-export { default as withStyles } from './withStyles';

package/dist/esm/utils/withStyles.js

@@ -1,23 +0,0 @@
-import styled from 'styled-components';
-
-/**
- * Enhances a React component with additional styles using styled-components.
- * @param {React.ComponentType} WrappedComponent - The React component to enhance.
- * @param {TemplateStringsArray} styles - CSS styles as a TemplateStringsArray.
- * @returns {React.ComponentType} Returns the enhanced styled component.
- */
-var withStyledComponent = function withStyledComponent(WrappedComponent, styles) {
-  /**
-   * A styled component generated by combining WrappedComponent with additional styles.
-   * @type {React.ComponentType}
-   */
-  var StyledComponent = styled(WrappedComponent).withConfig({
-    displayName: "StyledComponent",
-    componentId: "sc-ujcdm3-0"
-  })(["", ";"], styles);
-
-  // Set default props from the original component to the styled component
-  StyledComponent.defaultProps = WrappedComponent.defaultProps;
-  return StyledComponent;
-};
-export default withStyledComponent;

package/dist/utils/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "withStyles", {
-  enumerable: true,
-  get: function get() {
-    return _withStyles["default"];
-  }
-});
-var _withStyles = _interopRequireDefault(require("./withStyles"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }

package/dist/utils/withStyles.js

@@ -1,29 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-/**
- * Enhances a React component with additional styles using styled-components.
- * @param {React.ComponentType} WrappedComponent - The React component to enhance.
- * @param {TemplateStringsArray} styles - CSS styles as a TemplateStringsArray.
- * @returns {React.ComponentType} Returns the enhanced styled component.
- */
-var withStyledComponent = function withStyledComponent(WrappedComponent, styles) {
-  /**
-   * A styled component generated by combining WrappedComponent with additional styles.
-   * @type {React.ComponentType}
-   */
-  var StyledComponent = (0, _styledComponents["default"])(WrappedComponent).withConfig({
-    displayName: "StyledComponent",
-    componentId: "sc-ujcdm3-0"
-  })(["", ";"], styles);
-
-  // Set default props from the original component to the styled component
-  StyledComponent.defaultProps = WrappedComponent.defaultProps;
-  return StyledComponent;
-};
-var _default = exports["default"] = withStyledComponent;