@code0-tech/pictor 0.2.1 → 0.2.3

package/dist/cjs/components/{FontSizes → Text}/Text.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import { Code0Component, Code0Sizes } from "../../utils/types";
 import "./Text.style.scss";
 export interface FontType extends Omit<Omit<Code0Component<HTMLSpanElement>, "children">, "size"> {
-    children: string;
+    children: React.ReactNode;
     size: Code0Sizes;
     hierarchy?: "primary" | "secondary" | "tertiary";
 }

package/dist/cjs/index.d.ts

@@ -6,7 +6,7 @@ export { default as Card } from "./components/card/Card";
 export { default as Col } from "./components/col/Col";
 export { default as Container } from "./components/container/Container";
 export { default as Dropdown } from "./components/dropdown/Dropdown";
-export { default as Text } from "./components/FontSizes/Text";
+export { default as Text } from "./components/Text/Text";
 export { default as Input } from "./components/input/Input";
 export { default as ListGroup } from "./components/list-group/ListGroup";
 export { default as Menu } from "./components/menu/Menu";

package/dist/cjs/index.js

@@ -1396,11 +1396,11 @@ const getContent = (children, ...child) => {
     });
     return array.length == 0 ? null : array;
 };
-const createStyle = (styles) => (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (styles.m ? { margin: `${styles.m}rem` } : {})), (styles.my ? { marginTop: `${styles.my}rem`, marginBottom: `${styles.my}rem` } : {})), (styles.mx ? { marginLeft: `${styles.mx}rem`, marginRight: `${styles.mx}rem` } : {})), (styles.mt ? { marginTop: `${styles.mt}rem` } : {})), (styles.mb ? { marginBottom: `${styles.mb}rem` } : {})), (styles.ml ? { marginLeft: `${styles.ml}rem` } : {})), (styles.mr ? { marginRight: `${styles.mr}rem` } : {})), (styles.p ? { padding: `${styles.p}rem` } : {})), (styles.py ? { paddingTop: `${styles.py}rem`, paddingBottom: `${styles.py}rem` } : {})), (styles.px ? { paddingLeft: `${styles.px}rem`, paddingRight: `${styles.px}rem` } : {})), (styles.pt ? { paddingTop: `${styles.pt}rem` } : {})), (styles.pb ? { paddingBottom: `${styles.pb}rem` } : {})), (styles.pl ? { paddingLeft: `${styles.pl}rem` } : {})), (styles.pr ? { paddingRight: `${styles.pr}rem` } : {})), (styles.bg ? { backgroundColor: styles.bg } : {})), (styles.c ? { color: styles.c } : {})), (styles.opacity ? { opacity: styles.opacity } : {})), (styles.ff ? { fontFamily: styles.ff } : {})), (styles.fz ? { fontSize: `${styles.fz}rem` } : {})), (styles.ta ? { textAlign: styles.ta } : {})), (styles.w ? { width: styles.w } : {})), (styles.miw ? { minWidth: styles.miw } : {})), (styles.maw ? { maxWidth: styles.maw } : {})), (styles.h ? { height: styles.h } : {})), (styles.mih ? { minHeight: styles.mih } : {})), (styles.mah ? { maxHeight: styles.mah } : {})), (styles.pos ? { position: styles.pos } : {})), (styles.top ? { top: styles.top } : {})), (styles.left ? { left: styles.left } : {})), (styles.bottom ? { bottom: styles.bottom } : {})), (styles.right ? { right: styles.right } : {})), (styles.display ? { display: styles.display } : {})), (styles.flex ? { flex: styles.flex } : {})));
+const createStyle = (styles) => (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (styles.m ? { margin: `${styles.m}rem` } : {})), (styles.my ? { marginTop: `${styles.my}rem`, marginBottom: `${styles.my}rem` } : {})), (styles.mx ? { marginLeft: `${styles.mx}rem`, marginRight: `${styles.mx}rem` } : {})), (styles.mt ? { marginTop: `${styles.mt}rem` } : {})), (styles.mb ? { marginBottom: `${styles.mb}rem` } : {})), (styles.ml ? { marginLeft: `${styles.ml}rem` } : {})), (styles.mr ? { marginRight: `${styles.mr}rem` } : {})), (styles.p ? { padding: `${styles.p}rem` } : {})), (styles.py ? { paddingTop: `${styles.py}rem`, paddingBottom: `${styles.py}rem` } : {})), (styles.px ? { paddingLeft: `${styles.px}rem`, paddingRight: `${styles.px}rem` } : {})), (styles.pt ? { paddingTop: `${styles.pt}rem` } : {})), (styles.pb ? { paddingBottom: `${styles.pb}rem` } : {})), (styles.pl ? { paddingLeft: `${styles.pl}rem` } : {})), (styles.pr ? { paddingRight: `${styles.pr}rem` } : {})), (styles.bg ? { backgroundColor: styles.bg } : {})), (styles.c ? { color: styles.c } : {})), (styles.opacity ? { opacity: styles.opacity } : {})), (styles.ff ? { fontFamily: styles.ff } : {})), (styles.fz ? { fontSize: `${styles.fz}rem` } : {})), (styles.ta ? { textAlign: styles.ta } : {})), (styles.w ? { width: styles.w } : {})), (styles.miw ? { minWidth: styles.miw } : {})), (styles.maw ? { maxWidth: styles.maw } : {})), (styles.h ? { height: styles.h } : {})), (styles.mih ? { minHeight: styles.mih } : {})), (styles.mah ? { maxHeight: styles.mah } : {})), (styles.pos ? { position: styles.pos } : {})), (styles.top ? { top: styles.top } : {})), (styles.left ? { left: styles.left } : {})), (styles.bottom ? { bottom: styles.bottom } : {})), (styles.right ? { right: styles.right } : {})), (styles.display ? { display: styles.display } : {})), (styles.flex ? { flex: styles.flex } : {})), (styles.align ? { alignItems: styles.align } : {})), (styles.justify ? { justifyContent: styles.justify } : {})), (styles.tf ? { transform: styles.tf } : {})));
 const mergeCode0Props = (cn, rest) => {
     const style = createStyle(rest);
     const newProps = rest;
-    const keys = ["m", "my", "mx", "mt", "mb", "ml", "mr", "p", "py", "px", "pt", "pb", "pl", "pr", "bg", "c", "opacity", "ff", "fz", "fw", "lts", "ta", "lh", "fs", "tt", "td", "w", "miw", "maw", "h", "mih", "mah", "bgsz", "bgp", "bgr", "bga", "pos", "top", "left", "bottom", "right", "inset", "display", "flex"];
+    const keys = ["m", "my", "mx", "mt", "mb", "ml", "mr", "p", "py", "px", "pt", "pb", "pl", "pr", "bg", "c", "opacity", "ff", "fz", "fw", "lts", "ta", "lh", "fs", "tt", "td", "w", "miw", "maw", "h", "mih", "mah", "bgsz", "bgp", "bgr", "bga", "pos", "top", "left", "bottom", "right", "inset", "display", "flex", "align", "justify", "tf"];
     keys.forEach(key => {
         delete newProps[key];
     });

package/dist/cjs/utils/types.d.ts

@@ -49,6 +49,9 @@ export interface Code0ComponentProps {
     inset?: StyleProp<React.CSSProperties['inset']>;
     display?: StyleProp<React.CSSProperties['display']>;
     flex?: StyleProp<React.CSSProperties['flex']>;
+    align?: StyleProp<React.CSSProperties['alignItems']>;
+    justify?: StyleProp<React.CSSProperties['justifyContent']>;
+    tf?: StyleProp<React.CSSProperties['transform']>;
 }
 export interface Code0Component<T> extends Code0ComponentProps, HTMLProps<T> {
 }

package/dist/esm/components/{FontSizes → Text}/Text.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import { Code0Component, Code0Sizes } from "../../utils/types";
 import "./Text.style.scss";
 export interface FontType extends Omit<Omit<Code0Component<HTMLSpanElement>, "children">, "size"> {
-    children: string;
+    children: React.ReactNode;
     size: Code0Sizes;
     hierarchy?: "primary" | "secondary" | "tertiary";
 }

package/dist/esm/index.d.ts

@@ -6,7 +6,7 @@ export { default as Card } from "./components/card/Card";
 export { default as Col } from "./components/col/Col";
 export { default as Container } from "./components/container/Container";
 export { default as Dropdown } from "./components/dropdown/Dropdown";
-export { default as Text } from "./components/FontSizes/Text";
+export { default as Text } from "./components/Text/Text";
 export { default as Input } from "./components/input/Input";
 export { default as ListGroup } from "./components/list-group/ListGroup";
 export { default as Menu } from "./components/menu/Menu";

package/dist/esm/index.js

@@ -1387,11 +1387,11 @@ const getContent = (children, ...child) => {
     });
     return array.length == 0 ? null : array;
 };
-const createStyle = (styles) => (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (styles.m ? { margin: `${styles.m}rem` } : {})), (styles.my ? { marginTop: `${styles.my}rem`, marginBottom: `${styles.my}rem` } : {})), (styles.mx ? { marginLeft: `${styles.mx}rem`, marginRight: `${styles.mx}rem` } : {})), (styles.mt ? { marginTop: `${styles.mt}rem` } : {})), (styles.mb ? { marginBottom: `${styles.mb}rem` } : {})), (styles.ml ? { marginLeft: `${styles.ml}rem` } : {})), (styles.mr ? { marginRight: `${styles.mr}rem` } : {})), (styles.p ? { padding: `${styles.p}rem` } : {})), (styles.py ? { paddingTop: `${styles.py}rem`, paddingBottom: `${styles.py}rem` } : {})), (styles.px ? { paddingLeft: `${styles.px}rem`, paddingRight: `${styles.px}rem` } : {})), (styles.pt ? { paddingTop: `${styles.pt}rem` } : {})), (styles.pb ? { paddingBottom: `${styles.pb}rem` } : {})), (styles.pl ? { paddingLeft: `${styles.pl}rem` } : {})), (styles.pr ? { paddingRight: `${styles.pr}rem` } : {})), (styles.bg ? { backgroundColor: styles.bg } : {})), (styles.c ? { color: styles.c } : {})), (styles.opacity ? { opacity: styles.opacity } : {})), (styles.ff ? { fontFamily: styles.ff } : {})), (styles.fz ? { fontSize: `${styles.fz}rem` } : {})), (styles.ta ? { textAlign: styles.ta } : {})), (styles.w ? { width: styles.w } : {})), (styles.miw ? { minWidth: styles.miw } : {})), (styles.maw ? { maxWidth: styles.maw } : {})), (styles.h ? { height: styles.h } : {})), (styles.mih ? { minHeight: styles.mih } : {})), (styles.mah ? { maxHeight: styles.mah } : {})), (styles.pos ? { position: styles.pos } : {})), (styles.top ? { top: styles.top } : {})), (styles.left ? { left: styles.left } : {})), (styles.bottom ? { bottom: styles.bottom } : {})), (styles.right ? { right: styles.right } : {})), (styles.display ? { display: styles.display } : {})), (styles.flex ? { flex: styles.flex } : {})));
+const createStyle = (styles) => (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (styles.m ? { margin: `${styles.m}rem` } : {})), (styles.my ? { marginTop: `${styles.my}rem`, marginBottom: `${styles.my}rem` } : {})), (styles.mx ? { marginLeft: `${styles.mx}rem`, marginRight: `${styles.mx}rem` } : {})), (styles.mt ? { marginTop: `${styles.mt}rem` } : {})), (styles.mb ? { marginBottom: `${styles.mb}rem` } : {})), (styles.ml ? { marginLeft: `${styles.ml}rem` } : {})), (styles.mr ? { marginRight: `${styles.mr}rem` } : {})), (styles.p ? { padding: `${styles.p}rem` } : {})), (styles.py ? { paddingTop: `${styles.py}rem`, paddingBottom: `${styles.py}rem` } : {})), (styles.px ? { paddingLeft: `${styles.px}rem`, paddingRight: `${styles.px}rem` } : {})), (styles.pt ? { paddingTop: `${styles.pt}rem` } : {})), (styles.pb ? { paddingBottom: `${styles.pb}rem` } : {})), (styles.pl ? { paddingLeft: `${styles.pl}rem` } : {})), (styles.pr ? { paddingRight: `${styles.pr}rem` } : {})), (styles.bg ? { backgroundColor: styles.bg } : {})), (styles.c ? { color: styles.c } : {})), (styles.opacity ? { opacity: styles.opacity } : {})), (styles.ff ? { fontFamily: styles.ff } : {})), (styles.fz ? { fontSize: `${styles.fz}rem` } : {})), (styles.ta ? { textAlign: styles.ta } : {})), (styles.w ? { width: styles.w } : {})), (styles.miw ? { minWidth: styles.miw } : {})), (styles.maw ? { maxWidth: styles.maw } : {})), (styles.h ? { height: styles.h } : {})), (styles.mih ? { minHeight: styles.mih } : {})), (styles.mah ? { maxHeight: styles.mah } : {})), (styles.pos ? { position: styles.pos } : {})), (styles.top ? { top: styles.top } : {})), (styles.left ? { left: styles.left } : {})), (styles.bottom ? { bottom: styles.bottom } : {})), (styles.right ? { right: styles.right } : {})), (styles.display ? { display: styles.display } : {})), (styles.flex ? { flex: styles.flex } : {})), (styles.align ? { alignItems: styles.align } : {})), (styles.justify ? { justifyContent: styles.justify } : {})), (styles.tf ? { transform: styles.tf } : {})));
 const mergeCode0Props = (cn, rest) => {
     const style = createStyle(rest);
     const newProps = rest;
-    const keys = ["m", "my", "mx", "mt", "mb", "ml", "mr", "p", "py", "px", "pt", "pb", "pl", "pr", "bg", "c", "opacity", "ff", "fz", "fw", "lts", "ta", "lh", "fs", "tt", "td", "w", "miw", "maw", "h", "mih", "mah", "bgsz", "bgp", "bgr", "bga", "pos", "top", "left", "bottom", "right", "inset", "display", "flex"];
+    const keys = ["m", "my", "mx", "mt", "mb", "ml", "mr", "p", "py", "px", "pt", "pb", "pl", "pr", "bg", "c", "opacity", "ff", "fz", "fw", "lts", "ta", "lh", "fs", "tt", "td", "w", "miw", "maw", "h", "mih", "mah", "bgsz", "bgp", "bgr", "bga", "pos", "top", "left", "bottom", "right", "inset", "display", "flex", "align", "justify", "tf"];
     keys.forEach(key => {
         delete newProps[key];
     });

package/dist/esm/utils/types.d.ts

@@ -49,6 +49,9 @@ export interface Code0ComponentProps {
     inset?: StyleProp<React.CSSProperties['inset']>;
     display?: StyleProp<React.CSSProperties['display']>;
     flex?: StyleProp<React.CSSProperties['flex']>;
+    align?: StyleProp<React.CSSProperties['alignItems']>;
+    justify?: StyleProp<React.CSSProperties['justifyContent']>;
+    tf?: StyleProp<React.CSSProperties['transform']>;
 }
 export interface Code0Component<T> extends Code0ComponentProps, HTMLProps<T> {
 }

package/dist/index.d.ts

@@ -52,6 +52,9 @@ interface Code0ComponentProps {
     inset?: StyleProp<React.CSSProperties['inset']>;
     display?: StyleProp<React.CSSProperties['display']>;
     flex?: StyleProp<React.CSSProperties['flex']>;
+    align?: StyleProp<React.CSSProperties['alignItems']>;
+    justify?: StyleProp<React.CSSProperties['justifyContent']>;
+    tf?: StyleProp<React.CSSProperties['transform']>;
 }
 interface Code0Component<T> extends Code0ComponentProps, HTMLProps<T> {
 }
@@ -164,7 +167,7 @@ declare const _default$5: React.FC<DropdownType$1> & {
 };
 
 interface FontType extends Omit<Omit<Code0Component<HTMLSpanElement>, "children">, "size"> {
-    children: string;
+    children: React.ReactNode;
     size: Code0Sizes;
     hierarchy?: "primary" | "secondary" | "tertiary";
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@code0-tech/pictor",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "A simple template for a custom React component library",
   "scripts": {
     "dev": "npm run storybook:dev",