@gamepark/react-game 7.6.3 → 7.6.5

package/dist/components/GameProvider/GameErrorBoundary.js

@@ -20,124 +20,124 @@ export class GameErrorBoundary extends Component {
         return (_jsx("div", { css: containerCss, children: _jsxs("div", { css: cardCss, children: [_jsx("div", { css: iconContainerCss, children: _jsx(FontAwesomeIcon, { icon: faTriangleExclamation, css: iconCss }) }), _jsx("p", { css: messageCss, children: _jsx(Trans, { defaults: "A technical error has occurred. The error has been sent to the Game Park team.", i18nKey: "error.crash", ns: "common" }) }), _jsx("p", { css: hintCss, children: _jsx(Trans, { defaults: "You can refresh the page to continue your game.", i18nKey: "error.refresh.hint", ns: "common" }) }), _jsx("button", { css: buttonCss, onClick: () => window.location.reload(), children: _jsx(Trans, { defaults: "Refresh the page", i18nKey: "error.refresh.button", ns: "common" }) }), _jsx("div", { css: dividerCss }), _jsx("p", { css: secondaryMessageCss, children: _jsx(Trans, { defaults: "If the problem persists despite refreshing and the game is corrupted, please let us know on Discord.", i18nKey: "error.discord.hint", ns: "common" }) }), _jsxs("a", { css: discordLinkCss, href: "https://discord.gg/ZMCX5reQm8", target: "_blank", rel: "noopener noreferrer", children: [_jsx("svg", { css: discordIconCss, viewBox: "0 0 127.14 96.36", fill: "currentColor", children: _jsx("path", { d: "M107.7 8.07A105.15 105.15 0 0 0 81.47 0a72.06 72.06 0 0 0-3.36 6.83 97.68 97.68 0 0 0-29.11 0A72.37 72.37 0 0 0 45.64 0a105.89 105.89 0 0 0-26.25 8.09C2.79 32.65-1.71 56.6.54 80.21a105.73 105.73 0 0 0 32.17 16.15 77.7 77.7 0 0 0 6.89-11.11 68.42 68.42 0 0 1-10.85-5.18c.91-.66 1.8-1.34 2.66-2.04a75.57 75.57 0 0 0 64.32 0c.87.71 1.76 1.39 2.66 2.04a68.68 68.68 0 0 1-10.87 5.19 77.28 77.28 0 0 0 6.89 11.1 105.45 105.45 0 0 0 32.19-16.14c2.64-27.38-4.51-51.11-18.9-72.15ZM42.45 65.69C36.18 65.69 31 60 31 53.05c0-6.94 5.04-12.67 11.45-12.67S53.99 46.1 53.9 53.05c0 6.94-5.08 12.64-11.45 12.64Zm42.24 0C78.41 65.69 73.25 60 73.25 53.05c0-6.94 5.04-12.67 11.44-12.67s11.51 5.73 11.44 12.67c0 6.94-5.04 12.64-11.44 12.64Z" }) }), _jsx(Trans, { defaults: "Join the Game Park Discord", i18nKey: "error.discord.button", ns: "common" })] })] }) }));
     }
 }
-const fadeIn = keyframes `
-  from {
-    opacity: 0;
-    transform: translateY(16px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
+const fadeIn = keyframes `
+  from {
+    opacity: 0;
+    transform: translateY(16px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
 `;
-const containerCss = css `
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-  width: 100%;
-  padding: 2em;
-  box-sizing: border-box;
-  font-family: "Mulish", sans-serif;
+const containerCss = css `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+  padding: 2em;
+  box-sizing: border-box;
+  font-family: "Mulish", sans-serif;
 `;
-const cardCss = css `
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  max-width: 460px;
-  padding: 2.5em 2.5em 2em;
-  border-radius: 1.2em;
-  background: #002448;
-  color: #eee;
-  text-align: center;
-  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
-  animation: ${fadeIn} 0.4s ease-out;
+const cardCss = css `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  max-width: 460px;
+  padding: 2.5em 2.5em 2em;
+  border-radius: 1.2em;
+  background: #002448;
+  color: #eee;
+  text-align: center;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
+  animation: ${fadeIn} 0.4s ease-out;
 `;
-const iconContainerCss = css `
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 64px;
-  height: 64px;
-  border-radius: 50%;
-  background: rgba(40, 184, 206, 0.15);
-  margin-bottom: 1.2em;
+const iconContainerCss = css `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 64px;
+  height: 64px;
+  border-radius: 50%;
+  background: rgba(40, 184, 206, 0.15);
+  margin-bottom: 1.2em;
 `;
-const iconCss = css `
-  font-size: 32px;
-  color: #28B8CE;
+const iconCss = css `
+  font-size: 32px;
+  color: #28B8CE;
 `;
-const messageCss = css `
-  font-size: 1.05em;
-  font-weight: 600;
-  line-height: 1.5;
-  margin: 0 0 0.3em;
+const messageCss = css `
+  font-size: 1.05em;
+  font-weight: 600;
+  line-height: 1.5;
+  margin: 0 0 0.3em;
 `;
-const hintCss = css `
-  font-size: 0.95em;
-  line-height: 1.5;
-  margin: 0;
-  opacity: 0.8;
+const hintCss = css `
+  font-size: 0.95em;
+  line-height: 1.5;
+  margin: 0;
+  opacity: 0.8;
 `;
-const buttonCss = css `
-  margin-top: 1.5em;
-  padding: 0.65em 2.2em;
-  font-size: 1em;
-  font-family: inherit;
-  font-weight: 700;
-  border: none;
-  border-radius: 0.6em;
-  background: #28B8CE;
-  color: white;
-  cursor: pointer;
-  transition: background 0.2s, transform 0.1s;
-  letter-spacing: 0.02em;
-
-  &:hover {
-    background: #24a5b9;
-  }
-
-  &:active {
-    background: #2092a3;
-    transform: scale(0.97);
-  }
+const buttonCss = css `
+  margin-top: 1.5em;
+  padding: 0.65em 2.2em;
+  font-size: 1em;
+  font-family: inherit;
+  font-weight: 700;
+  border: none;
+  border-radius: 0.6em;
+  background: #28B8CE;
+  color: white;
+  cursor: pointer;
+  transition: background 0.2s, transform 0.1s;
+  letter-spacing: 0.02em;
+
+  &:hover {
+    background: #24a5b9;
+  }
+
+  &:active {
+    background: #2092a3;
+    transform: scale(0.97);
+  }
 `;
-const dividerCss = css `
-  width: 60%;
-  height: 1px;
-  background: rgba(255, 255, 255, 0.12);
-  margin: 1.8em 0 1.2em;
+const dividerCss = css `
+  width: 60%;
+  height: 1px;
+  background: rgba(255, 255, 255, 0.12);
+  margin: 1.8em 0 1.2em;
 `;
-const secondaryMessageCss = css `
-  font-size: 0.85em;
-  line-height: 1.6;
-  margin: 0 0 1em;
-  opacity: 0.65;
+const secondaryMessageCss = css `
+  font-size: 0.85em;
+  line-height: 1.6;
+  margin: 0 0 1em;
+  opacity: 0.65;
 `;
-const discordLinkCss = css `
-  display: inline-flex;
-  align-items: center;
-  gap: 0.5em;
-  padding: 0.5em 1.4em;
-  font-size: 0.9em;
-  font-family: inherit;
-  font-weight: 600;
-  color: white;
-  background: #5865F2;
-  border-radius: 0.5em;
-  text-decoration: none;
-  transition: background 0.2s, transform 0.1s;
-
-  &:hover {
-    background: #4752C4;
-  }
-
-  &:active {
-    transform: scale(0.97);
-  }
+const discordLinkCss = css `
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5em;
+  padding: 0.5em 1.4em;
+  font-size: 0.9em;
+  font-family: inherit;
+  font-weight: 600;
+  color: white;
+  background: #5865F2;
+  border-radius: 0.5em;
+  text-decoration: none;
+  transition: background 0.2s, transform 0.1s;
+
+  &:hover {
+    background: #4752C4;
+  }
+
+  &:active {
+    transform: scale(0.97);
+  }
 `;
-const discordIconCss = css `
-  width: 20px;
-  height: 20px;
+const discordIconCss = css `
+  width: 20px;
+  height: 20px;
 `;
 //# sourceMappingURL=GameErrorBoundary.js.map

package/dist/components/JournalTabs/History/SetupLogItem.js

@@ -3,24 +3,24 @@ import { css } from '@emotion/react';
 export const SetupLogItem = ({ log, game, index, customEntryCss, ...rest }) => {
     return (_jsx("div", { ...rest, children: _jsx("div", { css: [entryCss, customEntryCss, log.css], children: _jsx("div", { children: _jsx(log.Component, { game: game, index: index }) }) }) }));
 };
-const entryCss = css `
-  width: 100%;
-  background-color: rgba(0, 0, 0, 0.7);
-  border-radius: 1em;
-  margin-bottom: 0.5em;
-  min-height: 1em;
-  padding-left: 1em;
-  margin-left: 0.05em;
-  margin-top: 0.05em;
-  padding-top: 0.5em;
-  padding-bottom: 0.5em;
-  display: flex;
-  align-items: center;
-  font-size: 2em;
-  white-space: pre-wrap;
-
-  img, picture {
-    vertical-align: middle;
-  }
+const entryCss = css `
+  width: 100%;
+  background-color: rgba(0, 0, 0, 0.7);
+  border-radius: 1em;
+  margin-bottom: 0.5em;
+  min-height: 1em;
+  padding-left: 1em;
+  margin-left: 0.05em;
+  margin-top: 0.05em;
+  padding-top: 0.5em;
+  padding-bottom: 0.5em;
+  display: flex;
+  align-items: center;
+  font-size: 2em;
+  white-space: pre-wrap;
+
+  img, picture {
+    vertical-align: middle;
+  }
 `;
 //# sourceMappingURL=SetupLogItem.js.map

package/dist/components/material/GameTable/DevToolsHub.d.ts

@@ -1,14 +1,31 @@
-/** @jsxImportSource @emotion/react */
-import { FC, PropsWithChildren } from 'react';
-export { DevToolEntry } from './DevToolEntry';
-export { devToolBtnCss, devToolIconCss, devToolLabelCss, devToolDescCss } from './DevToolsStyles';
+import { FC, PropsWithChildren, ReactNode } from 'react';
 export type GameOption = {
     key: string;
     label: string;
     type: 'boolean';
 };
+/**
+ * A single entry in the DevToolsHub panel.
+ * Use this instead of raw `<button>` when adding custom tools via `children`.
+ *
+ * @example
+ * <DevToolsHub>
+ *   <DevToolEntry icon="✦" label="Card Viewer" desc="Browse agents" onClick={() => setShowCards(true)} />
+ * </DevToolsHub>
+ */
+export declare const DevToolEntry: FC<{
+    icon: ReactNode;
+    label: string;
+    desc?: string;
+    onClick?: () => void;
+}>;
 type DevToolsHubProps = PropsWithChildren<{
     fabBottom?: string;
     gameOptions?: GameOption[];
 }>;
 export declare const DevToolsHub: FC<DevToolsHubProps>;
+export declare const devToolBtnCss: import("@emotion/utils").SerializedStyles;
+export declare const devToolIconCss: import("@emotion/utils").SerializedStyles;
+export declare const devToolLabelCss: import("@emotion/utils").SerializedStyles;
+export declare const devToolDescCss: import("@emotion/utils").SerializedStyles;
+export {};