@activecollab/components 1.0.168 → 1.0.169
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/Entity/EntityCard.js +15 -28
- package/dist/cjs/components/Entity/EntityCard.js.map +1 -1
- package/dist/cjs/components/Entity/EntityGroup.js +13 -13
- package/dist/cjs/components/Entity/EntityGroup.js.map +1 -1
- package/dist/cjs/components/Entity/EntityProperty.js +14 -2
- package/dist/cjs/components/Entity/EntityProperty.js.map +1 -1
- package/dist/cjs/components/Entity/Styles.js +2 -6
- package/dist/cjs/components/Entity/Styles.js.map +1 -1
- package/dist/cjs/components/Entity/index.js.map +1 -1
- package/dist/esm/components/Entity/EntityCard.d.ts +8 -9
- package/dist/esm/components/Entity/EntityCard.d.ts.map +1 -1
- package/dist/esm/components/Entity/EntityCard.js +17 -29
- package/dist/esm/components/Entity/EntityCard.js.map +1 -1
- package/dist/esm/components/Entity/EntityGroup.d.ts +5 -0
- package/dist/esm/components/Entity/EntityGroup.d.ts.map +1 -1
- package/dist/esm/components/Entity/EntityGroup.js +9 -11
- package/dist/esm/components/Entity/EntityGroup.js.map +1 -1
- package/dist/esm/components/Entity/EntityProperty.d.ts +0 -1
- package/dist/esm/components/Entity/EntityProperty.d.ts.map +1 -1
- package/dist/esm/components/Entity/EntityProperty.js +7 -2
- package/dist/esm/components/Entity/EntityProperty.js.map +1 -1
- package/dist/esm/components/Entity/Styles.d.ts.map +1 -1
- package/dist/esm/components/Entity/Styles.js +2 -6
- package/dist/esm/components/Entity/Styles.js.map +1 -1
- package/dist/esm/components/Entity/index.d.ts +6 -7
- package/dist/esm/components/Entity/index.d.ts.map +1 -1
- package/dist/esm/components/Entity/index.js.map +1 -1
- package/dist/index.js +52 -72
- 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
|
@@ -11,11 +11,11 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
11
11
|
|
|
12
12
|
var _Styles = require("./Styles");
|
|
13
13
|
|
|
14
|
-
var
|
|
14
|
+
var _Card = require("../Card");
|
|
15
15
|
|
|
16
|
-
var
|
|
16
|
+
var _EntityGroup = require("./EntityGroup");
|
|
17
17
|
|
|
18
|
-
var _excluded = ["children", "
|
|
18
|
+
var _excluded = ["children", "isCollection", "background", "className", "as"];
|
|
19
19
|
|
|
20
20
|
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); }
|
|
21
21
|
|
|
@@ -27,43 +27,30 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
|
|
|
27
27
|
|
|
28
28
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
29
29
|
|
|
30
|
-
var EntityCard = function
|
|
30
|
+
var EntityCard = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
31
31
|
var children = _ref.children,
|
|
32
|
-
actions = _ref.actions,
|
|
33
|
-
_ref$renderAs = _ref.renderAs,
|
|
34
|
-
renderAs = _ref$renderAs === void 0 ? "grid" : _ref$renderAs,
|
|
35
32
|
isCollection = _ref.isCollection,
|
|
36
33
|
background = _ref.background,
|
|
37
34
|
className = _ref.className,
|
|
38
|
-
|
|
35
|
+
as = _ref.as,
|
|
39
36
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
40
37
|
|
|
38
|
+
var _useContext = (0, _react.useContext)(_EntityGroup.EntityGroupContext),
|
|
39
|
+
renderAs = _useContext.renderAs;
|
|
40
|
+
|
|
41
41
|
var paperType = renderAs === "grid" ? "paper-1" : "paper-2";
|
|
42
|
-
var
|
|
43
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
44
|
-
|
|
45
|
-
wrap: function wrap(children) {
|
|
46
|
-
return /*#__PURE__*/_react.default.createElement(WrapperElement, rest, children);
|
|
47
|
-
}
|
|
48
|
-
}, /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityCard, _extends({
|
|
42
|
+
var Component = as || _Card.Card;
|
|
43
|
+
return /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityCard, _extends({
|
|
44
|
+
as: Component,
|
|
49
45
|
$renderAs: renderAs,
|
|
50
46
|
$background: background,
|
|
51
47
|
paperType: paperType,
|
|
52
48
|
className: className,
|
|
53
49
|
$isCollection: isCollection
|
|
54
|
-
}, rest
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
});
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
return null;
|
|
62
|
-
}), actions && /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityActions, {
|
|
63
|
-
$renderAs: renderAs
|
|
64
|
-
}, actions)));
|
|
65
|
-
};
|
|
66
|
-
|
|
50
|
+
}, rest, {
|
|
51
|
+
ref: ref
|
|
52
|
+
}), children);
|
|
53
|
+
});
|
|
67
54
|
exports.EntityCard = EntityCard;
|
|
68
55
|
EntityCard.displayName = "EntityCard";
|
|
69
56
|
//# sourceMappingURL=EntityCard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Entity/EntityCard.tsx"],"names":["EntityCard","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Entity/EntityCard.tsx"],"names":["EntityCard","ref","children","isCollection","background","className","as","rest","EntityGroupContext","renderAs","paperType","Component","Card","displayName"],"mappings":";;;;;;;;;AAAA;;AAOA;;AAEA;;AAKA;;;;;;;;;;;;;;AAsBO,IAAMA,UAAsD,gBACjE,uBACE,gBASEC,GATF,EAUK;AAAA,MARDC,QAQC,QARDA,QAQC;AAAA,MAPDC,YAOC,QAPDA,YAOC;AAAA,MANDC,UAMC,QANDA,UAMC;AAAA,MALDC,SAKC,QALDA,SAKC;AAAA,MAJDC,EAIC,QAJDA,EAIC;AAAA,MAHEC,IAGF;;AACH,oBAAqB,uBAAWC,+BAAX,CAArB;AAAA,MAAQC,QAAR,eAAQA,QAAR;;AACA,MAAMC,SAAS,GAAGD,QAAQ,KAAK,MAAb,GAAsB,SAAtB,GAAkC,SAApD;AACA,MAAME,SAAS,GAAGL,EAAE,IAAIM,UAAxB;AACA,sBACE,6BAAC,wBAAD;AACE,IAAA,EAAE,EAAED,SADN;AAEE,IAAA,SAAS,EAAEF,QAFb;AAGE,IAAA,WAAW,EAAEL,UAHf;AAIE,IAAA,SAAS,EAAEM,SAJb;AAKE,IAAA,SAAS,EAAEL,SALb;AAME,IAAA,aAAa,EAAEF;AANjB,KAOMI,IAPN;AAQE,IAAA,GAAG,EAAEN;AARP,MAUGC,QAVH,CADF;AAcD,CA7BH,CADK;;AAiCPF,UAAU,CAACa,WAAX,GAAyB,YAAzB","sourcesContent":["import React, {\n BaseHTMLAttributes,\n CSSProperties,\n forwardRef,\n ReactElement,\n useContext,\n} from \"react\";\nimport { StyledEntityCard } from \"./Styles\";\n\nimport { Card, ICardProps } from \"../Card\";\nimport {\n PolymorphicComponentPropsWithRef,\n PolymorphicRef,\n} from \"../../utils/types\";\nimport { EntityGroupContext } from \"./EntityGroup\";\n\nexport interface IEntityCardProps\n extends ICardProps,\n BaseHTMLAttributes<HTMLElement> {\n /** ClassName to add on Card */\n className?: string;\n /** Show as group of Cards on grid */\n isCollection?: boolean;\n /** Background color to override for Card */\n background?: string;\n /** CSSProperties to override for Card */\n style?: CSSProperties;\n}\n\nexport type EntityCardProps<C extends React.ElementType> =\n PolymorphicComponentPropsWithRef<C, IEntityCardProps>;\n\nexport type EntityComponent = <C extends React.ElementType = typeof Card>(\n props: EntityCardProps<C>\n) => ReactElement | null;\n\nexport const EntityCard: EntityComponent & { displayName?: string } =\n forwardRef(\n <C extends React.ElementType = typeof Card>(\n {\n children,\n isCollection,\n background,\n className,\n as,\n ...rest\n }: EntityCardProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const { renderAs } = useContext(EntityGroupContext);\n const paperType = renderAs === \"grid\" ? \"paper-1\" : \"paper-2\";\n const Component = as || Card;\n return (\n <StyledEntityCard\n as={Component}\n $renderAs={renderAs}\n $background={background}\n paperType={paperType}\n className={className}\n $isCollection={isCollection}\n {...rest}\n ref={ref}\n >\n {children}\n </StyledEntityCard>\n );\n }\n );\n\nEntityCard.displayName = \"EntityCard\";\n"],"file":"EntityCard.js"}
|
|
@@ -3,14 +3,12 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.EntityGroup = void 0;
|
|
6
|
+
exports.EntityGroupContext = exports.EntityGroup = void 0;
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
10
|
var _Styles = require("./Styles");
|
|
11
11
|
|
|
12
|
-
var _EntityCard = require("./EntityCard");
|
|
13
|
-
|
|
14
12
|
var _excluded = ["children", "gap", "renderAs"];
|
|
15
13
|
|
|
16
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -21,6 +19,12 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
|
|
|
21
19
|
|
|
22
20
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
23
21
|
|
|
22
|
+
var EntityGroupContext = /*#__PURE__*/_react.default.createContext({
|
|
23
|
+
renderAs: "grid"
|
|
24
|
+
});
|
|
25
|
+
|
|
26
|
+
exports.EntityGroupContext = EntityGroupContext;
|
|
27
|
+
|
|
24
28
|
var EntityGroup = function EntityGroup(_ref) {
|
|
25
29
|
var children = _ref.children,
|
|
26
30
|
gap = _ref.gap,
|
|
@@ -28,18 +32,14 @@ var EntityGroup = function EntityGroup(_ref) {
|
|
|
28
32
|
renderAs = _ref$renderAs === void 0 ? "grid" : _ref$renderAs,
|
|
29
33
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
30
34
|
|
|
31
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
35
|
+
return /*#__PURE__*/_react.default.createElement(EntityGroupContext.Provider, {
|
|
36
|
+
value: {
|
|
37
|
+
renderAs: renderAs
|
|
38
|
+
}
|
|
39
|
+
}, /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityGroup, _extends({
|
|
32
40
|
$renderAs: renderAs,
|
|
33
41
|
$gap: gap
|
|
34
|
-
}, rest),
|
|
35
|
-
if ( /*#__PURE__*/_react.default.isValidElement(child) && child.type === _EntityCard.EntityCard) {
|
|
36
|
-
return /*#__PURE__*/_react.default.cloneElement(child, {
|
|
37
|
-
renderAs: renderAs
|
|
38
|
-
});
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
return null;
|
|
42
|
-
}));
|
|
42
|
+
}, rest), children));
|
|
43
43
|
};
|
|
44
44
|
|
|
45
45
|
exports.EntityGroup = EntityGroup;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Entity/EntityGroup.tsx"],"names":["
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Entity/EntityGroup.tsx"],"names":["EntityGroupContext","React","createContext","renderAs","EntityGroup","children","gap","rest","displayName"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;;;;;AAWO,IAAMA,kBAAkB,gBAAGC,eAAMC,aAAN,CAAyC;AACzEC,EAAAA,QAAQ,EAAE;AAD+D,CAAzC,CAA3B;;;;AAIA,IAAMC,WAAwC,GAAG,SAA3CA,WAA2C,OAKlD;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,GAGI,QAHJA,GAGI;AAAA,2BAFJH,QAEI;AAAA,MAFJA,QAEI,8BAFO,MAEP;AAAA,MADDI,IACC;;AACJ,sBACE,6BAAC,kBAAD,CAAoB,QAApB;AAA6B,IAAA,KAAK,EAAE;AAAEJ,MAAAA,QAAQ,EAAEA;AAAZ;AAApC,kBACE,6BAAC,yBAAD;AAAmB,IAAA,SAAS,EAAEA,QAA9B;AAAwC,IAAA,IAAI,EAAEG;AAA9C,KAAuDC,IAAvD,GACGF,QADH,CADF,CADF;AAOD,CAbM;;;AAePD,WAAW,CAACI,WAAZ,GAA0B,aAA1B","sourcesContent":["import React, { HTMLAttributes } from \"react\";\nimport { StyledEntityGroup } from \"./Styles\";\n\nexport interface IEntityGroupProps\n extends Pick<HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> {\n gap?: number;\n renderAs?: \"grid\" | \"list\";\n}\n\ninterface IEntityGroupContext {\n renderAs: \"grid\" | \"list\";\n}\nexport const EntityGroupContext = React.createContext<IEntityGroupContext>({\n renderAs: \"grid\",\n});\n\nexport const EntityGroup: React.FC<IEntityGroupProps> = ({\n children,\n gap,\n renderAs = \"grid\",\n ...rest\n}) => {\n return (\n <EntityGroupContext.Provider value={{ renderAs: renderAs }}>\n <StyledEntityGroup $renderAs={renderAs} $gap={gap} {...rest}>\n {children}\n </StyledEntityGroup>\n </EntityGroupContext.Provider>\n );\n};\n\nEntityGroup.displayName = \"EntityGroup\";\n"],"file":"EntityGroup.js"}
|
|
@@ -1,20 +1,28 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
|
4
|
+
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
8
|
exports.EntityProperty = void 0;
|
|
7
9
|
|
|
8
|
-
var _react =
|
|
10
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
11
|
|
|
10
12
|
var _Styles = require("./Styles");
|
|
11
13
|
|
|
12
14
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
13
15
|
|
|
16
|
+
var _EntityGroup = require("./EntityGroup");
|
|
17
|
+
|
|
14
18
|
var _excluded = ["listOrder", "listWidth", "visibleFromBreakpoint", "className"];
|
|
15
19
|
|
|
16
20
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
21
|
|
|
22
|
+
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); }
|
|
23
|
+
|
|
24
|
+
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; }
|
|
25
|
+
|
|
18
26
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
19
27
|
|
|
20
28
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
@@ -28,12 +36,16 @@ var EntityProperty = function EntityProperty(_ref) {
|
|
|
28
36
|
className = _ref.className,
|
|
29
37
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
30
38
|
|
|
39
|
+
var _useContext = (0, _react.useContext)(_EntityGroup.EntityGroupContext),
|
|
40
|
+
renderAs = _useContext.renderAs;
|
|
41
|
+
|
|
31
42
|
return /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityProperty, _extends({
|
|
32
43
|
className: (0, _classnames.default)("c-entity-property", className)
|
|
33
44
|
}, props, {
|
|
34
45
|
$order: listOrder,
|
|
35
46
|
$width: listWidth,
|
|
36
|
-
$visibleFromBreakpoint: visibleFromBreakpoint
|
|
47
|
+
$visibleFromBreakpoint: visibleFromBreakpoint,
|
|
48
|
+
$renderAs: renderAs
|
|
37
49
|
}));
|
|
38
50
|
};
|
|
39
51
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Entity/EntityProperty.tsx"],"names":["EntityProperty","listOrder","listWidth","visibleFromBreakpoint","className","props","displayName"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Entity/EntityProperty.tsx"],"names":["EntityProperty","listOrder","listWidth","visibleFromBreakpoint","className","props","EntityGroupContext","renderAs","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAUO,IAAMA,cAAkD,GAAG,SAArDA,cAAqD,OAM5D;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,SAII,QAJJA,SAII;AAAA,MAHJC,qBAGI,QAHJA,qBAGI;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADDC,KACC;;AACJ,oBAAqB,uBAAWC,+BAAX,CAArB;AAAA,MAAQC,QAAR,eAAQA,QAAR;;AACA,sBACE,6BAAC,4BAAD;AACE,IAAA,SAAS,EAAE,yBAAW,mBAAX,EAAgCH,SAAhC;AADb,KAEMC,KAFN;AAGE,IAAA,MAAM,EAAEJ,SAHV;AAIE,IAAA,MAAM,EAAEC,SAJV;AAKE,IAAA,sBAAsB,EAAEC,qBAL1B;AAME,IAAA,SAAS,EAAEI;AANb,KADF;AAUD,CAlBM;;;AAoBPP,cAAc,CAACQ,WAAf,GAA6B,gBAA7B","sourcesContent":["import React, { HTMLAttributes, useContext } from \"react\";\nimport { StyledEntityProperty } from \"./Styles\";\nimport classNames from \"classnames\";\nimport { EntityGroupContext } from \"./EntityGroup\";\n\nexport type VisibleFromBreakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport interface IEntityCardPropertyProps\n extends HTMLAttributes<HTMLDivElement> {\n listOrder?: number;\n listWidth?: string | number;\n visibleFromBreakpoint?: VisibleFromBreakpoint;\n}\n\nexport const EntityProperty: React.FC<IEntityCardPropertyProps> = ({\n listOrder,\n listWidth,\n visibleFromBreakpoint,\n className,\n ...props\n}) => {\n const { renderAs } = useContext(EntityGroupContext);\n return (\n <StyledEntityProperty\n className={classNames(\"c-entity-property\", className)}\n {...props}\n $order={listOrder}\n $width={listWidth}\n $visibleFromBreakpoint={visibleFromBreakpoint}\n $renderAs={renderAs}\n />\n );\n};\n\nEntityProperty.displayName = \"EntityProperty\";\n"],"file":"EntityProperty.js"}
|
|
@@ -20,14 +20,12 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
20
20
|
var StyledEntityCard = (0, _styledComponents.default)(_Card.Card).withConfig({
|
|
21
21
|
displayName: "Styles__StyledEntityCard",
|
|
22
22
|
componentId: "sc-bjeea8-0"
|
|
23
|
-
})(["line-height:1.375;", " ", " ", " ", "
|
|
23
|
+
})(["line-height:1.375;", " ", " ", " ", ""], function (_ref) {
|
|
24
24
|
var $renderAs = _ref.$renderAs;
|
|
25
25
|
return $renderAs === "list" && (0, _styledComponents.css)(["display:flex;flex-direction:row;align-items:center;min-height:48px;margin-bottom:4px;justify-content:space-between;padding:0 16px 0 16px;"]);
|
|
26
26
|
}, function (_ref2) {
|
|
27
27
|
var $renderAs = _ref2.$renderAs;
|
|
28
28
|
return $renderAs === "grid" && (0, _styledComponents.css)(["display:flex;flex-direction:column;position:relative;padding:20px 24px;height:280px;"]);
|
|
29
|
-
}, function (props) {
|
|
30
|
-
return props.$gap && (0, _styledComponents.css)(["gap:", "px;"], props.$gap);
|
|
31
29
|
}, function (props) {
|
|
32
30
|
return props.$background && (0, _styledComponents.css)(["background-color:", ";"], props.$background);
|
|
33
31
|
}, function (_ref3) {
|
|
@@ -94,14 +92,12 @@ StyledEntityProperty.displayName = "StyledEntityProperty";
|
|
|
94
92
|
var StyledEntityGroup = (0, _styledComponents.default)("div").withConfig({
|
|
95
93
|
displayName: "Styles__StyledEntityGroup",
|
|
96
94
|
componentId: "sc-bjeea8-2"
|
|
97
|
-
})(["", " ", "
|
|
95
|
+
})(["", " ", ""], function (_ref11) {
|
|
98
96
|
var $renderAs = _ref11.$renderAs,
|
|
99
97
|
$gap = _ref11.$gap;
|
|
100
98
|
return $renderAs === "grid" && (0, _styledComponents.css)(["display:grid;grid-gap:", ";grid-template-columns:repeat(auto-fill,minmax(260px,1fr));"], $gap ? "".concat($gap, "px") : "initial");
|
|
101
99
|
}, function (props) {
|
|
102
100
|
return props.$renderAs === "list" && (0, _styledComponents.css)(["display:flex;flex-direction:column;"]);
|
|
103
|
-
}, function (props) {
|
|
104
|
-
return props.$gap && props.$renderAs === "list" && (0, _styledComponents.css)(["", "{gap:", "px;}"], StyledEntityCard, props.$gap);
|
|
105
101
|
});
|
|
106
102
|
exports.StyledEntityGroup = StyledEntityGroup;
|
|
107
103
|
StyledEntityGroup.displayName = "StyledEntityGroup";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Entity/Styles.ts"],"names":["StyledEntityCard","Card","$renderAs","css","props","$
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Entity/Styles.ts"],"names":["StyledEntityCard","Card","$renderAs","css","props","$background","$isCollection","PaperStyles","displayName","StyledEntityProperty","$width","$order","$visibleFromBreakpoint","StyledEntityGroup","$gap","StyledEntityActions"],"mappings":"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","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Card } from \"../Card\";\nimport { PaperStyles } from \"../Paper/Styles\";\nimport { VisibleFromBreakpoint } from \"./EntityProperty\";\nimport tw from \"twin.macro\";\n\nexport const StyledEntityCard = styled(Card)<{\n $renderAs: string;\n $gap?: number;\n $background?: string;\n $isCollection?: boolean;\n}>`\n line-height: 1.375;\n ${({ $renderAs }) =>\n $renderAs === \"list\" &&\n css`\n display: flex;\n flex-direction: row;\n align-items: center;\n min-height: 48px;\n margin-bottom: 4px;\n justify-content: space-between;\n padding: 0 16px 0 16px;\n `}\n\n ${({ $renderAs }) =>\n $renderAs === \"grid\" &&\n css`\n display: flex;\n flex-direction: column;\n position: relative;\n padding: 20px 24px;\n height: 280px;\n `}\n\n\n ${(props) =>\n props.$background &&\n css`\n background-color: ${props.$background};\n `}\n\n ${({ $isCollection, $background }) =>\n $isCollection &&\n css`\n &::after {\n display: block;\n content: \"\";\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n transform: rotate(-3deg);\n z-index: -1;\n ${PaperStyles};\n background-color: ${$background};\n }\n `}\n`;\nStyledEntityCard.displayName = \"StyledEntityCard\";\n\nexport const StyledEntityProperty = styled(\"div\")<{\n $renderAs?: string;\n $order?: number;\n $width?: number | string;\n $visibleFromBreakpoint?: VisibleFromBreakpoint;\n}>`\n ${({ $renderAs, $width }) =>\n $renderAs === \"list\" &&\n css`\n display: flex;\n align-items: center;\n min-width: 24px;\n flex: ${$width ? \"unset\" : 1};\n `}\n\n ${(props) =>\n props.$renderAs === \"list\" &&\n props.$order &&\n css`\n order: ${props.$order};\n `}\n\n ${(props) =>\n props.$renderAs === \"list\" &&\n props.$width &&\n css`\n width: ${props.$width};\n `}\n ${({ $visibleFromBreakpoint }) =>\n $visibleFromBreakpoint &&\n css`\n ${tw`tw-hidden`}\n `}\n ${({ $visibleFromBreakpoint }) =>\n $visibleFromBreakpoint === \"sm\" &&\n css`\n ${tw`sm:tw-flex`}\n `}\n ${({ $visibleFromBreakpoint }) =>\n $visibleFromBreakpoint === \"md\" &&\n css`\n ${tw`md:tw-flex`}\n `}\n ${({ $visibleFromBreakpoint }) =>\n $visibleFromBreakpoint === \"lg\" &&\n css`\n ${tw`lg:tw-flex`}\n `}\n ${({ $visibleFromBreakpoint }) =>\n $visibleFromBreakpoint === \"xl\" &&\n css`\n ${tw`xl:tw-flex`}\n `}\n ${({ $visibleFromBreakpoint }) =>\n $visibleFromBreakpoint === \"2xl\" &&\n css`\n ${tw`2xl:tw-flex`}\n `}\n`;\n\nStyledEntityProperty.displayName = \"StyledEntityProperty\";\n\nexport const StyledEntityGroup = styled(\"div\")<{\n $renderAs: string;\n $gap?: number;\n}>`\n ${({ $renderAs, $gap }) =>\n $renderAs === \"grid\" &&\n css`\n display: grid;\n grid-gap: ${$gap ? `${$gap}px` : \"initial\"};\n grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n `}\n ${(props) =>\n props.$renderAs === \"list\" &&\n css`\n display: flex;\n flex-direction: column;\n `}\n`;\nStyledEntityGroup.displayName = \"StyledEntityGroup\";\n\nexport const StyledEntityActions = styled(\"div\")<{ $renderAs?: string }>`\n display: flex;\n flex-direction: column;\n align-items: center;\n\n ${({ $renderAs }) =>\n $renderAs === \"grid\" &&\n css`\n position: absolute;\n right: 16px;\n top: 20px;\n `}\n\n ${({ $renderAs }) =>\n $renderAs === \"list\" &&\n css`\n justify-self: flex-end;\n `}\n`;\n"],"file":"Styles.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Entity/index.ts"],"names":["Entity","Group","EntityGroup","Card","EntityCard","Property","EntityProperty"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Entity/index.ts"],"names":["Entity","Group","EntityGroup","Card","EntityCard","Property","EntityProperty"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAQO,IAAMA,MAAe,GAAG;AAC7BC,EAAAA,KAAK,EAAEC,wBADsB;AAE7BC,EAAAA,IAAI,EAAEC,sBAFuB;AAG7BC,EAAAA,QAAQ,EAAEC;AAHmB,CAAxB","sourcesContent":["import { EntityGroup } from \"./EntityGroup\";\nimport { EntityCard } from \"./EntityCard\";\nimport { EntityProperty } from \"./EntityProperty\";\n\nexport interface IEntity {\n Group: typeof EntityGroup;\n Card: typeof EntityCard;\n Property: typeof EntityProperty;\n}\n\nexport const Entity: IEntity = {\n Group: EntityGroup,\n Card: EntityCard,\n Property: EntityProperty,\n};\n"],"file":"index.js"}
|
|
@@ -1,16 +1,15 @@
|
|
|
1
|
-
import React, { BaseHTMLAttributes,
|
|
2
|
-
import { ICardProps } from "../Card";
|
|
1
|
+
import React, { BaseHTMLAttributes, CSSProperties, ReactElement } from "react";
|
|
2
|
+
import { Card, ICardProps } from "../Card";
|
|
3
|
+
import { PolymorphicComponentPropsWithRef } from "../../utils/types";
|
|
3
4
|
export interface IEntityCardProps extends ICardProps, BaseHTMLAttributes<HTMLElement> {
|
|
4
|
-
renderAs?: "grid" | "list";
|
|
5
|
-
actions?: ReactNode;
|
|
6
5
|
className?: string;
|
|
7
6
|
isCollection?: boolean;
|
|
8
7
|
background?: string;
|
|
9
8
|
style?: CSSProperties;
|
|
10
|
-
to?: string;
|
|
11
|
-
component?: ComponentType<{
|
|
12
|
-
children: ReactNode;
|
|
13
|
-
}>;
|
|
14
9
|
}
|
|
15
|
-
export declare
|
|
10
|
+
export declare type EntityCardProps<C extends React.ElementType> = PolymorphicComponentPropsWithRef<C, IEntityCardProps>;
|
|
11
|
+
export declare type EntityComponent = <C extends React.ElementType = typeof Card>(props: EntityCardProps<C>) => ReactElement | null;
|
|
12
|
+
export declare const EntityCard: EntityComponent & {
|
|
13
|
+
displayName?: string;
|
|
14
|
+
};
|
|
16
15
|
//# sourceMappingURL=EntityCard.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EntityCard.d.ts","sourceRoot":"","sources":["../../../../src/components/Entity/EntityCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,kBAAkB,EAClB,aAAa,
|
|
1
|
+
{"version":3,"file":"EntityCard.d.ts","sourceRoot":"","sources":["../../../../src/components/Entity/EntityCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,kBAAkB,EAClB,aAAa,EAEb,YAAY,EAEb,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EACL,gCAAgC,EAEjC,MAAM,mBAAmB,CAAC;AAG3B,MAAM,WAAW,gBACf,SAAQ,UAAU,EAChB,kBAAkB,CAAC,WAAW,CAAC;IAEjC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,oBAAY,eAAe,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IACrD,gCAAgC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC;AAExD,oBAAY,eAAe,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,OAAO,IAAI,EACtE,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KACtB,YAAY,GAAG,IAAI,CAAC;AAEzB,eAAO,MAAM,UAAU,EAAE,eAAe,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;CA+B9D,CAAC"}
|
|
@@ -1,45 +1,33 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
|
-
var _excluded = ["children", "
|
|
4
|
-
import React, {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
export var EntityCard = function
|
|
3
|
+
var _excluded = ["children", "isCollection", "background", "className", "as"];
|
|
4
|
+
import React, { forwardRef, useContext } from "react";
|
|
5
|
+
import { StyledEntityCard } from "./Styles";
|
|
6
|
+
import { Card } from "../Card";
|
|
7
|
+
import { EntityGroupContext } from "./EntityGroup";
|
|
8
|
+
export var EntityCard = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
9
9
|
var children = _ref.children,
|
|
10
|
-
actions = _ref.actions,
|
|
11
|
-
_ref$renderAs = _ref.renderAs,
|
|
12
|
-
renderAs = _ref$renderAs === void 0 ? "grid" : _ref$renderAs,
|
|
13
10
|
isCollection = _ref.isCollection,
|
|
14
11
|
background = _ref.background,
|
|
15
12
|
className = _ref.className,
|
|
16
|
-
|
|
13
|
+
as = _ref.as,
|
|
17
14
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
18
15
|
|
|
16
|
+
var _useContext = useContext(EntityGroupContext),
|
|
17
|
+
renderAs = _useContext.renderAs;
|
|
18
|
+
|
|
19
19
|
var paperType = renderAs === "grid" ? "paper-1" : "paper-2";
|
|
20
|
-
var
|
|
21
|
-
return /*#__PURE__*/React.createElement(
|
|
22
|
-
|
|
23
|
-
wrap: function wrap(children) {
|
|
24
|
-
return /*#__PURE__*/React.createElement(WrapperElement, rest, children);
|
|
25
|
-
}
|
|
26
|
-
}, /*#__PURE__*/React.createElement(StyledEntityCard, _extends({
|
|
20
|
+
var Component = as || Card;
|
|
21
|
+
return /*#__PURE__*/React.createElement(StyledEntityCard, _extends({
|
|
22
|
+
as: Component,
|
|
27
23
|
$renderAs: renderAs,
|
|
28
24
|
$background: background,
|
|
29
25
|
paperType: paperType,
|
|
30
26
|
className: className,
|
|
31
27
|
$isCollection: isCollection
|
|
32
|
-
}, rest
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
});
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
return null;
|
|
40
|
-
}), actions && /*#__PURE__*/React.createElement(StyledEntityActions, {
|
|
41
|
-
$renderAs: renderAs
|
|
42
|
-
}, actions)));
|
|
43
|
-
};
|
|
28
|
+
}, rest, {
|
|
29
|
+
ref: ref
|
|
30
|
+
}), children);
|
|
31
|
+
});
|
|
44
32
|
EntityCard.displayName = "EntityCard";
|
|
45
33
|
//# sourceMappingURL=EntityCard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Entity/EntityCard.tsx"],"names":["React","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Entity/EntityCard.tsx"],"names":["React","forwardRef","useContext","StyledEntityCard","Card","EntityGroupContext","EntityCard","ref","children","isCollection","background","className","as","rest","renderAs","paperType","Component","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAGEC,UAHF,EAKEC,UALF,QAMO,OANP;AAOA,SAASC,gBAAT,QAAiC,UAAjC;AAEA,SAASC,IAAT,QAAiC,SAAjC;AAKA,SAASC,kBAAT,QAAmC,eAAnC;AAsBA,OAAO,IAAMC,UAAsD,gBACjEL,UAAU,CACR,gBASEM,GATF,EAUK;AAAA,MARDC,QAQC,QARDA,QAQC;AAAA,MAPDC,YAOC,QAPDA,YAOC;AAAA,MANDC,UAMC,QANDA,UAMC;AAAA,MALDC,SAKC,QALDA,SAKC;AAAA,MAJDC,EAIC,QAJDA,EAIC;AAAA,MAHEC,IAGF;;AACH,oBAAqBX,UAAU,CAACG,kBAAD,CAA/B;AAAA,MAAQS,QAAR,eAAQA,QAAR;;AACA,MAAMC,SAAS,GAAGD,QAAQ,KAAK,MAAb,GAAsB,SAAtB,GAAkC,SAApD;AACA,MAAME,SAAS,GAAGJ,EAAE,IAAIR,IAAxB;AACA,sBACE,oBAAC,gBAAD;AACE,IAAA,EAAE,EAAEY,SADN;AAEE,IAAA,SAAS,EAAEF,QAFb;AAGE,IAAA,WAAW,EAAEJ,UAHf;AAIE,IAAA,SAAS,EAAEK,SAJb;AAKE,IAAA,SAAS,EAAEJ,SALb;AAME,IAAA,aAAa,EAAEF;AANjB,KAOMI,IAPN;AAQE,IAAA,GAAG,EAAEN;AARP,MAUGC,QAVH,CADF;AAcD,CA7BO,CADL;AAiCPF,UAAU,CAACW,WAAX,GAAyB,YAAzB","sourcesContent":["import React, {\n BaseHTMLAttributes,\n CSSProperties,\n forwardRef,\n ReactElement,\n useContext,\n} from \"react\";\nimport { StyledEntityCard } from \"./Styles\";\n\nimport { Card, ICardProps } from \"../Card\";\nimport {\n PolymorphicComponentPropsWithRef,\n PolymorphicRef,\n} from \"../../utils/types\";\nimport { EntityGroupContext } from \"./EntityGroup\";\n\nexport interface IEntityCardProps\n extends ICardProps,\n BaseHTMLAttributes<HTMLElement> {\n /** ClassName to add on Card */\n className?: string;\n /** Show as group of Cards on grid */\n isCollection?: boolean;\n /** Background color to override for Card */\n background?: string;\n /** CSSProperties to override for Card */\n style?: CSSProperties;\n}\n\nexport type EntityCardProps<C extends React.ElementType> =\n PolymorphicComponentPropsWithRef<C, IEntityCardProps>;\n\nexport type EntityComponent = <C extends React.ElementType = typeof Card>(\n props: EntityCardProps<C>\n) => ReactElement | null;\n\nexport const EntityCard: EntityComponent & { displayName?: string } =\n forwardRef(\n <C extends React.ElementType = typeof Card>(\n {\n children,\n isCollection,\n background,\n className,\n as,\n ...rest\n }: EntityCardProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const { renderAs } = useContext(EntityGroupContext);\n const paperType = renderAs === \"grid\" ? \"paper-1\" : \"paper-2\";\n const Component = as || Card;\n return (\n <StyledEntityCard\n as={Component}\n $renderAs={renderAs}\n $background={background}\n paperType={paperType}\n className={className}\n $isCollection={isCollection}\n {...rest}\n ref={ref}\n >\n {children}\n </StyledEntityCard>\n );\n }\n );\n\nEntityCard.displayName = \"EntityCard\";\n"],"file":"EntityCard.js"}
|
|
@@ -3,5 +3,10 @@ export interface IEntityGroupProps extends Pick<HTMLAttributes<HTMLDivElement>,
|
|
|
3
3
|
gap?: number;
|
|
4
4
|
renderAs?: "grid" | "list";
|
|
5
5
|
}
|
|
6
|
+
interface IEntityGroupContext {
|
|
7
|
+
renderAs: "grid" | "list";
|
|
8
|
+
}
|
|
9
|
+
export declare const EntityGroupContext: React.Context<IEntityGroupContext>;
|
|
6
10
|
export declare const EntityGroup: React.FC<IEntityGroupProps>;
|
|
11
|
+
export {};
|
|
7
12
|
//# sourceMappingURL=EntityGroup.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EntityGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/Entity/EntityGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"EntityGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/Entity/EntityGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG9C,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,WAAW,GAAG,OAAO,CAAC;IACnE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC5B;AAED,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAC;CAC3B;AACD,eAAO,MAAM,kBAAkB,oCAE7B,CAAC;AAEH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAanD,CAAC"}
|
|
@@ -3,7 +3,9 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
|
|
|
3
3
|
var _excluded = ["children", "gap", "renderAs"];
|
|
4
4
|
import React from "react";
|
|
5
5
|
import { StyledEntityGroup } from "./Styles";
|
|
6
|
-
|
|
6
|
+
export var EntityGroupContext = /*#__PURE__*/React.createContext({
|
|
7
|
+
renderAs: "grid"
|
|
8
|
+
});
|
|
7
9
|
export var EntityGroup = function EntityGroup(_ref) {
|
|
8
10
|
var children = _ref.children,
|
|
9
11
|
gap = _ref.gap,
|
|
@@ -11,18 +13,14 @@ export var EntityGroup = function EntityGroup(_ref) {
|
|
|
11
13
|
renderAs = _ref$renderAs === void 0 ? "grid" : _ref$renderAs,
|
|
12
14
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
13
15
|
|
|
14
|
-
return /*#__PURE__*/React.createElement(
|
|
16
|
+
return /*#__PURE__*/React.createElement(EntityGroupContext.Provider, {
|
|
17
|
+
value: {
|
|
18
|
+
renderAs: renderAs
|
|
19
|
+
}
|
|
20
|
+
}, /*#__PURE__*/React.createElement(StyledEntityGroup, _extends({
|
|
15
21
|
$renderAs: renderAs,
|
|
16
22
|
$gap: gap
|
|
17
|
-
}, rest),
|
|
18
|
-
if ( /*#__PURE__*/React.isValidElement(child) && child.type === EntityCard) {
|
|
19
|
-
return /*#__PURE__*/React.cloneElement(child, {
|
|
20
|
-
renderAs: renderAs
|
|
21
|
-
});
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
return null;
|
|
25
|
-
}));
|
|
23
|
+
}, rest), children));
|
|
26
24
|
};
|
|
27
25
|
EntityGroup.displayName = "EntityGroup";
|
|
28
26
|
//# sourceMappingURL=EntityGroup.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Entity/EntityGroup.tsx"],"names":["React","StyledEntityGroup","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Entity/EntityGroup.tsx"],"names":["React","StyledEntityGroup","EntityGroupContext","createContext","renderAs","EntityGroup","children","gap","rest","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,MAAsC,OAAtC;AACA,SAASC,iBAAT,QAAkC,UAAlC;AAWA,OAAO,IAAMC,kBAAkB,gBAAGF,KAAK,CAACG,aAAN,CAAyC;AACzEC,EAAAA,QAAQ,EAAE;AAD+D,CAAzC,CAA3B;AAIP,OAAO,IAAMC,WAAwC,GAAG,SAA3CA,WAA2C,OAKlD;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,GAGI,QAHJA,GAGI;AAAA,2BAFJH,QAEI;AAAA,MAFJA,QAEI,8BAFO,MAEP;AAAA,MADDI,IACC;;AACJ,sBACE,oBAAC,kBAAD,CAAoB,QAApB;AAA6B,IAAA,KAAK,EAAE;AAAEJ,MAAAA,QAAQ,EAAEA;AAAZ;AAApC,kBACE,oBAAC,iBAAD;AAAmB,IAAA,SAAS,EAAEA,QAA9B;AAAwC,IAAA,IAAI,EAAEG;AAA9C,KAAuDC,IAAvD,GACGF,QADH,CADF,CADF;AAOD,CAbM;AAePD,WAAW,CAACI,WAAZ,GAA0B,aAA1B","sourcesContent":["import React, { HTMLAttributes } from \"react\";\nimport { StyledEntityGroup } from \"./Styles\";\n\nexport interface IEntityGroupProps\n extends Pick<HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> {\n gap?: number;\n renderAs?: \"grid\" | \"list\";\n}\n\ninterface IEntityGroupContext {\n renderAs: \"grid\" | \"list\";\n}\nexport const EntityGroupContext = React.createContext<IEntityGroupContext>({\n renderAs: \"grid\",\n});\n\nexport const EntityGroup: React.FC<IEntityGroupProps> = ({\n children,\n gap,\n renderAs = \"grid\",\n ...rest\n}) => {\n return (\n <EntityGroupContext.Provider value={{ renderAs: renderAs }}>\n <StyledEntityGroup $renderAs={renderAs} $gap={gap} {...rest}>\n {children}\n </StyledEntityGroup>\n </EntityGroupContext.Provider>\n );\n};\n\nEntityGroup.displayName = \"EntityGroup\";\n"],"file":"EntityGroup.js"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import React, { HTMLAttributes } from "react";
|
|
2
2
|
export declare type VisibleFromBreakpoint = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
3
3
|
export interface IEntityCardPropertyProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
-
$renderAs?: "grid" | "list";
|
|
5
4
|
listOrder?: number;
|
|
6
5
|
listWidth?: string | number;
|
|
7
6
|
visibleFromBreakpoint?: VisibleFromBreakpoint;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EntityProperty.d.ts","sourceRoot":"","sources":["../../../../src/components/Entity/EntityProperty.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"EntityProperty.d.ts","sourceRoot":"","sources":["../../../../src/components/Entity/EntityProperty.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAc,MAAM,OAAO,CAAC;AAK1D,oBAAY,qBAAqB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AACtE,MAAM,WAAW,wBACf,SAAQ,cAAc,CAAC,cAAc,CAAC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,qBAAqB,CAAC,EAAE,qBAAqB,CAAC;CAC/C;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAkB7D,CAAC"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
3
|
var _excluded = ["listOrder", "listWidth", "visibleFromBreakpoint", "className"];
|
|
4
|
-
import React from "react";
|
|
4
|
+
import React, { useContext } from "react";
|
|
5
5
|
import { StyledEntityProperty } from "./Styles";
|
|
6
6
|
import classNames from "classnames";
|
|
7
|
+
import { EntityGroupContext } from "./EntityGroup";
|
|
7
8
|
export var EntityProperty = function EntityProperty(_ref) {
|
|
8
9
|
var listOrder = _ref.listOrder,
|
|
9
10
|
listWidth = _ref.listWidth,
|
|
@@ -11,12 +12,16 @@ export var EntityProperty = function EntityProperty(_ref) {
|
|
|
11
12
|
className = _ref.className,
|
|
12
13
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
13
14
|
|
|
15
|
+
var _useContext = useContext(EntityGroupContext),
|
|
16
|
+
renderAs = _useContext.renderAs;
|
|
17
|
+
|
|
14
18
|
return /*#__PURE__*/React.createElement(StyledEntityProperty, _extends({
|
|
15
19
|
className: classNames("c-entity-property", className)
|
|
16
20
|
}, props, {
|
|
17
21
|
$order: listOrder,
|
|
18
22
|
$width: listWidth,
|
|
19
|
-
$visibleFromBreakpoint: visibleFromBreakpoint
|
|
23
|
+
$visibleFromBreakpoint: visibleFromBreakpoint,
|
|
24
|
+
$renderAs: renderAs
|
|
20
25
|
}));
|
|
21
26
|
};
|
|
22
27
|
EntityProperty.displayName = "EntityProperty";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Entity/EntityProperty.tsx"],"names":["React","StyledEntityProperty","classNames","EntityProperty","listOrder","listWidth","visibleFromBreakpoint","className","props","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Entity/EntityProperty.tsx"],"names":["React","useContext","StyledEntityProperty","classNames","EntityGroupContext","EntityProperty","listOrder","listWidth","visibleFromBreakpoint","className","props","renderAs","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgCC,UAAhC,QAAkD,OAAlD;AACA,SAASC,oBAAT,QAAqC,UAArC;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,kBAAT,QAAmC,eAAnC;AAUA,OAAO,IAAMC,cAAkD,GAAG,SAArDA,cAAqD,OAM5D;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,SAII,QAJJA,SAII;AAAA,MAHJC,qBAGI,QAHJA,qBAGI;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADDC,KACC;;AACJ,oBAAqBT,UAAU,CAACG,kBAAD,CAA/B;AAAA,MAAQO,QAAR,eAAQA,QAAR;;AACA,sBACE,oBAAC,oBAAD;AACE,IAAA,SAAS,EAAER,UAAU,CAAC,mBAAD,EAAsBM,SAAtB;AADvB,KAEMC,KAFN;AAGE,IAAA,MAAM,EAAEJ,SAHV;AAIE,IAAA,MAAM,EAAEC,SAJV;AAKE,IAAA,sBAAsB,EAAEC,qBAL1B;AAME,IAAA,SAAS,EAAEG;AANb,KADF;AAUD,CAlBM;AAoBPN,cAAc,CAACO,WAAf,GAA6B,gBAA7B","sourcesContent":["import React, { HTMLAttributes, useContext } from \"react\";\nimport { StyledEntityProperty } from \"./Styles\";\nimport classNames from \"classnames\";\nimport { EntityGroupContext } from \"./EntityGroup\";\n\nexport type VisibleFromBreakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport interface IEntityCardPropertyProps\n extends HTMLAttributes<HTMLDivElement> {\n listOrder?: number;\n listWidth?: string | number;\n visibleFromBreakpoint?: VisibleFromBreakpoint;\n}\n\nexport const EntityProperty: React.FC<IEntityCardPropertyProps> = ({\n listOrder,\n listWidth,\n visibleFromBreakpoint,\n className,\n ...props\n}) => {\n const { renderAs } = useContext(EntityGroupContext);\n return (\n <StyledEntityProperty\n className={classNames(\"c-entity-property\", className)}\n {...props}\n $order={listOrder}\n $width={listWidth}\n $visibleFromBreakpoint={visibleFromBreakpoint}\n $renderAs={renderAs}\n />\n );\n};\n\nEntityProperty.displayName = \"EntityProperty\";\n"],"file":"EntityProperty.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Entity/Styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAGzD,eAAO,MAAM,gBAAgB;eAChB,MAAM;;;;
|
|
1
|
+
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Entity/Styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAGzD,eAAO,MAAM,gBAAgB;eAChB,MAAM;;;;SAoDlB,CAAC;AAGF,eAAO,MAAM,oBAAoB;;;;;SA0DhC,CAAC;AAIF,eAAO,MAAM,iBAAiB;eACjB,MAAM;;SAgBlB,CAAC;AAGF,eAAO,MAAM,mBAAmB;;SAkB/B,CAAC"}
|
|
@@ -4,14 +4,12 @@ import { PaperStyles } from "../Paper/Styles";
|
|
|
4
4
|
export var StyledEntityCard = styled(Card).withConfig({
|
|
5
5
|
displayName: "Styles__StyledEntityCard",
|
|
6
6
|
componentId: "sc-bjeea8-0"
|
|
7
|
-
})(["line-height:1.375;", " ", " ", " ", "
|
|
7
|
+
})(["line-height:1.375;", " ", " ", " ", ""], function (_ref) {
|
|
8
8
|
var $renderAs = _ref.$renderAs;
|
|
9
9
|
return $renderAs === "list" && css(["display:flex;flex-direction:row;align-items:center;min-height:48px;margin-bottom:4px;justify-content:space-between;padding:0 16px 0 16px;"]);
|
|
10
10
|
}, function (_ref2) {
|
|
11
11
|
var $renderAs = _ref2.$renderAs;
|
|
12
12
|
return $renderAs === "grid" && css(["display:flex;flex-direction:column;position:relative;padding:20px 24px;height:280px;"]);
|
|
13
|
-
}, function (props) {
|
|
14
|
-
return props.$gap && css(["gap:", "px;"], props.$gap);
|
|
15
13
|
}, function (props) {
|
|
16
14
|
return props.$background && css(["background-color:", ";"], props.$background);
|
|
17
15
|
}, function (_ref3) {
|
|
@@ -76,14 +74,12 @@ StyledEntityProperty.displayName = "StyledEntityProperty";
|
|
|
76
74
|
export var StyledEntityGroup = styled("div").withConfig({
|
|
77
75
|
displayName: "Styles__StyledEntityGroup",
|
|
78
76
|
componentId: "sc-bjeea8-2"
|
|
79
|
-
})(["", " ", "
|
|
77
|
+
})(["", " ", ""], function (_ref11) {
|
|
80
78
|
var $renderAs = _ref11.$renderAs,
|
|
81
79
|
$gap = _ref11.$gap;
|
|
82
80
|
return $renderAs === "grid" && css(["display:grid;grid-gap:", ";grid-template-columns:repeat(auto-fill,minmax(260px,1fr));"], $gap ? $gap + "px" : "initial");
|
|
83
81
|
}, function (props) {
|
|
84
82
|
return props.$renderAs === "list" && css(["display:flex;flex-direction:column;"]);
|
|
85
|
-
}, function (props) {
|
|
86
|
-
return props.$gap && props.$renderAs === "list" && css(["", "{gap:", "px;}"], StyledEntityCard, props.$gap);
|
|
87
83
|
});
|
|
88
84
|
StyledEntityGroup.displayName = "StyledEntityGroup";
|
|
89
85
|
export var StyledEntityActions = styled("div").withConfig({
|