@parrot-co/parrot-ui 0.0.94 → 0.0.96

package/dist/main.js

@@ -159,39 +159,107 @@ const $eb8f27c3596a0e6b$export$e71c4d32a2263218 = /*#__PURE__*/ $8zHUo$react.for
 
 
 
-const $df66c26cdcece32b$export$ef2184bd89960b14 = /*#__PURE__*/ $8zHUo$react.forwardRef(({ columns: columns = 12, gap: gap, gapX: gapX, gapY: gapY, align: align, justify: justify, as: as, className: className, ...props }, ref)=>{
-    return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $eb8f27c3596a0e6b$export$e71c4d32a2263218), {
+const $8ddcc69383feb36a$export$36308cce1deef340 = [
+    "tomato",
+    "red",
+    "crimson",
+    "pink",
+    "plum",
+    "purple",
+    "violet",
+    "indigo",
+    "blue",
+    "cyan",
+    "teal",
+    "green",
+    "grass",
+    "orange",
+    "brown",
+    "sky",
+    "mint",
+    "lime",
+    "yellow",
+    "amber",
+    "gold",
+    "bronze",
+    "gray",
+    "mauve",
+    "slate",
+    "sage",
+    "olive",
+    "sand"
+];
+const $8ddcc69383feb36a$export$b4e0e71242920c6a = {
+    sharp: "none",
+    pill: "full",
+    rounded: undefined
+};
+function $8ddcc69383feb36a$var$ps(styles) {
+// 1. iterate over the keys of the styles object
+// 2. for each key, check is is valid css property
+}
+
+
+function $4af7da5c7dd0b9c2$export$d41d9ab3de2def3d(text) {
+    const str = String(text);
+    let hash = 0;
+    let char;
+    if (str.trim().length === 0) return hash;
+    for(let i = 0; i < str.length; i++){
+        char = str.charCodeAt(i);
+        hash = (hash << 5) - hash + char;
+        // Convert to 32bit integer
+        hash &= hash;
+    }
+    return Math.abs(hash);
+}
+function $4af7da5c7dd0b9c2$export$d560c7e4a29451c2() {
+    return Math.random().toString(36);
+}
+function $4af7da5c7dd0b9c2$export$e4369cabd7e84cd9(string) {
+    const hash = $4af7da5c7dd0b9c2$export$d41d9ab3de2def3d(string);
+    return (0, $8ddcc69383feb36a$export$36308cce1deef340)[hash % (0, $8ddcc69383feb36a$export$36308cce1deef340).length];
+}
+function $4af7da5c7dd0b9c2$export$2db1d02db18b2d82(prefix, value) {
+    if (!value) return "";
+    if (typeof value === "string" || typeof value === "number") return `${prefix}-${value}`;
+    let classNames = "";
+    for (const key of Object.keys(value)){
+        const breakpoint = key;
+        const breakpointValue = value[breakpoint];
+        if (breakpointValue) {
+            classNames && (classNames += " ");
+            classNames += breakpoint === "base" ? `${prefix}-${breakpointValue}` : `${breakpoint}:${prefix}-${breakpointValue}`;
+        }
+    }
+    return classNames;
+}
+
+
+const $df66c26cdcece32b$export$de87bc49c164ff72 = (props, ref)=>{
+    const { columns: columns = 12, gap: gap = "sm", gapX: gapX, gapY: gapY, align: align, justify: justify, as: as, className: className, ...otherProps } = props;
+    return(// TODO figure out why ts is screaming over here
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    //@ts-ignore
+    /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $eb8f27c3596a0e6b$export$e71c4d32a2263218), {
         as: as,
         ref: ref,
-        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)({
-            "p-grid": true,
-            "display-grid": true,
-            [`columns-${columns}`]: !!columns,
-            [`gap-${gap}`]: !!gap,
-            [`column-gap-${gapX}`]: !!gapX,
-            [`row-gap-${gapY}`]: !!gapY,
-            [`flex-align-${align}`]: !!align,
-            [`flex-justify-${justify}`]: !!justify,
-            [`${className}`]: !!className
-        }),
-        ...props
-    });
-});
-$df66c26cdcece32b$export$ef2184bd89960b14.displayName = "Grid";
-const $df66c26cdcece32b$export$9eb849b9b922d396 = /*#__PURE__*/ $8zHUo$react.forwardRef(({ colSpan: colSpan = 1, as: as, className: className, ...props }, ref)=>{
+        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)("p-grid", "display-grid", (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("columns", columns), (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("gap", gap), (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("column-gap", gapX), (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("row-gap", gapY), (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("flex-align", align), (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("flex-justify", justify), className),
+        ...otherProps
+    }));
+};
+$df66c26cdcece32b$export$de87bc49c164ff72.displayName = "Grid";
+const $df66c26cdcece32b$export$ef2184bd89960b14 = /*#__PURE__*/ $8zHUo$react.forwardRef($df66c26cdcece32b$export$de87bc49c164ff72);
+const $df66c26cdcece32b$export$faaf771f35016530 = (props, ref)=>{
     return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $eb8f27c3596a0e6b$export$e71c4d32a2263218), {
-        as: as,
-        stretchX: true,
-        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)({
-            "p-grid-item": true,
-            [`col-span-${colSpan}`]: !!colSpan,
-            [`${className}`]: !!className
-        }),
         ref: ref,
+        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)("p-grid-item", (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("col-span", props.colSpan), props.className),
         ...props
     });
-});
-$df66c26cdcece32b$export$9eb849b9b922d396.displayName = "GridItem";
+};
+const $df66c26cdcece32b$export$9eb849b9b922d396 = /*#__PURE__*/ $8zHUo$react.forwardRef($df66c26cdcece32b$export$faaf771f35016530);
+$df66c26cdcece32b$export$faaf771f35016530.displayName = "GridItem";
+
 
 
 
@@ -202,25 +270,9 @@ $df66c26cdcece32b$export$9eb849b9b922d396.displayName = "GridItem";
 
 const $c3a954a7c0cb5109$export$21ee1313e2afe36c = (props, ref)=>{
     const { justify: justify, align: align, direction: direction, gap: gap = "sm", columnGap: columnGap, rowGap: rowGap, inline: inline, wrap: wrap, stack: stack, className: className, ...otherProps } = props;
-    const getDirection = $8zHUo$react.useCallback(()=>{
-        if (stack) return "column";
-        return direction || "row";
-    }, [
-        stack,
-        direction
-    ]);
+    const flexDirection = stack ? "column" : direction ?? "row";
     return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $eb8f27c3596a0e6b$export$e71c4d32a2263218), {
-        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)({
-            [`${className}`]: !!className,
-            [inline ? "display-inline-flex" : "display-flex"]: true,
-            [`flex-justify-${justify}`]: !!justify,
-            [`flex-align-${align}`]: !!align,
-            [`flex-direction-${getDirection()}`]: !!getDirection(),
-            [`gap-${gap}`]: !!gap,
-            [`column-gap-${columnGap}`]: !!columnGap,
-            [`row-gap-${rowGap}`]: !!rowGap,
-            [`flex-${wrap}`]: !!wrap
-        }),
+        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)(className, inline ? "display-inline-flex" : "display-flex", `flex-direction-${flexDirection}`, wrap && `flex-${wrap}`, justify && `flex-justify-${justify}`, align && `flex-align-${align}`, (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("gap", gap), (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("column-gap", columnGap), (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("row-gap", rowGap)),
         // TODO - Fix types here - seems to work just fine though
         ref: ref,
         ...otherProps,
@@ -243,19 +295,17 @@ const $c3a954a7c0cb5109$export$f51f4c4ede09e011 = /*#__PURE__*/ $8zHUo$react.for
 
 
 
+
 const $88fa102d91bf323a$export$f5a10939c0132d55 = (props, ref)=>{
     const { textCase: textCase, size: size = "sm", weight: weight, color: color = "gray", variant: variant = "default", highlight: highlight, align: align, lineHeight: lineHeight, underline: underline, italic: italic, as: Comp = "span", className: className, ...rest } = props;
     return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)(Comp, {
-        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)({
+        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)("p-text", className, {
             [`text-highlight`]: !!highlight,
-            "p-text": true,
-            [`text-size-${size}`]: !!size,
             [`text-weight-${weight}`]: !!weight,
             [`text-align-${align}`]: !!align,
             [`text-line-height-${lineHeight}`]: !!lineHeight,
-            [`text-transform-${textCase}`]: !!textCase,
-            [`${className}`]: !!className
-        }),
+            [`text-transform-${textCase}`]: !!textCase
+        }, (0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("text-size", size)),
         "data-underline": underline,
         "data-italic": italic,
         "data-color": color,
@@ -369,13 +419,14 @@ function $eae337549f49a5a2$export$450c36e0b0e62ccd() {
 
 const $f2fd0cbe11b7f0dd$var$ThemeContext = /*#__PURE__*/ $8zHUo$react.createContext(null);
 function $f2fd0cbe11b7f0dd$export$d8964aec282183a3(props) {
-    const { children: children, className: className, ...themeProps } = props;
+    const { children: children, className: className, scaling: scaling = "100%", ...themeProps } = props;
     return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)($f2fd0cbe11b7f0dd$var$ThemeContext.Provider, {
         value: themeProps,
         children: /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)("div", {
             id: "parrot-theme-provider",
             "data-radius": themeProps.radius,
             "data-color": themeProps.color,
+            "data-scaling": scaling,
             className: (0, $62f1c614c0962470$export$a274e22fb40f762e)([
                 "parrot-theme",
                 className
@@ -585,6 +636,7 @@ function $7f70742e736041ff$export$749e21be8b14b968() {
 
 
 
+
 const $5a6f28f3fd58ff6e$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, ($parcel$interopDefault($8zHUo$react))).forwardRef((props, ref)=>{
     const space = (0, $eae337549f49a5a2$export$450c36e0b0e62ccd)();
     const buttonGroupProps = (0, $7f70742e736041ff$export$749e21be8b14b968)();
@@ -625,8 +677,7 @@ const $5a6f28f3fd58ff6e$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, ($parcel$int
         "aria-busy": isLoading,
         "data-color": getColor().color,
         "data-variant": getColor().variant,
-        "data-size": size,
-        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)(className, "p-button", space.classNames),
+        className: (0, $62f1c614c0962470$export$a274e22fb40f762e)((0, $4af7da5c7dd0b9c2$export$2db1d02db18b2d82)("size", size), className, "p-button", space.classNames),
         ref: (0, $62f1c614c0962470$export$c9058316764c140e)(ref, buttonRef),
         form: otherProps.form,
         ...buttonProps,
@@ -1724,68 +1775,6 @@ $71fcf48f7e2e9427$export$f8afaea2e9656b91.displayName = "RadioCard";
 
 
 
-const $8ddcc69383feb36a$export$36308cce1deef340 = [
-    "tomato",
-    "red",
-    "crimson",
-    "pink",
-    "plum",
-    "purple",
-    "violet",
-    "indigo",
-    "blue",
-    "cyan",
-    "teal",
-    "green",
-    "grass",
-    "orange",
-    "brown",
-    "sky",
-    "mint",
-    "lime",
-    "yellow",
-    "amber",
-    "gold",
-    "bronze",
-    "gray",
-    "mauve",
-    "slate",
-    "sage",
-    "olive",
-    "sand"
-];
-const $8ddcc69383feb36a$export$b4e0e71242920c6a = {
-    sharp: "none",
-    pill: "full",
-    rounded: undefined
-};
-function $8ddcc69383feb36a$var$ps(styles) {
-// 1. iterate over the keys of the styles object
-// 2. for each key, check is is valid css property
-}
-
-
-function $4af7da5c7dd0b9c2$export$d41d9ab3de2def3d(text) {
-    const str = String(text);
-    let hash = 0;
-    let char;
-    if (str.trim().length === 0) return hash;
-    for(let i = 0; i < str.length; i++){
-        char = str.charCodeAt(i);
-        hash = (hash << 5) - hash + char;
-        // Convert to 32bit integer
-        hash &= hash;
-    }
-    return Math.abs(hash);
-}
-function $4af7da5c7dd0b9c2$export$d560c7e4a29451c2() {
-    return Math.random().toString(36);
-}
-function $4af7da5c7dd0b9c2$export$e4369cabd7e84cd9(string) {
-    const hash = $4af7da5c7dd0b9c2$export$d41d9ab3de2def3d(string);
-    return (0, $8ddcc69383feb36a$export$36308cce1deef340)[hash % (0, $8ddcc69383feb36a$export$36308cce1deef340).length];
-}
-