plain-design 1.0.0-beta.124 → 1.0.0-beta.126

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "plain-design",
-  "version": "1.0.0-beta.124",
+  "version": "1.0.0-beta.126",
   "description": "",
   "main": "dist/plain-design.min.js",
   "module": "dist/plain-design.commonjs.min.js",
@@ -19,7 +19,7 @@
   "author": "",
   "license": "ISC",
   "peerDependencies": {
-    "@peryl/react-compose": "0.0.202",
+    "@peryl/react-compose": "0.0.221",
     "exceljs": "^4.2.1",
     "file-saver": "^2.0.5",
     "react": "^18.0.1",
@@ -40,7 +40,7 @@
     "react-transition-group": "4.4.5"
   },
   "devDependencies": {
-    "@peryl/react-compose": "0.0.219",
+    "@peryl/react-compose": "0.0.221",
     "@babel/plugin-proposal-optional-chaining": "7.21.0",
     "@babel/plugin-transform-class-properties": "7.23.3",
     "@babel/preset-env": "7.23.7",

package/src/packages/components/InputGroup/input-group.scss

@@ -33,5 +33,11 @@
         border-left-color: transparent;
       }
     }
+
+    &.#{componentName(input)}, &.#{componentName(button)} {
+      & + .#{componentName(input)}, & + .#{componentName(button)} {
+        margin-left: -1px;
+      }
+    }
   }
 }

package/src/packages/components/Layout/layout.scss

@@ -14,6 +14,14 @@ $resize-width: 12px;
   }
 
   & > .#{componentName(layout-section)} {
+
+    &.layout-section-fixed-inner {
+      .layout-section-inner {
+        position: absolute;
+        inset: 0;
+      }
+    }
+
     &.layout-section-position-center {
       flex: 1;
       position: relative;

package/src/packages/components/LayoutSection/index.tsx

@@ -9,7 +9,8 @@ export const LayoutSection = designComponent({
   props: {
     position: { type: String as PropType<typeof eLayoutSectionPosition.TYPE>, default: eLayoutSectionPosition.center },
     modelValue: { type: Number },
-    collapse: { type: Boolean }
+    collapse: { type: Boolean },
+    fixedInner: { type: Boolean },
   },
   emits: {
     onUpdateModelValue: (val?: number) => true,
@@ -32,6 +33,7 @@ export const LayoutSection = designComponent({
       {
         'layout-section-fixed': !!model.value,
         'layout-section-collapse': collapseModel.value,
+        'layout-section-fixed-inner': props.fixedInner,
       }
     ]);
 

package/src/packages/styles/global.import.scss

@@ -57,6 +57,7 @@
 @mixin hover($component) {
   &:not(.#{$component}-disabled):not(.#{$component}-loading):not(.#{$component}-readonly):not(.#{$component}-focus) {
     &:hover, &.#{$component}-hover {
+      z-index: 2;
       @content;
     }
   }
@@ -99,21 +100,65 @@
       }
       @content;
 
-      &.mt{margin-top: $margin}
-      &.mb{margin-bottom: $margin}
-      &.ml{margin-left: $margin}
-      &.mr{margin-right: $margin}
-      &.mx{margin-left: $margin;margin-right: $margin}
-      &.my{margin-top: $margin;margin-bottom: $margin}
-      &.margin {margin: $margin}
-
-      &.pt{padding-top: $margin}
-      &.pb{padding-bottom: $margin}
-      &.pl{padding-left: $margin}
-      &.pr{padding-right: $margin}
-      &.px{padding-left: $margin;padding-right: $margin}
-      &.py{padding-top: $margin;padding-bottom: $margin}
-      &.padding {padding: $margin}
+      &.mt {
+        margin-top: $margin
+      }
+
+      &.mb {
+        margin-bottom: $margin
+      }
+
+      &.ml {
+        margin-left: $margin
+      }
+
+      &.mr {
+        margin-right: $margin
+      }
+
+      &.mx {
+        margin-left: $margin;
+        margin-right: $margin
+      }
+
+      &.my {
+        margin-top: $margin;
+        margin-bottom: $margin
+      }
+
+      &.margin {
+        margin: $margin
+      }
+
+      &.pt {
+        padding-top: $margin
+      }
+
+      &.pb {
+        padding-bottom: $margin
+      }
+
+      &.pl {
+        padding-left: $margin
+      }
+
+      &.pr {
+        padding-right: $margin
+      }
+
+      &.px {
+        padding-left: $margin;
+        padding-right: $margin
+      }
+
+      &.py {
+        padding-top: $margin;
+        padding-bottom: $margin
+      }
+
+      &.padding {
+        padding: $margin
+      }
     }
   }
 }