@digigov/ui 1.0.2 → 1.1.1

package/src/utils/hooks/useScreen.ts

@@ -0,0 +1,46 @@
+import { useEffect, useState } from "react";
+import breakpoints from '@digigov/css/screens.json'
+export type Breakpoints = 'xs' |'sm' |'md' | 'lg' | 'xl';
+export const breakpointKeys: Breakpoints[] = Object.keys(breakpoints) as Breakpoints[];
+export const breakpointValues = Object.values(breakpoints) as number[];;
+
+function resolveScreenSize(width: number): Breakpoints  {
+  let breakpointIndex = 0
+  for(const breakpoint of breakpointValues) {
+    if(width > breakpoint && width < breakpointValues[breakpointIndex + 1]) {
+      return breakpointKeys[breakpointIndex]
+    }
+    breakpointIndex++
+  }
+  return 'xl'
+}
+
+const listeners = new Set<Function>()
+let resizeObserver: ResizeObserver | null = null
+function createResizeObserver() {
+  if (resizeObserver === null) {
+    resizeObserver = new ResizeObserver(([body]) => {
+      listeners.forEach((listener) => {
+        listener(body.contentRect.width)
+      })
+    })
+    console.log('createResizeObserver')
+    resizeObserver.observe(document.body);
+  }
+  return listeners
+
+}
+export const useScreenSize = () => {
+  const [screenSize, setSize] = useState<Breakpoints>(resolveScreenSize(document.body.clientWidth))
+  useEffect(()=>{
+    const listeners = createResizeObserver()
+    const listener = (width: number) => {
+      setSize(resolveScreenSize(width))
+    }
+    listeners.add(listener)
+    return ()=>{
+      listeners.delete(listener)
+    }
+  },[])
+  return {screenSize, screenWidth: document.body.clientWidth}
+}

package/typography/Code/index.d.ts

@@ -0,0 +1,3 @@
+export * from '@digigov/react-core/Code';
+import Code from '@digigov/react-core/Code';
+export default Code;

package/typography/Code/index.js

@@ -0,0 +1,3 @@
+export * from '@digigov/react-core/Code';
+import Code from '@digigov/react-core/Code';
+export default Code;

package/typography/Code/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../cjs/typography/Code/index.js"
+}

package/typography/CodeBlock/index.d.ts

@@ -0,0 +1,3 @@
+export * from '@digigov/react-core/CodeBlock';
+import CodeBlock from '@digigov/react-core/CodeBlock';
+export default CodeBlock;

package/typography/CodeBlock/index.js

@@ -0,0 +1,3 @@
+export * from '@digigov/react-core/CodeBlock';
+import CodeBlock from '@digigov/react-core/CodeBlock';
+export default CodeBlock;

package/typography/CodeBlock/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../cjs/typography/CodeBlock/index.js"
+}

package/typography/Heading/Heading.stories.d.ts

@@ -1,8 +1,8 @@
 declare namespace _default {
-    export const title: string;
+    export let title: string;
     export { Heading as component };
-    export const displayName: string;
+    export let displayName: string;
 }
 export default _default;
 export * from "@digigov/ui/typography/Heading/__stories__/Default";
-import Heading from "@digigov/ui/typography/Heading";
+import Heading from '@digigov/ui/typography/Heading';

package/typography/HeadingCaption/HeadingCaption.stories.d.ts

@@ -1,9 +1,9 @@
 declare namespace _default {
-    export const title: string;
+    export let title: string;
     export { HeadingCaption as component };
-    export const displayName: string;
+    export let displayName: string;
 }
 export default _default;
 export * from "@digigov/ui/typography/HeadingCaption/__stories__/Default";
 export * from "@digigov/ui/typography/HeadingCaption/__stories__/NestedToTitle";
-import HeadingCaption from "@digigov/ui/typography/HeadingCaption";
+import HeadingCaption from '@digigov/ui/typography/HeadingCaption';

package/typography/Hint/Hint.stories.d.ts

@@ -1,9 +1,9 @@
 declare namespace _default {
-    export const title: string;
+    export let title: string;
     export { Hint as component };
-    export const displayName: string;
+    export let displayName: string;
 }
 export default _default;
 export * from "@digigov/ui/typography/Hint/__stories__/Default";
 export * from "@digigov/ui/typography/Hint/__stories__/FontSizes";
-import Hint from "@digigov/ui/typography/Hint";
+import Hint from '@digigov/ui/typography/Hint';

package/typography/NormalText/NormalText.stories.d.ts

@@ -1,11 +1,11 @@
 declare namespace _default {
-    export const title: string;
+    export let title: string;
     export { NormalText as component };
-    export const displayName: string;
+    export let displayName: string;
 }
 export default _default;
 export * from "@digigov/ui/typography/NormalText/__stories__/Default";
 export * from "@digigov/ui/typography/NormalText/__stories__/FontSizes";
 export * from "@digigov/ui/typography/NormalText/__stories__/FontWeight";
 export * from "@digigov/ui/typography/NormalText/__stories__/Variants";
-import NormalText from "@digigov/ui/typography/NormalText";
+import NormalText from '@digigov/ui/typography/NormalText';

package/typography/Paragraph/Paragraph.stories.d.ts

@@ -1,7 +1,7 @@
 declare namespace _default {
-    export const title: string;
+    export let title: string;
     export { Paragraph as component };
-    export const displayName: string;
+    export let displayName: string;
 }
 export default _default;
 export * from "@digigov/ui/typography/Paragraph/__stories__/Default";
@@ -9,4 +9,4 @@ export * from "@digigov/ui/typography/Paragraph/__stories__/LeadVariant";
 export * from "@digigov/ui/typography/Paragraph/__stories__/SmallVariant";
 export * from "@digigov/ui/typography/Paragraph/__stories__/FontSizes";
 export * from "@digigov/ui/typography/Paragraph/__stories__/FontWeight";
-import Paragraph from "@digigov/ui/typography/Paragraph";
+import Paragraph from '@digigov/ui/typography/Paragraph';

package/utils/VisuallyHidden/VisuallyHidden.stories.d.ts

@@ -1,8 +1,8 @@
 declare namespace _default {
-    export const title: string;
+    export let title: string;
     export { VisuallyHidden as component };
-    export const displayName: string;
+    export let displayName: string;
 }
 export default _default;
 export * from "@digigov/ui/utils/VisuallyHidden/__stories__/Default";
-import VisuallyHidden from "@digigov/ui/utils/VisuallyHidden";
+import VisuallyHidden from '@digigov/ui/utils/VisuallyHidden';

package/utils/hooks/useScreen/index.js

@@ -0,0 +1,53 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { useEffect, useState } from "react";
+import breakpoints from '@digigov/css/screens.json';
+export var breakpointKeys = Object.keys(breakpoints);
+export var breakpointValues = Object.values(breakpoints);
+;
+function resolveScreenSize(width) {
+  var breakpointIndex = 0;
+  for (var _i = 0, _breakpointValues = breakpointValues; _i < _breakpointValues.length; _i++) {
+    var breakpoint = _breakpointValues[_i];
+    if (width > breakpoint && width < breakpointValues[breakpointIndex + 1]) {
+      return breakpointKeys[breakpointIndex];
+    }
+    breakpointIndex++;
+  }
+  return 'xl';
+}
+var listeners = new Set();
+var resizeObserver = null;
+function createResizeObserver() {
+  if (resizeObserver === null) {
+    resizeObserver = new ResizeObserver(function (_ref) {
+      var _ref2 = _slicedToArray(_ref, 1),
+        body = _ref2[0];
+      listeners.forEach(function (listener) {
+        listener(body.contentRect.width);
+      });
+    });
+    console.log('createResizeObserver');
+    resizeObserver.observe(document.body);
+  }
+  return listeners;
+}
+export var useScreenSize = function useScreenSize() {
+  var _useState = useState(resolveScreenSize(document.body.clientWidth)),
+    _useState2 = _slicedToArray(_useState, 2),
+    screenSize = _useState2[0],
+    setSize = _useState2[1];
+  useEffect(function () {
+    var listeners = createResizeObserver();
+    var listener = function listener(width) {
+      setSize(resolveScreenSize(width));
+    };
+    listeners.add(listener);
+    return function () {
+      listeners["delete"](listener);
+    };
+  }, []);
+  return {
+    screenSize: screenSize,
+    screenWidth: document.body.clientWidth
+  };
+};

package/utils/hooks/useScreen/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../../cjs/utils/hooks/useScreen/index.js"
+}

package/utils/hooks/useScreen.d.ts

@@ -0,0 +1,7 @@
+export type Breakpoints = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export declare const breakpointKeys: Breakpoints[];
+export declare const breakpointValues: number[];
+export declare const useScreenSize: () => {
+    screenSize: Breakpoints;
+    screenWidth: number;
+};

package/utils/withDeprecation/index.js

@@ -1,19 +1,18 @@
 import _createClass from "@babel/runtime/helpers/createClass";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
 import _wrapNativeSuper from "@babel/runtime/helpers/wrapNativeSuper";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
 var DigigovError = /*#__PURE__*/function (_Error) {
   _inherits(DigigovError, _Error);
-  var _super = _createSuper(DigigovError);
   function DigigovError(message) {
     var _this;
     _classCallCheck(this, DigigovError);
-    _this = _super.call(this, message); // (1)
+    _this = _callSuper(this, DigigovError, [message]); // (1)
     _this.name = 'DigigovError'; // (2)
     return _this;
   }