Merge pull request #37 from imagine10255/36-support-height-can-use-nu…

…mber-auto-convert-to-px support height can use number (auto convert to px) #36
imagine10255 · Oct 31, 2024 · 7c2adbc · 7c2adbc
2 parents f412a78 + 4de8a73
commit 7c2adbc
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 3 deletions.
diff --git a/example/src/components/primary/BearReactCarousel/BearReactCarousel.stories.tsx b/example/src/components/primary/BearReactCarousel/BearReactCarousel.stories.tsx
@@ -67,6 +67,12 @@ export const WithStaticHeight: Story = {
         height: '240px',
     }
 };
+export const WithStaticHeightByNumber: Story = {
+    args: {
+        slidesPerView: 1,
+        height: 240,
+    }
+};
 export const WithAspectRatio: Story = {
     args: {
         slidesPerView: 1,

diff --git a/src/manager/Configurator/utils.ts b/src/manager/Configurator/utils.ts
@@ -80,9 +80,17 @@ export function getMediaSetting(options?: {
     };
 }
 
-
+/**
+ * 取得高度設定
+ * @param height
+ */
 export function getHeight(height: IBreakpointSetting['height']) {
-    if(typeof height === 'string'){
+    if(typeof height === 'number'){
+        return {
+            height: `${height}px`,
+        };
+
+    }else if(typeof height === 'string'){
         if(height === 'auto'){
             return undefined;
         }

diff --git a/src/types.ts b/src/types.ts
@@ -87,7 +87,7 @@ export interface IBearSlideItemData {
 export type TBearSlideItemDataList = ReactNode[];
 
 export type heightUnit = 'px' | '%' | 'em' | 'rem' | 'vh';
-export type THeightUnitSize = 'auto'|`${number}${heightUnit}`;
+export type THeightUnitSize = 'auto'|number|`${number}${heightUnit}`;
 
 export interface IAspectRatio {
   widthRatio: number