@activecollab/components 1.0.49 → 1.0.52
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/EntityCard/EntityCard.js +4 -8
- package/dist/cjs/components/EntityCard/EntityCard.js.map +1 -1
- package/dist/cjs/components/EntityCard/Styles.js +1 -15
- package/dist/cjs/components/EntityCard/Styles.js.map +1 -1
- package/dist/cjs/components/GlobalStyle.js +1 -1
- package/dist/cjs/components/GlobalStyle.js.map +1 -1
- package/dist/cjs/components/ScrollShadow/ScrollShadow.js +11 -1
- package/dist/cjs/components/ScrollShadow/ScrollShadow.js.map +1 -1
- package/dist/cjs/components/ScrollShadow/Styles.js +20 -4
- package/dist/cjs/components/ScrollShadow/Styles.js.map +1 -1
- package/dist/esm/components/EntityCard/EntityCard.d.ts +2 -2
- package/dist/esm/components/EntityCard/EntityCard.d.ts.map +1 -1
- package/dist/esm/components/EntityCard/EntityCard.js +5 -9
- package/dist/esm/components/EntityCard/EntityCard.js.map +1 -1
- package/dist/esm/components/EntityCard/Styles.d.ts +0 -1
- package/dist/esm/components/EntityCard/Styles.d.ts.map +1 -1
- package/dist/esm/components/EntityCard/Styles.js +0 -9
- package/dist/esm/components/EntityCard/Styles.js.map +1 -1
- package/dist/esm/components/GlobalStyle.d.ts.map +1 -1
- package/dist/esm/components/GlobalStyle.js +1 -1
- package/dist/esm/components/GlobalStyle.js.map +1 -1
- package/dist/esm/components/ScrollShadow/ScrollShadow.d.ts +2 -0
- package/dist/esm/components/ScrollShadow/ScrollShadow.d.ts.map +1 -1
- package/dist/esm/components/ScrollShadow/ScrollShadow.js +11 -1
- package/dist/esm/components/ScrollShadow/ScrollShadow.js.map +1 -1
- package/dist/esm/components/ScrollShadow/Styles.d.ts +9 -4
- package/dist/esm/components/ScrollShadow/Styles.d.ts.map +1 -1
- package/dist/esm/components/ScrollShadow/Styles.js +20 -4
- package/dist/esm/components/ScrollShadow/Styles.js.map +1 -1
- package/dist/index.js +36 -21
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -23,8 +23,7 @@ var EntityCard = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
23
23
|
var _ref$renderAs = _ref.renderAs,
|
|
24
24
|
renderAs = _ref$renderAs === void 0 ? "list-item" : _ref$renderAs,
|
|
25
25
|
properties = _ref.properties,
|
|
26
|
-
|
|
27
|
-
linkClassName = _ref.linkClassName;
|
|
26
|
+
className = _ref.className;
|
|
28
27
|
var renderAsListItem = (0, _react.useCallback)(function (properties) {
|
|
29
28
|
return properties.filter(function (p) {
|
|
30
29
|
return p.showInList;
|
|
@@ -67,19 +66,16 @@ var EntityCard = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
67
66
|
return renderProperty(p);
|
|
68
67
|
})));
|
|
69
68
|
}, []);
|
|
70
|
-
return /*#__PURE__*/_react.default.createElement(_Styles.
|
|
71
|
-
href: link,
|
|
72
|
-
className: linkClassName
|
|
73
|
-
}, /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityCard, {
|
|
69
|
+
return /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityCard, {
|
|
74
70
|
ref: ref,
|
|
75
71
|
hoverable: true,
|
|
76
72
|
className: (0, _classnames.default)("entity-card-wrapper", {
|
|
77
73
|
"grid-item": renderAs === "grid-item",
|
|
78
74
|
"list-item": renderAs === "list-item"
|
|
79
|
-
}),
|
|
75
|
+
}, className),
|
|
80
76
|
paperType: renderAs === "grid-item" ? "paper-1" : "paper-2",
|
|
81
77
|
$renderAs: renderAs
|
|
82
|
-
}, renderAs === "list-item" ? renderAsListItem(properties) : null, renderAs === "grid-item" ? renderAsGridItem(properties) : null)
|
|
78
|
+
}, renderAs === "list-item" ? renderAsListItem(properties) : null, renderAs === "grid-item" ? renderAsGridItem(properties) : null);
|
|
83
79
|
});
|
|
84
80
|
exports.EntityCard = EntityCard;
|
|
85
81
|
EntityCard.displayName = "EntityCard";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/EntityCard/EntityCard.tsx"],"names":["EntityCard","ref","renderAs","properties","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/EntityCard/EntityCard.tsx"],"names":["EntityCard","ref","renderAs","properties","className","renderAsListItem","filter","p","showInList","map","name","render","renderAsGridItem","headerSection","cardSection","bodySection","footerSection","renderProperty","displayName"],"mappings":";;;;;;;;;AAAA;;AAOA;;AACA;;;;;;;;AAoBO,IAAMA,UAAU,gBAAG,uBACxB,gBAMEC,GANF,EAOK;AAAA,2BALDC,QAKC;AAAA,MALDA,QAKC,8BALU,WAKV;AAAA,MAJDC,UAIC,QAJDA,UAIC;AAAA,MAHDC,SAGC,QAHDA,SAGC;AACH,MAAMC,gBAAgB,GAAG,wBAAY,UAACF,UAAD,EAAqC;AACxE,WAAOA,UAAU,CACdG,MADI,CACG,UAACC,CAAD;AAAA,aAAOA,CAAC,CAACC,UAAT;AAAA,KADH,EAEJC,GAFI,CAEA,UAACF,CAAD,EAAO;AACV,0BACE;AAAK,QAAA,GAAG,EAAEA,CAAC,CAACG,IAAZ;AAAkB,QAAA,SAAS,4BAAqBH,CAAC,CAACG,IAAvB;AAA3B,SACGH,CAAC,CAACI,MAAF,EADH,CADF;AAKD,KARI,CAAP;AASD,GAVwB,EAUtB,EAVsB,CAAzB;AAYA,MAAMC,gBAAgB,GAAG,wBAAY,UAACT,UAAD,EAAqC;AACxE,QAAMU,aAAa,GAAGV,UAAU,CAACG,MAAX,CACpB,UAACC,CAAD;AAAA,aAA0BA,CAAC,CAACO,WAAF,KAAkB,QAA5C;AAAA,KADoB,CAAtB;AAGA,QAAMC,WAAW,GAAGZ,UAAU,CAACG,MAAX,CAClB,UAACC,CAAD;AAAA,aAA0BA,CAAC,CAACO,WAAF,KAAkB,MAA5C;AAAA,KADkB,CAApB;AAGA,QAAME,aAAa,GAAGb,UAAU,CAACG,MAAX,CACpB,UAACC,CAAD;AAAA,aAAOA,CAAC,CAACO,WAAF,KAAkB,QAAzB;AAAA,KADoB,CAAtB;;AAGA,QAAMG,cAAc,GAAG,SAAjBA,cAAiB,CAACV,CAAD;AAAA,0BACrB;AAAK,QAAA,GAAG,EAAEA,CAAC,CAACG,IAAZ;AAAkB,QAAA,SAAS,4BAAqBH,CAAC,CAACG,IAAvB;AAA3B,SACGH,CAAC,CAACI,MAAF,EADH,CADqB;AAAA,KAAvB;;AAKA,wBACE,yEACE;AAAK,MAAA,SAAS,EAAE;AAAhB,OACGE,aAAa,CAACJ,GAAd,CAAkB,UAACF,CAAD;AAAA,aAAOU,cAAc,CAACV,CAAD,CAArB;AAAA,KAAlB,CADH,CADF,eAIE;AAAK,MAAA,SAAS,EAAE;AAAhB,OACGQ,WAAW,CAACN,GAAZ,CAAgB,UAACF,CAAD;AAAA,aAAOU,cAAc,CAACV,CAAD,CAArB;AAAA,KAAhB,CADH,CAJF,eAOE;AAAK,MAAA,SAAS,EAAE;AAAhB,OACGS,aAAa,CAACP,GAAd,CAAkB,UAACF,CAAD;AAAA,aAAOU,cAAc,CAACV,CAAD,CAArB;AAAA,KAAlB,CADH,CAPF,CADF;AAaD,GA5BwB,EA4BtB,EA5BsB,CAAzB;AA8BA,sBACE,6BAAC,wBAAD;AACE,IAAA,GAAG,EAAEN,GADP;AAEE,IAAA,SAAS,MAFX;AAGE,IAAA,SAAS,EAAE,yBACT,qBADS,EAET;AACE,mBAAaC,QAAQ,KAAK,WAD5B;AAEE,mBAAaA,QAAQ,KAAK;AAF5B,KAFS,EAMTE,SANS,CAHb;AAWE,IAAA,SAAS,EAAEF,QAAQ,KAAK,WAAb,GAA2B,SAA3B,GAAuC,SAXpD;AAYE,IAAA,SAAS,EAAEA;AAZb,KAcGA,QAAQ,KAAK,WAAb,GAA2BG,gBAAgB,CAACF,UAAD,CAA3C,GAA0D,IAd7D,EAeGD,QAAQ,KAAK,WAAb,GAA2BU,gBAAgB,CAACT,UAAD,CAA3C,GAA0D,IAf7D,CADF;AAmBD,CAtEuB,CAAnB;;AAyEPH,UAAU,CAACkB,WAAX,GAAyB,YAAzB","sourcesContent":["import React, {\n Ref,\n HTMLAttributes,\n forwardRef,\n ReactNode,\n useCallback,\n} from \"react\";\nimport classnames from \"classnames\";\nimport { StyledEntityCard } from \"./Styles\";\n\nexport type cardSection = \"header\" | \"body\" | \"footer\";\n\nexport interface IEntityProperties {\n name: string;\n render: () => ReactNode;\n showInList?: boolean;\n cardSection: cardSection;\n className?: string;\n}\n\nexport interface IEntityCardProps {\n renderAs?: \"list-item\" | \"grid-item\";\n properties: IEntityProperties[];\n ref?: Ref<HTMLDivElement>;\n link?: string;\n className?: string;\n}\n\nexport const EntityCard = forwardRef(\n (\n {\n renderAs = \"list-item\",\n properties,\n className,\n }: HTMLAttributes<HTMLDivElement> & IEntityCardProps,\n ref: Ref<HTMLDivElement> | null | undefined\n ) => {\n const renderAsListItem = useCallback((properties: IEntityProperties[]) => {\n return properties\n .filter((p) => p.showInList)\n .map((p) => {\n return (\n <div key={p.name} className={`entity-property-${p.name}`}>\n {p.render()}\n </div>\n );\n });\n }, []);\n\n const renderAsGridItem = useCallback((properties: IEntityProperties[]) => {\n const headerSection = properties.filter(\n (p: IEntityProperties) => p.cardSection === \"header\"\n );\n const bodySection = properties.filter(\n (p: IEntityProperties) => p.cardSection === \"body\"\n );\n const footerSection = properties.filter(\n (p) => p.cardSection === \"footer\"\n );\n const renderProperty = (p: IEntityProperties): ReactNode => (\n <div key={p.name} className={`entity-property-${p.name}`}>\n {p.render()}\n </div>\n );\n return (\n <>\n <div className={\"card-header\"}>\n {headerSection.map((p) => renderProperty(p))}\n </div>\n <div className={\"card-body\"}>\n {bodySection.map((p) => renderProperty(p))}\n </div>\n <div className={\"card-footer\"}>\n {footerSection.map((p) => renderProperty(p))}\n </div>\n </>\n );\n }, []);\n\n return (\n <StyledEntityCard\n ref={ref}\n hoverable\n className={classnames(\n \"entity-card-wrapper\",\n {\n \"grid-item\": renderAs === \"grid-item\",\n \"list-item\": renderAs === \"list-item\",\n },\n className\n )}\n paperType={renderAs === \"grid-item\" ? \"paper-1\" : \"paper-2\"}\n $renderAs={renderAs}\n >\n {renderAs === \"list-item\" ? renderAsListItem(properties) : null}\n {renderAs === \"grid-item\" ? renderAsGridItem(properties) : null}\n </StyledEntityCard>\n );\n }\n);\n\nEntityCard.displayName = \"EntityCard\";\n"],"file":"EntityCard.js"}
|
|
@@ -5,16 +5,12 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.
|
|
8
|
+
exports.StyledEntityCard = void 0;
|
|
9
9
|
|
|
10
10
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
11
11
|
|
|
12
|
-
var _BoxSizingStyle = require("../BoxSizingStyle");
|
|
13
|
-
|
|
14
12
|
var _Card = require("../Card");
|
|
15
13
|
|
|
16
|
-
var _FontStyle = require("../FontStyle");
|
|
17
|
-
|
|
18
14
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
19
15
|
|
|
20
16
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -29,14 +25,4 @@ var StyledEntityCard = (0, _styledComponents.default)(_Card.Card).withConfig({
|
|
|
29
25
|
});
|
|
30
26
|
exports.StyledEntityCard = StyledEntityCard;
|
|
31
27
|
StyledEntityCard.displayName = "StyledEntityCard";
|
|
32
|
-
|
|
33
|
-
var StyledLinkEntityCard = _styledComponents.default.a.withConfig({
|
|
34
|
-
displayName: "Styles__StyledLinkEntityCard",
|
|
35
|
-
componentId: "sc-3vmxf-1"
|
|
36
|
-
})(["", " ", " ", ""], {
|
|
37
|
-
"textDecoration": "none"
|
|
38
|
-
}, _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle);
|
|
39
|
-
|
|
40
|
-
exports.StyledLinkEntityCard = StyledLinkEntityCard;
|
|
41
|
-
StyledLinkEntityCard.displayName = "StyledLinkEntityCard";
|
|
42
28
|
//# sourceMappingURL=Styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/EntityCard/Styles.ts"],"names":["StyledEntityCard","Card","props","$renderAs","css","displayName"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/EntityCard/Styles.ts"],"names":["StyledEntityCard","Card","props","$renderAs","css","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;;;;;AAEO,IAAMA,gBAAgB,GAAG,+BAAOC,UAAP,CAAH;AAAA;AAAA;AAAA,iDAIzB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,SAAN,KAAoB,WAApB,QACAC,qBADA,+FADA;AAAA,CAJyB,EAczB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,SAAN,KAAoB,WAApB,QACAC,qBADA,2FADA;AAAA,CAdyB,CAAtB;;AA2BPJ,gBAAgB,CAACK,WAAjB,GAA+B,kBAA/B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Card } from \"../Card\";\n\nexport const StyledEntityCard = styled(Card)<{ $renderAs: string }>`\n padding: 12px;\n line-height: 1.375;\n\n ${(props) =>\n props.$renderAs === \"list-item\" &&\n css`\n display: grid;\n grid-auto-flow: column;\n align-items: center;\n min-height: 48px;\n margin-bottom: 4px;\n `}\n\n ${(props) =>\n props.$renderAs === \"grid-item\" &&\n css`\n display: flex;\n flex-direction: column;\n height: 250px;\n width: 250px;\n\n .card-body {\n flex-grow: 1;\n }\n `}\n`;\nStyledEntityCard.displayName = \"StyledEntityCard\";\n"],"file":"Styles.js"}
|
|
@@ -7,6 +7,6 @@ exports.GlobalStyle = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _styledComponents = require("styled-components");
|
|
9
9
|
|
|
10
|
-
var GlobalStyle = (0, _styledComponents.createGlobalStyle)([":root{--color-primary:#5d2bff;--color-secondary:#5d2bff;--color-theme-100:#ffffff;--color-theme-200:#f6f6f9;--color-theme-300:#ebebee;--color-theme-400:#d7d7da;--color-theme-500:#b9b9bd;--color-theme-600:#89898e;--color-theme-700:#6d6d73;--color-theme-800:#5b5b61;--color-theme-900:#303037;--color-primary-200:rgba(93,43,255,0.05);--color-primary-300:rgba(93,43,255,0.1);--color-primary-400:rgba(93,43,255,0.25);--color-primary-500:rgba(93,43,255,0.5);--color-primary-600:rgba(93,43,255,0.75);--color-primary-700:#5d2bff;--color-primary-800:#4a21cd;--color-primary-900:#32178b;--color-secondary-200:rgba(93,43,255,0.05);--color-secondary-300:rgba(93,43,255,0.1);--color-secondary-400:rgba(93,43,255,0.25);--color-secondary-500:rgba(93,43,255,0.5);--color-secondary-600:rgba(93,43,255,0.75);--color-secondary-700:#5d2bff;--color-secondary-800:#4a21cd;--color-secondary-900:#32178b;--color-primary-opaque-300:#efeaff;--color-primary-opaque-400:#d6caff;--color-secondary-opaque-300:#efeaff;--color-secondary-opaque-400:#d6caff;--color-sucess-green:#64cd93;--body-bg-main
|
|
10
|
+
var GlobalStyle = (0, _styledComponents.createGlobalStyle)([":root{--color-primary:#5d2bff;--color-secondary:#5d2bff;--color-theme-100:#ffffff;--color-theme-200:#f6f6f9;--color-theme-300:#ebebee;--color-theme-400:#d7d7da;--color-theme-500:#b9b9bd;--color-theme-600:#89898e;--color-theme-700:#6d6d73;--color-theme-800:#5b5b61;--color-theme-900:#303037;--color-primary-200:rgba(93,43,255,0.05);--color-primary-300:rgba(93,43,255,0.1);--color-primary-400:rgba(93,43,255,0.25);--color-primary-500:rgba(93,43,255,0.5);--color-primary-600:rgba(93,43,255,0.75);--color-primary-700:#5d2bff;--color-primary-800:#4a21cd;--color-primary-900:#32178b;--color-secondary-200:rgba(93,43,255,0.05);--color-secondary-300:rgba(93,43,255,0.1);--color-secondary-400:rgba(93,43,255,0.25);--color-secondary-500:rgba(93,43,255,0.5);--color-secondary-600:rgba(93,43,255,0.75);--color-secondary-700:#5d2bff;--color-secondary-800:#4a21cd;--color-secondary-900:#32178b;--color-primary-opaque-300:#efeaff;--color-primary-opaque-400:#d6caff;--color-secondary-opaque-300:#efeaff;--color-secondary-opaque-400:#d6caff;--color-sucess-green:#64cd93;--body-bg-main:rgb(244,245,247);--body-bg-main-transparent:rgba(244,245,247,0);--page-paper-main:#ffffff;--border-primary:#d7d7da;--note-bg:#fff9f1;--shadow-primary-hover:0 64px 64px 0 rgba(0,0,0,0.1),0 32px 32px 0 rgba(0,0,0,0.06),0 16px 16px 0 rgba(0,0,0,0.04),0 4px 4px 0 rgba(0,0,0,0.04),0 2px 2px 0 rgba(0,0,0,0.04);--shadow-primary:0 64px 64px 0 rgba(0,0,0,0.06),0 32px 32px 0 rgba(0,0,0,0.03),0 16px 16px 0 rgba(0,0,0,0.02),0 4px 4px 0 rgba(0,0,0,0.02),0 2px 2px 0 rgba(0,0,0,0.02);--shadow-secondary:0 4px 14px 0 rgba(0,0,0,0.17);--shadow-tertiary:0 4px 6px -2px rgba(0,0,0,0.05),0 10px 15px -3px rgba(0,0,0,0.1);--shadow-tertiary-hover:0 4px 10px -2px rgba(0,0,0,0.1),0 12px 20px -3px rgba(0,0,0,0.2);--page-paper-main-shadow:rgba( 255,255,255,0 );--modal-background:rgba(244,245,247,0.6);--highlight-dark:rgba(0,0,0,0.03);--input-background-color:#ffffff;--red-alert:rgb(237,97,97);--only-white:#ffffff;--only-black:#000000;--ac-br-4:4px;--ac-br-6:6px;--ac-br-8:8px;--ac-br-rounded:999px;}.cupcake{--color-primary:#29bcdd;--color-secondary:#fe6fa7;--color-primary-200:rgba(41,188,221,0.07);--color-primary-300:rgba(41,188,221,0.12);--color-primary-400:rgba(41,188,221,0.26);--color-primary-500:rgba(41,188,221,0.52);--color-primary-600:rgba(41,188,221,0.75);--color-primary-700:#29bcdd;--color-primary-800:#219fbb;--color-primary-900:#1a768b;--color-secondary-200:rgba(254,111,167,0.07);--color-secondary-300:rgba(254,111,167,0.13);--color-secondary-400:rgba(254,111,167,0.27);--color-secondary-500:rgba(254,111,167,0.52);--color-secondary-600:rgba(254,111,167,0.75);--color-secondary-700:#fe6fa7;--color-secondary-800:#dd6091;--color-secondary-900:#ab496f;--color-primary-opaque-300:#e5f7fb;--color-primary-opaque-400:#c8eef6;--color-secondary-opaque-300:#ffecf4;--color-secondary-opaque-400:#ffd8e7;}.classic{--color-primary:#4182f2;--color-secondary:#4182f2;--color-primary-200:rgba(65,130,242,0.07);--color-primary-300:rgba(65,130,242,0.13);--color-primary-400:rgba(65,130,242,0.26);--color-primary-500:rgba(65,130,242,0.52);--color-primary-600:rgba(65,130,242,0.75);--color-primary-700:#4182f2;--color-primary-800:#356bc8;--color-primary-900:#244a8a;--color-secondary-200:rgba(65,130,242,0.07);--color-secondary-300:rgba(65,130,242,0.13);--color-secondary-400:rgba(65,130,242,0.26);--color-secondary-500:rgba(65,130,242,0.52);--color-secondary-600:rgba(65,130,242,0.75);--color-secondary-700:#4182f2;--color-secondary-800:#356bc8;--color-secondary-900:#244a8a;--color-primary-opaque-300:#e6effd;--color-primary-opaque-400:#cedffc;--color-secondary-opaque-300:#e6effd;--color-secondary-opaque-400:#cedffc;}.neon{--color-primary:#67ffc8;--color-secondary:#67ffc8;--color-theme-100:#000000;--color-theme-200:#31333e;--color-theme-300:#2b2d37;--color-theme-400:#1f2024;--color-theme-500:#99999e;--color-theme-600:#89898e;--color-theme-700:#b0b0b5;--color-theme-800:#dfdfe5;--color-theme-900:#ffffff;--color-primary-200:rgba(103,255,200,0.05);--color-primary-300:rgba(103,255,200,0.1);--color-primary-400:rgba(103,255,200,0.25);--color-primary-500:rgba(103,255,200,0.5);--color-primary-600:rgba(103,255,200,0.75);--color-primary-700:#67ffc8;--color-primary-800:#a5ffdf;--color-primary-900:#d0fdec;--color-secondary-200:rgba(103,255,200,0.05);--color-secondary-300:rgba(103,255,200,0.1);--color-secondary-400:rgba(103,255,200,0.25);--color-secondary-500:rgba(103,255,200,0.5);--color-secondary-600:rgba(103,255,200,0.75);--color-secondary-700:#67ffc8;--color-secondary-800:#a5ffdf;--color-secondary-900:#d0fdec;--color-primary-opaque-300:#3b4e51;--color-primary-opaque-400:#436b64;--color-secondary-opaque-300:#3b4e51;--color-secondary-opaque-400:#436b64;--body-bg-main:rgb(44,46,56);--body-bg-main-transparent:rgba(44,46,56,0);--page-paper-main:#373a44;--border-primary:#1f2024;--note-bg:#464545;--shadow-primary-hover:0 64px 64px 0 rgba(0,0,0,0.2),0 32px 32px 0 rgba(0,0,0,0.2),0 16px 16px 0 rgba(0,0,0,0.2),0 4px 4px 0 rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.2);--shadow-primary:0 64px 64px 0 rgba(0,0,0,0.1),0 32px 32px 0 rgba(0,0,0,0.1),0 16px 16px 0 rgba(0,0,0,0.1),0 4px 4px 0 rgba(0,0,0,0.1),0 2px 2px 0 rgba(0,0,0,0.1);--shadow-secondary:0 4px 14px 0 rgba(0,0,0,0.3);--shadow-tertiary:0 4px 6px -2px rgba(0,0,0,0.1),0 10px 15px -3px rgba(0,0,0,0.15);--shadow-tertiary-hover:0 4px 12px -2px rgba(0,0,0,0.4),0 10px 30px -3px rgba(0,0,0,0.5);--page-paper-main-shadow:rgba( 55,58,68,0 );--modal-background:rgba(44,46,56,0.7);--highlight-dark:rgba(0,0,0,0.06);--input-background-color:#2c2e38;--only-white:#ffffff;--only-black:#000000;}.ac-shadow,.ac-shadow--raised{&--lg{box-shadow:var(--shadow-primary);}&--sm{box-shadow:var(--shadow-tertiary);}}.ac-shadow--raised{&--lg{transition:box-shadow 0.3s;&:hover{box-shadow:var(--shadow-primary-hover);}}&--sm{transition:box-shadow 0.3s;&:hover{box-shadow:var(--shadow-tertiary-hover);}}}.ac-shadow-optimized--sm{position:relative;box-shadow:var(--shadow-tertiary);&::before{position:absolute;top:0;left:0;width:100%;height:100%;content:\"\";box-shadow:var(--shadow-tertiary);opacity:0;border-radius:var(--ac-br-6);transition:opacity 0.3s ease;z-index:-1;}@media (hover:hover){&:hover::before{opacity:1;}}}.ac-shadow-optimized--lg{position:relative;box-shadow:var(--shadow-primary);&::before{position:absolute;top:0;left:0;width:100%;height:100%;content:\"\";box-shadow:var(--shadow-primary);opacity:0;border-radius:var(--ac-br-8);transition:opacity 0.3s ease;z-index:-1;}@media (hover:hover){&:hover::before{opacity:1;}}}.ac-border-radius{&-4{border-radius:var(--ac-br-4);}&-6{border-radius:var(--ac-br-6);}&-8{border-radius:var(--ac-br-8);}&-rounded{border-radius:var(--ac-br-rounded);}}"]);
|
|
11
11
|
exports.GlobalStyle = GlobalStyle;
|
|
12
12
|
//# sourceMappingURL=GlobalStyle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/GlobalStyle.ts"],"names":["GlobalStyle","createGlobalStyle"],"mappings":";;;;;;;AAAA;;AAEO,IAAMA,WAAW,OAAGC,mCAAH,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/GlobalStyle.ts"],"names":["GlobalStyle","createGlobalStyle"],"mappings":";;;;;;;AAAA;;AAEO,IAAMA,WAAW,OAAGC,mCAAH,ojNAAjB","sourcesContent":["import { createGlobalStyle } from \"styled-components\";\n\nexport const GlobalStyle = createGlobalStyle`\n :root {\n --color-primary: #5d2bff;\n --color-secondary: #5d2bff;\n\n --color-theme-100: #ffffff;\n --color-theme-200: #f6f6f9;\n --color-theme-300: #ebebee;\n --color-theme-400: #d7d7da;\n --color-theme-500: #b9b9bd;\n --color-theme-600: #89898e;\n --color-theme-700: #6d6d73;\n --color-theme-800: #5b5b61;\n --color-theme-900: #303037;\n\n --color-primary-200: rgba(93, 43, 255, 0.05);\n --color-primary-300: rgba(93, 43, 255, 0.1);\n --color-primary-400: rgba(93, 43, 255, 0.25);\n --color-primary-500: rgba(93, 43, 255, 0.5);\n --color-primary-600: rgba(93, 43, 255, 0.75);\n --color-primary-700: #5d2bff;\n --color-primary-800: #4a21cd;\n --color-primary-900: #32178b;\n\n --color-secondary-200: rgba(93, 43, 255, 0.05);\n --color-secondary-300: rgba(93, 43, 255, 0.1);\n --color-secondary-400: rgba(93, 43, 255, 0.25);\n --color-secondary-500: rgba(93, 43, 255, 0.5);\n --color-secondary-600: rgba(93, 43, 255, 0.75);\n --color-secondary-700: #5d2bff;\n --color-secondary-800: #4a21cd;\n --color-secondary-900: #32178b;\n\n --color-primary-opaque-300: #efeaff;\n --color-primary-opaque-400: #d6caff;\n\n --color-secondary-opaque-300: #efeaff;\n --color-secondary-opaque-400: #d6caff;\n\n --color-sucess-green: #64cd93;\n\n --body-bg-main: rgb(244, 245, 247);\n --body-bg-main-transparent: rgba(244, 245, 247, 0);\n --page-paper-main: #ffffff;\n --border-primary: #d7d7da;\n\n --note-bg: #fff9f1;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.06), 0 16px 16px 0 rgba(0, 0, 0, 0.04),\n 0 4px 4px 0 rgba(0, 0, 0, 0.04), 0 2px 2px 0 rgba(0, 0, 0, 0.04);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.06),\n 0 32px 32px 0 rgba(0, 0, 0, 0.03), 0 16px 16px 0 rgba(0, 0, 0, 0.02),\n 0 4px 4px 0 rgba(0, 0, 0, 0.02), 0 2px 2px 0 rgba(0, 0, 0, 0.02);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.17);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.05),\n 0 10px 15px -3px rgba(0, 0, 0, 0.1);\n --shadow-tertiary-hover: 0 4px 10px -2px rgba(0, 0, 0, 0.1),\n 0 12px 20px -3px rgba(0, 0, 0, 0.2);\n\n --page-paper-main-shadow: rgba(\n 255,\n 255,\n 255,\n 0\n ); /* Shadow list shadow for page paper main */\n\n --modal-background: rgba(244, 245, 247, 0.6);\n\n --highlight-dark: rgba(0, 0, 0, 0.03);\n\n --input-background-color: #ffffff;\n\n --red-alert: rgb(237, 97, 97);\n\n --only-white: #ffffff;\n\n --only-black: #000000;\n\n --ac-br-4: 4px;\n\n --ac-br-6: 6px;\n\n --ac-br-8: 8px;\n\n --ac-br-rounded: 999px;\n }\n\n .cupcake {\n --color-primary: #29bcdd;\n --color-secondary: #fe6fa7;\n\n --color-primary-200: rgba(41, 188, 221, 0.07);\n --color-primary-300: rgba(41, 188, 221, 0.12);\n --color-primary-400: rgba(41, 188, 221, 0.26);\n --color-primary-500: rgba(41, 188, 221, 0.52);\n --color-primary-600: rgba(41, 188, 221, 0.75);\n --color-primary-700: #29bcdd;\n --color-primary-800: #219fbb;\n --color-primary-900: #1a768b;\n\n --color-secondary-200: rgba(254, 111, 167, 0.07);\n --color-secondary-300: rgba(254, 111, 167, 0.13);\n --color-secondary-400: rgba(254, 111, 167, 0.27);\n --color-secondary-500: rgba(254, 111, 167, 0.52);\n --color-secondary-600: rgba(254, 111, 167, 0.75);\n --color-secondary-700: #fe6fa7;\n --color-secondary-800: #dd6091;\n --color-secondary-900: #ab496f;\n\n --color-primary-opaque-300: #e5f7fb;\n --color-primary-opaque-400: #c8eef6;\n\n --color-secondary-opaque-300: #ffecf4;\n --color-secondary-opaque-400: #ffd8e7;\n }\n\n .classic {\n --color-primary: #4182f2;\n --color-secondary: #4182f2;\n\n --color-primary-200: rgba(65, 130, 242, 0.07);\n --color-primary-300: rgba(65, 130, 242, 0.13);\n --color-primary-400: rgba(65, 130, 242, 0.26);\n --color-primary-500: rgba(65, 130, 242, 0.52);\n --color-primary-600: rgba(65, 130, 242, 0.75);\n --color-primary-700: #4182f2;\n --color-primary-800: #356bc8;\n --color-primary-900: #244a8a;\n\n --color-secondary-200: rgba(65, 130, 242, 0.07);\n --color-secondary-300: rgba(65, 130, 242, 0.13);\n --color-secondary-400: rgba(65, 130, 242, 0.26);\n --color-secondary-500: rgba(65, 130, 242, 0.52);\n --color-secondary-600: rgba(65, 130, 242, 0.75);\n --color-secondary-700: #4182f2;\n --color-secondary-800: #356bc8;\n --color-secondary-900: #244a8a;\n\n --color-primary-opaque-300: #e6effd;\n --color-primary-opaque-400: #cedffc;\n\n --color-secondary-opaque-300: #e6effd;\n --color-secondary-opaque-400: #cedffc;\n }\n\n .neon {\n --color-primary: #67ffc8;\n --color-secondary: #67ffc8;\n\n --color-theme-100: #000000;\n --color-theme-200: #31333e;\n --color-theme-300: #2b2d37;\n --color-theme-400: #1f2024;\n --color-theme-500: #99999e;\n --color-theme-600: #89898e;\n --color-theme-700: #b0b0b5;\n --color-theme-800: #dfdfe5;\n --color-theme-900: #ffffff;\n\n --color-primary-200: rgba(103, 255, 200, 0.05);\n --color-primary-300: rgba(103, 255, 200, 0.1);\n --color-primary-400: rgba(103, 255, 200, 0.25);\n --color-primary-500: rgba(103, 255, 200, 0.5);\n --color-primary-600: rgba(103, 255, 200, 0.75);\n --color-primary-700: #67ffc8;\n --color-primary-800: #a5ffdf;\n --color-primary-900: #d0fdec;\n\n --color-secondary-200: rgba(103, 255, 200, 0.05);\n --color-secondary-300: rgba(103, 255, 200, 0.1);\n --color-secondary-400: rgba(103, 255, 200, 0.25);\n --color-secondary-500: rgba(103, 255, 200, 0.5);\n --color-secondary-600: rgba(103, 255, 200, 0.75);\n --color-secondary-700: #67ffc8;\n --color-secondary-800: #a5ffdf;\n --color-secondary-900: #d0fdec;\n\n --color-primary-opaque-300: #3b4e51;\n --color-primary-opaque-400: #436b64;\n\n --color-secondary-opaque-300: #3b4e51;\n --color-secondary-opaque-400: #436b64;\n\n --body-bg-main: rgb(44, 46, 56);\n --body-bg-main-transparent: rgba(44, 46, 56, 0);\n --page-paper-main: #373a44;\n --border-primary: #1f2024;\n\n --note-bg: #464545;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.2),\n 0 32px 32px 0 rgba(0, 0, 0, 0.2), 0 16px 16px 0 rgba(0, 0, 0, 0.2),\n 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.1), 0 16px 16px 0 rgba(0, 0, 0, 0.1),\n 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.3);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.1),\n 0 10px 15px -3px rgba(0, 0, 0, 0.15);\n --shadow-tertiary-hover: 0 4px 12px -2px rgba(0, 0, 0, 0.4),\n 0 10px 30px -3px rgba(0, 0, 0, 0.5);\n\n --page-paper-main-shadow: rgba(\n 55,\n 58,\n 68,\n 0\n ); /* Shadow list shadow for page paper main */\n\n --modal-background: rgba(44, 46, 56, 0.7);\n\n --highlight-dark: rgba(0, 0, 0, 0.06);\n\n --input-background-color: #2c2e38;\n\n --only-white: #ffffff;\n\n --only-black: #000000;\n }\n\n .ac-shadow,\n .ac-shadow--raised {\n &--lg {\n box-shadow: var(--shadow-primary);\n }\n &--sm {\n box-shadow: var(--shadow-tertiary);\n }\n }\n\n .ac-shadow--raised {\n &--lg {\n transition: box-shadow 0.3s;\n &:hover {\n box-shadow: var(--shadow-primary-hover);\n }\n }\n &--sm {\n transition: box-shadow 0.3s;\n &:hover {\n box-shadow: var(--shadow-tertiary-hover);\n }\n }\n }\n\n .ac-shadow-optimized--sm {\n position: relative;\n box-shadow: var(--shadow-tertiary);\n\n &::before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n content: \"\";\n box-shadow: var(--shadow-tertiary);\n opacity: 0;\n border-radius: var(--ac-br-6);\n transition: opacity 0.3s ease;\n z-index: -1;\n }\n\n @media (hover: hover) {\n &:hover::before {\n opacity: 1;\n }\n }\n }\n\n .ac-shadow-optimized--lg {\n position: relative;\n box-shadow: var(--shadow-primary);\n\n &::before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n content: \"\";\n box-shadow: var(--shadow-primary);\n opacity: 0;\n border-radius: var(--ac-br-8);\n transition: opacity 0.3s ease;\n z-index: -1;\n }\n\n @media (hover: hover) {\n &:hover::before {\n opacity: 1;\n }\n }\n }\n\n .ac-border-radius {\n &-4 {\n border-radius: var(--ac-br-4);\n }\n\n &-6 {\n border-radius: var(--ac-br-6);\n }\n\n &-8 {\n border-radius: var(--ac-br-8);\n }\n\n &-rounded {\n border-radius: var(--ac-br-rounded);\n }\n }\n\n`;\n"],"file":"GlobalStyle.js"}
|
|
@@ -13,7 +13,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
|
|
|
13
13
|
|
|
14
14
|
var _Styles = require("./Styles");
|
|
15
15
|
|
|
16
|
-
var _excluded = ["children", "className", "disableVertical", "disableHorizontal", "invertHorizontal", "invertVertical"];
|
|
16
|
+
var _excluded = ["children", "className", "disableVertical", "disableHorizontal", "invertHorizontal", "invertVertical", "innerColor", "outerColor"];
|
|
17
17
|
|
|
18
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
19
|
|
|
@@ -50,6 +50,8 @@ var ScrollShadow = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
50
50
|
invertHorizontal = _ref$invertHorizontal === void 0 ? false : _ref$invertHorizontal,
|
|
51
51
|
_ref$invertVertical = _ref.invertVertical,
|
|
52
52
|
invertVertical = _ref$invertVertical === void 0 ? false : _ref$invertVertical,
|
|
53
|
+
innerColor = _ref.innerColor,
|
|
54
|
+
outerColor = _ref.outerColor,
|
|
53
55
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
54
56
|
|
|
55
57
|
var _useState = (0, _react.useState)({
|
|
@@ -117,18 +119,26 @@ var ScrollShadow = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
117
119
|
}), children({
|
|
118
120
|
onScroll: handleScroll
|
|
119
121
|
}), !disableVertical ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Styles.StyledScrollShadowTop, {
|
|
122
|
+
$innerColor: innerColor,
|
|
123
|
+
$outerColor: outerColor,
|
|
120
124
|
style: {
|
|
121
125
|
opacity: opacity.top
|
|
122
126
|
}
|
|
123
127
|
}), /*#__PURE__*/_react.default.createElement(_Styles.StyledScrollShadowBottom, {
|
|
128
|
+
$innerColor: innerColor,
|
|
129
|
+
$outerColor: outerColor,
|
|
124
130
|
style: {
|
|
125
131
|
opacity: opacity.bottom
|
|
126
132
|
}
|
|
127
133
|
})) : null, !disableHorizontal ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Styles.StyledScrollShadowLeft, {
|
|
134
|
+
$innerColor: innerColor,
|
|
135
|
+
$outerColor: outerColor,
|
|
128
136
|
style: {
|
|
129
137
|
opacity: opacity.left
|
|
130
138
|
}
|
|
131
139
|
}), /*#__PURE__*/_react.default.createElement(_Styles.StyledScrollShadowRight, {
|
|
140
|
+
$innerColor: innerColor,
|
|
141
|
+
$outerColor: outerColor,
|
|
132
142
|
style: {
|
|
133
143
|
opacity: opacity.right
|
|
134
144
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/ScrollShadow/ScrollShadow.tsx"],"names":["ScrollShadow","ref","children","className","disableVertical","disableHorizontal","invertHorizontal","invertVertical","rest","top","right","bottom","left","opacity","setOpacity","handleScroll","event","target","scrollHeight","clientHeight","scrollWidth","clientWidth","scrollTop","scrollLeft","prevState","Math","min","bottomScrollTop","max","offset","newState","onScroll","displayName"],"mappings":";;;;;;;;;AAAA;;AAQA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/ScrollShadow/ScrollShadow.tsx"],"names":["ScrollShadow","ref","children","className","disableVertical","disableHorizontal","invertHorizontal","invertVertical","innerColor","outerColor","rest","top","right","bottom","left","opacity","setOpacity","handleScroll","event","target","scrollHeight","clientHeight","scrollWidth","clientWidth","scrollTop","scrollLeft","prevState","Math","min","bottomScrollTop","max","offset","newState","onScroll","displayName"],"mappings":"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","sourcesContent":["import React, {\n forwardRef,\n useState,\n useCallback,\n UIEventHandler,\n UIEvent,\n HTMLAttributes,\n} from \"react\";\nimport classnames from \"classnames\";\nimport {\n StyledScrollShadow,\n StyledScrollShadowBottom,\n StyledScrollShadowLeft,\n StyledScrollShadowRight,\n StyledScrollShadowTop,\n} from \"./Styles\";\n\nexport interface IScrollShadowProps {\n /** Children */\n children: ({ onScroll: UIEventHandler }) => void;\n /** Applies passed classes */\n className?: string;\n /** Disable vertical shadow */\n disableVertical?: boolean;\n /** Disable horizontal shadow */\n disableHorizontal?: boolean;\n /** Invert horizontal shadow logic */\n invertHorizontal?: boolean;\n /** Invert vertical shadow logic */\n invertVertical?: boolean;\n /** Inner gradient color */\n innerColor?: string;\n /** Outer gradient color */\n outerColor?: string;\n}\n\nexport const ScrollShadow = forwardRef<\n HTMLDivElement,\n IScrollShadowProps & HTMLAttributes<HTMLDivElement>\n>(\n (\n {\n children,\n className,\n disableVertical = false,\n disableHorizontal = false,\n invertHorizontal = false,\n invertVertical = false,\n innerColor,\n outerColor,\n ...rest\n },\n ref\n ) => {\n const [opacity, setOpacity] = useState({\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n });\n\n const handleScroll: UIEventHandler = useCallback(\n (event: UIEvent) => {\n const { scrollHeight, clientHeight, scrollWidth, clientWidth } =\n event.target as Element;\n let { scrollTop, scrollLeft } = event.target as Element;\n\n if (scrollLeft < 0) {\n scrollLeft *= -1;\n }\n if (scrollTop < 0) {\n scrollTop *= -1;\n }\n\n setOpacity((prevState) => {\n const top = (1 / 20) * Math.min(scrollTop, 20);\n const bottomScrollTop = scrollHeight - clientHeight;\n const bottom =\n (1 / 20) *\n (bottomScrollTop - Math.max(scrollTop, bottomScrollTop - 20));\n const left = (1 / 20) * Math.min(scrollLeft, 20);\n const offset = scrollWidth - clientWidth;\n const right = (1 / 20) * (offset - Math.max(scrollLeft, offset - 20));\n\n const newState = { top: 0, bottom: 0, left: 0, right: 0 };\n\n if (!disableVertical) {\n newState.top = invertVertical ? bottom : top;\n newState.bottom = invertVertical ? top : bottom;\n }\n\n if (!disableHorizontal) {\n newState.left = invertHorizontal ? right : left;\n newState.right = invertHorizontal ? left : right;\n }\n\n if (\n newState.top !== prevState.top ||\n newState.bottom !== prevState.bottom ||\n newState.left !== prevState.left ||\n newState.right !== prevState.right\n ) {\n return newState;\n }\n\n return prevState;\n });\n },\n [invertHorizontal, invertVertical, disableVertical, disableHorizontal]\n );\n\n return (\n <StyledScrollShadow\n {...rest}\n ref={ref}\n className={classnames(\"c-scroll-shadow\", className)}\n >\n {children({ onScroll: handleScroll })}\n {!disableVertical ? (\n <>\n <StyledScrollShadowTop\n $innerColor={innerColor}\n $outerColor={outerColor}\n style={{ opacity: opacity.top }}\n />\n <StyledScrollShadowBottom\n $innerColor={innerColor}\n $outerColor={outerColor}\n style={{ opacity: opacity.bottom }}\n />\n </>\n ) : null}\n {!disableHorizontal ? (\n <>\n <StyledScrollShadowLeft\n $innerColor={innerColor}\n $outerColor={outerColor}\n style={{ opacity: opacity.left }}\n />\n <StyledScrollShadowRight\n $innerColor={innerColor}\n $outerColor={outerColor}\n style={{ opacity: opacity.right }}\n />\n </>\n ) : null}\n </StyledScrollShadow>\n );\n }\n);\n\nScrollShadow.displayName = \"ScrollShadow\";\n"],"file":"ScrollShadow.js"}
|
|
@@ -21,12 +21,16 @@ exports.StyledScrollShadow = StyledScrollShadow;
|
|
|
21
21
|
var StyledScrollShadowTop = _styledComponents.default.div.withConfig({
|
|
22
22
|
displayName: "Styles__StyledScrollShadowTop",
|
|
23
23
|
componentId: "sc-17pcaqo-1"
|
|
24
|
-
})(["", " background-image:linear-gradient( to top,
|
|
24
|
+
})(["", " background-image:linear-gradient( to top,", ",", " );"], {
|
|
25
25
|
"position": "absolute",
|
|
26
26
|
"top": "0px",
|
|
27
27
|
"left": "0px",
|
|
28
28
|
"right": "0px",
|
|
29
29
|
"height": "0.5rem"
|
|
30
|
+
}, function (props) {
|
|
31
|
+
return props.$innerColor ? props.$innerColor : "var(--page-paper-main-shadow)";
|
|
32
|
+
}, function (props) {
|
|
33
|
+
return props.$outerColor ? props.$outerColor : "var(--page-paper-main)";
|
|
30
34
|
});
|
|
31
35
|
|
|
32
36
|
exports.StyledScrollShadowTop = StyledScrollShadowTop;
|
|
@@ -34,12 +38,16 @@ exports.StyledScrollShadowTop = StyledScrollShadowTop;
|
|
|
34
38
|
var StyledScrollShadowBottom = _styledComponents.default.div.withConfig({
|
|
35
39
|
displayName: "Styles__StyledScrollShadowBottom",
|
|
36
40
|
componentId: "sc-17pcaqo-2"
|
|
37
|
-
})(["", " background-image:linear-gradient( to top,
|
|
41
|
+
})(["", " background-image:linear-gradient( to top,", ",", " );"], {
|
|
38
42
|
"position": "absolute",
|
|
39
43
|
"bottom": "0px",
|
|
40
44
|
"left": "0px",
|
|
41
45
|
"right": "0px",
|
|
42
46
|
"height": "0.5rem"
|
|
47
|
+
}, function (props) {
|
|
48
|
+
return props.$outerColor ? props.$outerColor : "var(--page-paper-main)";
|
|
49
|
+
}, function (props) {
|
|
50
|
+
return props.$innerColor ? props.$innerColor : "var(--page-paper-main-shadow)";
|
|
43
51
|
});
|
|
44
52
|
|
|
45
53
|
exports.StyledScrollShadowBottom = StyledScrollShadowBottom;
|
|
@@ -47,12 +55,16 @@ exports.StyledScrollShadowBottom = StyledScrollShadowBottom;
|
|
|
47
55
|
var StyledScrollShadowLeft = _styledComponents.default.div.withConfig({
|
|
48
56
|
displayName: "Styles__StyledScrollShadowLeft",
|
|
49
57
|
componentId: "sc-17pcaqo-3"
|
|
50
|
-
})(["", " background-image:linear-gradient( to left,
|
|
58
|
+
})(["", " background-image:linear-gradient( to left,", ",", " );"], {
|
|
51
59
|
"position": "absolute",
|
|
52
60
|
"left": "0px",
|
|
53
61
|
"top": "0px",
|
|
54
62
|
"bottom": "0px",
|
|
55
63
|
"width": "0.5rem"
|
|
64
|
+
}, function (props) {
|
|
65
|
+
return props.$innerColor ? props.$innerColor : "var(--page-paper-main-shadow)";
|
|
66
|
+
}, function (props) {
|
|
67
|
+
return props.$outerColor ? props.$outerColor : "var(--page-paper-main)";
|
|
56
68
|
});
|
|
57
69
|
|
|
58
70
|
exports.StyledScrollShadowLeft = StyledScrollShadowLeft;
|
|
@@ -60,12 +72,16 @@ exports.StyledScrollShadowLeft = StyledScrollShadowLeft;
|
|
|
60
72
|
var StyledScrollShadowRight = _styledComponents.default.div.withConfig({
|
|
61
73
|
displayName: "Styles__StyledScrollShadowRight",
|
|
62
74
|
componentId: "sc-17pcaqo-4"
|
|
63
|
-
})(["", " background-image:linear-gradient( to right,
|
|
75
|
+
})(["", " background-image:linear-gradient( to right,", ",", " );"], {
|
|
64
76
|
"position": "absolute",
|
|
65
77
|
"right": "0px",
|
|
66
78
|
"top": "0px",
|
|
67
79
|
"bottom": "0px",
|
|
68
80
|
"width": "0.5rem"
|
|
81
|
+
}, function (props) {
|
|
82
|
+
return props.$innerColor ? props.$innerColor : "var(--page-paper-main-shadow)";
|
|
83
|
+
}, function (props) {
|
|
84
|
+
return props.$outerColor ? props.$outerColor : "var(--page-paper-main)";
|
|
69
85
|
});
|
|
70
86
|
|
|
71
87
|
exports.StyledScrollShadowRight = StyledScrollShadowRight;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/ScrollShadow/Styles.ts"],"names":["StyledScrollShadow","styled","div","StyledScrollShadowTop","StyledScrollShadowBottom","StyledScrollShadowLeft","StyledScrollShadowRight","displayName"],"mappings":";;;;;;;AAAA;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/ScrollShadow/Styles.ts"],"names":["StyledScrollShadow","styled","div","StyledScrollShadowTop","props","$innerColor","$outerColor","StyledScrollShadowBottom","StyledScrollShadowLeft","StyledScrollShadowRight","displayName"],"mappings":";;;;;;;AAAA;;;;AAQO,IAAMA,kBAAkB,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,aACzB;AAAA;AAAA,CADyB,CAAxB;;;;AAIA,IAAMC,qBAAqB,GAAGF,0BAAOC,GAAV;AAAA;AAAA;AAAA,mEAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAD4B,EAK5B,UAACE,KAAD;AAAA,SACFA,KAAK,CAACC,WAAN,GAAoBD,KAAK,CAACC,WAA1B,GAAwC,+BADtC;AAAA,CAL4B,EAO5B,UAACD,KAAD;AAAA,SACFA,KAAK,CAACE,WAAN,GAAoBF,KAAK,CAACE,WAA1B,GAAwC,wBADtC;AAAA,CAP4B,CAA3B;;;;AAYA,IAAMC,wBAAwB,GAAGN,0BAAOC,GAAV;AAAA;AAAA;AAAA,mEAC/B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAD+B,EAK/B,UAACE,KAAD;AAAA,SACFA,KAAK,CAACE,WAAN,GAAoBF,KAAK,CAACE,WAA1B,GAAwC,wBADtC;AAAA,CAL+B,EAO/B,UAACF,KAAD;AAAA,SACFA,KAAK,CAACC,WAAN,GAAoBD,KAAK,CAACC,WAA1B,GAAwC,+BADtC;AAAA,CAP+B,CAA9B;;;;AAYA,IAAMG,sBAAsB,GAAGP,0BAAOC,GAAV;AAAA;AAAA;AAAA,oEAC7B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAD6B,EAK7B,UAACE,KAAD;AAAA,SACFA,KAAK,CAACC,WAAN,GAAoBD,KAAK,CAACC,WAA1B,GAAwC,+BADtC;AAAA,CAL6B,EAO7B,UAACD,KAAD;AAAA,SACFA,KAAK,CAACE,WAAN,GAAoBF,KAAK,CAACE,WAA1B,GAAwC,wBADtC;AAAA,CAP6B,CAA5B;;;;AAYA,IAAMG,uBAAuB,GAAGR,0BAAOC,GAAV;AAAA;AAAA;AAAA,qEAC9B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAD8B,EAK9B,UAACE,KAAD;AAAA,SACFA,KAAK,CAACC,WAAN,GAAoBD,KAAK,CAACC,WAA1B,GAAwC,+BADtC;AAAA,CAL8B,EAO9B,UAACD,KAAD;AAAA,SACFA,KAAK,CAACE,WAAN,GAAoBF,KAAK,CAACE,WAA1B,GAAwC,wBADtC;AAAA,CAP8B,CAA7B;;;AAYPN,kBAAkB,CAACU,WAAnB,GAAiC,oBAAjC;AACAP,qBAAqB,CAACO,WAAtB,GAAoC,uBAApC;AACAH,wBAAwB,CAACG,WAAzB,GAAuC,0BAAvC;AACAF,sBAAsB,CAACE,WAAvB,GAAqC,wBAArC;AACAD,uBAAuB,CAACC,WAAxB,GAAsC,yBAAtC","sourcesContent":["import styled from \"styled-components\";\nimport tw from \"twin.macro\";\n\ninterface Colors {\n $innerColor?: string;\n $outerColor?: string;\n}\n\nexport const StyledScrollShadow = styled.div`\n ${tw`tw-relative`}\n`;\n\nexport const StyledScrollShadowTop = styled.div<Colors>`\n ${tw`tw-absolute tw-top-0 tw-inset-x-0 tw-h-2`}\n\n background-image: linear-gradient(\n to top,\n ${(props) =>\n props.$innerColor ? props.$innerColor : \"var(--page-paper-main-shadow)\"},\n ${(props) =>\n props.$outerColor ? props.$outerColor : \"var(--page-paper-main)\"}\n );\n`;\n\nexport const StyledScrollShadowBottom = styled.div<Colors>`\n ${tw`tw-absolute tw-bottom-0 tw-inset-x-0 tw-h-2`}\n\n background-image: linear-gradient(\n to top,\n ${(props) =>\n props.$outerColor ? props.$outerColor : \"var(--page-paper-main)\"},\n ${(props) =>\n props.$innerColor ? props.$innerColor : \"var(--page-paper-main-shadow)\"}\n );\n`;\n\nexport const StyledScrollShadowLeft = styled.div<Colors>`\n ${tw`tw-absolute tw-left-0 tw-inset-y-0 tw-w-2`}\n\n background-image: linear-gradient(\n to left,\n ${(props) =>\n props.$innerColor ? props.$innerColor : \"var(--page-paper-main-shadow)\"},\n ${(props) =>\n props.$outerColor ? props.$outerColor : \"var(--page-paper-main)\"}\n );\n`;\n\nexport const StyledScrollShadowRight = styled.div<Colors>`\n ${tw`tw-absolute tw-right-0 tw-inset-y-0 tw-w-2`}\n\n background-image: linear-gradient(\n to right,\n ${(props) =>\n props.$innerColor ? props.$innerColor : \"var(--page-paper-main-shadow)\"},\n ${(props) =>\n props.$outerColor ? props.$outerColor : \"var(--page-paper-main)\"}\n );\n`;\n\nStyledScrollShadow.displayName = \"StyledScrollShadow\";\nStyledScrollShadowTop.displayName = \"StyledScrollShadowTop\";\nStyledScrollShadowBottom.displayName = \"StyledScrollShadowBottom\";\nStyledScrollShadowLeft.displayName = \"StyledScrollShadowLeft\";\nStyledScrollShadowRight.displayName = \"StyledScrollShadowRight\";\n"],"file":"Styles.js"}
|
|
@@ -12,7 +12,7 @@ export interface IEntityCardProps {
|
|
|
12
12
|
properties: IEntityProperties[];
|
|
13
13
|
ref?: Ref<HTMLDivElement>;
|
|
14
14
|
link?: string;
|
|
15
|
-
|
|
15
|
+
className?: string;
|
|
16
16
|
}
|
|
17
|
-
export declare const EntityCard: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLDivElement> & IEntityCardProps, "link" |
|
|
17
|
+
export declare const EntityCard: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLDivElement> & IEntityCardProps, "link" | "slot" | "style" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "cs" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "tw" | "renderAs" | "properties"> & React.RefAttributes<HTMLDivElement>>;
|
|
18
18
|
//# sourceMappingURL=EntityCard.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EntityCard.d.ts","sourceRoot":"","sources":["../../../../src/components/EntityCard/EntityCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,GAAG,EAGH,SAAS,EAEV,MAAM,OAAO,CAAC;AAIf,oBAAY,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;AAEvD,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,SAAS,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,WAAW,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,EAAE,WAAW,GAAG,WAAW,CAAC;IACrC,UAAU,EAAE,iBAAiB,EAAE,CAAC;IAChC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,
|
|
1
|
+
{"version":3,"file":"EntityCard.d.ts","sourceRoot":"","sources":["../../../../src/components/EntityCard/EntityCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,GAAG,EAGH,SAAS,EAEV,MAAM,OAAO,CAAC;AAIf,oBAAY,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;AAEvD,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,SAAS,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,WAAW,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,EAAE,WAAW,GAAG,WAAW,CAAC;IACrC,UAAU,EAAE,iBAAiB,EAAE,CAAC;IAChC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,UAAU,uqJAuEtB,CAAC"}
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import React, { forwardRef, useCallback } from "react";
|
|
2
2
|
import classnames from "classnames";
|
|
3
|
-
import { StyledEntityCard
|
|
3
|
+
import { StyledEntityCard } from "./Styles";
|
|
4
4
|
export var EntityCard = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
5
5
|
var _ref$renderAs = _ref.renderAs,
|
|
6
6
|
renderAs = _ref$renderAs === void 0 ? "list-item" : _ref$renderAs,
|
|
7
7
|
properties = _ref.properties,
|
|
8
|
-
|
|
9
|
-
linkClassName = _ref.linkClassName;
|
|
8
|
+
className = _ref.className;
|
|
10
9
|
var renderAsListItem = useCallback(function (properties) {
|
|
11
10
|
return properties.filter(function (p) {
|
|
12
11
|
return p.showInList;
|
|
@@ -49,19 +48,16 @@ export var EntityCard = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
49
48
|
return renderProperty(p);
|
|
50
49
|
})));
|
|
51
50
|
}, []);
|
|
52
|
-
return /*#__PURE__*/React.createElement(
|
|
53
|
-
href: link,
|
|
54
|
-
className: linkClassName
|
|
55
|
-
}, /*#__PURE__*/React.createElement(StyledEntityCard, {
|
|
51
|
+
return /*#__PURE__*/React.createElement(StyledEntityCard, {
|
|
56
52
|
ref: ref,
|
|
57
53
|
hoverable: true,
|
|
58
54
|
className: classnames("entity-card-wrapper", {
|
|
59
55
|
"grid-item": renderAs === "grid-item",
|
|
60
56
|
"list-item": renderAs === "list-item"
|
|
61
|
-
}),
|
|
57
|
+
}, className),
|
|
62
58
|
paperType: renderAs === "grid-item" ? "paper-1" : "paper-2",
|
|
63
59
|
$renderAs: renderAs
|
|
64
|
-
}, renderAs === "list-item" ? renderAsListItem(properties) : null, renderAs === "grid-item" ? renderAsGridItem(properties) : null)
|
|
60
|
+
}, renderAs === "list-item" ? renderAsListItem(properties) : null, renderAs === "grid-item" ? renderAsGridItem(properties) : null);
|
|
65
61
|
});
|
|
66
62
|
EntityCard.displayName = "EntityCard";
|
|
67
63
|
//# sourceMappingURL=EntityCard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/EntityCard/EntityCard.tsx"],"names":["React","forwardRef","useCallback","classnames","StyledEntityCard","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/EntityCard/EntityCard.tsx"],"names":["React","forwardRef","useCallback","classnames","StyledEntityCard","EntityCard","ref","renderAs","properties","className","renderAsListItem","filter","p","showInList","map","name","render","renderAsGridItem","headerSection","cardSection","bodySection","footerSection","renderProperty","displayName"],"mappings":"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","sourcesContent":["import React, {\n Ref,\n HTMLAttributes,\n forwardRef,\n ReactNode,\n useCallback,\n} from \"react\";\nimport classnames from \"classnames\";\nimport { StyledEntityCard } from \"./Styles\";\n\nexport type cardSection = \"header\" | \"body\" | \"footer\";\n\nexport interface IEntityProperties {\n name: string;\n render: () => ReactNode;\n showInList?: boolean;\n cardSection: cardSection;\n className?: string;\n}\n\nexport interface IEntityCardProps {\n renderAs?: \"list-item\" | \"grid-item\";\n properties: IEntityProperties[];\n ref?: Ref<HTMLDivElement>;\n link?: string;\n className?: string;\n}\n\nexport const EntityCard = forwardRef(\n (\n {\n renderAs = \"list-item\",\n properties,\n className,\n }: HTMLAttributes<HTMLDivElement> & IEntityCardProps,\n ref: Ref<HTMLDivElement> | null | undefined\n ) => {\n const renderAsListItem = useCallback((properties: IEntityProperties[]) => {\n return properties\n .filter((p) => p.showInList)\n .map((p) => {\n return (\n <div key={p.name} className={`entity-property-${p.name}`}>\n {p.render()}\n </div>\n );\n });\n }, []);\n\n const renderAsGridItem = useCallback((properties: IEntityProperties[]) => {\n const headerSection = properties.filter(\n (p: IEntityProperties) => p.cardSection === \"header\"\n );\n const bodySection = properties.filter(\n (p: IEntityProperties) => p.cardSection === \"body\"\n );\n const footerSection = properties.filter(\n (p) => p.cardSection === \"footer\"\n );\n const renderProperty = (p: IEntityProperties): ReactNode => (\n <div key={p.name} className={`entity-property-${p.name}`}>\n {p.render()}\n </div>\n );\n return (\n <>\n <div className={\"card-header\"}>\n {headerSection.map((p) => renderProperty(p))}\n </div>\n <div className={\"card-body\"}>\n {bodySection.map((p) => renderProperty(p))}\n </div>\n <div className={\"card-footer\"}>\n {footerSection.map((p) => renderProperty(p))}\n </div>\n </>\n );\n }, []);\n\n return (\n <StyledEntityCard\n ref={ref}\n hoverable\n className={classnames(\n \"entity-card-wrapper\",\n {\n \"grid-item\": renderAs === \"grid-item\",\n \"list-item\": renderAs === \"list-item\",\n },\n className\n )}\n paperType={renderAs === \"grid-item\" ? \"paper-1\" : \"paper-2\"}\n $renderAs={renderAs}\n >\n {renderAs === \"list-item\" ? renderAsListItem(properties) : null}\n {renderAs === \"grid-item\" ? renderAsGridItem(properties) : null}\n </StyledEntityCard>\n );\n }\n);\n\nEntityCard.displayName = \"EntityCard\";\n"],"file":"EntityCard.js"}
|
|
@@ -2,5 +2,4 @@
|
|
|
2
2
|
export declare const StyledEntityCard: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement> & import("../Card").ICardProps, keyof import("react").HTMLAttributes<HTMLDivElement> | "hoverable" | "paperType"> & import("react").RefAttributes<HTMLDivElement>>, any, {
|
|
3
3
|
$renderAs: string;
|
|
4
4
|
}, never>;
|
|
5
|
-
export declare const StyledLinkEntityCard: import("styled-components").StyledComponent<"a", any, {}, never>;
|
|
6
5
|
//# sourceMappingURL=Styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/EntityCard/Styles.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/EntityCard/Styles.ts"],"names":[],"mappings":";AAGA,eAAO,MAAM,gBAAgB;eAA6B,MAAM;SA0B/D,CAAC"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import styled, { css } from "styled-components";
|
|
2
|
-
import { BoxSizingStyle } from "../BoxSizingStyle";
|
|
3
2
|
import { Card } from "../Card";
|
|
4
|
-
import { FontStyle } from "../FontStyle";
|
|
5
3
|
export var StyledEntityCard = styled(Card).withConfig({
|
|
6
4
|
displayName: "Styles__StyledEntityCard",
|
|
7
5
|
componentId: "sc-3vmxf-0"
|
|
@@ -11,11 +9,4 @@ export var StyledEntityCard = styled(Card).withConfig({
|
|
|
11
9
|
return props.$renderAs === "grid-item" && css(["display:flex;flex-direction:column;height:250px;width:250px;.card-body{flex-grow:1;}"]);
|
|
12
10
|
});
|
|
13
11
|
StyledEntityCard.displayName = "StyledEntityCard";
|
|
14
|
-
export var StyledLinkEntityCard = styled.a.withConfig({
|
|
15
|
-
displayName: "Styles__StyledLinkEntityCard",
|
|
16
|
-
componentId: "sc-3vmxf-1"
|
|
17
|
-
})(["", " ", " ", ""], {
|
|
18
|
-
"textDecoration": "none"
|
|
19
|
-
}, FontStyle, BoxSizingStyle);
|
|
20
|
-
StyledLinkEntityCard.displayName = "StyledLinkEntityCard";
|
|
21
12
|
//# sourceMappingURL=Styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/EntityCard/Styles.ts"],"names":["styled","css","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/EntityCard/Styles.ts"],"names":["styled","css","Card","StyledEntityCard","props","$renderAs","displayName"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AACA,SAASC,IAAT,QAAqB,SAArB;AAEA,OAAO,IAAMC,gBAAgB,GAAGH,MAAM,CAACE,IAAD,CAAT;AAAA;AAAA;AAAA,iDAIzB,UAACE,KAAD;AAAA,SACAA,KAAK,CAACC,SAAN,KAAoB,WAApB,IACAJ,GADA,8FADA;AAAA,CAJyB,EAczB,UAACG,KAAD;AAAA,SACAA,KAAK,CAACC,SAAN,KAAoB,WAApB,IACAJ,GADA,0FADA;AAAA,CAdyB,CAAtB;AA2BPE,gBAAgB,CAACG,WAAjB,GAA+B,kBAA/B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Card } from \"../Card\";\n\nexport const StyledEntityCard = styled(Card)<{ $renderAs: string }>`\n padding: 12px;\n line-height: 1.375;\n\n ${(props) =>\n props.$renderAs === \"list-item\" &&\n css`\n display: grid;\n grid-auto-flow: column;\n align-items: center;\n min-height: 48px;\n margin-bottom: 4px;\n `}\n\n ${(props) =>\n props.$renderAs === \"grid-item\" &&\n css`\n display: flex;\n flex-direction: column;\n height: 250px;\n width: 250px;\n\n .card-body {\n flex-grow: 1;\n }\n `}\n`;\nStyledEntityCard.displayName = \"StyledEntityCard\";\n"],"file":"Styles.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GlobalStyle.d.ts","sourceRoot":"","sources":["../../../src/components/GlobalStyle.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"GlobalStyle.d.ts","sourceRoot":"","sources":["../../../src/components/GlobalStyle.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW,gGA8TvB,CAAC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { createGlobalStyle } from "styled-components";
|
|
2
|
-
export var GlobalStyle = createGlobalStyle([":root{--color-primary:#5d2bff;--color-secondary:#5d2bff;--color-theme-100:#ffffff;--color-theme-200:#f6f6f9;--color-theme-300:#ebebee;--color-theme-400:#d7d7da;--color-theme-500:#b9b9bd;--color-theme-600:#89898e;--color-theme-700:#6d6d73;--color-theme-800:#5b5b61;--color-theme-900:#303037;--color-primary-200:rgba(93,43,255,0.05);--color-primary-300:rgba(93,43,255,0.1);--color-primary-400:rgba(93,43,255,0.25);--color-primary-500:rgba(93,43,255,0.5);--color-primary-600:rgba(93,43,255,0.75);--color-primary-700:#5d2bff;--color-primary-800:#4a21cd;--color-primary-900:#32178b;--color-secondary-200:rgba(93,43,255,0.05);--color-secondary-300:rgba(93,43,255,0.1);--color-secondary-400:rgba(93,43,255,0.25);--color-secondary-500:rgba(93,43,255,0.5);--color-secondary-600:rgba(93,43,255,0.75);--color-secondary-700:#5d2bff;--color-secondary-800:#4a21cd;--color-secondary-900:#32178b;--color-primary-opaque-300:#efeaff;--color-primary-opaque-400:#d6caff;--color-secondary-opaque-300:#efeaff;--color-secondary-opaque-400:#d6caff;--color-sucess-green:#64cd93;--body-bg-main
|
|
2
|
+
export var GlobalStyle = createGlobalStyle([":root{--color-primary:#5d2bff;--color-secondary:#5d2bff;--color-theme-100:#ffffff;--color-theme-200:#f6f6f9;--color-theme-300:#ebebee;--color-theme-400:#d7d7da;--color-theme-500:#b9b9bd;--color-theme-600:#89898e;--color-theme-700:#6d6d73;--color-theme-800:#5b5b61;--color-theme-900:#303037;--color-primary-200:rgba(93,43,255,0.05);--color-primary-300:rgba(93,43,255,0.1);--color-primary-400:rgba(93,43,255,0.25);--color-primary-500:rgba(93,43,255,0.5);--color-primary-600:rgba(93,43,255,0.75);--color-primary-700:#5d2bff;--color-primary-800:#4a21cd;--color-primary-900:#32178b;--color-secondary-200:rgba(93,43,255,0.05);--color-secondary-300:rgba(93,43,255,0.1);--color-secondary-400:rgba(93,43,255,0.25);--color-secondary-500:rgba(93,43,255,0.5);--color-secondary-600:rgba(93,43,255,0.75);--color-secondary-700:#5d2bff;--color-secondary-800:#4a21cd;--color-secondary-900:#32178b;--color-primary-opaque-300:#efeaff;--color-primary-opaque-400:#d6caff;--color-secondary-opaque-300:#efeaff;--color-secondary-opaque-400:#d6caff;--color-sucess-green:#64cd93;--body-bg-main:rgb(244,245,247);--body-bg-main-transparent:rgba(244,245,247,0);--page-paper-main:#ffffff;--border-primary:#d7d7da;--note-bg:#fff9f1;--shadow-primary-hover:0 64px 64px 0 rgba(0,0,0,0.1),0 32px 32px 0 rgba(0,0,0,0.06),0 16px 16px 0 rgba(0,0,0,0.04),0 4px 4px 0 rgba(0,0,0,0.04),0 2px 2px 0 rgba(0,0,0,0.04);--shadow-primary:0 64px 64px 0 rgba(0,0,0,0.06),0 32px 32px 0 rgba(0,0,0,0.03),0 16px 16px 0 rgba(0,0,0,0.02),0 4px 4px 0 rgba(0,0,0,0.02),0 2px 2px 0 rgba(0,0,0,0.02);--shadow-secondary:0 4px 14px 0 rgba(0,0,0,0.17);--shadow-tertiary:0 4px 6px -2px rgba(0,0,0,0.05),0 10px 15px -3px rgba(0,0,0,0.1);--shadow-tertiary-hover:0 4px 10px -2px rgba(0,0,0,0.1),0 12px 20px -3px rgba(0,0,0,0.2);--page-paper-main-shadow:rgba( 255,255,255,0 );--modal-background:rgba(244,245,247,0.6);--highlight-dark:rgba(0,0,0,0.03);--input-background-color:#ffffff;--red-alert:rgb(237,97,97);--only-white:#ffffff;--only-black:#000000;--ac-br-4:4px;--ac-br-6:6px;--ac-br-8:8px;--ac-br-rounded:999px;}.cupcake{--color-primary:#29bcdd;--color-secondary:#fe6fa7;--color-primary-200:rgba(41,188,221,0.07);--color-primary-300:rgba(41,188,221,0.12);--color-primary-400:rgba(41,188,221,0.26);--color-primary-500:rgba(41,188,221,0.52);--color-primary-600:rgba(41,188,221,0.75);--color-primary-700:#29bcdd;--color-primary-800:#219fbb;--color-primary-900:#1a768b;--color-secondary-200:rgba(254,111,167,0.07);--color-secondary-300:rgba(254,111,167,0.13);--color-secondary-400:rgba(254,111,167,0.27);--color-secondary-500:rgba(254,111,167,0.52);--color-secondary-600:rgba(254,111,167,0.75);--color-secondary-700:#fe6fa7;--color-secondary-800:#dd6091;--color-secondary-900:#ab496f;--color-primary-opaque-300:#e5f7fb;--color-primary-opaque-400:#c8eef6;--color-secondary-opaque-300:#ffecf4;--color-secondary-opaque-400:#ffd8e7;}.classic{--color-primary:#4182f2;--color-secondary:#4182f2;--color-primary-200:rgba(65,130,242,0.07);--color-primary-300:rgba(65,130,242,0.13);--color-primary-400:rgba(65,130,242,0.26);--color-primary-500:rgba(65,130,242,0.52);--color-primary-600:rgba(65,130,242,0.75);--color-primary-700:#4182f2;--color-primary-800:#356bc8;--color-primary-900:#244a8a;--color-secondary-200:rgba(65,130,242,0.07);--color-secondary-300:rgba(65,130,242,0.13);--color-secondary-400:rgba(65,130,242,0.26);--color-secondary-500:rgba(65,130,242,0.52);--color-secondary-600:rgba(65,130,242,0.75);--color-secondary-700:#4182f2;--color-secondary-800:#356bc8;--color-secondary-900:#244a8a;--color-primary-opaque-300:#e6effd;--color-primary-opaque-400:#cedffc;--color-secondary-opaque-300:#e6effd;--color-secondary-opaque-400:#cedffc;}.neon{--color-primary:#67ffc8;--color-secondary:#67ffc8;--color-theme-100:#000000;--color-theme-200:#31333e;--color-theme-300:#2b2d37;--color-theme-400:#1f2024;--color-theme-500:#99999e;--color-theme-600:#89898e;--color-theme-700:#b0b0b5;--color-theme-800:#dfdfe5;--color-theme-900:#ffffff;--color-primary-200:rgba(103,255,200,0.05);--color-primary-300:rgba(103,255,200,0.1);--color-primary-400:rgba(103,255,200,0.25);--color-primary-500:rgba(103,255,200,0.5);--color-primary-600:rgba(103,255,200,0.75);--color-primary-700:#67ffc8;--color-primary-800:#a5ffdf;--color-primary-900:#d0fdec;--color-secondary-200:rgba(103,255,200,0.05);--color-secondary-300:rgba(103,255,200,0.1);--color-secondary-400:rgba(103,255,200,0.25);--color-secondary-500:rgba(103,255,200,0.5);--color-secondary-600:rgba(103,255,200,0.75);--color-secondary-700:#67ffc8;--color-secondary-800:#a5ffdf;--color-secondary-900:#d0fdec;--color-primary-opaque-300:#3b4e51;--color-primary-opaque-400:#436b64;--color-secondary-opaque-300:#3b4e51;--color-secondary-opaque-400:#436b64;--body-bg-main:rgb(44,46,56);--body-bg-main-transparent:rgba(44,46,56,0);--page-paper-main:#373a44;--border-primary:#1f2024;--note-bg:#464545;--shadow-primary-hover:0 64px 64px 0 rgba(0,0,0,0.2),0 32px 32px 0 rgba(0,0,0,0.2),0 16px 16px 0 rgba(0,0,0,0.2),0 4px 4px 0 rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.2);--shadow-primary:0 64px 64px 0 rgba(0,0,0,0.1),0 32px 32px 0 rgba(0,0,0,0.1),0 16px 16px 0 rgba(0,0,0,0.1),0 4px 4px 0 rgba(0,0,0,0.1),0 2px 2px 0 rgba(0,0,0,0.1);--shadow-secondary:0 4px 14px 0 rgba(0,0,0,0.3);--shadow-tertiary:0 4px 6px -2px rgba(0,0,0,0.1),0 10px 15px -3px rgba(0,0,0,0.15);--shadow-tertiary-hover:0 4px 12px -2px rgba(0,0,0,0.4),0 10px 30px -3px rgba(0,0,0,0.5);--page-paper-main-shadow:rgba( 55,58,68,0 );--modal-background:rgba(44,46,56,0.7);--highlight-dark:rgba(0,0,0,0.06);--input-background-color:#2c2e38;--only-white:#ffffff;--only-black:#000000;}.ac-shadow,.ac-shadow--raised{&--lg{box-shadow:var(--shadow-primary);}&--sm{box-shadow:var(--shadow-tertiary);}}.ac-shadow--raised{&--lg{transition:box-shadow 0.3s;&:hover{box-shadow:var(--shadow-primary-hover);}}&--sm{transition:box-shadow 0.3s;&:hover{box-shadow:var(--shadow-tertiary-hover);}}}.ac-shadow-optimized--sm{position:relative;box-shadow:var(--shadow-tertiary);&::before{position:absolute;top:0;left:0;width:100%;height:100%;content:\"\";box-shadow:var(--shadow-tertiary);opacity:0;border-radius:var(--ac-br-6);transition:opacity 0.3s ease;z-index:-1;}@media (hover:hover){&:hover::before{opacity:1;}}}.ac-shadow-optimized--lg{position:relative;box-shadow:var(--shadow-primary);&::before{position:absolute;top:0;left:0;width:100%;height:100%;content:\"\";box-shadow:var(--shadow-primary);opacity:0;border-radius:var(--ac-br-8);transition:opacity 0.3s ease;z-index:-1;}@media (hover:hover){&:hover::before{opacity:1;}}}.ac-border-radius{&-4{border-radius:var(--ac-br-4);}&-6{border-radius:var(--ac-br-6);}&-8{border-radius:var(--ac-br-8);}&-rounded{border-radius:var(--ac-br-rounded);}}"]);
|
|
3
3
|
//# sourceMappingURL=GlobalStyle.js.map
|