@class101/cdn-ui-system 0.0.7 → 0.0.11

package/core/variants/propsVariant/propsVariant.spec.js

@@ -0,0 +1,73 @@
+import {
+  __spreadValues,
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/core/variants/propsVariant/propsVariant.spec.ts
+init_react_shim();
+import { defaultTheme } from "../../theme/defaultTheme.js";
+import { propsVariant } from "./propsVariant.js";
+import { getPaddedResponsiveArray } from "../../props/utils/getResponsiveValue.js";
+describe("propsVariant", () => {
+  const theme = defaultTheme;
+  describe("Props\uC5D0 size, direction\uC774 \uC788\uACE0", () => {
+    let variantFn;
+    beforeEach(() => {
+      variantFn = propsVariant({
+        props: [
+          {
+            name: "size",
+            skipForward: true
+          },
+          {
+            name: "direction",
+            responsive: true
+          }
+        ],
+        variants: ({ size, direction }) => ({
+          result: {
+            size,
+            direction
+          }
+        })
+      });
+    });
+    describe.each([
+      { props: { size: "sm", direction: "vertical" } },
+      { props: { size: "sm", direction: ["vertical", "horizontal"] } }
+    ])("prop\uC5D0 $props.size, $props.direction\uC744 \uB118\uAE30\uBA74", ({ props }) => {
+      let variantFnResult;
+      beforeEach(() => {
+        variantFnResult = variantFn(__spreadValues({
+          __theme__: theme
+        }, props));
+      });
+      it("skipForward \uC635\uC158\uC744 \uC900 size prop\uC740 \uC0AC\uB77C\uC9C4\uB2E4", () => {
+        expect(variantFnResult.size).toBeUndefined();
+      });
+      it("skipForward \uC635\uC158\uC744 \uC8FC\uC9C0 \uC54A\uC740 direction prop\uC740 \uADF8\uB300\uB85C\uC774\uB2E4", () => {
+        expect(variantFnResult.direction).toEqual(props.direction);
+      });
+      it("result\uC5D0 size\uB294 prop\uC73C\uB85C \uB118\uAE34 size \uAC12\uC774\uB2E4", () => {
+        expect(variantFnResult.result.size).toEqual(props.size);
+      });
+      it("result\uC5D0 direction\uC740 breakpoints \uB9CC\uD07C \uBC30\uC5F4\uB85C \uB9CC\uB4E4\uC5B4\uC9C4\uB2E4", () => {
+        expect(variantFnResult.result.direction).toEqual(getPaddedResponsiveArray(theme.breakpoints, props.direction));
+      });
+    });
+    describe(`prop\uC5D0 size, direction \uAC12\uC744 \uB118\uAE30\uC9C0 \uC54A\uC73C\uBA74`, () => {
+      let variantFnResult;
+      beforeEach(() => {
+        variantFnResult = variantFn({
+          __theme__: theme
+        });
+      });
+      it("result\uC5D0 size \uAC12\uC740 undefined\uC774\uB2E4", () => {
+        expect(variantFnResult.result.size).toBeUndefined();
+      });
+      it("result\uC5D0 direction \uAC12\uC740 undefined\uC774\uB2E4", () => {
+        expect(variantFnResult.result.direction).toBeUndefined();
+      });
+    });
+  });
+});

package/core/variants/styleVariant/index.js

@@ -1,8 +1,10 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/core/variants/styleVariant/index.ts
-import {styleVariant} from "./styleVariant.js";
+init_react_shim();
+import { styleVariant } from "./styleVariant.js";
 export {
   styleVariant
 };

package/core/variants/styleVariant/styleVariant.js

@@ -1,35 +1,42 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  index_esm_default
+} from "../../../chunk-37VQUPZR.js";
+import {
+  __spreadProps,
+  __spreadValues,
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/core/variants/styleVariant/styleVariant.ts
-import css from "https://jspm.dev/@styled-system/css@5.1.5";
-import {getVariantValue} from "../baseVariant/baseVariant.js";
+init_react_shim();
+import { getVariantValue } from "../baseVariant/baseVariant.js";
+import { makeStyle } from "../makeStyled/makeStyled.js";
 function styleVariant(option) {
   return (originalProps) => {
-    const {prop, variants, responsive, defaultValue, skipForward} = option;
+    const { prop, variants, responsive, defaultValue, skipForward } = option;
+    const { __theme__, __styles__ } = originalProps;
     const variantKey = originalProps[prop] || defaultValue;
     if (!variantKey || !variants) {
       return originalProps;
     }
-    const {__theme__, __styles__} = originalProps;
-    const nextStyles = [...__styles__ ?? []];
+    const nextStyles = [...__styles__ != null ? __styles__ : []];
     if (responsive && Array.isArray(variantKey)) {
       const styles = variantKey.reduce((prev, key, index) => {
         const value = getVariantValue(key, variants);
         if (index === 0) {
-          return {...prev, ...css(value)(__theme__)};
+          return __spreadValues(__spreadValues({}, prev), index_esm_default(value)(__theme__));
         }
         const media = createMediaQuery(__theme__.breakpoints[index - 1]);
-        const style = css(value)(__theme__);
-        return {...prev, [media]: style};
+        const style = index_esm_default(value)(__theme__);
+        return __spreadProps(__spreadValues({}, prev), { [media]: style });
       }, {});
-      nextStyles.push(styles);
+      nextStyles.push(makeStyle(styles));
     } else {
       const value = getVariantValue(variantKey, variants);
-      const style = css(value)(__theme__);
-      nextStyles.push(style);
+      const style = index_esm_default(value)(__theme__);
+      nextStyles.push(makeStyle(style));
     }
-    const nextProps = {...originalProps, __styles__: nextStyles};
+    const nextProps = __spreadProps(__spreadValues({}, originalProps), { __styles__: nextStyles });
     if (skipForward) {
       delete nextProps[prop];
     }

package/core/variants/styleVariant/styleVariant.spec.js

@@ -1,29 +1,33 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  __spreadProps,
+  __spreadValues,
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/core/variants/styleVariant/styleVariant.spec.ts
-import {defaultTheme} from "../../theme/defaultTheme.js";
-import {styleVariant} from "./styleVariant.js";
+init_react_shim();
+import { defaultTheme } from "../../theme/defaultTheme.js";
+import { styleVariant } from "./styleVariant.js";
 describe("styleVariant", () => {
-  const defaultProps = {theme: defaultTheme};
+  const defaultProps = { __theme__: defaultTheme };
   describe("responsive \uAC12\uC774 \uC544\uB2C8\uBA74", () => {
     let variantFn;
     beforeEach(() => {
-      variantFn = styleVariant({prop: "test", variants: {sm: {marginLeft: "10"}, md: {marginLeft: "20"}}});
+      variantFn = styleVariant({ prop: "test", variants: { sm: { marginLeft: 10 }, md: { marginLeft: 20 } } });
     });
     describe("variant\uC5D0 \uC788\uB294 prop\uC744 \uB118\uACBC\uC744 \uB54C", () => {
       let result;
       beforeEach(() => {
-        result = variantFn({...defaultProps, test: "sm"});
+        result = variantFn(__spreadProps(__spreadValues({}, defaultProps), { test: "sm" }));
       });
       it("variant\uC5D0 \uB9DE\uAC8C \uAC12\uC774 \uB118\uC5B4\uC628\uB2E4", () => {
-        expect(result.__styles__).toEqual([{marginLeft: 10}]);
+        expect(result.__styles__).toEqual([{ marginLeft: 10 }]);
       });
     });
     describe("variant\uC5D0 \uC5C6\uB294 prop\uC744 \uB118\uACBC\uC744 \uB54C", () => {
       let result;
       beforeEach(() => {
-        result = variantFn({...defaultProps, test: "lg"});
+        result = variantFn(__spreadProps(__spreadValues({}, defaultProps), { test: "lg" }));
       });
       it("\uC2A4\uD0C0\uC77C\uC740 \uC874\uC7AC\uD558\uC9C0 \uC54A\uB294\uB2E4", () => {
         expect(result.__styles__).toEqual([{}]);
@@ -35,14 +39,14 @@ describe("styleVariant", () => {
     beforeEach(() => {
       variantFn = styleVariant({
         prop: "test",
-        variants: {sm: {marginLeft: "10"}, md: {marginLeft: "20"}},
+        variants: { sm: { marginLeft: 10 }, md: { marginLeft: 20 } },
         responsive: true
       });
     });
     describe("\uAC12\uC774 \uBC30\uC5F4\uB85C \uB118\uC5B4\uAC08 \uB54C", () => {
       let result;
       beforeEach(() => {
-        result = variantFn({...defaultProps, test: ["sm", "md", "sm"]});
+        result = variantFn(__spreadProps(__spreadValues({}, defaultProps), { test: ["sm", "md", "sm"] }));
       });
       it("media query\uAC00 \uC801\uC6A9\uB41C \uAC12\uC774 \uB098\uC628\uB2E4", () => {
         expect(result.__styles__).toEqual([
@@ -61,10 +65,10 @@ describe("styleVariant", () => {
     describe("\uAC12\uC774 \uBC30\uC5F4\uC774 \uC544\uB2C8\uAC8C \uB118\uC5B4\uAC08 \uB54C", () => {
       let result;
       beforeEach(() => {
-        result = variantFn({...defaultProps, test: "sm"});
+        result = variantFn(__spreadProps(__spreadValues({}, defaultProps), { test: "sm" }));
       });
       it("media query\uAC00 \uC801\uC6A9\uB418\uC9C0 \uC54A\uB294 \uAC12\uC774 \uB098\uC628\uB2E4", () => {
-        expect(result.__styles__).toEqual([{marginLeft: 10}]);
+        expect(result.__styles__).toEqual([{ marginLeft: 10 }]);
       });
     });
   });

package/core/variants/stylesVariant/index.js

@@ -0,0 +1,10 @@
+import {
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/core/variants/stylesVariant/index.ts
+init_react_shim();
+import { stylesVariant } from "./stylesVariant.js";
+export {
+  stylesVariant
+};

package/core/variants/stylesVariant/stylesVariant.js

@@ -0,0 +1,40 @@
+import {
+  index_esm_default
+} from "../../../chunk-37VQUPZR.js";
+import {
+  __spreadProps,
+  __spreadValues,
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/core/variants/stylesVariant/stylesVariant.ts
+init_react_shim();
+import { getPaddedResponsiveArray } from "../../props/utils/getResponsiveValue.js";
+import { getVariantValue } from "../baseVariant/index.js";
+import { makeStyle } from "../makeStyled/index.js";
+function stylesVariant(options) {
+  return (originalProps) => {
+    const { props, variants } = options;
+    const { __theme__, __styles__ } = originalProps;
+    const nextProps = __spreadValues({}, originalProps);
+    const values = props ? props.reduce((prev, curr) => {
+      if (curr.skipForward) {
+        delete nextProps[curr.name];
+      }
+      if (originalProps[curr.name] === void 0) {
+        return prev;
+      }
+      return __spreadProps(__spreadValues({}, prev), {
+        [curr.name]: curr.responsive ? getPaddedResponsiveArray(__theme__.breakpoints, originalProps[curr.name]) : originalProps[curr.name]
+      });
+    }, {}) : originalProps;
+    const nextStyles = [...__styles__ != null ? __styles__ : []];
+    nextStyles.push(makeStyle(index_esm_default(getVariantValue(values, variants))(__theme__)));
+    return __spreadProps(__spreadValues({}, nextProps), {
+      __styles__: nextStyles
+    });
+  };
+}
+export {
+  stylesVariant
+};

package/core/variants/stylesVariant/stylesVariant.spec.js

@@ -0,0 +1,52 @@
+import {
+  __spreadValues,
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/core/variants/stylesVariant/stylesVariant.spec.ts
+init_react_shim();
+import { defaultTheme } from "../../theme/defaultTheme.js";
+import { stylesVariant } from "./stylesVariant.js";
+describe("stylesVariant", () => {
+  const theme = defaultTheme;
+  describe("Props\uC5D0 size, direction\uC774 \uC788\uACE0", () => {
+    let variantFn;
+    beforeEach(() => {
+      variantFn = stylesVariant({
+        props: [
+          {
+            name: "size",
+            skipForward: true
+          },
+          {
+            name: "direction"
+          }
+        ],
+        variants: ({ size, direction }) => ({
+          marginTop: size === "sm" ? 4 : 12,
+          flexDirection: direction === "vertical" ? "row" : "column"
+        })
+      });
+    });
+    describe.each([
+      { props: { size: "sm", direction: "vertical" }, result: { marginTop: 4, flexDirection: "row" } },
+      { props: { size: "md", direction: "horizontal" }, result: { marginTop: 12, flexDirection: "column" } }
+    ])("prop\uC5D0 $props.size, $props.direction\uC744 \uB118\uAE30\uBA74", ({ props, result }) => {
+      let variantFnResult;
+      beforeEach(() => {
+        variantFnResult = variantFn(__spreadValues({
+          __theme__: theme
+        }, props));
+      });
+      it("skipForward \uC635\uC158\uC744 \uC900 size prop\uC740 \uC0AC\uB77C\uC9C4\uB2E4", () => {
+        expect(variantFnResult.size).toBeUndefined();
+      });
+      it("skipForward \uC635\uC158\uC744 \uC8FC\uC9C0 \uC54A\uC740 direction prop\uC740 \uADF8\uB300\uB85C\uC774\uB2E4", () => {
+        expect(variantFnResult.direction).toEqual(props.direction);
+      });
+      it("style\uC774 variant\uC5D0 \uB9DE\uAC8C \uB4E4\uC5B4\uAC04\uB2E4", () => {
+        expect(variantFnResult.__styles__).toEqual([result]);
+      });
+    });
+  });
+});

package/core/variants/system/index.js

@@ -1,8 +1,10 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/core/variants/system/index.ts
-import {system} from "./system.js";
+init_react_shim();
+import { system } from "./system.js";
 export {
   system
 };

package/core/variants/system/system.js

@@ -1,26 +1,34 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  useTheme
+} from "../../../chunk-T7TBQTBE.js";
+import "../../../chunk-LE44IRCL.js";
+import "../../../chunk-CGEEKALF.js";
+import "../../../chunk-J3Q2BPOW.js";
+import {
+  __spreadProps,
+  __spreadValues,
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/core/variants/system/system.ts
-import {createElement, forwardRef} from "react";
-import styled from "https://jspm.dev/@emotion/styled@11.3.0";
-import {useTheme} from "https://jspm.dev/@emotion/react@11.1.5";
+init_react_shim();
+import { createElement, forwardRef } from "react";
+import { makeStyled } from "../makeStyled/index.js";
 function system() {
-  return (...variants) => (component) => forwardRef((props, ref) => {
-    const theme = useTheme();
-    const nextProps = variants.reduce((previousProp, variant) => variant(previousProp), {
-      ...props,
-      ref,
-      __theme__: theme
+  return (...variants) => (component) => {
+    const styledElement = makeStyled(component)((props) => props.__styles__);
+    return forwardRef((props, ref) => {
+      const theme = useTheme();
+      const nextProps = variants.reduce((previousProp, variant) => variant(previousProp), __spreadProps(__spreadValues({}, props), {
+        ref,
+        __theme__: theme
+      }));
+      if (nextProps.__styles__) {
+        return createElement(styledElement, nextProps);
+      }
+      return createElement(component, nextProps);
     });
-    delete nextProps.__theme__;
-    if (nextProps.__styles__) {
-      const styles = nextProps.__styles__;
-      delete nextProps.__styles__;
-      return createElement(styled(component)(...styles), nextProps);
-    }
-    return createElement(component, nextProps);
-  });
+  };
 }
 export {
   system

package/core/variants/system/type.js

@@ -0,0 +1,6 @@
+import {
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/core/variants/system/type.ts
+init_react_shim();

package/hooks/useIsMobile/index.js

@@ -0,0 +1,10 @@
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/hooks/useIsMobile/index.ts
+init_react_shim();
+import { useIsMobile } from "./useIsMobile.js";
+export {
+  useIsMobile
+};

package/hooks/useIsMobile/useIsMobile.js

@@ -0,0 +1,12 @@
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/hooks/useIsMobile/useIsMobile.tsx
+init_react_shim();
+import { baseTheme } from "../../core/theme/baseTheme.js";
+import { useMediaQuery } from "../useMediaQuery/index.js";
+var useIsMobile = () => useMediaQuery(baseTheme.mediaQueries.mobile);
+export {
+  useIsMobile
+};

package/hooks/useMediaQuery/index.js

@@ -0,0 +1,10 @@
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/hooks/useMediaQuery/index.ts
+init_react_shim();
+import { useMediaQuery } from "./useMediaQuery.js";
+export {
+  useMediaQuery
+};

package/hooks/useMediaQuery/useMediaQuery.js

@@ -0,0 +1,32 @@
+import {
+  isServer
+} from "../../chunk-LN36XQS3.js";
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/hooks/useMediaQuery/useMediaQuery.ts
+init_react_shim();
+import { useLayoutEffect, useState } from "react";
+function useMediaQuery(query, defaultValue = false) {
+  const [matches, setMatches] = useState(() => {
+    if (isServer) {
+      return defaultValue;
+    }
+    return window.matchMedia(query).matches;
+  });
+  useLayoutEffect(() => {
+    const media = window.matchMedia(query);
+    const updateMatch = () => setMatches(media.matches);
+    if (media.addEventListener) {
+      media.addEventListener("change", updateMatch);
+      return () => media.removeEventListener("change", updateMatch);
+    }
+    media.addListener(updateMatch);
+    return () => media.removeListener(updateMatch);
+  }, [matches, query]);
+  return matches;
+}
+export {
+  useMediaQuery
+};

package/hooks/useNativeResponsiveValue/index.js

@@ -0,0 +1,10 @@
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/hooks/useNativeResponsiveValue/index.ts
+init_react_shim();
+import { useNativeResponsiveValue } from "./useNativeResponsiveValue.js";
+export {
+  useNativeResponsiveValue
+};

package/hooks/useNativeResponsiveValue/useNativeResponsiveValue.js

@@ -0,0 +1,42 @@
+import {
+  require_cjs
+} from "../../chunk-2A2YD3YP.js";
+import "../../chunk-IFZN3H2K.js";
+import "../../chunk-R4HM35UZ.js";
+import {
+  useTheme
+} from "../../chunk-T7TBQTBE.js";
+import "../../chunk-LE44IRCL.js";
+import "../../chunk-CGEEKALF.js";
+import "../../chunk-J3Q2BPOW.js";
+import {
+  __toModule,
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/hooks/useNativeResponsiveValue/useNativeResponsiveValue.ts
+init_react_shim();
+
+// libs/shared/utils-native-stylesheet/src/index.ts
+init_react_shim();
+
+// libs/shared/utils-native-stylesheet/src/lib/useDimension/index.ts
+init_react_shim();
+
+// libs/shared/utils-native-stylesheet/src/lib/useDimension/useDimension.ts
+init_react_shim();
+var import_react_native = __toModule(require_cjs());
+var useDimension = () => (0, import_react_native.useWindowDimensions)();
+
+// libs/shared/ui-system/src/hooks/useNativeResponsiveValue/useNativeResponsiveValue.ts
+import { getPaddedResponsiveArray } from "../../core/index.js";
+function useNativeResponsiveValue(responsiveValue) {
+  const { width } = useDimension();
+  const { breakpoints } = useTheme();
+  const arrayValue = getPaddedResponsiveArray(breakpoints, responsiveValue);
+  const matchedBreakpointIndex = [...breakpoints, `${width + 1}px`].findIndex((breakpoint) => width < parseInt(breakpoint, 10));
+  return arrayValue[matchedBreakpointIndex];
+}
+export {
+  useNativeResponsiveValue
+};

package/hooks/useResponsiveValue/index.js

@@ -1,8 +1,10 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/hooks/useResponsiveValue/index.ts
-import {useResponsiveValue} from "./useResponsiveValue.js";
+init_react_shim();
+import { useResponsiveValue } from "./useResponsiveValue.js";
 export {
   useResponsiveValue
 };

package/hooks/useResponsiveValue/useResponsiveValue.js

@@ -1,29 +1,39 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  useTheme
+} from "../../chunk-T7TBQTBE.js";
+import "../../chunk-LE44IRCL.js";
+import "../../chunk-CGEEKALF.js";
+import "../../chunk-J3Q2BPOW.js";
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/hooks/useResponsiveValue/useResponsiveValue.ts
-import {useCallback, useEffect, useState} from "react";
-import {useTheme} from "https://jspm.dev/@emotion/react@11.1.5";
-function useResponsiveValue(responsiveValue) {
+init_react_shim();
+import { useCallback, useEffect, useState } from "react";
+function useResponsiveValue(responsiveValue, watch = true) {
   const arrayValue = Array.isArray(responsiveValue) ? responsiveValue : [responsiveValue];
   const [value, setValue] = useState(arrayValue[0]);
-  const {breakpoints} = useTheme();
+  const { breakpoints } = useTheme();
   const setResponsiveValue = useCallback(() => {
     if (typeof window === "undefined") {
       return;
     }
     const windowWidth = window.innerWidth;
-    const breakpointIndex = breakpoints.findIndex((breakpoint) => parseInt(breakpoint, 10) > windowWidth);
+    const breakpointIndex = [...breakpoints, `${windowWidth + 1}px`].findIndex((breakpoint) => parseInt(breakpoint, 10) > windowWidth);
     const currentValue = arrayValue[Math.min(breakpointIndex < 0 ? breakpoints.length - 1 : breakpointIndex, arrayValue.length - 1)];
     setValue(currentValue);
   }, [...breakpoints, ...arrayValue]);
   useEffect(() => {
     setResponsiveValue();
+    if (!watch) {
+      return;
+    }
     window.addEventListener("resize", setResponsiveValue);
     return () => {
       window.removeEventListener("resize", setResponsiveValue);
     };
-  }, [setResponsiveValue]);
+  }, [setResponsiveValue, watch]);
   return value;
 }
 export {

package/hooks/useWindowResizeEvent/index.js

@@ -0,0 +1,10 @@
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/hooks/useWindowResizeEvent/index.ts
+init_react_shim();
+import { useWindowResizeEvent } from "./useWindowResizeEvent.js";
+export {
+  useWindowResizeEvent
+};

package/hooks/useWindowResizeEvent/useWindowResizeEvent.js

@@ -0,0 +1,27 @@
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
+
+// libs/shared/ui-system/src/hooks/useWindowResizeEvent/useWindowResizeEvent.ts
+init_react_shim();
+import { useEffect } from "react";
+var WINDOW_RESIZE_DEBOUNCE_WAIT = 300;
+function useWindowResizeEvent(eventListener) {
+  useEffect(() => {
+    if (typeof window === "undefined") {
+      return;
+    }
+    let debounceTimerId;
+    const handleResize = () => {
+      window.clearTimeout(debounceTimerId);
+      debounceTimerId = window.setTimeout(eventListener, WINDOW_RESIZE_DEBOUNCE_WAIT);
+    };
+    window.addEventListener("resize", handleResize);
+    return () => {
+      window.removeEventListener("resize", handleResize);
+    };
+  }, [eventListener]);
+}
+export {
+  useWindowResizeEvent
+};