@hsu-react/ui 0.0.1 → 0.0.2

package/lib/components/Icon/index.js

@@ -5,8 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = require("@iconify/react");
-var _icons = _interopRequireWildcard(require("@ant-design/icons"));
-var AntdIcons = _icons;
+var AntdIcons = _interopRequireWildcard(require("@ant-design/icons"));
 var _react2 = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _indexModule = _interopRequireDefault(require("./index.module.less"));
@@ -51,37 +50,20 @@ const Icon = props => {
       ref: ref
     });
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.default, {
+
+  // iconify 图标：直接用 span 承载 Iconify 自带的 svg，避免把它嵌套进 antd Icon
+  // 的 svg（其 viewBox 会把内层 svg 缩放成极小值导致图标不可见）。
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
     ...iconConfig,
-    // 与 antd 缺省值一致；显式传入以消除开发态 viewBox 告警（子节点是 Iconify 自带 viewBox 的 svg）
-    viewBox: "0 0 1024 1024",
-    className: (0, _classnames.default)([_indexModule.default.icon, className]),
-    style: mergedStyle,
+    role: "img",
     ref: ref,
+    className: (0, _classnames.default)(["anticon", _indexModule.default.icon, className]),
+    style: mergedStyle,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Icon, {
       ...iconProps,
       icon: icon,
       width: "1em",
-      height: "1em",
-      onLoad: () => {
-        setTimeout(() => {
-          if (ref.current) {
-            const svg = ref.current.childNodes[0];
-            const svg_i = svg.childNodes[0];
-            const {
-              height
-            } = svg.getBoundingClientRect();
-            const {
-              height: height_i
-            } = svg_i.getBoundingClientRect();
-            const viewBox_i = svg_i.getAttribute("viewBox");
-            const viewBox_i_height = viewBox_i?.split(" ")[3];
-            if (Number(viewBox_i_height) <= 24) return;
-            const y_i = Number(viewBox_i_height) - (Number(height) - Number(height_i));
-            svg_i.setAttribute("viewBox", `0 0 ${viewBox_i?.split(" ")[2]} ${y_i.toFixed(0)}`);
-          }
-        }, 1);
-      }
+      height: "1em"
     })
   });
 };

package/lib/components/Input/Number/index.module.less

@@ -10,22 +10,22 @@
     width: 100%;
     height: 100%;
 
-    .ant-input-number-wrapper {
+    :global(.ant-input-number-wrapper) {
       height: 100%;
       min-height: inherit;
 
-      > .ant-input-number,
-      > .ant-input-number-affix-wrapper {
+      > :global(.ant-input-number),
+      > :global(.ant-input-number-affix-wrapper) {
         height: 100%;
         min-height: inherit;
       }
 
-      > .ant-input-number {
-        > .ant-input-number-input-wrap {
+      > :global(.ant-input-number) {
+        > :global(.ant-input-number-input-wrap) {
           height: 100%;
           min-height: inherit;
 
-          > .ant-input-number-input {
+          > :global(.ant-input-number-input) {
             height: 100%;
             min-height: inherit;
           }
@@ -33,11 +33,11 @@
       }
     }
 
-    > .ant-input-number-input-wrap {
+    > :global(.ant-input-number-input-wrap) {
       height: 100%;
       min-height: inherit;
 
-      > .ant-input-number-input {
+      > :global(.ant-input-number-input) {
         height: 100%;
       }
     }
@@ -66,7 +66,7 @@
   }
 
   // 当存在 addonAfter 时，调整清除图标位置
-  // Ant Design 的 addonAfter 会生成 .ant-input-number-group-addon
+  // Ant Design 的 addonAfter 会生成 :global(.ant-input-number-group-addon)
   // 清除图标需要向左偏移，避免与 addon 重叠
   // 使用 CSS 变量来动态设置 addon 宽度，默认值 60px 是合理的估算
   // 通过 JS 动态计算实际宽度并设置 CSS 变量来覆盖

package/lib/components/Input/Password/index.module.less

@@ -2,12 +2,12 @@
   width: 100%;
   height: 100%;
 
-  .ant-input-wrapper {
+  :global(.ant-input-wrapper) {
     height: 100%;
     min-height: inherit;
 
-    > .ant-input,
-    > .ant-input-affix-wrapper {
+    > :global(.ant-input),
+    > :global(.ant-input-affix-wrapper) {
       height: 100%;
       min-height: inherit;
     }

package/lib/components/Input/Search/index.module.less

@@ -2,18 +2,18 @@
   width: 100%;
   height: 100%;
 
-  .ant-input-wrapper {
+  :global(.ant-input-wrapper) {
     height: 100%;
     min-height: inherit;
 
-    > .ant-input,
-    > .ant-input-affix-wrapper {
+    > :global(.ant-input),
+    > :global(.ant-input-affix-wrapper) {
       height: 100%;
       min-height: inherit;
     }
 
-    > .ant-input-group-addon {
-      > .ant-btn {
+    > :global(.ant-input-group-addon) {
+      > :global(.ant-btn) {
         height: 100%;
         min-height: inherit;
       }

package/lib/components/Input/TextArea/index.module.less

@@ -61,7 +61,7 @@
 
     background-color: transparent !important;
 
-    &.ant-input-textarea-affix-wrapper {
+    &:global(.ant-input-textarea-affix-wrapper) {
       position: relative;
 
       padding: 0px;
@@ -76,13 +76,13 @@
         font-family: inherit;
       }
 
-      .ant-input-suffix {
+      :global(.ant-input-suffix) {
         position: absolute;
         top: 50%;
         right: 10px;
         transform: translateY(-50%);
 
-        .ant-input-data-count {
+        :global(.ant-input-data-count) {
           position: relative;
           bottom: auto;
 
@@ -90,7 +90,7 @@
           font-size: 14px;
         }
 
-        .ant-input-clear-icon {
+        :global(.ant-input-clear-icon) {
           position: relative;
 
           inset-inline-end: 0;
@@ -121,7 +121,7 @@
 
     box-shadow: 0 0 0 2px rgba(255, 38, 5, 0.06);
 
-    .ant-input-status-error {
+    :global(.ant-input-status-error) {
       border: none !important;
 
       box-shadow: none !important;

package/lib/components/Input/index.module.less

@@ -2,16 +2,16 @@
   width: 100%;
   height: 100%;
 
-  .ant-input-clear-icon {
+  :global(.ant-input-clear-icon) {
     font-size: 14px;
   }
 
-  .ant-input-wrapper {
+  :global(.ant-input-wrapper) {
     height: 100%;
     min-height: inherit;
 
-    > .ant-input,
-    > .ant-input-affix-wrapper {
+    > :global(.ant-input),
+    > :global(.ant-input-affix-wrapper) {
       height: 100%;
       min-height: inherit;
     }

package/lib/components/Modal/index.module.less

@@ -24,7 +24,7 @@
     padding: 0px 0px 15px;
   }
 
-  .ant-modal-close {
+  :global(.ant-modal-close) {
     top: 15px;
     inset-inline-end: 10px;
   }
@@ -47,7 +47,7 @@
       }
     }
 
-    .ant-modal-title {
+    :global(.ant-modal-title) {
       display: flex;
       align-items: center;
       justify-content: space-between;

package/lib/components/Operate/index.module.less

@@ -42,13 +42,13 @@
 }
 
 .moreButton {
-  &.ant-btn-icon-only {
+  &:global(.ant-btn-icon-only) {
     width: max-content;
 
     padding-inline: 4px;
   }
 
-  .ant-btn-icon {
+  :global(.ant-btn-icon) {
     display: inline-flex;
     align-items: center;
 

package/lib/components/Panel/IframePanel/index.module.less

@@ -30,7 +30,7 @@
     width: 100%;
     height: 100%;
 
-    > .ant-spin-container {
+    > :global(.ant-spin-container) {
       width: 100%;
       height: 100%;
 

package/lib/components/Panel/ListPanel/_components/ColumnMgt/index.module.less

@@ -25,7 +25,7 @@
   }
 
   .checkbox {
-    .ant-checkbox {
+    :global(.ant-checkbox) {
       width: 14px;
       min-width: 14px;
       height: 14px;

package/lib/components/Search/index.module.less

@@ -48,7 +48,7 @@
         justify-content: flex-start;
       }
 
-      .ant-btn-icon {
+      :global(.ant-btn-icon) {
         font-size: 16px;
       }
 
@@ -166,7 +166,7 @@
 }
 
 .filterDropdown {
-  .ant-dropdown-menu {
+  :global(.ant-dropdown-menu) {
     height: max-content;
     max-height: 500px;
 

package/lib/components/Select/AutoCompleteSelect/index.module.less

@@ -28,11 +28,11 @@
     .antdAutoComplete {
       cursor: not-allowed;
 
-      .ant-select-selection-item {
+      :global(.ant-select-selection-item) {
         color: var(--cf-text-3);
       }
 
-      .ant-select-arrow {
+      :global(.ant-select-arrow) {
         cursor: not-allowed;
       }
     }
@@ -75,7 +75,7 @@
     margin-inline-start: 4px;
   }
 
-  &:has(.ant-select-status-error) {
+  &:has(:global(.ant-select-status-error)) {
     border: 1px solid #ff4d4f;
 
     .prefix,
@@ -108,24 +108,24 @@
     font-weight: inherit;
     color: inherit !important;
 
-    &:has(> .ant-select-arrow),
-    &:has(> .ant-select-clear) {
-      .ant-select-selector {
+    &:has(> :global(.ant-select-arrow)),
+    &:has(> :global(.ant-select-clear)) {
+      :global(.ant-select-selector) {
         padding-right: 20px;
       }
     }
 
     &.legacyHasArrowOrClear {
-      .ant-select-selector {
+      :global(.ant-select-selector) {
         padding-right: 20px;
       }
     }
 
-    &.ant-select {
+    &:global(.ant-select) {
       width: 100%;
       height: 100%;
 
-      .ant-select-selector {
+      :global(.ant-select-selector) {
         width: 100%;
         height: 100%;
         padding: 0;
@@ -143,7 +143,7 @@
           content: none;
         }
 
-        .ant-select-selection-wrap {
+        :global(.ant-select-selection-wrap) {
           height: 100%;
 
           font-family: inherit;
@@ -152,7 +152,7 @@
           color: inherit;
         }
 
-        .ant-select-selection-search {
+        :global(.ant-select-selection-search) {
           inset-inline-start: 0px;
           inset-inline-end: 0px;
 
@@ -171,7 +171,7 @@
           }
         }
 
-        .ant-select-selection-placeholder {
+        :global(.ant-select-selection-placeholder) {
           display: inline-flex;
           align-items: center;
 
@@ -183,7 +183,7 @@
           font-weight: inherit;
         }
 
-        .ant-select-selection-item {
+        :global(.ant-select-selection-item) {
           padding-inline-end: 0px;
 
           font-family: inherit;
@@ -192,8 +192,8 @@
           color: inherit;
         }
 
-        .ant-select-selection-overflow-item {
-          .ant-select-selection-item {
+        :global(.ant-select-selection-overflow-item) {
+          :global(.ant-select-selection-item) {
             line-height: normal;
 
             padding-inline-end: 4px;
@@ -201,50 +201,50 @@
         }
       }
 
-      &.ant-select-focused {
-        .ant-select-selector {
+      &:global(.ant-select-focused) {
+        :global(.ant-select-selector) {
           border: none !important;
 
           box-shadow: none !important;
         }
       }
 
-      &.ant-select-open {
-        .ant-select-arrow {
+      &:global(.ant-select-open) {
+        :global(.ant-select-arrow) {
           transform: rotate(-180deg) translateY(50%);
         }
 
         &.noArrowAnimation {
-          .ant-select-arrow {
+          :global(.ant-select-arrow) {
             transform: translateY(-50%);
             transition: none !important;
           }
         }
       }
 
-      &.ant-select-status-error {
-        .ant-select-selector {
+      &:global(.ant-select-status-error) {
+        :global(.ant-select-selector) {
           border: none !important;
         }
       }
 
-      &.ant-select-multiple {
-        > .ant-select-selector {
-          > .ant-select-selection-overflow {
-            .ant-select-selection-search {
+      &:global(.ant-select-multiple) {
+        > :global(.ant-select-selector) {
+          > :global(.ant-select-selection-overflow) {
+            :global(.ant-select-selection-search) {
               width: 0px !important;
 
               margin-inline-start: 0px;
             }
           }
 
-          > .ant-select-selection-placeholder {
+          > :global(.ant-select-selection-placeholder) {
             inset-inline-start: 0px;
           }
         }
       }
 
-      .ant-select-arrow {
+      :global(.ant-select-arrow) {
         width: 14px;
         height: 14px;
         margin-top: 0px;
@@ -258,7 +258,7 @@
         pointer-events: all;
       }
 
-      .ant-select-clear {
+      :global(.ant-select-clear) {
         width: 14px;
         height: 14px;
         margin-top: 0px;
@@ -273,14 +273,14 @@
   }
 
   &.popupMatchContentWidth {
-    .ant-select-dropdown {
+    :global(.ant-select-dropdown) {
       [class="rc-virtual-list-holder-inner"] {
         position: relative !important;
       }
     }
   }
 
-  .ant-select-dropdown {
+  :global(.ant-select-dropdown) {
     position: fixed;
 
     font-family: inherit;
@@ -288,16 +288,16 @@
     font-weight: inherit;
     color: inherit;
 
-    .ant-select-item {
+    :global(.ant-select-item) {
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;
       color: inherit;
     }
 
-    .ant-select-item-empty,
-    .ant-empty,
-    .ant-empty-description {
+    :global(.ant-select-item-empty),
+    :global(.ant-empty),
+    :global(.ant-empty-description) {
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;

package/lib/components/Select/IconSelect/index.module.less

@@ -10,7 +10,7 @@
     cursor: pointer;
   }
 
-  .ant-input-group-addon {
+  :global(.ant-input-group-addon) {
     padding: 0;
   }
 }
@@ -26,11 +26,11 @@
 .tabs {
   max-width: min-content;
 
-  .ant-tabs-nav {
+  :global(.ant-tabs-nav) {
     margin-bottom: 10px;
   }
 
-  .ant-tabs-tab {
+  :global(.ant-tabs-tab) {
     padding: 4px 0px 6px;
   }
 

package/lib/components/Select/TreeSelect/index.module.less

@@ -11,7 +11,7 @@
   border: 1px solid var(--cf-border);
   border-radius: 6px;
 
-  .ant-select-selector {
+  :global(.ant-select-selector) {
     font-family: inherit;
     font-size: inherit;
     font-weight: inherit;
@@ -21,14 +21,14 @@
     border: none !important;
     border-radius: inherit !important;
 
-    .ant-select-selection-wrap {
+    :global(.ant-select-selection-wrap) {
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;
       color: inherit;
     }
 
-    .ant-select-selection-search {
+    :global(.ant-select-selection-search) {
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;
@@ -42,13 +42,13 @@
       }
     }
 
-    .ant-select-selection-placeholder {
+    :global(.ant-select-selection-placeholder) {
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;
     }
 
-    .ant-select-selection-item {
+    :global(.ant-select-selection-item) {
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;
@@ -56,21 +56,21 @@
     }
   }
 
-  .ant-select-arrow {
+  :global(.ant-select-arrow) {
     width: 14px;
     height: 14px;
 
     font-size: 14px;
   }
 
-  .ant-select-clear {
+  :global(.ant-select-clear) {
     width: 14px;
     height: 14px;
 
     font-size: 14px;
   }
 
-  .ant-tree-select-dropdown {
+  :global(.ant-tree-select-dropdown) {
     position: fixed;
 
     font-family: inherit;
@@ -78,17 +78,17 @@
     font-weight: inherit;
     color: inherit;
 
-    .ant-select-tree,
-    .ant-select-tree-treenode,
-    .ant-select-tree-node-content-wrapper,
-    .ant-select-tree-title {
+    :global(.ant-select-tree),
+    :global(.ant-select-tree-treenode),
+    :global(.ant-select-tree-node-content-wrapper),
+    :global(.ant-select-tree-title) {
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;
       color: inherit;
     }
 
-    .ant-select-tree-switcher {
+    :global(.ant-select-tree-switcher) {
       display: inline-flex;
       align-items: center;
       justify-content: center;
@@ -103,19 +103,19 @@
       }
     }
 
-    .ant-select-tree-indent-unit {
+    :global(.ant-select-tree-indent-unit) {
       width: var(--tree-indent-unit-width);
     }
 
-    .ant-empty,
-    .ant-empty-description {
+    :global(.ant-empty),
+    :global(.ant-empty-description) {
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;
       color: inherit;
     }
 
-    .ant-select-tree-list-scrollbar {
+    :global(.ant-select-tree-list-scrollbar) {
       width: 5px !important;
 
       > div {