@capillarytech/blaze-ui 0.1.6-alpha.66 → 0.1.6-alpha.7

package/dist/esm/CapLabel/styles.js

@@ -0,0 +1,219 @@
+import styled, { css } from 'styled-components';
+import * as styledVars from '../styled/variables';
+var labels = {
+  label1: {
+    color: styledVars.CAP_G04,
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label2: {
+    color: styledVars.CAP_G01,
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label3: {
+    color: styledVars.CAP_G05,
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label4: {
+    color: styledVars.CAP_G01,
+    fontSize: '12px',
+    fontWeight: '500',
+    lineHeight: 'normal'
+  },
+  label5: {
+    color: styledVars.CAP_G01,
+    fontSize: '10px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label6: {
+    color: styledVars.CAP_G06,
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label7: {
+    color: styledVars.CAP_G04,
+    fontSize: '14px',
+    fontWeight: '500',
+    lineHeight: 'normal'
+  },
+  label8: {
+    color: styledVars.CAP_G01,
+    fontSize: '12px',
+    fontWeight: '500',
+    lineHeight: 'normal'
+  },
+  label9: {
+    color: styledVars.CAP_G01,
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: '16px'
+  },
+  label10: {
+    color: styledVars.CAP_WHITE,
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: '16px'
+  },
+  label11: {
+    color: styledVars.CAP_G04,
+    fontSize: '10px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label12: {
+    color: styledVars.CAP_WHITE,
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label13: {
+    color: styledVars.CAP_G05,
+    fontSize: '10px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label14: {
+    color: styledVars.CAP_G03,
+    fontSize: '14px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label15: {
+    color: styledVars.CAP_G01,
+    fontSize: '14px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label16: {
+    color: styledVars.CAP_G01,
+    fontSize: '14px',
+    fontWeight: '500',
+    lineHeight: 'normal'
+  },
+  label17: {
+    color: styledVars.CAP_G01,
+    fontSize: '16px',
+    fontWeight: '500',
+    lineHeight: 'normal'
+  },
+  label18: {
+    color: styledVars.CAP_G04,
+    fontSize: '14px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label19: {
+    color: 'rgba(0, 0, 0, 0.87)',
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: '16px'
+  },
+  label20: {
+    color: styledVars.CAP_SECONDARY.base,
+    fontSize: '14px',
+    fontWeight: '500',
+    lineHeight: 'normal'
+  },
+  label21: {
+    color: styledVars.CAP_SECONDARY.base,
+    fontSize: '12px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label22: {
+    color: styledVars.CAP_G04,
+    fontSize: '24px',
+    fontWeight: 'normal',
+    lineHeight: '28px'
+  },
+  label23: {
+    color: styledVars.CAP_WHITE,
+    fontSize: '14px',
+    fontWeight: 'normal',
+    lineHeight: 'normal'
+  },
+  label24: {
+    fontSize: '14px',
+    fontWeight: '400',
+    color: styledVars.CAP_G04,
+    lineHeight: '20px'
+  },
+  label25: {
+    fontSize: '14px',
+    fontWeight: '500',
+    color: styledVars.CAP_G04,
+    lineHeight: '20px'
+  },
+  label26: {
+    fontSize: '10px',
+    fontWeight: '400',
+    color: styledVars.CAP_G01,
+    lineHeight: '12px'
+  },
+  label27: {
+    fontSize: '12px',
+    fontWeight: '500',
+    color: styledVars.CAP_SECONDARY.base,
+    lineHeight: '16px'
+  },
+  label28: {
+    fontSize: '12px',
+    fontWeight: '500',
+    color: styledVars.CAP_WHITE,
+    lineHeight: '16px'
+  },
+  label29: {
+    fontSize: '10px',
+    fontWeight: '400',
+    color: styledVars.CAP_WHITE,
+    lineHeight: '12px'
+  },
+  label30: {
+    fontSize: '10px',
+    fontWeight: '400',
+    color: styledVars.CAP_WHITE,
+    lineHeight: '12px'
+  },
+  label31: {
+    color: styledVars.CAP_G01,
+    fontSize: '12px',
+    fontWeight: '400',
+    lineHeight: '16px'
+  },
+  label32: {
+    color: styledVars.CAP_WHITE,
+    fontSize: '14px',
+    fontWeight: '500',
+    lineHeight: '20px'
+  },
+  label33: {
+    color: styledVars.CAP_SECONDARY.base,
+    fontSize: '14px',
+    fontWeight: '500',
+    lineHeight: '20px'
+  }
+};
+var labelStyles = css(["font-size:", ";font-weight:", ";color:", ";line-height:", ";margin:0;padding:0;"], function (props) {
+  return labels[props.type].fontSize;
+}, function (props) {
+  return props.fontWeight || labels[props.type].fontWeight;
+}, function (props) {
+  return labels[props.type].color;
+}, function (props) {
+  return props.lineHeight || labels[props.type].lineHeight || 'initial';
+});
+export var LabelWrapper = styled.div.withConfig({
+  displayName: "LabelWrapper",
+  componentId: "sc-1xg855n-0"
+})(["", ""], labelStyles);
+export var LabelInline = styled.span.withConfig({
+  displayName: "LabelInline",
+  componentId: "sc-1xg855n-1"
+})(["", " display:inline-block;"], labelStyles);

package/dist/esm/CapRow/CapRow.js

@@ -0,0 +1,22 @@
+var _excluded = ["className", "children"];
+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); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Row } from 'antd';
+import classNames from 'classnames';
+import { RowWrapper } from './styles';
+var CapRow = function CapRow(_ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(RowWrapper, null, /*#__PURE__*/React.createElement(Row, _extends({}, rest, {
+    className: classNames('cap-row', className)
+  }), React.Children.toArray(children)));
+};
+CapRow.propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string
+};
+export default CapRow;

package/dist/esm/CapRow/index.js

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

package/dist/esm/CapRow/styles.js

@@ -0,0 +1,5 @@
+import styled from 'styled-components';
+export var RowWrapper = styled.div.withConfig({
+  displayName: "RowWrapper",
+  componentId: "sc-y3x4h8-0"
+})([".cap-row{display:flex;flex-flow:row wrap;min-width:0;}"]);

package/dist/esm/CapTable/CapTable.js

@@ -0,0 +1,143 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["id", "className", "children", "infiniteScroll", "pagination", "dataSource", "offset_limit", "setPagination", "scroll", "showLoader"];
+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); }
+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) { _defineProperty(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; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+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; }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+/**
+ * CapTable - Migrated to Ant Design v5
+ * A table component that supports:
+ * - Infinite scrolling with virtualization
+ * - Sequential data loading
+ * - Optimized scroll performance
+ */
+import React, { useEffect, useCallback, useState, useRef } from 'react';
+import PropTypes from 'prop-types';
+import { debounce } from 'lodash';
+import classNames from 'classnames';
+import { StyledTable } from './styles';
+import LocaleHoc from '../LocaleHoc';
+var SCROLL_THRESHOLD = 80; // Percentage of scroll to trigger load
+var DEBOUNCE_DELAY = 250; // ms to wait between scroll events
+var DEFAULT_ROW_HEIGHT = 54;
+var DEFAULT_SCROLL_HEIGHT = 400;
+var CapTable = function CapTable(_ref) {
+  var id = _ref.id,
+    className = _ref.className,
+    children = _ref.children,
+    infiniteScroll = _ref.infiniteScroll,
+    pagination = _ref.pagination,
+    dataSource = _ref.dataSource,
+    offset_limit = _ref.offset_limit,
+    setPagination = _ref.setPagination,
+    scroll = _ref.scroll,
+    showLoader = _ref.showLoader,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var scrollRef = useRef(null);
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    hasMore = _useState2[0],
+    setHasMore = _useState2[1];
+  var currentOffsetRef = useRef(0);
+  var loadMore = useCallback(function () {
+    if (!showLoader && hasMore) {
+      var nextOffset = currentOffsetRef.current + 1;
+      var newOffsetLimit = _objectSpread(_objectSpread({}, offset_limit), {}, {
+        offset: nextOffset
+      });
+      currentOffsetRef.current = nextOffset;
+      setPagination(newOffsetLimit);
+    }
+  }, [showLoader, hasMore, setPagination, offset_limit]);
+  var handleScroll = useCallback(debounce(function (event) {
+    var target = event.target;
+    if (!target || !infiniteScroll || !hasMore || showLoader) return;
+    var scrollTop = Math.ceil(target.scrollTop);
+    var visibleHeight = target.clientHeight;
+    var totalHeight = target.scrollHeight;
+    var scrolledPercentage = (scrollTop + visibleHeight) / totalHeight * 100;
+    if (scrolledPercentage >= SCROLL_THRESHOLD) {
+      loadMore();
+    }
+  }, DEBOUNCE_DELAY), [infiniteScroll, showLoader, hasMore, loadMore]);
+
+  // Setup scroll listener and handle initial load
+  useEffect(function () {
+    var tableBody = document.querySelector("#".concat(id, " .ant-table-body"));
+    if (!tableBody) return;
+    scrollRef.current = tableBody;
+    tableBody.addEventListener('scroll', handleScroll, {
+      passive: true
+    });
+
+    // Check if initial load needed
+    var shouldLoadInitially = tableBody.scrollHeight <= tableBody.clientHeight && !showLoader && hasMore;
+    if (shouldLoadInitially) {
+      currentOffsetRef.current = 0;
+      loadMore();
+    }
+
+    // Cleanup
+    return function () {
+      var _scrollRef$current;
+      (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.removeEventListener('scroll', handleScroll);
+      handleScroll.cancel();
+    };
+  }, [id, handleScroll, showLoader, hasMore, loadMore]);
+
+  // Handle data changes
+  useEffect(function () {
+    if (!(dataSource !== null && dataSource !== void 0 && dataSource.length)) {
+      currentOffsetRef.current = 0;
+      setHasMore(true);
+    } else {
+      setHasMore(true);
+    }
+  }, [dataSource]);
+  var tableClassName = classNames('cap-table-v2', className, {
+    'show-loader': showLoader,
+    'infinite-scroll': infiniteScroll,
+    'has-more': hasMore
+  });
+  return /*#__PURE__*/React.createElement(StyledTable, _extends({
+    id: id,
+    className: tableClassName,
+    dataSource: dataSource,
+    pagination: false,
+    scroll: {
+      x: scroll === null || scroll === void 0 ? void 0 : scroll.x,
+      y: (scroll === null || scroll === void 0 ? void 0 : scroll.y) || DEFAULT_SCROLL_HEIGHT,
+      scrollToFirstRowOnChange: false
+    },
+    virtual: infiniteScroll,
+    rowHeight: DEFAULT_ROW_HEIGHT,
+    locale: {
+      emptyText: 'No Data'
+    }
+  }, rest), children);
+};
+CapTable.propTypes = {
+  id: PropTypes.string.isRequired,
+  className: PropTypes.string,
+  children: PropTypes.node,
+  infiniteScroll: PropTypes.bool,
+  pagination: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]),
+  dataSource: PropTypes.array,
+  offset_limit: PropTypes.object,
+  setPagination: PropTypes.func,
+  scroll: PropTypes.object,
+  showLoader: PropTypes.bool
+};
+export default LocaleHoc(CapTable, {
+  key: 'CapTable'
+});

package/dist/esm/CapTable/index.js

@@ -0,0 +1,2 @@
+import CapTableLoadable from './loadable';
+export default CapTableLoadable;

package/dist/esm/CapTable/loadable.js

@@ -0,0 +1,12 @@
+import CapSpin from '@capillarytech/cap-ui-library/CapSpin';
+import { loadable } from '@capillarytech/cap-ui-utils';
+import React, { Suspense } from 'react';
+var LoadableComponent = loadable(function () {
+  return import('./CapTable');
+});
+var CapTableLoadable = function CapTableLoadable() {
+  return /*#__PURE__*/React.createElement(Suspense, {
+    fallback: /*#__PURE__*/React.createElement(CapSpin, null)
+  }, /*#__PURE__*/React.createElement(LoadableComponent, null));
+};
+export default CapTableLoadable;

package/dist/esm/CapTable/styles.js

@@ -0,0 +1,17 @@
+import { Table } from 'antd';
+import styled from 'styled-components';
+import * as styledVars from '../styled/variables';
+var CAP_G09 = styledVars.CAP_G09,
+  CAP_G01 = styledVars.CAP_G01,
+  CAP_G06 = styledVars.CAP_G06,
+  CAP_G07 = styledVars.CAP_G07,
+  CAP_G10 = styledVars.CAP_G10,
+  SPACING_16 = styledVars.SPACING_16,
+  SPACING_24 = styledVars.SPACING_24,
+  FONT_SIZE_S = styledVars.FONT_SIZE_S;
+export var StyledTable = styled(Table).withConfig({
+  displayName: "StyledTable",
+  componentId: "sc-1ldu1k4-0"
+})(["&.cap-table-v2{.ant-table{border:1px solid ", ";}}&.show-loader{.ant-table-body > table > tbody::after{content:'", "';display:flex;justify-content:center;position:absolute;width:100%;align-items:center;height:60px;text-align:center;font-size:16px;color:gray;border-top:1px solid ", ";}}.ant-table{border:1px solid ", ";.ant-table-thead > tr > th{color:", ";font-size:", ";line-height:", ";background-color:", ";text-align:left;}.ant-table-placeholder{.ant-table-cell{border-bottom:none;&:hover{background:none !important;}}}.ant-empty{margin:32px 0;.ant-empty-image{height:40px;margin-bottom:8px;}.ant-empty-description{color:", ";}}.ant-table-thead > tr > th,.ant-table-tbody > tr > td{padding:", " ", ";}.ant-table-tbody > tr > td{border-bottom:1px solid ", ";}.ant-table-tbody > tr:last-child > td{border-bottom:none;}.ant-table-thead > tr.ant-table-row-hover:not(.ant-table-expanded-row) > td,.ant-table-tbody > tr.ant-table-row-hover:not(.ant-table-expanded-row) > td,.ant-table-thead > tr:hover:not(.ant-table-expanded-row) > td,.ant-table-tbody > tr:hover:not(.ant-table-expanded-row) > td{background-color:", ";}.ant-table-thead > tr > th .ant-table-column-sorter-up,.ant-table-thead > tr > th .ant-table-column-sorter-down{&.active{color:", ";}&:not(.active){color:", ";}}.ant-table-thead{.table-children{padding:6px ", " 16px;position:relative;}.table-parent{padding-bottom:0;padding-left:", ";}.table-children.show-separator:not(:last-child)::after{content:'';height:8px;width:1px;right:0;top:30%;background-color:", ";position:absolute;}}.ant-table-thead > tr > th .ant-table-column-sorter{vertical-align:unset;}.ant-table-body table{table-layout:fixed;width:100%;}}&.no-pagination-loader{.ant-table-body > table > tbody::after{content:'';height:unset;display:none;}}&.hide-hover{.ant-table{.ant-table-thead > tr.ant-table-row-hover:not(.ant-table-expanded-row) > td,.ant-table-tbody > tr.ant-table-row-hover:not(.ant-table-expanded-row) > td,.ant-table-thead > tr:hover:not(.ant-table-expanded-row) > td,.ant-table-tbody > tr:hover:not(.ant-table-expanded-row) > td{background:none;}}}a{color:", ";}"], CAP_G07, function (props) {
+  return props.loadMoreData;
+}, CAP_G07, CAP_G07, CAP_G01, FONT_SIZE_S, SPACING_16, CAP_G10, CAP_G06, SPACING_16, SPACING_24, CAP_G07, CAP_G09, CAP_G01, CAP_G06, SPACING_24, SPACING_24, CAP_G07, CAP_G01);

package/dist/esm/CapTooltip/CapTooltip.js

@@ -0,0 +1,34 @@
+var _excluded = ["overlayClassName", "children"];
+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); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Tooltip } from 'antd';
+import classNames from 'classnames';
+import { TooltipWrapper } from './styles';
+var CapTooltip = function CapTooltip(_ref) {
+  var overlayClassName = _ref.overlayClassName,
+    children = _ref.children,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(TooltipWrapper, null, /*#__PURE__*/React.createElement(Tooltip, _extends({
+    overlayClassName: classNames('cap-tooltip', overlayClassName)
+  }, rest), children));
+};
+
+/*
+  NOTE:
+    While using a disabled button with tooltip, wrap the button with an element with className "button-disabled-tooltip-wrapper".
+
+    <CapTooltip title="disabled button with tooltip">
+      <span className="button-disabled-tooltip-wrapper">
+        <CapButton disabled>Button</CapButton>
+      </span>
+    </CapTooltip>
+*/
+
+CapTooltip.propTypes = {
+  overlayClassName: PropTypes.string,
+  children: PropTypes.node
+};
+export default CapTooltip;

package/dist/esm/CapTooltip/index.js

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

package/dist/esm/CapTooltip/styles.js

@@ -0,0 +1,6 @@
+import styled from 'styled-components';
+import * as styledVars from '../styled/variables';
+export var TooltipWrapper = styled.span.withConfig({
+  displayName: "TooltipWrapper",
+  componentId: "sc-17x5zp5-0"
+})([".cap-tooltip{max-width:324px;.ant-tooltip-inner{background-color:", ";font-size:", ";font-weight:", ";padding:6px 8px;min-height:32px;border-radius:", ";}&.cap-bgcolor-tooltip{.ant-tooltip-inner{background-color:", ";}}&.hide-tooltip-pointer{.ant-tooltip-arrow{display:none;}}}.button-disabled-tooltip-wrapper{display:inline-flex;cursor:not-allowed;.cap-button.ant-btn[disabled]{pointer-events:none;& > *{pointer-events:auto;cursor:not-allowed;}}}"], styledVars.FONT_COLOR_01, styledVars.FONT_SIZE_M, styledVars.FONT_WEIGHT_MEDIUM, styledVars.RADIUS_04, styledVars.FONT_COLOR_05);

package/dist/esm/CapUnifiedSelect/CapUnifiedSelect.js

@@ -0,0 +1,101 @@
+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); }
+// CapUnifiedSelect component using Ant Design v5 Select and TreeSelect directly
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Select, TreeSelect } from 'antd';
+import { SelectWrapper, HeaderWrapper, StyledInfoIcon } from './styles';
+import CapLabel from '../CapLabel';
+import CapTooltip from '../CapTooltip';
+function CapUnifiedSelect(_ref) {
+  var type = _ref.type,
+    _ref$options = _ref.options,
+    options = _ref$options === void 0 ? [] : _ref$options,
+    treeData = _ref.treeData,
+    value = _ref.value,
+    onChange = _ref.onChange,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? 'Select an option' : _ref$placeholder,
+    className = _ref.className,
+    style = _ref.style,
+    _ref$allowClear = _ref.allowClear,
+    allowClear = _ref$allowClear === void 0 ? false : _ref$allowClear,
+    _ref$showSearch = _ref.showSearch,
+    showSearch = _ref$showSearch === void 0 ? false : _ref$showSearch,
+    label = _ref.label,
+    tooltip = _ref.tooltip,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled;
+  var selectVirtualizationProps = {
+    listHeight: 256
+  };
+  var treeSelectVirtualizationProps = {
+    listHeight: 256,
+    listItemHeight: 32
+  };
+  var renderHeader = function renderHeader() {
+    if (!label && !tooltip) return null;
+    return /*#__PURE__*/React.createElement(HeaderWrapper, {
+      className: disabled ? 'disabled' : ''
+    }, label && /*#__PURE__*/React.createElement(CapLabel, {
+      type: "label16",
+      className: disabled ? 'disabled' : ''
+    }, label), tooltip && /*#__PURE__*/React.createElement(CapTooltip, {
+      title: tooltip
+    }, /*#__PURE__*/React.createElement(StyledInfoIcon, {
+      className: disabled ? 'disabled' : ''
+    })));
+  };
+  var renderDropdown = function renderDropdown() {
+    if (type === 'treeSelect' || type === 'multiTreeSelect') {
+      return /*#__PURE__*/React.createElement(TreeSelect, _extends({
+        treeData: treeData || options,
+        value: value,
+        onChange: onChange,
+        placeholder: placeholder,
+        className: className,
+        style: style,
+        allowClear: allowClear,
+        showSearch: showSearch,
+        multiple: type === 'multiTreeSelect' ? true : false,
+        virtual: true,
+        treeDefaultExpandAll: true,
+        disabled: disabled
+      }, treeSelectVirtualizationProps));
+    }
+    return /*#__PURE__*/React.createElement(Select, _extends({
+      value: value,
+      onChange: onChange,
+      placeholder: placeholder,
+      className: className,
+      style: style,
+      allowClear: allowClear,
+      showSearch: showSearch,
+      options: options,
+      mode: type === 'multiSelect' ? 'multiple' : undefined,
+      virtual: true,
+      disabled: disabled
+    }, selectVirtualizationProps));
+  };
+  return /*#__PURE__*/React.createElement(SelectWrapper, null, renderHeader(), renderDropdown());
+}
+CapUnifiedSelect.propTypes = {
+  type: PropTypes.oneOf(['select', 'multiSelect', 'treeSelect', 'multiTreeSelect']),
+  options: PropTypes.array,
+  treeData: PropTypes.array,
+  value: PropTypes.any,
+  onChange: PropTypes.func,
+  placeholder: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+  className: PropTypes.string,
+  style: PropTypes.object,
+  allowClear: PropTypes.bool,
+  showSearch: PropTypes.bool,
+  label: PropTypes.string,
+  tooltip: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+  disabled: PropTypes.bool
+};
+CapUnifiedSelect.defaultProps = {
+  type: 'select',
+  allowClear: false,
+  showSearch: false
+};
+export default CapUnifiedSelect;

package/dist/esm/CapUnifiedSelect/index.js

@@ -0,0 +1,3 @@
+import CapUnifiedSelect from './CapUnifiedSelect';
+import CapUnifiedSelectLoadable from './loadable';
+export default CapUnifiedSelectLoadable;

package/dist/esm/CapUnifiedSelect/loadable.js

@@ -0,0 +1,4 @@
+import loadable from '@loadable/component';
+export default loadable(function () {
+  return import('./CapUnifiedSelect');
+});

package/dist/esm/CapUnifiedSelect/messages.js

@@ -0,0 +1,23 @@
+import { defineMessages } from 'react-intl';
+export default defineMessages({
+  selectPlaceholder: {
+    id: 'cap.unified.select.placeholder',
+    defaultMessage: 'Select an option'
+  },
+  searchPlaceholder: {
+    id: 'cap.unified.select.search.placeholder',
+    defaultMessage: 'Search...'
+  },
+  noData: {
+    id: 'cap.unified.select.no.data',
+    defaultMessage: 'No data'
+  },
+  loading: {
+    id: 'cap.unified.select.loading',
+    defaultMessage: 'Loading...'
+  },
+  selected: {
+    id: 'cap.unified.select.selected',
+    defaultMessage: '{count} items selected'
+  }
+});

package/dist/esm/CapUnifiedSelect/styles.js

@@ -0,0 +1,15 @@
+import styled, { css } from 'styled-components';
+import * as styledVars from '../styled/variables';
+export var SelectWrapper = styled.div.withConfig({
+  displayName: "SelectWrapper",
+  componentId: "sc-3v7xpu-0"
+})(["display:flex;flex-direction:column;gap:8px;width:100%;&.disabled{cursor:not-allowed;}"]);
+export var HeaderWrapper = styled.div.withConfig({
+  displayName: "HeaderWrapper",
+  componentId: "sc-3v7xpu-1"
+})(["display:flex;align-items:center;gap:4px;&.disabled{opacity:0.5;cursor:not-allowed;}"]);
+export var StyledInfoIcon = styled.span.withConfig({
+  displayName: "StyledInfoIcon",
+  componentId: "sc-3v7xpu-2"
+})(["color:", ";font-size:16px;cursor:help;&:hover{color:", ";}&.disabled{cursor:not-allowed;&:hover{color:", ";}}"], styledVars.CAP_G2, styledVars.CAP_G1, styledVars.CAP_G2);
+export var selectStyles = css(["&.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{padding:4px;border-radius:", ";box-shadow:0 2px 8px rgba(0,0,0,0.15);.ant-select-item{border-radius:", ";padding:8px 12px;transition:", ";&-option-selected{background-color:", ";color:", ";font-weight:500;}&-option-active{background-color:", ";}}.ant-select-search{padding:8px;input{border-radius:", ";transition:", ";&:focus{border-color:", ";box-shadow:none;}}}}&.ant-select-multiple{.ant-select-selection-item{background-color:", ";border-color:", ";border-radius:", ";color:", ";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:", ";transition:", ";&:hover{background-color:", ";}&.ant-select-tree-node-selected{background-color:", ";color:", ";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-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:", ";}}}}"], 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.RADIUS_04, styledVars.TRANSITION_ALL, styledVars.CAP_PRIMARY.light, styledVars.CAP_PRIMARY.base, styledVars.CAP_G08, styledVars.RADIUS_04, styledVars.TRANSITION_ALL, styledVars.CAP_G01, styledVars.CAP_PRIMARY.light, styledVars.CAP_PRIMARY.light, styledVars.RADIUS_04, styledVars.CAP_PRIMARY.base, styledVars.CAP_PRIMARY.base, styledVars.CAP_PRIMARY.hover, styledVars.RADIUS_04, styledVars.TRANSITION_ALL, styledVars.CAP_G08, styledVars.CAP_PRIMARY.light, styledVars.CAP_PRIMARY.base, styledVars.CAP_PRIMARY.base);