@aplus-frontend/ui 0.5.31 → 0.5.32

package/lib/src/splitter/interface.d.ts

@@ -0,0 +1,70 @@
+import { CSSProperties } from 'vue';
+export interface SplitterProps {
+    prefixCls?: string;
+    className?: string;
+    style?: CSSProperties;
+    rootClassName?: string;
+    layout?: 'horizontal' | 'vertical';
+    onResizeStart?: (sizes: number[]) => void;
+    onResize?: (sizes: number[]) => void;
+    onResizeEnd?: (sizes: number[]) => void;
+    lazy?: boolean;
+}
+export interface PanelProps {
+    className?: string;
+    style?: CSSProperties;
+    min?: number | string;
+    max?: number | string;
+    size?: number | string;
+    collapsible?: boolean | {
+        start?: boolean;
+        end?: boolean;
+    };
+    resizable?: boolean;
+    defaultSize?: number | string;
+}
+export interface InternalPanelProps extends PanelProps {
+    className?: string;
+    prefixCls?: string;
+}
+export interface UseResize {
+    setSize: (data: {
+        size: number;
+        index: number;
+    }[]) => void;
+    setOffset: (offset: number, containerSize: number, index: number) => void;
+}
+export interface UseHandle {
+    onStart: (x: number, y: number, index: number) => void;
+}
+export interface UseCollapsibleProps {
+    basicsState: number[];
+    collapsible?: PanelProps['collapsible'];
+    index: number;
+    reverse: boolean;
+    setSize?: UseResize['setSize'];
+}
+export interface UseCollapsible {
+    nextIcon: boolean;
+    overlap: boolean;
+    previousIcon: boolean;
+    onFold: (type: 'previous' | 'next') => void;
+    setOldBasics: () => void;
+}
+export interface SplitBarProps {
+    index: number;
+    active: boolean;
+    resizable: boolean;
+    startCollapsible: boolean;
+    endCollapsible: boolean;
+    onOffsetStart: (index: number) => void;
+    onOffsetUpdate: (index: number, offsetX: number, offsetY: number) => void;
+    onOffsetEnd: VoidFunction;
+    onCollapse: (index: number, type: 'start' | 'end') => void;
+    vertical: boolean;
+    ariaNow?: number;
+    ariaMin?: number;
+    ariaMax?: number;
+    lazy?: boolean;
+    containerSize: number;
+}

package/lib/src/splitter/interface.js

@@ -0,0 +1 @@
+"use strict";

package/lib/src/splitter/style/css.cjs

@@ -0,0 +1 @@
+import '@aplus-frontend/ui/theme/splitter/index.css';

package/lib/src/splitter/style/index.cjs

@@ -0,0 +1 @@
+import '@aplus-frontend/ui/theme/splitter/index.less';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aplus-frontend/ui",
-  "version": "0.5.31",
+  "version": "0.5.32",
   "main": "./lib/index.js",
   "type": "module",
   "files": [

package/theme/ap-grid/index.css

@@ -336,3 +336,12 @@
   word-break: break-all;
   flex: 1;
 }
+.aplus-ap-grid .vxe-cell--wrapper {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.aplus-ap-grid .vxe-cell--wrapper .vxe-cell--title {
+  flex-shrink: 1;
+}

package/theme/ap-grid/index.less

@@ -108,4 +108,14 @@
       flex: 1;
     }
   }
+
+  .vxe-cell--wrapper {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    align-items: center;
+    .vxe-cell--title {
+      flex-shrink: 1;
+    }
+  }
 });

package/theme/ap-product-info/ap-product-info.css

@@ -14,7 +14,6 @@
   overflow: hidden;
 }
 .aplus-ap-product-info__title {
-  color: #182948;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;

package/theme/ap-product-info/ap-product-info.less

@@ -16,7 +16,7 @@
     overflow: hidden;
   }
    &__title{
-    color:#182948;
+    // color:#182948;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;

package/theme/index.css

@@ -757,7 +757,6 @@
   overflow: hidden;
 }
 .aplus-ap-product-info__title {
-  color: #182948;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -2368,17 +2367,17 @@ div.aplus-ap-info-layout-admin__header-shadow.aplus-ap-info-layout-admin__sticky
   bottom: 0;
   padding-bottom: 16px;
 }
-.aplus-ap-grid-sticky:has(.aplus-scroll-bar) .aplus-ap-grid-pagination-wrapper {
+.aplus-ap-grid-sticky:has(.aplus-splitter-bar) .aplus-ap-grid-pagination-wrapper {
   bottom: 0;
 }
-.aplus-ap-grid-sticky:has(.aplus-scroll-bar) .aplus-ap-grid-pagination-wrapper ul.ant-pagination {
+.aplus-ap-grid-sticky:has(.aplus-splitter-bar) .aplus-ap-grid-pagination-wrapper ul.ant-pagination {
   margin-top: 0;
   padding-top: 8px;
 }
-.aplus-ap-grid-sticky:has(.aplus-scroll-bar) .vxe-table--scroll-x-wrapper {
+.aplus-ap-grid-sticky:has(.aplus-splitter-bar) .vxe-table--scroll-x-wrapper {
   opacity: 0;
 }
-.aplus-ap-grid-sticky:has(.aplus-scroll-bar) .vxe-table .vxe-table--scroll-x-virtual {
+.aplus-ap-grid-sticky:has(.aplus-splitter-bar) .vxe-table .vxe-table--scroll-x-virtual {
   height: 0px !important;
 }
 .aplus-ap-grid-wrapper {
@@ -2436,6 +2435,15 @@ div.aplus-ap-info-layout-admin__header-shadow.aplus-ap-info-layout-admin__sticky
   word-break: break-all;
   flex: 1;
 }
+.aplus-ap-grid .vxe-cell--wrapper {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.aplus-ap-grid .vxe-cell--wrapper .vxe-cell--title {
+  flex-shrink: 1;
+}
 .aplus-editable-grid__header-cell--required {
   color: #FF4D4F;
   padding-right: 2px;
@@ -2570,3 +2578,233 @@ div.aplus-ap-info-layout-admin__header-shadow.aplus-ap-info-layout-admin__sticky
   background-color: currentColor;
   opacity: 0.45;
 }
+.split-center {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.split-bar-preview {
+  position: absolute;
+  z-index: 1;
+  display: none;
+  background: var(--basic-color-primary, #0070ff);
+  opacity: 0.2;
+  transition: none;
+  pointer-events: none;
+}
+.aplus-splitter {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: rgba(0 0 0 / 85%);
+  font-size: 14px;
+  line-height: 22px;
+  list-style: none;
+  font-family: inherit;
+  display: flex;
+  width: 100%;
+  height: 100%;
+  align-items: stretch;
+}
+.aplus-splitter > .aplus-splitter-bar {
+  flex: none;
+  position: relative;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger {
+  z-index: 1;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger::before {
+  content: "";
+  background: rgba(0, 0, 0, 0.04);
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger::after {
+  content: "";
+  background: rgba(0, 0, 0, 0.15);
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger:hover:not(.aplus-splitter-bar-dragger-active)::before {
+  background: #e6f4ff;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-active {
+  z-index: 2px;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-active::before {
+  background: #bae0ff;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger {
+  z-index: 0;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger,
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger:hover,
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger-active {
+  cursor: default;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger::before,
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger:hover::before,
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger-active::before {
+  background: rgba(0, 0, 0, 0.04);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger::after {
+  display: none;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 1000;
+  background: rgba(0, 0, 0, 0.04);
+  font-size: 12px;
+  border-radius: 2px;
+  color: rgba(0 0 0 / 85%);
+  cursor: pointer;
+  opacity: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar:hover {
+  background-color: rgba(0, 0, 0, 0.15);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar:active {
+  background-color: #e6f4ff;
+}
+.aplus-splitter > .aplus-splitter-bar:hover .aplus-splitter-bar-collapse-bar,
+.aplus-splitter > .aplus-splitter-bar:active .aplus-splitter-bar-collapse-bar {
+  opacity: 1;
+}
+.aplus-splitter-mask {
+  position: fixed;
+  z-index: 1000;
+  inset: 0;
+}
+.aplus-splitter-mask-horizontal {
+  cursor: col-resize;
+}
+.aplus-splitter-mask-vertical {
+  cursor: row-resize;
+}
+.aplus-splitter-horizontal {
+  flex-direction: row;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar {
+  width: 0;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-preview {
+  height: 100%;
+  width: 2px;
+  position: absolute;
+  z-index: 1;
+  display: none;
+  background: var(--basic-color-primary, #0070ff);
+  opacity: 0.2;
+  transition: none;
+  pointer-events: none;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-preview-active {
+  display: block;
+  transform: translateX(var(--aplus-splitter-bar-preview-offset));
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-dragger {
+  cursor: col-resize;
+  height: 100%;
+  width: 6px;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-dragger::before {
+  height: 100%;
+  width: 2px;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-dragger::after {
+  height: 20px;
+  width: 2px;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar {
+  width: 12px;
+  height: 24px;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar-start {
+  left: auto;
+  right: calc(6px / 2);
+  transform: translateY(-50%);
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar-end {
+  left: calc(6px / 2);
+  right: auto;
+  transform: translateY(-50%);
+}
+.aplus-splitter-vertical {
+  flex-direction: column;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar {
+  height: 0;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-preview {
+  height: 2px;
+  width: 100%;
+  position: absolute;
+  z-index: 1;
+  display: none;
+  background: var(--basic-color-primary, #0070ff);
+  opacity: 0.2;
+  transition: none;
+  pointer-events: none;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-preview.aplus-splitter-bar-preview-active {
+  display: block;
+  transform: translateY(var(--aplus-splitter-bar-preview-offset));
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-dragger {
+  cursor: row-resize;
+  width: 100%;
+  height: 6px;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-dragger::before {
+  width: 100%;
+  height: 2px;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-dragger::after {
+  width: 20px;
+  height: 2px;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar {
+  height: 12px;
+  width: 24px;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar-start {
+  top: auto;
+  bottom: calc(6px / 2);
+  transform: translateX(-50%);
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar-end {
+  top: calc(6px / 2);
+  bottom: auto;
+  transform: translateX(-50%);
+}
+.aplus-splitter-panel {
+  overflow: auto;
+  padding: 0 1px;
+  scrollbar-width: thin;
+  box-sizing: border-box;
+}
+.aplus-splitter-panel-hidden {
+  padding: 0;
+  overflow: hidden;
+}
+.aplus-splitter-panel:has(.aplus-splitter:only-child) {
+  overflow: hidden;
+}

package/theme/index.less

@@ -42,3 +42,4 @@
 @import './text/index.less';
 @import './text/group.less';
 @import './mask/index.less';
+@import './splitter/index.less';

package/theme/mixins/config.less

@@ -20,8 +20,19 @@
 
 @app-content-background: #fafafa;
 
+@font-size-base: 14px;
+@font-size-small: 12px;
+@line-height-base: 22px;
+
 // 业务组件样式
 
 // 业务组件 两端——全局主题色
 @aplus-primary-color: #0070ff;
 @admin-primary-color: #34b77c;
+
+// Splitter
+
+@split-bar-size: 2px;
+@split-trigger-size: 6px;
+@resize-spinner-size: 20px;
+@split-bar-draggable-size: 20px;

package/theme/splitter/index.css

@@ -0,0 +1,230 @@
+.split-center {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.split-bar-preview {
+  position: absolute;
+  z-index: 1;
+  display: none;
+  background: var(--basic-color-primary, #0070ff);
+  opacity: 0.2;
+  transition: none;
+  pointer-events: none;
+}
+.aplus-splitter {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: rgba(0 0 0 / 85%);
+  font-size: 14px;
+  line-height: 22px;
+  list-style: none;
+  font-family: inherit;
+  display: flex;
+  width: 100%;
+  height: 100%;
+  align-items: stretch;
+}
+.aplus-splitter > .aplus-splitter-bar {
+  flex: none;
+  position: relative;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger {
+  z-index: 1;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger::before {
+  content: "";
+  background: rgba(0, 0, 0, 0.04);
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger::after {
+  content: "";
+  background: rgba(0, 0, 0, 0.15);
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger:hover:not(.aplus-splitter-bar-dragger-active)::before {
+  background: #e6f4ff;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-active {
+  z-index: 2px;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-active::before {
+  background: #bae0ff;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger {
+  z-index: 0;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger,
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger:hover,
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger-active {
+  cursor: default;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger::before,
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger:hover::before,
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger-active::before {
+  background: rgba(0, 0, 0, 0.04);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-dragger-disabled.aplus-splitter-bar-dragger::after {
+  display: none;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 1000;
+  background: rgba(0, 0, 0, 0.04);
+  font-size: 12px;
+  border-radius: 2px;
+  color: rgba(0 0 0 / 85%);
+  cursor: pointer;
+  opacity: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar:hover {
+  background-color: rgba(0, 0, 0, 0.15);
+}
+.aplus-splitter > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar:active {
+  background-color: #e6f4ff;
+}
+.aplus-splitter > .aplus-splitter-bar:hover .aplus-splitter-bar-collapse-bar,
+.aplus-splitter > .aplus-splitter-bar:active .aplus-splitter-bar-collapse-bar {
+  opacity: 1;
+}
+.aplus-splitter-mask {
+  position: fixed;
+  z-index: 1000;
+  inset: 0;
+}
+.aplus-splitter-mask-horizontal {
+  cursor: col-resize;
+}
+.aplus-splitter-mask-vertical {
+  cursor: row-resize;
+}
+.aplus-splitter-horizontal {
+  flex-direction: row;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar {
+  width: 0;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-preview {
+  height: 100%;
+  width: 2px;
+  position: absolute;
+  z-index: 1;
+  display: none;
+  background: var(--basic-color-primary, #0070ff);
+  opacity: 0.2;
+  transition: none;
+  pointer-events: none;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-preview-active {
+  display: block;
+  transform: translateX(var(--aplus-splitter-bar-preview-offset));
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-dragger {
+  cursor: col-resize;
+  height: 100%;
+  width: 6px;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-dragger::before {
+  height: 100%;
+  width: 2px;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-dragger::after {
+  height: 20px;
+  width: 2px;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar {
+  width: 12px;
+  height: 24px;
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar-start {
+  left: auto;
+  right: calc(6px / 2);
+  transform: translateY(-50%);
+}
+.aplus-splitter-horizontal > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar-end {
+  left: calc(6px / 2);
+  right: auto;
+  transform: translateY(-50%);
+}
+.aplus-splitter-vertical {
+  flex-direction: column;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar {
+  height: 0;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-preview {
+  height: 2px;
+  width: 100%;
+  position: absolute;
+  z-index: 1;
+  display: none;
+  background: var(--basic-color-primary, #0070ff);
+  opacity: 0.2;
+  transition: none;
+  pointer-events: none;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-preview.aplus-splitter-bar-preview-active {
+  display: block;
+  transform: translateY(var(--aplus-splitter-bar-preview-offset));
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-dragger {
+  cursor: row-resize;
+  width: 100%;
+  height: 6px;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-dragger::before {
+  width: 100%;
+  height: 2px;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-dragger::after {
+  width: 20px;
+  height: 2px;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar {
+  height: 12px;
+  width: 24px;
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar-start {
+  top: auto;
+  bottom: calc(6px / 2);
+  transform: translateX(-50%);
+}
+.aplus-splitter-vertical > .aplus-splitter-bar .aplus-splitter-bar-collapse-bar-end {
+  top: calc(6px / 2);
+  bottom: auto;
+  transform: translateX(-50%);
+}
+.aplus-splitter-panel {
+  overflow: auto;
+  padding: 0 1px;
+  scrollbar-width: thin;
+  box-sizing: border-box;
+}
+.aplus-splitter-panel-hidden {
+  padding: 0;
+  overflow: hidden;
+}
+.aplus-splitter-panel:has(.aplus-splitter:only-child) {
+  overflow: hidden;
+}