pixelize-design-library 1.0.54 → 1.0.56

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.
Files changed (5) hide show
  1. package/dist/Components/Modal/Modal.js +16 -11
  2. package/dist/Components/Modal/ModalProps.d.ts +2 -3
  3. package/dist/Components/ProfileCard/ProfileCard.js +17 -12
  4. package/dist/Components/ProfileCard/ProfileCardProps.d.ts +2 -1
  5. package/package.json +1 -1
package/dist/Components/Modal/Modal.js CHANGED
@@ -9,15 +9,20 @@ function Modal(_a) {
9
9
  var size = _a.size, _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, onClose = _a.onClose, _c = _a.overlaybg, overlaybg = _c === void 0 ? "blackAlpha.300" : _c, _d = _a.overlaybackdropFilter, overlaybackdropFilter = _d === void 0 ? "blur(10px) hue-rotate(90deg)" : _d, overlaybackdropInvert = _a.overlaybackdropInvert, overlaybackdropBlur = _a.overlaybackdropBlur, isCentered = _a.isCentered, finalFocusRef = _a.finalFocusRef, blockScrollOnMount = _a.blockScrollOnMount, initialFocusRef = _a.initialFocusRef, closeOnOverlayClick = _a.closeOnOverlayClick, motionPreset = _a.motionPreset, scrollBehavior = _a.scrollBehavior, children = _a.children, isLoading = _a.isLoading;
10
10
  if (!isOpen)
11
11
  return react_1.default.createElement(react_1.default.Fragment, null);
12
- var filterChildren = function (type) {
13
- return react_1.default.Children.map(children, function (child) {
14
- if (child.type === type)
15
- return child.props.children;
16
- }).filter(Boolean)[0]; // Get the first (and should be only) element's children
12
+ // const filterChildren = (type: string) => {
13
+ // return React.Children.map(children, (child) => {
14
+ // if (child.type === type) return child.props.children;
15
+ // }).filter(Boolean)[0]; // Get the first (and should be only) element's children
16
+ // };
17
+ // const headerContent = filterChildren("header");
18
+ // const bodyContent = filterChildren("body");
19
+ // const footerContent = filterChildren("footer");
20
+ var isReactElement = function (child) {
21
+ return child !== null && typeof child === "object" && "type" in child;
17
22
  };
18
- var headerContent = filterChildren("header");
19
- var bodyContent = filterChildren("body");
20
- var footerContent = filterChildren("footer");
23
+ var header = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === "header"; });
24
+ var body = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === "body"; });
25
+ var footer = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === "footer"; });
21
26
  return (react_1.default.createElement(react_2.Modal, { isOpen: true, onClose: onClose, size: size, isCentered: isCentered, finalFocusRef: finalFocusRef, blockScrollOnMount: blockScrollOnMount, initialFocusRef: initialFocusRef, closeOnOverlayClick: closeOnOverlayClick, motionPreset: motionPreset, scrollBehavior: scrollBehavior },
22
27
  react_1.default.createElement(react_2.ModalOverlay, { bg: overlaybg, backdropFilter: overlaybackdropFilter, backdropInvert: overlaybackdropInvert, backdropBlur: overlaybackdropBlur }),
23
28
  react_1.default.createElement(react_2.ModalContent, null, isLoading ? (react_1.default.createElement("div", { style: {
@@ -29,9 +34,9 @@ function Modal(_a) {
29
34
  padding: "25%",
30
35
  } },
31
36
  react_1.default.createElement(react_2.Spinner, { thickness: "4px", speed: "0.65s", emptyColor: "gray.200", color: "blue.500", size: "xl" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
32
- headerContent && react_1.default.createElement(react_2.ModalHeader, null, headerContent),
37
+ header && react_1.default.createElement(react_2.ModalHeader, null, header),
33
38
  react_1.default.createElement(react_2.ModalCloseButton, null),
34
- react_1.default.createElement(react_2.ModalBody, null, bodyContent),
35
- footerContent && react_1.default.createElement(react_2.ModalFooter, null, footerContent))))));
39
+ react_1.default.createElement(react_2.ModalBody, null, body),
40
+ footer && react_1.default.createElement(react_2.ModalFooter, null, footer))))));
36
41
  }
37
42
  exports.default = Modal;
package/dist/Components/Modal/ModalProps.d.ts CHANGED
@@ -1,12 +1,11 @@
1
+ /// <reference types="react" />
1
2
  import { ModalProps } from "@chakra-ui/react";
2
3
  export type ChakraModelProps = Pick<ModalProps, "isOpen" | "onClose" | "finalFocusRef" | "blockScrollOnMount" | "initialFocusRef" | "closeOnOverlayClick" | "isCentered" | "motionPreset" | "scrollBehavior"> & {
3
- header?: any;
4
- footer?: any;
5
4
  overlaybg?: string;
6
5
  overlaybackdropFilter?: string;
7
6
  overlaybackdropInvert?: string;
8
7
  overlaybackdropBlur?: string;
9
8
  size: "xs" | "sm" | "md" | "lg" | "xl" | "full";
10
- children?: any;
9
+ children?: React.ReactNode;
11
10
  isLoading?: boolean;
12
11
  };
package/dist/Components/ProfileCard/ProfileCard.js CHANGED
@@ -6,6 +6,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  var react_1 = __importDefault(require("react"));
7
7
  var react_2 = require("@chakra-ui/react");
8
8
  function ProfileCard(_a) {
9
+ // const filterChildren = (type: string) => {
10
+ // return React.Children.map(children, (child) => {
11
+ // if (child.type === type) return child.props.children;
12
+ // }).filter(Boolean)[0];
13
+ // };
9
14
  var key = _a.key,
10
15
  // maxW,
11
16
  // align,
@@ -17,15 +22,15 @@ function ProfileCard(_a) {
17
22
  _b = _a.dividercolor,
18
23
  // overflow,
19
24
  dividercolor = _b === void 0 ? "gray.300" : _b, _c = _a.dividersize, dividersize = _c === void 0 ? "1px" : _c, _d = _a.dividervariant, dividervariant = _d === void 0 ? "solid" : _d;
20
- var filterChildren = function (type) {
21
- return react_1.default.Children.map(children, function (child) {
22
- if (child.type === type)
23
- return child.props.children;
24
- }).filter(Boolean)[0];
25
+ // const headerContent = filterChildren("header");
26
+ // const bodyContent = filterChildren("body");
27
+ // const footerContent = filterChildren("footer");
28
+ var isReactElement = function (child) {
29
+ return child !== null && typeof child === "object" && "type" in child;
25
30
  };
26
- var headerContent = filterChildren("header");
27
- var bodyContent = filterChildren("body");
28
- var footerContent = filterChildren("footer");
31
+ var header = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === "header"; });
32
+ var body = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === "body"; });
33
+ var footer = react_1.default.Children.toArray(children).find(function (child) { return isReactElement(child) && child.type === "footer"; });
29
34
  return (react_1.default.createElement(react_2.Card, { key: key,
30
35
  // maxW={maxW}
31
36
  // align={align}
@@ -35,14 +40,14 @@ function ProfileCard(_a) {
35
40
  size: size,
36
41
  // overflow={overflow}
37
42
  colorScheme: color, mr: 10 },
38
- headerContent && (react_1.default.createElement(react_1.default.Fragment, null,
39
- react_1.default.createElement(react_2.CardHeader, { style: { fontWeight: "bold" } }, headerContent),
43
+ header && (react_1.default.createElement(react_1.default.Fragment, null,
44
+ react_1.default.createElement(react_2.CardHeader, { style: { fontWeight: "bold" } }, header),
40
45
  react_1.default.createElement(react_2.Divider, { style: {
41
46
  borderColor: dividercolor,
42
47
  borderWidth: dividersize,
43
48
  borderStyle: dividervariant,
44
49
  } }))),
45
- react_1.default.createElement(react_2.CardBody, null, bodyContent),
46
- footerContent && (react_1.default.createElement(react_2.CardFooter, null, footerContent))));
50
+ react_1.default.createElement(react_2.CardBody, null, body),
51
+ footer && react_1.default.createElement(react_2.CardFooter, null, footer)));
47
52
  }
48
53
  exports.default = ProfileCard;
package/dist/Components/ProfileCard/ProfileCardProps.d.ts CHANGED
@@ -1,5 +1,6 @@
1
+ /// <reference types="react" />
1
2
  export type ProfileCardProps = {
2
- children: any;
3
+ children: React.ReactNode;
3
4
  variant?: "elevated" | "outlein" | "filled" | "unstyled";
4
5
  size?: "sm" | "md" | "lg";
5
6
  color?: "whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pixelize-design-library",
3
- "version": "1.0.54",
3
+ "version": "1.0.56",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",