@cybertools/grommet 0.0.0-stage → 1.0.0

package/dist/index.mjs

@@ -0,0 +1,12 @@
+import { Information, Warning } from "./Alert.mjs";
+import { useResponsive } from "./useResponsive.mjs";
+import { useIsLarge } from "./useIsLarge.mjs";
+import { BoxDirection } from "./BoxDirection.mjs";
+import { ContactUs } from "./ContactUs.mjs";
+import { ExternalLink } from "./ExternalLink.mjs";
+import { Image } from "./Image.mjs";
+import { Loader } from "./Loader.mjs";
+import { NotificationsProvider, useNotifications } from "./NotificationsProvider.mjs";
+import { Notification } from "./Notification.mjs";
+import { reportEvent, useTrackEvents } from "./useTrackEvents.mjs";
+export { BoxDirection, ContactUs, ExternalLink, Image, Information, Loader, Notification, NotificationsProvider, Warning, reportEvent, useIsLarge, useNotifications, useResponsive, useTrackEvents };

package/dist/interop.cjs

@@ -0,0 +1,9 @@
+//#region src/interop.ts
+/**
+* Node's native ESM loader hands CommonJS modules over as an exports object,
+* so a default import of a CJS package (styled-components, next/image, ...) can
+* be `{ default: value }` instead of `value`. Returns the original value.
+*/
+const unwrapCjsDefault = (value) => value !== null && typeof value === "object" && "default" in value ? value.default : value;
+//#endregion
+exports.unwrapCjsDefault = unwrapCjsDefault;

package/dist/interop.mjs

@@ -0,0 +1,9 @@
+//#region src/interop.ts
+/**
+* Node's native ESM loader hands CommonJS modules over as an exports object,
+* so a default import of a CJS package (styled-components, next/image, ...) can
+* be `{ default: value }` instead of `value`. Returns the original value.
+*/
+const unwrapCjsDefault = (value) => value !== null && typeof value === "object" && "default" in value ? value.default : value;
+//#endregion
+export { unwrapCjsDefault };

package/dist/testing.cjs

@@ -0,0 +1,3 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_MockNextRouterProvider = require("./MockNextRouterProvider.cjs");
+exports.MockNextRouterProvider = require_MockNextRouterProvider.MockNextRouterProvider;

package/dist/testing.d.cts

@@ -0,0 +1,2 @@
+import { MockNextRouterProvider } from "./MockNextRouterProvider.cjs";
+export { MockNextRouterProvider };

package/dist/testing.d.mts

@@ -0,0 +1,2 @@
+import { MockNextRouterProvider } from "./MockNextRouterProvider.mjs";
+export { MockNextRouterProvider };

package/dist/testing.mjs

@@ -0,0 +1,2 @@
+import { MockNextRouterProvider } from "./MockNextRouterProvider.mjs";
+export { MockNextRouterProvider };

package/dist/useIsLarge.cjs

@@ -0,0 +1,8 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_useResponsive = require("./useResponsive.cjs");
+//#region src/useIsLarge.ts
+function useIsLarge() {
+	return require_useResponsive.useResponsive() !== "small";
+}
+//#endregion
+exports.useIsLarge = useIsLarge;

package/dist/useIsLarge.d.cts

@@ -0,0 +1,3 @@
+//#region src/useIsLarge.d.ts
+export declare function useIsLarge(): boolean;
+//#endregion

package/dist/useIsLarge.d.mts

@@ -0,0 +1,3 @@
+//#region src/useIsLarge.d.ts
+export declare function useIsLarge(): boolean;
+//#endregion

package/dist/useIsLarge.mjs

@@ -0,0 +1,7 @@
+import { useResponsive } from "./useResponsive.mjs";
+//#region src/useIsLarge.ts
+function useIsLarge() {
+	return useResponsive() !== "small";
+}
+//#endregion
+export { useIsLarge };

package/dist/useResponsive.cjs

@@ -0,0 +1,9 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let react = require("react");
+let grommet = require("grommet");
+//#region src/useResponsive.ts
+function useResponsive() {
+	return (0, react.useContext)(grommet.ResponsiveContext);
+}
+//#endregion
+exports.useResponsive = useResponsive;

package/dist/useResponsive.d.cts

@@ -0,0 +1,3 @@
+//#region src/useResponsive.d.ts
+export declare function useResponsive(): string;
+//#endregion

package/dist/useResponsive.d.mts

@@ -0,0 +1,3 @@
+//#region src/useResponsive.d.ts
+export declare function useResponsive(): string;
+//#endregion

package/dist/useResponsive.mjs

@@ -0,0 +1,8 @@
+import { useContext } from "react";
+import { ResponsiveContext } from "grommet";
+//#region src/useResponsive.ts
+function useResponsive() {
+	return useContext(ResponsiveContext);
+}
+//#endregion
+export { useResponsive };

package/dist/useTrackEvents.cjs

@@ -0,0 +1,39 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_useIsLarge = require("./useIsLarge.cjs");
+let react = require("react");
+//#region src/useTrackEvents.ts
+function reportEvent(category, action, label, value = NaN, dimension = "", event = "gaCustomEvent") {
+	if (!window.dataLayer) return;
+	setTimeout(() => {
+		const eventData = {
+			event,
+			category,
+			action,
+			label,
+			...!isNaN(+value) && { value: +value },
+			dimension
+		};
+		window.dataLayer?.push(eventData);
+	}, 0);
+}
+function useTrackEvents() {
+	const largeRef = (0, react.useRef)(void 0);
+	largeRef.current = require_useIsLarge.useIsLarge();
+	(0, react.useEffect)(() => {
+		const click = (event) => {
+			if (!window.dataLayer) return;
+			const gaEl = event.target.closest("[data-ga]");
+			if (!gaEl) return;
+			const ga = gaEl.getAttribute("data-ga");
+			if (!ga) return;
+			const [eventCategory, eventAction, eventLabel, eventValue] = ga.split("::");
+			if (!eventCategory) return;
+			reportEvent(eventCategory, eventAction, eventLabel, eventValue, largeRef.current ? "large" : "small");
+		};
+		document.addEventListener("click", click);
+		return () => document.removeEventListener("click", click);
+	}, []);
+}
+//#endregion
+exports.reportEvent = reportEvent;
+exports.useTrackEvents = useTrackEvents;

package/dist/useTrackEvents.d.cts

@@ -0,0 +1,9 @@
+//#region src/useTrackEvents.d.ts
+declare global {
+  interface Window {
+    dataLayer?: Record<string, unknown>[];
+  }
+}
+export declare function reportEvent(category: string, action?: string, label?: string, value?: unknown, dimension?: string, event?: string): void;
+export declare function useTrackEvents(): void;
+//#endregion

package/dist/useTrackEvents.d.mts

@@ -0,0 +1,9 @@
+//#region src/useTrackEvents.d.ts
+declare global {
+  interface Window {
+    dataLayer?: Record<string, unknown>[];
+  }
+}
+export declare function reportEvent(category: string, action?: string, label?: string, value?: unknown, dimension?: string, event?: string): void;
+export declare function useTrackEvents(): void;
+//#endregion

package/dist/useTrackEvents.mjs

@@ -0,0 +1,37 @@
+import { useIsLarge } from "./useIsLarge.mjs";
+import { useEffect, useRef } from "react";
+//#region src/useTrackEvents.ts
+function reportEvent(category, action, label, value = NaN, dimension = "", event = "gaCustomEvent") {
+	if (!window.dataLayer) return;
+	setTimeout(() => {
+		const eventData = {
+			event,
+			category,
+			action,
+			label,
+			...!isNaN(+value) && { value: +value },
+			dimension
+		};
+		window.dataLayer?.push(eventData);
+	}, 0);
+}
+function useTrackEvents() {
+	const largeRef = useRef(void 0);
+	largeRef.current = useIsLarge();
+	useEffect(() => {
+		const click = (event) => {
+			if (!window.dataLayer) return;
+			const gaEl = event.target.closest("[data-ga]");
+			if (!gaEl) return;
+			const ga = gaEl.getAttribute("data-ga");
+			if (!ga) return;
+			const [eventCategory, eventAction, eventLabel, eventValue] = ga.split("::");
+			if (!eventCategory) return;
+			reportEvent(eventCategory, eventAction, eventLabel, eventValue, largeRef.current ? "large" : "small");
+		};
+		document.addEventListener("click", click);
+		return () => document.removeEventListener("click", click);
+	}, []);
+}
+//#endregion
+export { reportEvent, useTrackEvents };

package/package.json

@@ -1,6 +1,115 @@
 {
   "name": "@cybertools/grommet",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "1.0.0",
+  "description": "grommet + Next.js UI components, notifications and responsive/analytics hooks for Cyberscope apps.",
+  "license": "Apache-2.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/cyberscope-io/cybertools.git",
+    "directory": "packages/grommet"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "grommet": "^2.32.0",
+    "grommet-icons": "^4.11.0",
+    "next": ">=13.5.0 <17",
+    "react": "^18.2.0 || ^19.0.0",
+    "react-dom": "^18.2.0 || ^19.0.0",
+    "styled-components": "^5.3.11 || ^6.0.0"
+  },
+  "devDependencies": {
+    "@arethetypeswrong/cli": "^0.18.5",
+    "@cybertools/eslint-config": "0.0.0",
+    "@cybertools/tsconfig": "0.0.0",
+    "@testing-library/dom": "^10.4.2",
+    "@testing-library/react": "^16.3.3",
+    "@types/node": "^24.19.1",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "eslint": "^10.12.0",
+    "grommet": "^2.57.0",
+    "grommet-icons": "^4.14.0",
+    "jsdom": "^30.1.2",
+    "next": "^16.3.8",
+    "publint": "^0.3.25",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
+    "styled-components": "^6.5.3",
+    "tsdown": "0.23.0",
+    "typescript": "6.0.3",
+    "vite": "^8.3.2",
+    "vitest": "^5.0.3"
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.cts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    },
+    "./Alert": {
+      "import": "./dist/Alert.mjs",
+      "require": "./dist/Alert.cjs"
+    },
+    "./BoxDirection": {
+      "import": "./dist/BoxDirection.mjs",
+      "require": "./dist/BoxDirection.cjs"
+    },
+    "./ContactUs": {
+      "import": "./dist/ContactUs.mjs",
+      "require": "./dist/ContactUs.cjs"
+    },
+    "./ExternalLink": {
+      "import": "./dist/ExternalLink.mjs",
+      "require": "./dist/ExternalLink.cjs"
+    },
+    "./Image": {
+      "import": "./dist/Image.mjs",
+      "require": "./dist/Image.cjs"
+    },
+    "./Loader": {
+      "import": "./dist/Loader.mjs",
+      "require": "./dist/Loader.cjs"
+    },
+    "./Notification": {
+      "import": "./dist/Notification.mjs",
+      "require": "./dist/Notification.cjs"
+    },
+    "./NotificationsProvider": {
+      "import": "./dist/NotificationsProvider.mjs",
+      "require": "./dist/NotificationsProvider.cjs"
+    },
+    "./testing": {
+      "import": "./dist/testing.mjs",
+      "require": "./dist/testing.cjs"
+    },
+    "./useIsLarge": {
+      "import": "./dist/useIsLarge.mjs",
+      "require": "./dist/useIsLarge.cjs"
+    },
+    "./useResponsive": {
+      "import": "./dist/useResponsive.mjs",
+      "require": "./dist/useResponsive.cjs"
+    },
+    "./useTrackEvents": {
+      "import": "./dist/useTrackEvents.mjs",
+      "require": "./dist/useTrackEvents.cjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "scripts": {
+    "build": "tsdown",
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint .",
+    "check:package": "publint && attw --pack . --profile node16 && node scripts/check-native-esm.mjs",
+    "test": "vitest run"
+  }
 }