@xyo-network/react-card 2.64.0-rc.7 → 2.64.1
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/browser/components/CardContentEx.cjs +56 -0
- package/dist/{node/components/CardContentEx.mjs.map → browser/components/CardContentEx.cjs.map} +1 -1
- package/dist/browser/components/CardContentEx.d.cts +11 -0
- package/dist/browser/components/CardContentEx.d.cts.map +1 -0
- package/dist/browser/components/CardContentEx.js +5 -4
- package/dist/browser/components/CardContentEx.js.map +1 -1
- package/dist/browser/components/CardEx.cjs +48 -0
- package/dist/{node/components/CardEx.mjs.map → browser/components/CardEx.cjs.map} +1 -1
- package/dist/browser/components/CardEx.d.cts +8 -0
- package/dist/browser/components/CardEx.d.cts.map +1 -0
- package/dist/browser/components/CardEx.js +4 -3
- package/dist/browser/components/CardEx.js.map +1 -1
- package/dist/browser/components/FullWidthCard/FullWidthCard.cjs +93 -0
- package/dist/{node/components/FullWidthCard/FullWidthCard.mjs.map → browser/components/FullWidthCard/FullWidthCard.cjs.map} +1 -1
- package/dist/browser/components/FullWidthCard/FullWidthCard.d.cts +15 -0
- package/dist/browser/components/FullWidthCard/FullWidthCard.d.cts.map +1 -0
- package/dist/browser/components/FullWidthCard/FullWidthCard.js +3 -2
- package/dist/browser/components/FullWidthCard/FullWidthCard.js.map +1 -1
- package/dist/browser/components/FullWidthCard/index.cjs +95 -0
- package/dist/browser/components/FullWidthCard/index.cjs.map +1 -0
- package/dist/browser/components/FullWidthCard/index.d.cts +2 -0
- package/dist/browser/components/FullWidthCard/index.d.cts.map +1 -0
- package/dist/browser/components/FullWidthCard/index.js +71 -1
- package/dist/browser/components/FullWidthCard/index.js.map +1 -1
- package/dist/browser/components/PageCard.cjs +71 -0
- package/dist/browser/components/PageCard.cjs.map +1 -0
- package/dist/browser/components/PageCard.d.cts +10 -0
- package/dist/browser/components/PageCard.d.cts.map +1 -0
- package/dist/browser/components/PageCard.js +33 -8
- package/dist/browser/components/PageCard.js.map +1 -1
- package/dist/browser/components/SimpleCard/SimpleCard.cjs +120 -0
- package/dist/browser/components/SimpleCard/SimpleCard.cjs.map +1 -0
- package/dist/browser/components/SimpleCard/SimpleCard.d.cts +16 -0
- package/dist/browser/components/SimpleCard/SimpleCard.d.cts.map +1 -0
- package/dist/browser/components/SimpleCard/SimpleCard.js +36 -11
- package/dist/browser/components/SimpleCard/SimpleCard.js.map +1 -1
- package/dist/browser/components/SimpleCard/index.cjs +122 -0
- package/dist/browser/components/SimpleCard/index.cjs.map +1 -0
- package/dist/browser/components/SimpleCard/index.d.cts +2 -0
- package/dist/browser/components/SimpleCard/index.d.cts.map +1 -0
- package/dist/browser/components/SimpleCard/index.js +98 -1
- package/dist/browser/components/SimpleCard/index.js.map +1 -1
- package/dist/browser/components/SimpleCardGrid/SimpleCardGrid.cjs +129 -0
- package/dist/browser/components/SimpleCardGrid/SimpleCardGrid.cjs.map +1 -0
- package/dist/browser/components/SimpleCardGrid/SimpleCardGrid.d.cts +8 -0
- package/dist/browser/components/SimpleCardGrid/SimpleCardGrid.d.cts.map +1 -0
- package/dist/browser/components/SimpleCardGrid/SimpleCardGrid.js +102 -4
- package/dist/browser/components/SimpleCardGrid/SimpleCardGrid.js.map +1 -1
- package/dist/browser/components/SimpleCardGrid/index.cjs +131 -0
- package/dist/browser/components/SimpleCardGrid/index.cjs.map +1 -0
- package/dist/browser/components/SimpleCardGrid/index.d.cts +2 -0
- package/dist/browser/components/SimpleCardGrid/index.d.cts.map +1 -0
- package/dist/browser/components/SimpleCardGrid/index.js +107 -1
- package/dist/browser/components/SimpleCardGrid/index.js.map +1 -1
- package/dist/browser/components/index.cjs +248 -0
- package/dist/browser/components/index.cjs.map +1 -0
- package/dist/browser/components/index.d.cts +6 -0
- package/dist/browser/components/index.d.cts.map +1 -0
- package/dist/browser/components/index.js +224 -5
- package/dist/browser/components/index.js.map +1 -1
- package/dist/browser/index.cjs +248 -0
- package/dist/browser/index.cjs.map +1 -0
- package/dist/browser/index.d.cts +2 -0
- package/dist/browser/index.d.cts.map +1 -0
- package/dist/browser/index.js +224 -1
- package/dist/browser/index.js.map +1 -1
- package/dist/browser/types/images.d.cjs +2 -0
- package/dist/docs.json +1998 -0
- package/dist/node/components/CardContentEx.cjs +62 -0
- package/dist/node/components/CardContentEx.cjs.map +1 -0
- package/dist/node/components/CardContentEx.d.cts +11 -0
- package/dist/node/components/CardContentEx.d.cts.map +1 -0
- package/dist/node/components/CardContentEx.js +15 -38
- package/dist/node/components/CardContentEx.js.map +1 -1
- package/dist/node/components/CardEx.cjs +53 -0
- package/dist/node/components/CardEx.cjs.map +1 -0
- package/dist/node/components/CardEx.d.cts +8 -0
- package/dist/node/components/CardEx.d.cts.map +1 -0
- package/dist/node/components/CardEx.js +12 -36
- package/dist/node/components/CardEx.js.map +1 -1
- package/dist/node/components/FullWidthCard/FullWidthCard.cjs +97 -0
- package/dist/node/components/FullWidthCard/FullWidthCard.cjs.map +1 -0
- package/dist/node/components/FullWidthCard/FullWidthCard.d.cts +15 -0
- package/dist/node/components/FullWidthCard/FullWidthCard.d.cts.map +1 -0
- package/dist/node/components/FullWidthCard/FullWidthCard.js +28 -51
- package/dist/node/components/FullWidthCard/FullWidthCard.js.map +1 -1
- package/dist/node/components/FullWidthCard/index.cjs +99 -0
- package/dist/node/components/FullWidthCard/index.cjs.map +1 -0
- package/dist/node/components/FullWidthCard/index.d.cts +2 -0
- package/dist/node/components/FullWidthCard/index.d.cts.map +1 -0
- package/dist/node/components/FullWidthCard/index.js +70 -21
- package/dist/node/components/FullWidthCard/index.js.map +1 -1
- package/dist/node/components/PageCard.cjs +75 -0
- package/dist/node/components/PageCard.cjs.map +1 -0
- package/dist/node/components/PageCard.d.cts +10 -0
- package/dist/node/components/PageCard.d.cts.map +1 -0
- package/dist/node/components/PageCard.js +40 -39
- package/dist/node/components/PageCard.js.map +1 -1
- package/dist/node/components/SimpleCard/SimpleCard.cjs +124 -0
- package/dist/node/components/SimpleCard/SimpleCard.cjs.map +1 -0
- package/dist/node/components/SimpleCard/SimpleCard.d.cts +16 -0
- package/dist/node/components/SimpleCard/SimpleCard.d.cts.map +1 -0
- package/dist/node/components/SimpleCard/SimpleCard.js +51 -50
- package/dist/node/components/SimpleCard/SimpleCard.js.map +1 -1
- package/dist/node/components/SimpleCard/index.cjs +126 -0
- package/dist/node/components/SimpleCard/index.cjs.map +1 -0
- package/dist/node/components/SimpleCard/index.d.cts +2 -0
- package/dist/node/components/SimpleCard/index.d.cts.map +1 -0
- package/dist/node/components/SimpleCard/index.js +97 -21
- package/dist/node/components/SimpleCard/index.js.map +1 -1
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.cjs +133 -0
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.cjs.map +1 -0
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.d.cts +8 -0
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.d.cts.map +1 -0
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.js +104 -30
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.js.map +1 -1
- package/dist/node/components/SimpleCardGrid/index.cjs +135 -0
- package/dist/node/components/SimpleCardGrid/index.cjs.map +1 -0
- package/dist/node/components/SimpleCardGrid/index.d.cts +2 -0
- package/dist/node/components/SimpleCardGrid/index.d.cts.map +1 -0
- package/dist/node/components/SimpleCardGrid/index.js +106 -21
- package/dist/node/components/SimpleCardGrid/index.js.map +1 -1
- package/dist/node/components/index.cjs +259 -0
- package/dist/node/components/index.cjs.map +1 -0
- package/dist/node/components/index.d.cts +6 -0
- package/dist/node/components/index.d.cts.map +1 -0
- package/dist/node/components/index.js +222 -27
- package/dist/node/components/index.js.map +1 -1
- package/dist/node/index.cjs +259 -0
- package/dist/node/index.cjs.map +1 -0
- package/dist/node/index.d.cts +2 -0
- package/dist/node/index.d.cts.map +1 -0
- package/dist/node/index.js +222 -19
- package/dist/node/index.js.map +1 -1
- package/dist/node/types/images.d.cjs +2 -0
- package/dist/node/types/images.d.cjs.map +1 -0
- package/dist/node/types/images.d.js +0 -1
- package/package.json +16 -16
- package/dist/browser/components/CardContentEx.stories.js +0 -51
- package/dist/browser/components/CardContentEx.stories.js.map +0 -1
- package/dist/browser/components/FullWidthCard/FullWidthCard.stories.js +0 -27
- package/dist/browser/components/FullWidthCard/FullWidthCard.stories.js.map +0 -1
- package/dist/browser/components/PageCard.stories.js +0 -54
- package/dist/browser/components/PageCard.stories.js.map +0 -1
- package/dist/browser/components/SimpleCard/SimpleCard.stories.js +0 -76
- package/dist/browser/components/SimpleCard/SimpleCard.stories.js.map +0 -1
- package/dist/browser/components/SimpleCardGrid/SimpleCardGrid.stories.js +0 -68
- package/dist/browser/components/SimpleCardGrid/SimpleCardGrid.stories.js.map +0 -1
- package/dist/node/components/CardContentEx.mjs +0 -34
- package/dist/node/components/CardContentEx.stories.js +0 -77
- package/dist/node/components/CardContentEx.stories.js.map +0 -1
- package/dist/node/components/CardContentEx.stories.mjs +0 -51
- package/dist/node/components/CardContentEx.stories.mjs.map +0 -1
- package/dist/node/components/CardEx.mjs +0 -26
- package/dist/node/components/FullWidthCard/FullWidthCard.mjs +0 -71
- package/dist/node/components/FullWidthCard/FullWidthCard.stories.js +0 -51
- package/dist/node/components/FullWidthCard/FullWidthCard.stories.js.map +0 -1
- package/dist/node/components/FullWidthCard/FullWidthCard.stories.mjs +0 -27
- package/dist/node/components/FullWidthCard/FullWidthCard.stories.mjs.map +0 -1
- package/dist/node/components/FullWidthCard/index.mjs +0 -2
- package/dist/node/components/FullWidthCard/index.mjs.map +0 -1
- package/dist/node/components/PageCard.mjs +0 -25
- package/dist/node/components/PageCard.mjs.map +0 -1
- package/dist/node/components/PageCard.stories.js +0 -80
- package/dist/node/components/PageCard.stories.js.map +0 -1
- package/dist/node/components/PageCard.stories.mjs +0 -54
- package/dist/node/components/PageCard.stories.mjs.map +0 -1
- package/dist/node/components/SimpleCard/SimpleCard.mjs +0 -74
- package/dist/node/components/SimpleCard/SimpleCard.mjs.map +0 -1
- package/dist/node/components/SimpleCard/SimpleCard.stories.js +0 -115
- package/dist/node/components/SimpleCard/SimpleCard.stories.js.map +0 -1
- package/dist/node/components/SimpleCard/SimpleCard.stories.mjs +0 -76
- package/dist/node/components/SimpleCard/SimpleCard.stories.mjs.map +0 -1
- package/dist/node/components/SimpleCard/index.mjs +0 -2
- package/dist/node/components/SimpleCard/index.mjs.map +0 -1
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.mjs +0 -10
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.mjs.map +0 -1
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.stories.js +0 -102
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.stories.js.map +0 -1
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.stories.mjs +0 -68
- package/dist/node/components/SimpleCardGrid/SimpleCardGrid.stories.mjs.map +0 -1
- package/dist/node/components/SimpleCardGrid/index.mjs +0 -2
- package/dist/node/components/SimpleCardGrid/index.mjs.map +0 -1
- package/dist/node/components/index.mjs +0 -6
- package/dist/node/components/index.mjs.map +0 -1
- package/dist/node/index.mjs +0 -2
- package/dist/node/index.mjs.map +0 -1
- package/dist/node/types/images.d.mjs +0 -1
- /package/dist/{node/types/images.d.mjs.map → browser/types/images.d.cjs.map} +0 -0
@@ -0,0 +1,56 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __defProp = Object.defineProperty;
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
6
|
+
var __export = (target, all) => {
|
7
|
+
for (var name in all)
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
9
|
+
};
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
12
|
+
for (let key of __getOwnPropNames(from))
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
15
|
+
}
|
16
|
+
return to;
|
17
|
+
};
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
19
|
+
|
20
|
+
// src/components/CardContentEx.tsx
|
21
|
+
var CardContentEx_exports = {};
|
22
|
+
__export(CardContentEx_exports, {
|
23
|
+
CardContentEx: () => CardContentEx,
|
24
|
+
CardContentExWithRef: () => CardContentExWithRef
|
25
|
+
});
|
26
|
+
module.exports = __toCommonJS(CardContentEx_exports);
|
27
|
+
var import_material = require("@mui/material");
|
28
|
+
var import_react_shared = require("@xyo-network/react-shared");
|
29
|
+
var import_react = require("react");
|
30
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
31
|
+
var CardContentExRoot = (0, import_material.styled)(import_material.CardContent, {
|
32
|
+
name: "CardContentEx",
|
33
|
+
shouldForwardProp: (prop) => !["variant", "removePadding"].includes(prop),
|
34
|
+
slot: "Root"
|
35
|
+
})(({ variant, removePadding }) => ({
|
36
|
+
...(variant === "scrollable" || removePadding) && {
|
37
|
+
[":last-child"]: {
|
38
|
+
paddingBottom: 0
|
39
|
+
},
|
40
|
+
overflow: "auto",
|
41
|
+
paddingTop: 0,
|
42
|
+
...removePadding && { padding: 0 }
|
43
|
+
}
|
44
|
+
}));
|
45
|
+
var CardContentExWithRef = (0, import_react.forwardRef)(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {
|
46
|
+
const sharedRef = (0, import_react_shared.useShareForwardedRef)(ref, refreshRef);
|
47
|
+
(0, import_react.useEffect)(() => {
|
48
|
+
if (sharedRef && scrollToTop) {
|
49
|
+
sharedRef.current?.scroll({ behavior: "smooth", top: 0 });
|
50
|
+
}
|
51
|
+
}, [sharedRef, scrollToTop]);
|
52
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardContentExRoot, { ref: sharedRef, ...props });
|
53
|
+
});
|
54
|
+
CardContentExWithRef.displayName = "CardContentEx";
|
55
|
+
var CardContentEx = CardContentExWithRef;
|
56
|
+
//# sourceMappingURL=CardContentEx.cjs.map
|
package/dist/{node/components/CardContentEx.mjs.map → browser/components/CardContentEx.cjs.map}
RENAMED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardContentEx.tsx"],"sourcesContent":["import { CardContent, CardContentProps, styled } from '@mui/material'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport { forwardRef, useEffect } from 'react'\n\nconst CardContentExRoot = styled(CardContent, {\n name: 'CardContentEx',\n shouldForwardProp: (prop: string) => !['variant', 'removePadding'].includes(prop),\n slot: 'Root',\n})<CardContentExProps>(({ variant, removePadding }) => ({\n ...((variant === 'scrollable' || removePadding) && {\n [':last-child']: {\n paddingBottom: 0,\n },\n overflow: 'auto',\n paddingTop: 0,\n ...(removePadding && { padding: 0 }),\n }),\n}))\n\nexport type CardContentExProps = CardContentProps & {\n refreshRef?: number\n removePadding?: boolean\n scrollToTop?: number\n variant?: 'scrollable' | 'normal'\n}\n\nexport const CardContentExWithRef = forwardRef<HTMLDivElement | null, CardContentExProps>(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {\n const sharedRef = useShareForwardedRef<HTMLDivElement>(ref, refreshRef)\n\n useEffect(() => {\n if (sharedRef && scrollToTop) {\n sharedRef.current?.scroll({ behavior: 'smooth', top: 0 })\n }\n }, [sharedRef, scrollToTop])\n\n return <CardContentExRoot ref={sharedRef} {...props} />\n})\n\nCardContentExWithRef.displayName = 'CardContentEx'\n\nexport const CardContentEx = CardContentExWithRef\n"],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/CardContentEx.tsx"],"sourcesContent":["import { CardContent, CardContentProps, styled } from '@mui/material'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport { forwardRef, useEffect } from 'react'\n\nconst CardContentExRoot = styled(CardContent, {\n name: 'CardContentEx',\n shouldForwardProp: (prop: string) => !['variant', 'removePadding'].includes(prop),\n slot: 'Root',\n})<CardContentExProps>(({ variant, removePadding }) => ({\n ...((variant === 'scrollable' || removePadding) && {\n [':last-child']: {\n paddingBottom: 0,\n },\n overflow: 'auto',\n paddingTop: 0,\n ...(removePadding && { padding: 0 }),\n }),\n}))\n\nexport type CardContentExProps = CardContentProps & {\n refreshRef?: number\n removePadding?: boolean\n scrollToTop?: number\n variant?: 'scrollable' | 'normal'\n}\n\nexport const CardContentExWithRef = forwardRef<HTMLDivElement | null, CardContentExProps>(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {\n const sharedRef = useShareForwardedRef<HTMLDivElement>(ref, refreshRef)\n\n useEffect(() => {\n if (sharedRef && scrollToTop) {\n sharedRef.current?.scroll({ behavior: 'smooth', top: 0 })\n }\n }, [sharedRef, scrollToTop])\n\n return <CardContentExRoot ref={sharedRef} {...props} />\n})\n\nCardContentExWithRef.displayName = 'CardContentEx'\n\nexport const CardContentEx = CardContentExWithRef\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAsD;AACtD,0BAAqC;AACrC,mBAAsC;AAiC7B;AA/BT,IAAM,wBAAoB,wBAAO,6BAAa;AAAA,EAC5C,MAAM;AAAA,EACN,mBAAmB,CAAC,SAAiB,CAAC,CAAC,WAAW,eAAe,EAAE,SAAS,IAAI;AAAA,EAChF,MAAM;AACR,CAAC,EAAsB,CAAC,EAAE,SAAS,cAAc,OAAO;AAAA,EACtD,IAAK,YAAY,gBAAgB,kBAAkB;AAAA,IACjD,CAAC,aAAa,GAAG;AAAA,MACf,eAAe;AAAA,IACjB;AAAA,IACA,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,GAAI,iBAAiB,EAAE,SAAS,EAAE;AAAA,EACpC;AACF,EAAE;AASK,IAAM,2BAAuB,yBAAsD,CAAC,EAAE,cAAc,GAAG,aAAa,GAAG,GAAG,MAAM,GAAG,QAAQ;AAChJ,QAAM,gBAAY,0CAAqC,KAAK,UAAU;AAEtE,8BAAU,MAAM;AACd,QAAI,aAAa,aAAa;AAC5B,gBAAU,SAAS,OAAO,EAAE,UAAU,UAAU,KAAK,EAAE,CAAC;AAAA,IAC1D;AAAA,EACF,GAAG,CAAC,WAAW,WAAW,CAAC;AAE3B,SAAO,4CAAC,qBAAkB,KAAK,WAAY,GAAG,OAAO;AACvD,CAAC;AAED,qBAAqB,cAAc;AAE5B,IAAM,gBAAgB;","names":[]}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { CardContentProps } from '@mui/material';
|
3
|
+
export type CardContentExProps = CardContentProps & {
|
4
|
+
refreshRef?: number;
|
5
|
+
removePadding?: boolean;
|
6
|
+
scrollToTop?: number;
|
7
|
+
variant?: 'scrollable' | 'normal';
|
8
|
+
};
|
9
|
+
export declare const CardContentExWithRef: import("react").ForwardRefExoticComponent<Omit<CardContentExProps, "ref"> & import("react").RefAttributes<HTMLDivElement | null>>;
|
10
|
+
export declare const CardContentEx: import("react").ForwardRefExoticComponent<Omit<CardContentExProps, "ref"> & import("react").RefAttributes<HTMLDivElement | null>>;
|
11
|
+
//# sourceMappingURL=CardContentEx.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"CardContentEx.d.ts","sourceRoot":"","sources":["../../../src/components/CardContentEx.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAe,gBAAgB,EAAU,MAAM,eAAe,CAAA;AAmBrE,MAAM,MAAM,kBAAkB,GAAG,gBAAgB,GAAG;IAClD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,YAAY,GAAG,QAAQ,CAAA;CAClC,CAAA;AAED,eAAO,MAAM,oBAAoB,mIAU/B,CAAA;AAIF,eAAO,MAAM,aAAa,mIAAuB,CAAA"}
|
@@ -1,8 +1,9 @@
|
|
1
|
-
|
1
|
+
// src/components/CardContentEx.tsx
|
2
2
|
import { CardContent, styled } from "@mui/material";
|
3
3
|
import { useShareForwardedRef } from "@xyo-network/react-shared";
|
4
4
|
import { forwardRef, useEffect } from "react";
|
5
|
-
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
6
|
+
var CardContentExRoot = styled(CardContent, {
|
6
7
|
name: "CardContentEx",
|
7
8
|
shouldForwardProp: (prop) => !["variant", "removePadding"].includes(prop),
|
8
9
|
slot: "Root"
|
@@ -16,7 +17,7 @@ const CardContentExRoot = styled(CardContent, {
|
|
16
17
|
...removePadding && { padding: 0 }
|
17
18
|
}
|
18
19
|
}));
|
19
|
-
|
20
|
+
var CardContentExWithRef = forwardRef(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {
|
20
21
|
const sharedRef = useShareForwardedRef(ref, refreshRef);
|
21
22
|
useEffect(() => {
|
22
23
|
if (sharedRef && scrollToTop) {
|
@@ -26,7 +27,7 @@ const CardContentExWithRef = forwardRef(({ scrollToTop = 0, refreshRef = 0, ...p
|
|
26
27
|
return /* @__PURE__ */ jsx(CardContentExRoot, { ref: sharedRef, ...props });
|
27
28
|
});
|
28
29
|
CardContentExWithRef.displayName = "CardContentEx";
|
29
|
-
|
30
|
+
var CardContentEx = CardContentExWithRef;
|
30
31
|
export {
|
31
32
|
CardContentEx,
|
32
33
|
CardContentExWithRef
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardContentEx.tsx"],"sourcesContent":["import { CardContent, CardContentProps, styled } from '@mui/material'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport { forwardRef, useEffect } from 'react'\n\nconst CardContentExRoot = styled(CardContent, {\n name: 'CardContentEx',\n shouldForwardProp: (prop: string) => !['variant', 'removePadding'].includes(prop),\n slot: 'Root',\n})<CardContentExProps>(({ variant, removePadding }) => ({\n ...((variant === 'scrollable' || removePadding) && {\n [':last-child']: {\n paddingBottom: 0,\n },\n overflow: 'auto',\n paddingTop: 0,\n ...(removePadding && { padding: 0 }),\n }),\n}))\n\nexport type CardContentExProps = CardContentProps & {\n refreshRef?: number\n removePadding?: boolean\n scrollToTop?: number\n variant?: 'scrollable' | 'normal'\n}\n\nexport const CardContentExWithRef = forwardRef<HTMLDivElement | null, CardContentExProps>(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {\n const sharedRef = useShareForwardedRef<HTMLDivElement>(ref, refreshRef)\n\n useEffect(() => {\n if (sharedRef && scrollToTop) {\n sharedRef.current?.scroll({ behavior: 'smooth', top: 0 })\n }\n }, [sharedRef, scrollToTop])\n\n return <CardContentExRoot ref={sharedRef} {...props} />\n})\n\nCardContentExWithRef.displayName = 'CardContentEx'\n\nexport const CardContentEx = CardContentExWithRef\n"],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/CardContentEx.tsx"],"sourcesContent":["import { CardContent, CardContentProps, styled } from '@mui/material'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport { forwardRef, useEffect } from 'react'\n\nconst CardContentExRoot = styled(CardContent, {\n name: 'CardContentEx',\n shouldForwardProp: (prop: string) => !['variant', 'removePadding'].includes(prop),\n slot: 'Root',\n})<CardContentExProps>(({ variant, removePadding }) => ({\n ...((variant === 'scrollable' || removePadding) && {\n [':last-child']: {\n paddingBottom: 0,\n },\n overflow: 'auto',\n paddingTop: 0,\n ...(removePadding && { padding: 0 }),\n }),\n}))\n\nexport type CardContentExProps = CardContentProps & {\n refreshRef?: number\n removePadding?: boolean\n scrollToTop?: number\n variant?: 'scrollable' | 'normal'\n}\n\nexport const CardContentExWithRef = forwardRef<HTMLDivElement | null, CardContentExProps>(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {\n const sharedRef = useShareForwardedRef<HTMLDivElement>(ref, refreshRef)\n\n useEffect(() => {\n if (sharedRef && scrollToTop) {\n sharedRef.current?.scroll({ behavior: 'smooth', top: 0 })\n }\n }, [sharedRef, scrollToTop])\n\n return <CardContentExRoot ref={sharedRef} {...props} />\n})\n\nCardContentExWithRef.displayName = 'CardContentEx'\n\nexport const CardContentEx = CardContentExWithRef\n"],"mappings":";AAAA,SAAS,aAA+B,cAAc;AACtD,SAAS,4BAA4B;AACrC,SAAS,YAAY,iBAAiB;AAiC7B;AA/BT,IAAM,oBAAoB,OAAO,aAAa;AAAA,EAC5C,MAAM;AAAA,EACN,mBAAmB,CAAC,SAAiB,CAAC,CAAC,WAAW,eAAe,EAAE,SAAS,IAAI;AAAA,EAChF,MAAM;AACR,CAAC,EAAsB,CAAC,EAAE,SAAS,cAAc,OAAO;AAAA,EACtD,IAAK,YAAY,gBAAgB,kBAAkB;AAAA,IACjD,CAAC,aAAa,GAAG;AAAA,MACf,eAAe;AAAA,IACjB;AAAA,IACA,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,GAAI,iBAAiB,EAAE,SAAS,EAAE;AAAA,EACpC;AACF,EAAE;AASK,IAAM,uBAAuB,WAAsD,CAAC,EAAE,cAAc,GAAG,aAAa,GAAG,GAAG,MAAM,GAAG,QAAQ;AAChJ,QAAM,YAAY,qBAAqC,KAAK,UAAU;AAEtE,YAAU,MAAM;AACd,QAAI,aAAa,aAAa;AAC5B,gBAAU,SAAS,OAAO,EAAE,UAAU,UAAU,KAAK,EAAE,CAAC;AAAA,IAC1D;AAAA,EACF,GAAG,CAAC,WAAW,WAAW,CAAC;AAE3B,SAAO,oBAAC,qBAAkB,KAAK,WAAY,GAAG,OAAO;AACvD,CAAC;AAED,qBAAqB,cAAc;AAE5B,IAAM,gBAAgB;","names":[]}
|
@@ -0,0 +1,48 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __defProp = Object.defineProperty;
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
6
|
+
var __export = (target, all) => {
|
7
|
+
for (var name in all)
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
9
|
+
};
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
12
|
+
for (let key of __getOwnPropNames(from))
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
15
|
+
}
|
16
|
+
return to;
|
17
|
+
};
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
19
|
+
|
20
|
+
// src/components/CardEx.tsx
|
21
|
+
var CardEx_exports = {};
|
22
|
+
__export(CardEx_exports, {
|
23
|
+
CardEx: () => CardEx,
|
24
|
+
CardExWithRef: () => CardExWithRef
|
25
|
+
});
|
26
|
+
module.exports = __toCommonJS(CardEx_exports);
|
27
|
+
var import_material = require("@mui/material");
|
28
|
+
var import_react_shared = require("@xyo-network/react-shared");
|
29
|
+
var import_react = require("react");
|
30
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
31
|
+
var CardExWithRef = (0, import_react.forwardRef)(({ style, gradient, ...props }, ref) => {
|
32
|
+
const { styles } = (0, import_react_shared.useGradientStyles)();
|
33
|
+
const gradientStyle = gradient === "border" ? styles.border : gradient === "background" ? styles.background : {};
|
34
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
35
|
+
import_material.Card,
|
36
|
+
{
|
37
|
+
style: {
|
38
|
+
...gradientStyle,
|
39
|
+
...style
|
40
|
+
},
|
41
|
+
ref,
|
42
|
+
...props
|
43
|
+
}
|
44
|
+
);
|
45
|
+
});
|
46
|
+
CardExWithRef.displayName = "CardEx";
|
47
|
+
var CardEx = CardExWithRef;
|
48
|
+
//# sourceMappingURL=CardEx.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardEx.tsx"],"sourcesContent":["import { Card, CardProps } from '@mui/material'\nimport { useGradientStyles } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport type CardExProps = CardProps & {\n gradient?: 'border' | 'background'\n}\n\nexport const CardExWithRef: React.FC<CardExProps> = forwardRef(({ style, gradient, ...props }, ref) => {\n const { styles } = useGradientStyles()\n const gradientStyle = gradient === 'border' ? styles.border : gradient === 'background' ? styles.background : {}\n return (\n <Card\n style={{\n ...gradientStyle,\n ...style,\n }}\n ref={ref}\n {...props}\n />\n )\n})\n\nCardExWithRef.displayName = 'CardEx'\n\nexport const CardEx = CardExWithRef\n"],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/CardEx.tsx"],"sourcesContent":["import { Card, CardProps } from '@mui/material'\nimport { useGradientStyles } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport type CardExProps = CardProps & {\n gradient?: 'border' | 'background'\n}\n\nexport const CardExWithRef: React.FC<CardExProps> = forwardRef(({ style, gradient, ...props }, ref) => {\n const { styles } = useGradientStyles()\n const gradientStyle = gradient === 'border' ? styles.border : gradient === 'background' ? styles.background : {}\n return (\n <Card\n style={{\n ...gradientStyle,\n ...style,\n }}\n ref={ref}\n {...props}\n />\n )\n})\n\nCardExWithRef.displayName = 'CardEx'\n\nexport const CardEx = CardExWithRef\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAgC;AAChC,0BAAkC;AAClC,mBAA2B;AAUvB;AAJG,IAAM,oBAAuC,yBAAW,CAAC,EAAE,OAAO,UAAU,GAAG,MAAM,GAAG,QAAQ;AACrG,QAAM,EAAE,OAAO,QAAI,uCAAkB;AACrC,QAAM,gBAAgB,aAAa,WAAW,OAAO,SAAS,aAAa,eAAe,OAAO,aAAa,CAAC;AAC/G,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAAA,MACA;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,cAAc,cAAc;AAErB,IAAM,SAAS;","names":[]}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { CardProps } from '@mui/material';
|
3
|
+
export type CardExProps = CardProps & {
|
4
|
+
gradient?: 'border' | 'background';
|
5
|
+
};
|
6
|
+
export declare const CardExWithRef: React.FC<CardExProps>;
|
7
|
+
export declare const CardEx: import("react").FC<CardExProps>;
|
8
|
+
//# sourceMappingURL=CardEx.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"CardEx.d.ts","sourceRoot":"","sources":["../../../src/components/CardEx.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAQ,SAAS,EAAE,MAAM,eAAe,CAAA;AAI/C,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG;IACpC,QAAQ,CAAC,EAAE,QAAQ,GAAG,YAAY,CAAA;CACnC,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAa9C,CAAA;AAIF,eAAO,MAAM,MAAM,iCAAgB,CAAA"}
|
@@ -1,8 +1,9 @@
|
|
1
|
-
|
1
|
+
// src/components/CardEx.tsx
|
2
2
|
import { Card } from "@mui/material";
|
3
3
|
import { useGradientStyles } from "@xyo-network/react-shared";
|
4
4
|
import { forwardRef } from "react";
|
5
|
-
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
6
|
+
var CardExWithRef = forwardRef(({ style, gradient, ...props }, ref) => {
|
6
7
|
const { styles } = useGradientStyles();
|
7
8
|
const gradientStyle = gradient === "border" ? styles.border : gradient === "background" ? styles.background : {};
|
8
9
|
return /* @__PURE__ */ jsx(
|
@@ -18,7 +19,7 @@ const CardExWithRef = forwardRef(({ style, gradient, ...props }, ref) => {
|
|
18
19
|
);
|
19
20
|
});
|
20
21
|
CardExWithRef.displayName = "CardEx";
|
21
|
-
|
22
|
+
var CardEx = CardExWithRef;
|
22
23
|
export {
|
23
24
|
CardEx,
|
24
25
|
CardExWithRef
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardEx.tsx"],"sourcesContent":["import { Card, CardProps } from '@mui/material'\nimport { useGradientStyles } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport type CardExProps = CardProps & {\n gradient?: 'border' | 'background'\n}\n\nexport const CardExWithRef: React.FC<CardExProps> = forwardRef(({ style, gradient, ...props }, ref) => {\n const { styles } = useGradientStyles()\n const gradientStyle = gradient === 'border' ? styles.border : gradient === 'background' ? styles.background : {}\n return (\n <Card\n style={{\n ...gradientStyle,\n ...style,\n }}\n ref={ref}\n {...props}\n />\n )\n})\n\nCardExWithRef.displayName = 'CardEx'\n\nexport const CardEx = CardExWithRef\n"],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/CardEx.tsx"],"sourcesContent":["import { Card, CardProps } from '@mui/material'\nimport { useGradientStyles } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport type CardExProps = CardProps & {\n gradient?: 'border' | 'background'\n}\n\nexport const CardExWithRef: React.FC<CardExProps> = forwardRef(({ style, gradient, ...props }, ref) => {\n const { styles } = useGradientStyles()\n const gradientStyle = gradient === 'border' ? styles.border : gradient === 'background' ? styles.background : {}\n return (\n <Card\n style={{\n ...gradientStyle,\n ...style,\n }}\n ref={ref}\n {...props}\n />\n )\n})\n\nCardExWithRef.displayName = 'CardEx'\n\nexport const CardEx = CardExWithRef\n"],"mappings":";AAAA,SAAS,YAAuB;AAChC,SAAS,yBAAyB;AAClC,SAAS,kBAAkB;AAUvB;AAJG,IAAM,gBAAuC,WAAW,CAAC,EAAE,OAAO,UAAU,GAAG,MAAM,GAAG,QAAQ;AACrG,QAAM,EAAE,OAAO,IAAI,kBAAkB;AACrC,QAAM,gBAAgB,aAAa,WAAW,OAAO,SAAS,aAAa,eAAe,OAAO,aAAa,CAAC;AAC/G,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAAA,MACA;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,cAAc,cAAc;AAErB,IAAM,SAAS;","names":[]}
|
@@ -0,0 +1,93 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __defProp = Object.defineProperty;
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
6
|
+
var __export = (target, all) => {
|
7
|
+
for (var name in all)
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
9
|
+
};
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
12
|
+
for (let key of __getOwnPropNames(from))
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
15
|
+
}
|
16
|
+
return to;
|
17
|
+
};
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
19
|
+
|
20
|
+
// src/components/FullWidthCard/FullWidthCard.tsx
|
21
|
+
var FullWidthCard_exports = {};
|
22
|
+
__export(FullWidthCard_exports, {
|
23
|
+
FullWidthCard: () => FullWidthCard
|
24
|
+
});
|
25
|
+
module.exports = __toCommonJS(FullWidthCard_exports);
|
26
|
+
var import_icons_material = require("@mui/icons-material");
|
27
|
+
var import_material = require("@mui/material");
|
28
|
+
var import_react_flexbox = require("@xylabs/react-flexbox");
|
29
|
+
var import_react_shared = require("@xyo-network/react-shared");
|
30
|
+
var import_react = require("react");
|
31
|
+
var import_react_router_dom = require("react-router-dom");
|
32
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
33
|
+
var FullWidthCard = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {
|
34
|
+
const theme = (0, import_material.useTheme)();
|
35
|
+
const [raised, setRaised] = (0, import_react.useState)(false);
|
36
|
+
const navigate = (0, import_react_router_dom.useNavigate)();
|
37
|
+
const isMobile = (0, import_react_shared.useIsMobile)();
|
38
|
+
const localRouteChange = (to2) => {
|
39
|
+
to2 ? navigate(to2) : navigate("/404");
|
40
|
+
};
|
41
|
+
const externalRouteChange = (href2) => {
|
42
|
+
href2 ? window.open(href2) : navigate("/404");
|
43
|
+
};
|
44
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
45
|
+
import_material.Card,
|
46
|
+
{
|
47
|
+
elevation: raised ? 3 : 0,
|
48
|
+
style: { height: "100%", width: "100%" },
|
49
|
+
...props,
|
50
|
+
sx: {
|
51
|
+
"&:hover": {
|
52
|
+
cursor: "pointer"
|
53
|
+
},
|
54
|
+
backgroundColor: (0, import_material.alpha)(theme.palette.primary.light, 0.05)
|
55
|
+
},
|
56
|
+
onMouseEnter: () => isMobile ? null : cardIsButton ? setRaised(true) : null,
|
57
|
+
onMouseLeave: () => isMobile ? null : cardIsButton ? setRaised(false) : null,
|
58
|
+
onClick: () => cardIsButton ? href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404") : null,
|
59
|
+
children: [
|
60
|
+
media ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.CardMedia, { component: "img", height: "100", image: media, alt: "" }) : null,
|
61
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.CardContent, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.Grid, { container: true, alignItems: "center", paddingY: 2, paddingX: 2, children: [
|
62
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Grid, { item: true, xs: 12, md: 6, children: typeof name === "string" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { fontWeight: 700, variant: "h2", textAlign: "left", paddingBottom: 1, children: name }) : name }),
|
63
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Grid, { item: true, xs: 12, md: 5, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "body1", fontWeight: 400, textAlign: "left", children: desc }) }),
|
64
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Grid, { item: true, xs: 1, display: isMobile ? "none" : "flex", justifyContent: "center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Zoom, { in: raised, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
65
|
+
import_material.IconButton,
|
66
|
+
{
|
67
|
+
color: "primary",
|
68
|
+
size: small ? "small" : "medium",
|
69
|
+
onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
|
70
|
+
disableFocusRipple: true,
|
71
|
+
disableRipple: true,
|
72
|
+
disableTouchRipple: true,
|
73
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.ArrowForwardRounded, { fontSize: small ? "small" : "medium" })
|
74
|
+
}
|
75
|
+
) }) })
|
76
|
+
] }) }),
|
77
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.CardActions, { sx: { display: { md: isMobile ? "flex" : "none" } }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_flexbox.FlexGrowCol, { alignItems: "flex-end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
78
|
+
import_material.IconButton,
|
79
|
+
{
|
80
|
+
color: "primary",
|
81
|
+
size: small ? "small" : "medium",
|
82
|
+
onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
|
83
|
+
disableFocusRipple: true,
|
84
|
+
disableRipple: true,
|
85
|
+
disableTouchRipple: true,
|
86
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.ArrowForwardRounded, { fontSize: small ? "small" : "medium" })
|
87
|
+
}
|
88
|
+
) }) })
|
89
|
+
]
|
90
|
+
}
|
91
|
+
);
|
92
|
+
};
|
93
|
+
//# sourceMappingURL=FullWidthCard.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/FullWidthCard/FullWidthCard.tsx"],"sourcesContent":["import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport { alpha, Card, CardActions, CardContent, CardMedia, CardProps, Grid, IconButton, Typography, useTheme, Zoom } from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, useNavigate } from 'react-router-dom'\n\nexport interface FullWidthCardProps extends CardProps {\n cardIsButton?: boolean\n desc?: ReactNode\n href?: string\n linkText?: string\n media?: string\n name: ReactNode\n small?: boolean\n to?: To\n}\n\nexport const FullWidthCard: React.FC<FullWidthCardProps> = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isMobile = useIsMobile()\n\n const localRouteChange = (to: To | undefined) => {\n to ? navigate(to) : navigate('/404')\n }\n const externalRouteChange = (href: string | undefined) => {\n href ? window.open(href) : navigate('/404')\n }\n\n return (\n <Card\n elevation={raised ? 3 : 0}\n style={{ height: '100%', width: '100%' }}\n {...props}\n sx={{\n '&:hover': {\n cursor: 'pointer',\n },\n backgroundColor: alpha(theme.palette.primary.light, 0.05),\n }}\n onMouseEnter={() => (isMobile ? null : cardIsButton ? setRaised(true) : null)}\n onMouseLeave={() => (isMobile ? null : cardIsButton ? setRaised(false) : null)}\n onClick={() => (cardIsButton ? (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404')) : null)}\n >\n {media ? <CardMedia component=\"img\" height=\"100\" image={media} alt=\"\" /> : null}\n\n <CardContent>\n <Grid container alignItems=\"center\" paddingY={2} paddingX={2}>\n <Grid item xs={12} md={6}>\n {typeof name === 'string' ? (\n <Typography fontWeight={700} variant=\"h2\" textAlign=\"left\" paddingBottom={1}>\n {name}\n </Typography>\n ) : (\n name\n )}\n </Grid>\n <Grid item xs={12} md={5}>\n <Typography variant=\"body1\" fontWeight={400} textAlign=\"left\">\n {desc}\n </Typography>\n </Grid>\n <Grid item xs={1} display={isMobile ? 'none' : 'flex'} justifyContent=\"center\">\n <Zoom in={raised}>\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </Zoom>\n </Grid>\n </Grid>\n </CardContent>\n <CardActions sx={{ display: { md: isMobile ? 'flex' : 'none' } }}>\n <FlexGrowCol alignItems=\"flex-end\">\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n </Card>\n )\n}\n"],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../../src/components/FullWidthCard/FullWidthCard.tsx"],"sourcesContent":["import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport { alpha, Card, CardActions, CardContent, CardMedia, CardProps, Grid, IconButton, Typography, useTheme, Zoom } from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, useNavigate } from 'react-router-dom'\n\nexport interface FullWidthCardProps extends CardProps {\n cardIsButton?: boolean\n desc?: ReactNode\n href?: string\n linkText?: string\n media?: string\n name: ReactNode\n small?: boolean\n to?: To\n}\n\nexport const FullWidthCard: React.FC<FullWidthCardProps> = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isMobile = useIsMobile()\n\n const localRouteChange = (to: To | undefined) => {\n to ? navigate(to) : navigate('/404')\n }\n const externalRouteChange = (href: string | undefined) => {\n href ? window.open(href) : navigate('/404')\n }\n\n return (\n <Card\n elevation={raised ? 3 : 0}\n style={{ height: '100%', width: '100%' }}\n {...props}\n sx={{\n '&:hover': {\n cursor: 'pointer',\n },\n backgroundColor: alpha(theme.palette.primary.light, 0.05),\n }}\n onMouseEnter={() => (isMobile ? null : cardIsButton ? setRaised(true) : null)}\n onMouseLeave={() => (isMobile ? null : cardIsButton ? setRaised(false) : null)}\n onClick={() => (cardIsButton ? (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404')) : null)}\n >\n {media ? <CardMedia component=\"img\" height=\"100\" image={media} alt=\"\" /> : null}\n\n <CardContent>\n <Grid container alignItems=\"center\" paddingY={2} paddingX={2}>\n <Grid item xs={12} md={6}>\n {typeof name === 'string' ? (\n <Typography fontWeight={700} variant=\"h2\" textAlign=\"left\" paddingBottom={1}>\n {name}\n </Typography>\n ) : (\n name\n )}\n </Grid>\n <Grid item xs={12} md={5}>\n <Typography variant=\"body1\" fontWeight={400} textAlign=\"left\">\n {desc}\n </Typography>\n </Grid>\n <Grid item xs={1} display={isMobile ? 'none' : 'flex'} justifyContent=\"center\">\n <Zoom in={raised}>\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </Zoom>\n </Grid>\n </Grid>\n </CardContent>\n <CardActions sx={{ display: { md: isMobile ? 'flex' : 'none' } }}>\n <FlexGrowCol alignItems=\"flex-end\">\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n </Card>\n )\n}\n"],"mappings":"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","names":["to","href","ArrowForwardRoundedIcon"]}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import { CardProps } from '@mui/material';
|
2
|
+
import { ReactNode } from 'react';
|
3
|
+
import { To } from 'react-router-dom';
|
4
|
+
export interface FullWidthCardProps extends CardProps {
|
5
|
+
cardIsButton?: boolean;
|
6
|
+
desc?: ReactNode;
|
7
|
+
href?: string;
|
8
|
+
linkText?: string;
|
9
|
+
media?: string;
|
10
|
+
name: ReactNode;
|
11
|
+
small?: boolean;
|
12
|
+
to?: To;
|
13
|
+
}
|
14
|
+
export declare const FullWidthCard: React.FC<FullWidthCardProps>;
|
15
|
+
//# sourceMappingURL=FullWidthCard.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"FullWidthCard.d.ts","sourceRoot":"","sources":["../../../../src/components/FullWidthCard/FullWidthCard.tsx"],"names":[],"mappings":"AACA,OAAO,EAAoD,SAAS,EAAgD,MAAM,eAAe,CAAA;AAGzI,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,EAAE,EAAe,MAAM,kBAAkB,CAAA;AAElD,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,SAAS,CAAA;IACf,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,EAAE,CAAC,EAAE,EAAE,CAAA;CACR;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA8EtD,CAAA"}
|
@@ -1,11 +1,12 @@
|
|
1
|
-
|
1
|
+
// src/components/FullWidthCard/FullWidthCard.tsx
|
2
2
|
import { ArrowForwardRounded as ArrowForwardRoundedIcon } from "@mui/icons-material";
|
3
3
|
import { alpha, Card, CardActions, CardContent, CardMedia, Grid, IconButton, Typography, useTheme, Zoom } from "@mui/material";
|
4
4
|
import { FlexGrowCol } from "@xylabs/react-flexbox";
|
5
5
|
import { useIsMobile } from "@xyo-network/react-shared";
|
6
6
|
import { useState } from "react";
|
7
7
|
import { useNavigate } from "react-router-dom";
|
8
|
-
|
8
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
9
|
+
var FullWidthCard = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {
|
9
10
|
const theme = useTheme();
|
10
11
|
const [raised, setRaised] = useState(false);
|
11
12
|
const navigate = useNavigate();
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/FullWidthCard/FullWidthCard.tsx"],"sourcesContent":["import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport { alpha, Card, CardActions, CardContent, CardMedia, CardProps, Grid, IconButton, Typography, useTheme, Zoom } from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, useNavigate } from 'react-router-dom'\n\nexport interface FullWidthCardProps extends CardProps {\n cardIsButton?: boolean\n desc?: ReactNode\n href?: string\n linkText?: string\n media?: string\n name: ReactNode\n small?: boolean\n to?: To\n}\n\nexport const FullWidthCard: React.FC<FullWidthCardProps> = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isMobile = useIsMobile()\n\n const localRouteChange = (to: To | undefined) => {\n to ? navigate(to) : navigate('/404')\n }\n const externalRouteChange = (href: string | undefined) => {\n href ? window.open(href) : navigate('/404')\n }\n\n return (\n <Card\n elevation={raised ? 3 : 0}\n style={{ height: '100%', width: '100%' }}\n {...props}\n sx={{\n '&:hover': {\n cursor: 'pointer',\n },\n backgroundColor: alpha(theme.palette.primary.light, 0.05),\n }}\n onMouseEnter={() => (isMobile ? null : cardIsButton ? setRaised(true) : null)}\n onMouseLeave={() => (isMobile ? null : cardIsButton ? setRaised(false) : null)}\n onClick={() => (cardIsButton ? (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404')) : null)}\n >\n {media ? <CardMedia component=\"img\" height=\"100\" image={media} alt=\"\" /> : null}\n\n <CardContent>\n <Grid container alignItems=\"center\" paddingY={2} paddingX={2}>\n <Grid item xs={12} md={6}>\n {typeof name === 'string' ? (\n <Typography fontWeight={700} variant=\"h2\" textAlign=\"left\" paddingBottom={1}>\n {name}\n </Typography>\n ) : (\n name\n )}\n </Grid>\n <Grid item xs={12} md={5}>\n <Typography variant=\"body1\" fontWeight={400} textAlign=\"left\">\n {desc}\n </Typography>\n </Grid>\n <Grid item xs={1} display={isMobile ? 'none' : 'flex'} justifyContent=\"center\">\n <Zoom in={raised}>\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </Zoom>\n </Grid>\n </Grid>\n </CardContent>\n <CardActions sx={{ display: { md: isMobile ? 'flex' : 'none' } }}>\n <FlexGrowCol alignItems=\"flex-end\">\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n </Card>\n )\n}\n"],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../../src/components/FullWidthCard/FullWidthCard.tsx"],"sourcesContent":["import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport { alpha, Card, CardActions, CardContent, CardMedia, CardProps, Grid, IconButton, Typography, useTheme, Zoom } from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, useNavigate } from 'react-router-dom'\n\nexport interface FullWidthCardProps extends CardProps {\n cardIsButton?: boolean\n desc?: ReactNode\n href?: string\n linkText?: string\n media?: string\n name: ReactNode\n small?: boolean\n to?: To\n}\n\nexport const FullWidthCard: React.FC<FullWidthCardProps> = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isMobile = useIsMobile()\n\n const localRouteChange = (to: To | undefined) => {\n to ? navigate(to) : navigate('/404')\n }\n const externalRouteChange = (href: string | undefined) => {\n href ? window.open(href) : navigate('/404')\n }\n\n return (\n <Card\n elevation={raised ? 3 : 0}\n style={{ height: '100%', width: '100%' }}\n {...props}\n sx={{\n '&:hover': {\n cursor: 'pointer',\n },\n backgroundColor: alpha(theme.palette.primary.light, 0.05),\n }}\n onMouseEnter={() => (isMobile ? null : cardIsButton ? setRaised(true) : null)}\n onMouseLeave={() => (isMobile ? null : cardIsButton ? setRaised(false) : null)}\n onClick={() => (cardIsButton ? (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404')) : null)}\n >\n {media ? <CardMedia component=\"img\" height=\"100\" image={media} alt=\"\" /> : null}\n\n <CardContent>\n <Grid container alignItems=\"center\" paddingY={2} paddingX={2}>\n <Grid item xs={12} md={6}>\n {typeof name === 'string' ? (\n <Typography fontWeight={700} variant=\"h2\" textAlign=\"left\" paddingBottom={1}>\n {name}\n </Typography>\n ) : (\n name\n )}\n </Grid>\n <Grid item xs={12} md={5}>\n <Typography variant=\"body1\" fontWeight={400} textAlign=\"left\">\n {desc}\n </Typography>\n </Grid>\n <Grid item xs={1} display={isMobile ? 'none' : 'flex'} justifyContent=\"center\">\n <Zoom in={raised}>\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </Zoom>\n </Grid>\n </Grid>\n </CardContent>\n <CardActions sx={{ display: { md: isMobile ? 'flex' : 'none' } }}>\n <FlexGrowCol alignItems=\"flex-end\">\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n </Card>\n )\n}\n"],"mappings":"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","names":["to","href"]}
|
@@ -0,0 +1,95 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __defProp = Object.defineProperty;
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
6
|
+
var __export = (target, all) => {
|
7
|
+
for (var name in all)
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
9
|
+
};
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
12
|
+
for (let key of __getOwnPropNames(from))
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
15
|
+
}
|
16
|
+
return to;
|
17
|
+
};
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
19
|
+
|
20
|
+
// src/components/FullWidthCard/index.ts
|
21
|
+
var FullWidthCard_exports = {};
|
22
|
+
__export(FullWidthCard_exports, {
|
23
|
+
FullWidthCard: () => FullWidthCard
|
24
|
+
});
|
25
|
+
module.exports = __toCommonJS(FullWidthCard_exports);
|
26
|
+
|
27
|
+
// src/components/FullWidthCard/FullWidthCard.tsx
|
28
|
+
var import_icons_material = require("@mui/icons-material");
|
29
|
+
var import_material = require("@mui/material");
|
30
|
+
var import_react_flexbox = require("@xylabs/react-flexbox");
|
31
|
+
var import_react_shared = require("@xyo-network/react-shared");
|
32
|
+
var import_react = require("react");
|
33
|
+
var import_react_router_dom = require("react-router-dom");
|
34
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
35
|
+
var FullWidthCard = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {
|
36
|
+
const theme = (0, import_material.useTheme)();
|
37
|
+
const [raised, setRaised] = (0, import_react.useState)(false);
|
38
|
+
const navigate = (0, import_react_router_dom.useNavigate)();
|
39
|
+
const isMobile = (0, import_react_shared.useIsMobile)();
|
40
|
+
const localRouteChange = (to2) => {
|
41
|
+
to2 ? navigate(to2) : navigate("/404");
|
42
|
+
};
|
43
|
+
const externalRouteChange = (href2) => {
|
44
|
+
href2 ? window.open(href2) : navigate("/404");
|
45
|
+
};
|
46
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
47
|
+
import_material.Card,
|
48
|
+
{
|
49
|
+
elevation: raised ? 3 : 0,
|
50
|
+
style: { height: "100%", width: "100%" },
|
51
|
+
...props,
|
52
|
+
sx: {
|
53
|
+
"&:hover": {
|
54
|
+
cursor: "pointer"
|
55
|
+
},
|
56
|
+
backgroundColor: (0, import_material.alpha)(theme.palette.primary.light, 0.05)
|
57
|
+
},
|
58
|
+
onMouseEnter: () => isMobile ? null : cardIsButton ? setRaised(true) : null,
|
59
|
+
onMouseLeave: () => isMobile ? null : cardIsButton ? setRaised(false) : null,
|
60
|
+
onClick: () => cardIsButton ? href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404") : null,
|
61
|
+
children: [
|
62
|
+
media ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.CardMedia, { component: "img", height: "100", image: media, alt: "" }) : null,
|
63
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.CardContent, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.Grid, { container: true, alignItems: "center", paddingY: 2, paddingX: 2, children: [
|
64
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Grid, { item: true, xs: 12, md: 6, children: typeof name === "string" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { fontWeight: 700, variant: "h2", textAlign: "left", paddingBottom: 1, children: name }) : name }),
|
65
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Grid, { item: true, xs: 12, md: 5, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "body1", fontWeight: 400, textAlign: "left", children: desc }) }),
|
66
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Grid, { item: true, xs: 1, display: isMobile ? "none" : "flex", justifyContent: "center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Zoom, { in: raised, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
67
|
+
import_material.IconButton,
|
68
|
+
{
|
69
|
+
color: "primary",
|
70
|
+
size: small ? "small" : "medium",
|
71
|
+
onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
|
72
|
+
disableFocusRipple: true,
|
73
|
+
disableRipple: true,
|
74
|
+
disableTouchRipple: true,
|
75
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.ArrowForwardRounded, { fontSize: small ? "small" : "medium" })
|
76
|
+
}
|
77
|
+
) }) })
|
78
|
+
] }) }),
|
79
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.CardActions, { sx: { display: { md: isMobile ? "flex" : "none" } }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_flexbox.FlexGrowCol, { alignItems: "flex-end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
80
|
+
import_material.IconButton,
|
81
|
+
{
|
82
|
+
color: "primary",
|
83
|
+
size: small ? "small" : "medium",
|
84
|
+
onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
|
85
|
+
disableFocusRipple: true,
|
86
|
+
disableRipple: true,
|
87
|
+
disableTouchRipple: true,
|
88
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.ArrowForwardRounded, { fontSize: small ? "small" : "medium" })
|
89
|
+
}
|
90
|
+
) }) })
|
91
|
+
]
|
92
|
+
}
|
93
|
+
);
|
94
|
+
};
|
95
|
+
//# sourceMappingURL=index.cjs.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/FullWidthCard/index.ts","../../../../src/components/FullWidthCard/FullWidthCard.tsx"],"sourcesContent":["export * from './FullWidthCard'\n","import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport { alpha, Card, CardActions, CardContent, CardMedia, CardProps, Grid, IconButton, Typography, useTheme, Zoom } from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, useNavigate } from 'react-router-dom'\n\nexport interface FullWidthCardProps extends CardProps {\n cardIsButton?: boolean\n desc?: ReactNode\n href?: string\n linkText?: string\n media?: string\n name: ReactNode\n small?: boolean\n to?: To\n}\n\nexport const FullWidthCard: React.FC<FullWidthCardProps> = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isMobile = useIsMobile()\n\n const localRouteChange = (to: To | undefined) => {\n to ? navigate(to) : navigate('/404')\n }\n const externalRouteChange = (href: string | undefined) => {\n href ? window.open(href) : navigate('/404')\n }\n\n return (\n <Card\n elevation={raised ? 3 : 0}\n style={{ height: '100%', width: '100%' }}\n {...props}\n sx={{\n '&:hover': {\n cursor: 'pointer',\n },\n backgroundColor: alpha(theme.palette.primary.light, 0.05),\n }}\n onMouseEnter={() => (isMobile ? null : cardIsButton ? setRaised(true) : null)}\n onMouseLeave={() => (isMobile ? null : cardIsButton ? setRaised(false) : null)}\n onClick={() => (cardIsButton ? (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404')) : null)}\n >\n {media ? <CardMedia component=\"img\" height=\"100\" image={media} alt=\"\" /> : null}\n\n <CardContent>\n <Grid container alignItems=\"center\" paddingY={2} paddingX={2}>\n <Grid item xs={12} md={6}>\n {typeof name === 'string' ? (\n <Typography fontWeight={700} variant=\"h2\" textAlign=\"left\" paddingBottom={1}>\n {name}\n </Typography>\n ) : (\n name\n )}\n </Grid>\n <Grid item xs={12} md={5}>\n <Typography variant=\"body1\" fontWeight={400} textAlign=\"left\">\n {desc}\n </Typography>\n </Grid>\n <Grid item xs={1} display={isMobile ? 'none' : 'flex'} justifyContent=\"center\">\n <Zoom in={raised}>\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </Zoom>\n </Grid>\n </Grid>\n </CardContent>\n <CardActions sx={{ display: { md: isMobile ? 'flex' : 'none' } }}>\n <FlexGrowCol alignItems=\"flex-end\">\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() => (href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate('/404'))}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n </Card>\n )\n}\n"],"mappings":"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","names":["to","href","ArrowForwardRoundedIcon"]}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/FullWidthCard/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
|