@creekjs/web-components 1.0.2 → 1.0.3

package/src/creek-hooks/useApp/index.tsx

@@ -0,0 +1,119 @@
+import { useMemoizedFn } from 'ahooks';
+import { App } from 'antd';
+import React, { createContext, useContext, useMemo, useState } from 'react';
+
+import { DrawerHelper } from './DrawerHelper';
+import { ModalHelper } from './ModalHelper';
+import {
+  AppContextType,
+  DrawerConfig,
+  FormDrawerConfig,
+  FormModalConfig,
+  ModalConfig,
+  NormalDrawerConfig,
+  NormalModalConfig,
+} from './types';
+
+// --- Helper Hook for State Management ---
+const usePopupState = <T extends object>() => {
+  const [state, setState] = useState<{ open: boolean; config: T }>({
+    open: false,
+    config: {} as T,
+  });
+
+  const show = useMemoizedFn((config: T) => {
+    setState({ open: true, config });
+  });
+
+  const close = useMemoizedFn(() => {
+    setState((prev) => ({ ...prev, open: false }));
+  });
+
+  return { ...state, show, close };
+};
+
+const AppContext = createContext<AppContextType | null>(null);
+
+export const AppProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  const drawer = usePopupState<DrawerConfig>();
+  const modal = usePopupState<ModalConfig>();
+
+  const handleCloseModal = useMemoizedFn(() => {
+    modal.close();
+  });
+
+  const handleCloseDrawer = useMemoizedFn(() => {
+    drawer.close();
+  });
+
+  const contextValue = useMemo(
+    () => ({
+      openDrawer: drawer.show,
+      closeDrawer: handleCloseDrawer,
+      openModal: modal.show,
+      closeModal: handleCloseModal,
+    }),
+    [drawer.show, handleCloseDrawer, modal.show, handleCloseModal],
+  );
+
+  return (
+    <AppContext.Provider value={contextValue}>
+      {children}
+      <DrawerHelper open={drawer.open} config={drawer.config} onClose={handleCloseDrawer} />
+      <ModalHelper open={modal.open} config={modal.config} onClose={handleCloseModal} />
+    </AppContext.Provider>
+  );
+};
+
+export const useApp = () => {
+  const antdApp = App.useApp();
+  const appContext = useContext(AppContext);
+
+  return useMemo(() => {
+    const { openDrawer, closeDrawer, openModal, closeModal } = appContext || {};
+    const warn = () => console.warn('AppProvider is missing');
+
+    const createOpener = <T extends NormalModalConfig | NormalDrawerConfig>(
+      opener: ((config: T) => void) | undefined,
+      type: 'normal',
+    ) => {
+      return (config: T) => {
+        if (opener) {
+          opener({ ...config, type } as T);
+        } else {
+          warn();
+        }
+      };
+    };
+
+    const createFormOpener = <T extends FormModalConfig | FormDrawerConfig>(
+      opener: ((config: T) => void) | undefined,
+      type: 'form',
+    ) => {
+      return (config: Omit<T, 'type'>) => {
+        if (opener) {
+          opener({ ...config, type } as T);
+        } else {
+          warn();
+        }
+      };
+    };
+
+    return {
+      ...antdApp,
+      drawer: {
+        open: createOpener<NormalDrawerConfig>(openDrawer, 'normal'),
+        openForm: createFormOpener<FormDrawerConfig>(openDrawer, 'form'),
+        close: closeDrawer || warn,
+      },
+      modal: {
+        ...antdApp.modal,
+        open: createOpener<NormalModalConfig>(openModal, 'normal'),
+        openForm: createFormOpener<FormModalConfig>(openModal, 'form'),
+        close: closeModal || warn,
+      },
+    };
+  }, [antdApp, appContext]);
+};
+
+export * from './types';

package/src/creek-hooks/useApp/types.ts

@@ -0,0 +1,25 @@
+import { DrawerFormProps, ModalFormProps } from '@ant-design/pro-components';
+import { DrawerProps, ModalProps } from 'antd';
+import React from 'react';
+
+// --- Common ---
+export type BaseConfig = {
+  content?: React.ReactNode;
+};
+
+// --- Modal Types ---
+export type NormalModalConfig = BaseConfig & ModalProps & { type?: 'normal' };
+export type FormModalConfig<T = any> = BaseConfig & Omit<ModalFormProps<T>, 'content'> & { type: 'form' };
+export type ModalConfig = NormalModalConfig | FormModalConfig;
+
+// --- Drawer Types ---
+export type NormalDrawerConfig = BaseConfig & DrawerProps & { type?: 'normal' };
+export type FormDrawerConfig<T = any> = BaseConfig & Omit<DrawerFormProps<T>, 'content'> & { type: 'form' };
+export type DrawerConfig = NormalDrawerConfig | FormDrawerConfig;
+
+export interface AppContextType {
+  openDrawer: (config: DrawerConfig) => void;
+  closeDrawer: () => void;
+  openModal: (config: ModalConfig) => void;
+  closeModal: () => void;
+}

package/src/creek-hooks/useViewportHeight.tsx

@@ -1,4 +1,4 @@
-import { useDebounceEffect, useDeepCompareEffect, useEventListener, useMemoizedFn, useMount, useUnmount } from 'ahooks';
+import { useDebounceEffect, useDebounceFn, useDeepCompareEffect, useEventListener, useMemoizedFn, useMount, useUnmount } from 'ahooks';
 import { useRef, useState } from 'react';
 
 interface UseViewportHeightOptions {
@@ -23,12 +23,13 @@ interface UseViewportHeightOptions {
 }
 
 export const useViewportHeight = (options: UseViewportHeightOptions = {}) => {
-  const { bottomOffset = 0, topOffset, margin = 0, minHeight = 0, maxHeight, debug = false, debounceDelay = 200, deps = [], isObserverParent } = options;
+  const { bottomOffset = 0, topOffset, margin = 0, minHeight = 0, maxHeight, debug = false, debounceDelay = 500, deps = [], isObserverParent } = options;
 
   const [viewPortHeight, setHeight] = useState<number | undefined>(undefined);
   let containerRef = useRef<HTMLDivElement| null>(null);
   const resizeObserverRef = useRef<ResizeObserver | null>(null);
   const mutationObserverRef = useRef<MutationObserver | null>(null);
+  const lastHeightRef = useRef<number>(window.innerHeight);
 
   // 使用 useMemoizedFn 缓存计算函数，避免不必要的重新创建
   const calculateHeight = useMemoizedFn(() => {
@@ -69,8 +70,38 @@ export const useViewportHeight = (options: UseViewportHeightOptions = {}) => {
     setHeight(availableHeight);
   });
 
+  const { run: debouncedCalculateHeight } = useDebounceFn(
+    () => {
+      calculateHeight();
+    },
+    { wait: debounceDelay },
+  );
+
   // 使用 ahooks 的 useEventListener 监听窗口 resize 事件
-  useEventListener('resize', calculateHeight, { target: () => window });
+  useEventListener(
+    'resize',
+    () => {
+      const currentHeight = window.innerHeight;
+      // 只有高度发生变化时才重新计算
+      if (Math.abs(currentHeight - lastHeightRef.current) > 1) {
+        lastHeightRef.current = currentHeight;
+        // 防抖调用 calculateHeight
+        if (debounceDelay > 0) {
+          // 清除之前的定时器（如果有）
+          // 注意：这里需要一个 ref 来存储 timer，但为了简化，我们依赖 useDebounceEffect 的重新触发
+          // 或者更直接地，我们可以在这里直接调用 debouncedCalculateHeight
+          // 但由于 calculateHeight 本身是同步的，我们可以利用 ahooks 的 run 方法如果它是 useDebounceFn 返回的
+          
+          // 简单起见，我们在这里直接触发一个状态更新或者调用防抖函数
+          // 由于 calculateHeight 被用在多个地方，我们给它包一层 debounce
+          debouncedCalculateHeight();
+        } else {
+          calculateHeight();
+        }
+      }
+    },
+    { target: () => window },
+  );
 
   // 使用 useDebounceEffect 处理依赖项变化时的防抖计算
   useDebounceEffect(
@@ -141,8 +172,6 @@ export const useViewportHeight = (options: UseViewportHeightOptions = {}) => {
     }
   }, [containerRef.current])
 
-  console.log(viewPortHeight, 'viewPortHeight');
-
   return {
     /** 容器引用，需要绑定到目标元素的容器 */
     containerRef,

package/src/creek-table/SearchTable.tsx

@@ -2,11 +2,9 @@ import { ParamsType, ProTable } from '@ant-design/pro-components';
 import { createStyles } from 'antd-style';
 import classnames from 'classnames';
 import _ from 'lodash';
-import { useMemo, useRef } from 'react';
+import { useRef } from 'react';
 
-import { CreekFilterDisplay, CreekSearchInput, useSearchContext } from '../creek-search';
-
-import { useAdaptiveToolBar, useAutoAddFilterToColumns } from './hooks';
+import { useAutoWidthColumns } from './hooks';
 import { TableOptionRender } from './TableOptionRender';
 import { TableViewContent } from './TableViewContent';
 import { toolBarRender } from './toolBarRender';
@@ -40,45 +38,31 @@ export const SearchProTable = <T extends ParamsType, U extends ParamsType, Value
     ...restProps
   } = props;
 
-  const searchContext = useSearchContext();
-  const { filters, filtersToParams } = searchContext;
-
-  const proTableRef = useRef(null);
+  const proTableRef = useRef<HTMLDivElement>(null);
 
-  // 使用自定义 hook 处理列的筛选功能（包含状态管理）
-  const { columnsWithFilter } = useAutoAddFilterToColumns({
-    columns,
-    autoAddFilterForColumn,
-  });
+  // // 使用自定义 hook 处理工具栏的自适应功能
+  // const { shouldCollapse } = useAdaptiveToolBar({
+  //   containerRef: proTableRef,
+  //   prefixCls,
+  // });
 
-  // 使用自定义 hook 处理工具栏的自适应功能
-  const { shouldCollapse } = useAdaptiveToolBar({
-    containerRef: proTableRef,
-    prefixCls,
-  });
+  const { columns: adaptiveColumns, totalWidth } = useAutoWidthColumns(columns, proTableRef);
 
   const { styles } = useStyles();
 
-  // 获取搜素的参数
-  const finalParams = useMemo(() => {
-    let result = filtersToParams(filters) as U;
-    return result;
-  }, [filters]);
-
   return (
     <div ref={proTableRef}>
       <ProTable<T, U, ValueType>
         {...restProps}
         className={classnames(styles['creek-table-container'], className)}
-        columns={columnsWithFilter}
+        columns={adaptiveColumns}
+        scroll={{
+          x: totalWidth,
+          ...restProps.scroll,
+        }}
         toolbar={{
           ...restProps.toolbar,
         }}
-        params={{
-          ...params,
-          ...finalParams,
-        }}
-        search={false}
         pagination={{
           showTotal: (total) => <span>共 {total} 条</span>,
           showSizeChanger: true,
@@ -92,17 +76,12 @@ export const SearchProTable = <T extends ParamsType, U extends ParamsType, Value
               : [];
         }}
         toolBarRender={() => {
-          return toolBarRender({ shouldCollapse, restProps  });
+          return toolBarRender({  　shouldCollapse: false, restProps });
         }}
-        // 在 headerTitle 中只放搜索输入框
-        headerTitle={<CreekSearchInput />}
         // 在表格内容区上方显示筛选条件
         tableViewRender={(defaultProps, defaultDom) => {
           return _.isFunction(tableViewRender) ? (
-            <>
-              <CreekFilterDisplay />
-              {tableViewRender(defaultProps, defaultDom)}
-            </>
+            <>{tableViewRender(defaultProps, defaultDom)}</>
           ) : (
             <TableViewContent<T, U, ValueType> pageFixedBottom={pageFixedBottom} pageFixedBottomConfig={pageFixedBottomConfig} prefixCls={prefixCls}>
               {defaultDom}

package/src/creek-table/TableViewContent.tsx

@@ -3,7 +3,6 @@ import { ParamsType } from '@ant-design/pro-components';
 import { useDebounceFn, useDeepCompareEffect } from 'ahooks';
 
 import { useViewportHeight } from '../creek-hooks';
-import { CreekFilterDisplay } from '../creek-search';
 import { CreekTableProps } from './type';
 
 export type CreekTableViewRender<T extends ParamsType, U extends ParamsType, ValueType = 'text'> = CreekTableProps<T, U, ValueType>['tableViewRender'];
@@ -17,18 +16,27 @@ export const TableViewContent = <T extends ParamsType, U extends ParamsType, Val
   });
 
   // 设置antd内容区的高度，使得分页永远在底部
-  const { run: setAntdTableContentHeight } = useDebounceFn((mainHeight: number) => {
-    const antdTableContentElement = containerRef.current?.querySelector(`.${prefixCls}-table`);
-    const antdPaginationElement = containerRef.current?.querySelector(`.${prefixCls}-pagination`);
-    if (antdTableContentElement) {
-      const paginationHeight = antdPaginationElement?.clientHeight || 0;
-      const bottomFix = pageFixedBottomConfig?.bottomFix || 20;
-      const tableContentHeight = mainHeight - paginationHeight - 32 - bottomFix;
-      antdTableContentElement.setAttribute('style', `height: ${tableContentHeight}px`);
-    }
-  }, {
-    wait: 16
-  });
+  const { run: setAntdTableContentHeight } = useDebounceFn(
+    (mainHeight: number) => {
+      const antdTableContentElement = containerRef.current?.querySelector(`.${prefixCls}-table`);
+      const antdPaginationElement = containerRef.current?.querySelector(`.${prefixCls}-pagination`);
+      if (antdTableContentElement) {
+        const paginationHeight = antdPaginationElement?.clientHeight || 0;
+        const bottomFix = pageFixedBottomConfig?.bottomFix || 20;
+        const parentElement = containerRef.current?.parentElement;
+        let parentPaddingBottom = 0;
+        if (parentElement) {
+          const style = window.getComputedStyle(parentElement);
+          parentPaddingBottom = parseFloat(style.paddingBottom) || 0;
+        }
+        const tableContentHeight = mainHeight - paginationHeight - parentPaddingBottom - bottomFix - parentPaddingBottom;
+        antdTableContentElement.setAttribute('style', `height: ${tableContentHeight}px`);
+      }
+    },
+    {
+      wait: 16,
+    },
+  );
 
   useDeepCompareEffect(() => {
     if (pageFixedBottom) {
@@ -39,7 +47,6 @@ export const TableViewContent = <T extends ParamsType, U extends ParamsType, Val
   // 默认渲染逻辑
   return (
     <>
-      <CreekFilterDisplay />
       <div ref={containerRef}>{children}</div>
     </>
   );

package/src/creek-table/hooks/index.ts

@@ -1,4 +1,4 @@
 export * from './useAdaptiveToolBar';
-export * from './useAutoAddFilterToColumns';
+export * from './useAutoWidthColumns';
 export * from './useElementDistance';
 

package/src/creek-table/hooks/useAutoWidthColumns.tsx

@@ -0,0 +1,212 @@
+import { ProColumns } from '@ant-design/pro-components';
+import { useMemoizedFn } from 'ahooks';
+import { Space } from 'antd';
+import { RefObject, useEffect, useMemo, useRef, useState } from 'react';
+
+const DEFAULT_PADDING_WIDTH = 16;
+
+/**
+ * 估算字符串宽度（简单估算：汉字 14px，非汉字 8px，左右 padding 16px）
+ */
+const estimateWidth = (text: string) => {
+  let width = 0;
+  for (const char of text) {
+    if (/[\u4e00-\u9fa5]/.test(char)) {
+      width += 14;
+    } else {
+      width += 8;
+    }
+  }
+  return width + DEFAULT_PADDING_WIDTH; // padding
+};
+
+/**
+ * 根据 valueType 获取默认宽度
+ */
+const getValueTypeWidth = (valueType: string | undefined): number => {
+  switch (valueType) {
+    case 'date':
+    case 'dateRange':
+      return 120;
+    case 'dateTime':
+    case 'dateTimeRange':
+      return 180;
+    case 'time':
+    case 'timeRange':
+      return 100;
+    case 'index':
+    case 'indexBorder':
+      return 60;
+    case 'money':
+      return 100;
+    case 'digit':
+      return 100;
+    case 'select':
+      return 120;
+    default:
+      return 80; // 默认给 80
+  }
+};
+
+/**
+ * 一个用于测量的包裹组件
+ */
+const MeasureWrapper = ({ children, onResize }: { children: React.ReactNode; onResize: (width: number) => void }) => {
+  const ref = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (!ref.current) return;
+
+    // 初次测量
+    onResize(ref.current.offsetWidth);
+
+    // 监听变化
+    const observer = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        onResize((entry.target as HTMLElement).offsetWidth);
+      }
+    });
+
+    observer.observe(ref.current);
+
+    return () => {
+      observer.disconnect();
+    };
+  }, []); // 依赖为空，只在挂载时设置监听
+
+  return <Space ref={ref}>{children}</Space>;
+};
+
+export const useAutoWidthColumns = <T, ValueType>(
+  columns: ProColumns<T, ValueType>[] | undefined,
+  tableRef: RefObject<HTMLDivElement>,
+): { columns: ProColumns<T, ValueType>[] | undefined; totalWidth: number | undefined } => {
+  // 存储每个列的最大宽度：key 是 dataIndex 或 title，value 是最大宽度
+  const [columnWidths, setColumnWidths] = useState<Record<string, number>>({});
+  const [tableWidth, setTableWidth] = useState<number>(0);
+
+  // 监听 table 容器宽度变化
+  useEffect(() => {
+    if (!tableRef.current) return;
+
+    // 立即获取一次宽度
+    setTableWidth(tableRef.current.offsetWidth);
+
+    // 使用 requestAnimationFrame + setTimeout 防抖
+    let rafId: number;
+    let timerId: NodeJS.Timeout;
+
+    const updateWidth = (width: number) => {
+      cancelAnimationFrame(rafId);
+      clearTimeout(timerId);
+
+      rafId = requestAnimationFrame(() => {
+        timerId = setTimeout(() => {
+          setTableWidth(width);
+        }, 500);
+      });
+    };
+
+    const observer = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        updateWidth(entry.contentRect.width);
+      }
+    });
+
+    observer.observe(tableRef.current);
+
+    // 监听 window resize 作为后备
+    const handleWindowResize = () => {
+      if (tableRef.current) {
+        updateWidth(tableRef.current.offsetWidth);
+      }
+    };
+    window.addEventListener('resize', handleWindowResize);
+
+    return () => {
+      observer.disconnect();
+      window.removeEventListener('resize', handleWindowResize);
+      cancelAnimationFrame(rafId);
+      clearTimeout(timerId);
+    };
+  }, [tableRef]);
+
+  const handleResize = useMemoizedFn((key: string, width: number) => {
+    setColumnWidths((prev) => {
+      const currentMax = prev[key] || 0;
+      if (width > currentMax) {
+        return { ...prev, [key]: width };
+      }
+      return prev;
+    });
+  });
+
+  const { columns: finalColumns, totalWidth } = useMemo(() => {
+    if (!columns) return { columns: undefined, totalWidth: undefined };
+
+    // 1. 先计算所有列的理想宽度（不考虑 table 宽度）
+    const calculatedColumns = columns.map((col, index) => {
+      const colKey = (col.dataIndex as string) || (col.key as string) || `col-${index}`;
+      const measuredWidth = columnWidths[colKey];
+      let width: number;
+      if (col.width) {
+        width = typeof col.width === 'number' ? col.width : 100; // 暂时给个默认值如果手动设了 string width
+      } else if (col.valueType === 'option' && measuredWidth) {
+        width = measuredWidth + DEFAULT_PADDING_WIDTH;
+      } else {
+        width = Math.max(estimateWidth(col.title as string), getValueTypeWidth(col.valueType as string));
+      }
+
+      return {
+        ...col,
+        _calculatedWidth: width,
+        _colKey: colKey,
+      };
+    });
+
+    // 2. 计算所有列的总宽度
+    const totalCalculatedWidth = calculatedColumns.reduce((acc, col) => acc + col._calculatedWidth, 0);
+
+    // 3. 判断是否需要自适应
+    // 如果总宽度小于 table 宽度，说明空间足够，除了 option 列，其他列可以不设宽度让 table 自动撑开
+    const isOverflow = totalCalculatedWidth > tableWidth;
+
+    const processedColumns = calculatedColumns.map((col) => {
+      // 提取内部使用的字段
+      const { _calculatedWidth, _colKey, ...originalCol } = col;
+
+      // 针对 valueType === 'option' (操作列)，始终需要特殊处理（包裹测量组件）
+      if (col.valueType === 'option') {
+        const originalRender = col.render;
+        return {
+          ...originalCol,
+          // 始终设置 option 列宽度
+          width: _calculatedWidth,
+          fixed: col.fixed ?? 'right',
+          render: (dom: any, entity: any, index: any, action: any, schema: any) => {
+            const originalRenderResult = originalRender ? (originalRender(dom, entity, index, action, schema) as React.ReactNode) : dom;
+            return <MeasureWrapper onResize={(width) => handleResize(_colKey, width)}>{originalRenderResult}</MeasureWrapper>;
+          },
+        } as ProColumns<T, ValueType>;
+      }
+
+      // 非 option 列
+      return {
+        ...originalCol,
+        // 只有当内容溢出（需要滚动）或者手动设置了宽度时，才应用计算出的宽度
+        // 否则不设置 width，让 Antd Table 自动布局占满剩余空间
+        width: isOverflow || col.width ? _calculatedWidth : undefined,
+      };
+    });
+
+    return {
+      columns: processedColumns,
+      totalWidth: isOverflow ? totalCalculatedWidth : undefined,
+    };
+  }, [columns, columnWidths, tableWidth]);
+
+  return {
+    columns: finalColumns,
+    totalWidth,
+  };
+};

package/src/creek-table/index.tsx

@@ -1,7 +1,5 @@
 import { ParamsType } from '@ant-design/pro-components';
 
-import { CreekSearchProvider } from '../creek-search';
-
 import { SearchProTable } from './SearchTable';
 import { CreekTableProps } from './type';
 
@@ -9,8 +7,6 @@ export const CreekTable = <T extends ParamsType, U extends ParamsType, ValueType
   const { columns = [],  onSubmit, ...restProps } = props;
 
   return (
-    <CreekSearchProvider columns={columns} onSubmit={onSubmit}>
-      <SearchProTable columns={columns} {...restProps} />
-    </CreekSearchProvider>
+     <SearchProTable columns={columns} {...restProps} />
   );
 };

package/src/creek-table/type.ts

@@ -6,7 +6,7 @@ export type OptionRenderCustom = {
   onClick?: () => void;
 };
 
-export type CreekTableProps<T extends ParamsType, U extends ParamsType, ValueType = 'text'> = Omit<ProTableProps<T, U, ValueType>, 'search' | 'options'> & {
+export type CreekTableProps<T extends ParamsType, U extends ParamsType, ValueType = 'text'> = Omit<ProTableProps<T, U, ValueType>,  'options'> & {
   pageFixedBottom?: boolean; // 是否固定分页在底部
   pageFixedBottomConfig?: {
     /** 底部保留空间（如固定在底部的元素高度），默认 0 */

package/src/index.tsx

@@ -1,8 +1,8 @@
-export * from './bg-center';
+
 export * from './creek-config-provider';
+export * from './creek-hooks';
 export * from './creek-icon';
 export * from './creek-layout';
 export * from './creek-loading';
-export * from './creek-search';
 export * from './creek-table';
 

package/dist/bg-center/index.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-export type BgCenterProps = {
-    children: React.ReactNode;
-};
-export declare const BgCenter: ({ children }: BgCenterProps) => import("react/jsx-runtime").JSX.Element;

package/dist/bg-center/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/bg-center/index.tsx"],"names":[],"mappings":";AAEA,MAAM,MAAM,aAAa,GAAG;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,QAAQ,iBAAkB,aAAa,4CAmBnD,CAAC"}

package/dist/bg-center/index.js

@@ -1,28 +0,0 @@
-import { createStyles } from 'antd-style';
-import { jsx as _jsx } from "react/jsx-runtime";
-export var BgCenter = function BgCenter(_ref) {
-  var children = _ref.children;
-  var useStyles = createStyles(function (_ref2) {
-    var token = _ref2.token;
-    return {
-      bgCenterContianer: {
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        position: 'fixed',
-        top: 0,
-        left: 0,
-        right: 0,
-        bottom: 0,
-        backgroundColor: 'rgba(255, 255, 255, 0.7)',
-        zIndex: token.zIndexBase
-      }
-    };
-  });
-  var _useStyles = useStyles(),
-    styles = _useStyles.styles;
-  return /*#__PURE__*/_jsx("div", {
-    className: styles.bgCenterContianer,
-    children: children
-  });
-};

package/dist/creek-config-provider/CreekConfigContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CreekConfigContext.d.ts","sourceRoot":"","sources":["../../src/creek-config-provider/CreekConfigContext.tsx"],"names":[],"mappings":";AAEA,MAAM,MAAM,uBAAuB,GAAG;IACpC,WAAW,CAAC,EAAE,MAAM,EAAE,CAAA;CACvB,CAAC;AAEF,eAAO,MAAM,kBAAkB,kDAA6C,CAAC"}

package/dist/creek-config-provider/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/creek-config-provider/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAsB,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AAEnF,MAAM,MAAM,wBAAwB,GAAG,uBAAuB,GAAG;IAC/D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,mBAAmB;YAAW,wBAAwB;;CAGlE,CAAC"}

package/dist/creek-hooks/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/creek-hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC"}

package/dist/creek-hooks/useViewportHeight.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useViewportHeight.d.ts","sourceRoot":"","sources":["../../src/creek-hooks/useViewportHeight.tsx"],"names":[],"mappings":";AAGA,UAAU,wBAAwB;IAChC,+BAA+B;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,gBAAgB;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mBAAmB;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2BAA2B;IAC3B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,yBAAyB;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mCAAmC;IACnC,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC;IAE5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,iBAAiB,aAAa,wBAAwB;IA0H/D,wBAAwB;;IAExB,kBAAkB;;IAElB,kBAAkB;;IAElB,gBAAgB;;CAGnB,CAAC"}