@stoked-ui/github 0.1.0-alpha.11.3 → 0.1.0-alpha.13.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/GithubCalendar/GithubCalendar.js +40 -4
  2. package/modern/GithubCalendar/GithubCalendar.js +40 -4
  3. package/node/GithubCalendar/GithubCalendar.js +40 -3
  4. package/package.json +2 -2
package/GithubCalendar/GithubCalendar.js CHANGED
@@ -3,9 +3,45 @@ import * as React from 'react';
3
3
  import { Box } from "@mui/material";
4
4
  import { ActivityCalendar } from "react-activity-calendar";
5
5
  import { useTheme } from '@mui/material/styles';
6
- import { useResize } from '@stoked-ui/common';
7
- import { useResizeWindow } from '@stoked-ui/common';
8
6
  import { jsx as _jsx } from "react/jsx-runtime";
7
+ function useWindowSize() {
8
+ const [size, setSize] = React.useState(() => {
9
+ if (typeof window === 'undefined') {
10
+ return [0, 0];
11
+ }
12
+ return [window.innerWidth, window.innerHeight];
13
+ });
14
+ React.useEffect(() => {
15
+ if (typeof window === 'undefined') {
16
+ return undefined;
17
+ }
18
+ const handleResize = () => {
19
+ setSize([window.innerWidth, window.innerHeight]);
20
+ };
21
+ window.addEventListener('resize', handleResize);
22
+ handleResize();
23
+ return () => window.removeEventListener('resize', handleResize);
24
+ }, []);
25
+ return size;
26
+ }
27
+ function useElementSize(elementRef) {
28
+ const [size, setSize] = React.useState({
29
+ width: undefined,
30
+ height: undefined
31
+ });
32
+ React.useEffect(() => {
33
+ const handleResize = () => {
34
+ setSize({
35
+ width: elementRef.current ? elementRef.current.offsetWidth : undefined,
36
+ height: elementRef.current ? elementRef.current.offsetHeight : undefined
37
+ });
38
+ };
39
+ handleResize();
40
+ window.addEventListener('resize', handleResize);
41
+ return () => window.removeEventListener('resize', handleResize);
42
+ }, [elementRef]);
43
+ return size;
44
+ }
9
45
  function formatActivityDate(date) {
10
46
  const year = date.getFullYear();
11
47
  const month = String(date.getMonth() + 1).padStart(2, '0');
@@ -70,8 +106,8 @@ export default function GithubCalendar({
70
106
  const [labelsTimer, setLabelsTimer] = React.useState(null);
71
107
  const theme = useTheme();
72
108
  const elementRef = React.useRef(null);
73
- const [windowWidth, _] = useResizeWindow();
74
- const elemSize = useResize(elementRef);
109
+ const [windowWidth] = useWindowSize();
110
+ const elemSize = useElementSize(elementRef);
75
111
  React.useEffect(() => {
76
112
  if (inputBlockSize) {
77
113
  return;
package/modern/GithubCalendar/GithubCalendar.js CHANGED
@@ -3,9 +3,45 @@ import * as React from 'react';
3
3
  import { Box } from "@mui/material";
4
4
  import { ActivityCalendar } from "react-activity-calendar";
5
5
  import { useTheme } from '@mui/material/styles';
6
- import { useResize } from '@stoked-ui/common';
7
- import { useResizeWindow } from '@stoked-ui/common';
8
6
  import { jsx as _jsx } from "react/jsx-runtime";
7
+ function useWindowSize() {
8
+ const [size, setSize] = React.useState(() => {
9
+ if (typeof window === 'undefined') {
10
+ return [0, 0];
11
+ }
12
+ return [window.innerWidth, window.innerHeight];
13
+ });
14
+ React.useEffect(() => {
15
+ if (typeof window === 'undefined') {
16
+ return undefined;
17
+ }
18
+ const handleResize = () => {
19
+ setSize([window.innerWidth, window.innerHeight]);
20
+ };
21
+ window.addEventListener('resize', handleResize);
22
+ handleResize();
23
+ return () => window.removeEventListener('resize', handleResize);
24
+ }, []);
25
+ return size;
26
+ }
27
+ function useElementSize(elementRef) {
28
+ const [size, setSize] = React.useState({
29
+ width: undefined,
30
+ height: undefined
31
+ });
32
+ React.useEffect(() => {
33
+ const handleResize = () => {
34
+ setSize({
35
+ width: elementRef.current ? elementRef.current.offsetWidth : undefined,
36
+ height: elementRef.current ? elementRef.current.offsetHeight : undefined
37
+ });
38
+ };
39
+ handleResize();
40
+ window.addEventListener('resize', handleResize);
41
+ return () => window.removeEventListener('resize', handleResize);
42
+ }, [elementRef]);
43
+ return size;
44
+ }
9
45
  function formatActivityDate(date) {
10
46
  const year = date.getFullYear();
11
47
  const month = String(date.getMonth() + 1).padStart(2, '0');
@@ -70,8 +106,8 @@ export default function GithubCalendar({
70
106
  const [labelsTimer, setLabelsTimer] = React.useState(null);
71
107
  const theme = useTheme();
72
108
  const elementRef = React.useRef(null);
73
- const [windowWidth, _] = useResizeWindow();
74
- const elemSize = useResize(elementRef);
109
+ const [windowWidth] = useWindowSize();
110
+ const elemSize = useElementSize(elementRef);
75
111
  React.useEffect(() => {
76
112
  if (inputBlockSize) {
77
113
  return;
package/node/GithubCalendar/GithubCalendar.js CHANGED
@@ -10,9 +10,46 @@ var React = _interopRequireWildcard(require("react"));
10
10
  var _material = require("@mui/material");
11
11
  var _reactActivityCalendar = require("react-activity-calendar");
12
12
  var _styles = require("@mui/material/styles");
13
- var _common = require("@stoked-ui/common");
14
13
  var _jsxRuntime = require("react/jsx-runtime");
15
14
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
15
+ function useWindowSize() {
16
+ const [size, setSize] = React.useState(() => {
17
+ if (typeof window === 'undefined') {
18
+ return [0, 0];
19
+ }
20
+ return [window.innerWidth, window.innerHeight];
21
+ });
22
+ React.useEffect(() => {
23
+ if (typeof window === 'undefined') {
24
+ return undefined;
25
+ }
26
+ const handleResize = () => {
27
+ setSize([window.innerWidth, window.innerHeight]);
28
+ };
29
+ window.addEventListener('resize', handleResize);
30
+ handleResize();
31
+ return () => window.removeEventListener('resize', handleResize);
32
+ }, []);
33
+ return size;
34
+ }
35
+ function useElementSize(elementRef) {
36
+ const [size, setSize] = React.useState({
37
+ width: undefined,
38
+ height: undefined
39
+ });
40
+ React.useEffect(() => {
41
+ const handleResize = () => {
42
+ setSize({
43
+ width: elementRef.current ? elementRef.current.offsetWidth : undefined,
44
+ height: elementRef.current ? elementRef.current.offsetHeight : undefined
45
+ });
46
+ };
47
+ handleResize();
48
+ window.addEventListener('resize', handleResize);
49
+ return () => window.removeEventListener('resize', handleResize);
50
+ }, [elementRef]);
51
+ return size;
52
+ }
16
53
  function formatActivityDate(date) {
17
54
  const year = date.getFullYear();
18
55
  const month = String(date.getMonth() + 1).padStart(2, '0');
@@ -77,8 +114,8 @@ function GithubCalendar({
77
114
  const [labelsTimer, setLabelsTimer] = React.useState(null);
78
115
  const theme = (0, _styles.useTheme)();
79
116
  const elementRef = React.useRef(null);
80
- const [windowWidth, _] = (0, _common.useResizeWindow)();
81
- const elemSize = (0, _common.useResize)(elementRef);
117
+ const [windowWidth] = useWindowSize();
118
+ const elemSize = useElementSize(elementRef);
82
119
  React.useEffect(() => {
83
120
  if (inputBlockSize) {
84
121
  return;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stoked-ui/github",
3
- "version": "0.1.0-alpha.11.3",
3
+ "version": "0.1.0-alpha.13.1",
4
4
  "description": "Github components for Stoked UI",
5
5
  "author": "Brian Stoker",
6
6
  "main": "./node/index.js",
@@ -65,4 +65,4 @@
65
65
  "private": false,
66
66
  "module": "./index.js",
67
67
  "types": "./index.d.ts"
68
- }
68
+ }