@parrot-co/parrot-ui 0.0.94 → 0.0.96

package/dist/module.js

@@ -1,5 +1,5 @@
 import {jsx as $hgUW1$jsx, jsxs as $hgUW1$jsxs} from "react/jsx-runtime";
-import $hgUW1$react, {forwardRef as $hgUW1$forwardRef, useCallback as $hgUW1$useCallback, createContext as $hgUW1$createContext, Children as $hgUW1$Children, useMemo as $hgUW1$useMemo, isValidElement as $hgUW1$isValidElement, useContext as $hgUW1$useContext, useRef as $hgUW1$useRef, cloneElement as $hgUW1$cloneElement, createElement as $hgUW1$createElement, useState as $hgUW1$useState, useEffect as $hgUW1$useEffect} from "react";
+import $hgUW1$react, {forwardRef as $hgUW1$forwardRef, createContext as $hgUW1$createContext, Children as $hgUW1$Children, useMemo as $hgUW1$useMemo, isValidElement as $hgUW1$isValidElement, useContext as $hgUW1$useContext, useRef as $hgUW1$useRef, cloneElement as $hgUW1$cloneElement, createElement as $hgUW1$createElement, useState as $hgUW1$useState, useEffect as $hgUW1$useEffect, useCallback as $hgUW1$useCallback} from "react";
 import {useTextField as $hgUW1$useTextField, useLocale as $hgUW1$useLocale, useNumberField as $hgUW1$useNumberField, useToggleButton as $hgUW1$useToggleButton, useCheckbox as $hgUW1$useCheckbox, useCheckboxGroupItem as $hgUW1$useCheckboxGroupItem, useFocusRing as $hgUW1$useFocusRing, VisuallyHidden as $hgUW1$VisuallyHidden, useCheckboxGroup as $hgUW1$useCheckboxGroup, useMenuTrigger as $hgUW1$useMenuTrigger, usePress as $hgUW1$usePress, mergeProps as $hgUW1$mergeProps, useMenu as $hgUW1$useMenu, useMenuItem as $hgUW1$useMenuItem, useMenuSection as $hgUW1$useMenuSection, useSeparator as $hgUW1$useSeparator, usePopover as $hgUW1$usePopover, Overlay as $hgUW1$Overlay, useFilter as $hgUW1$useFilter, useComboBox as $hgUW1$useComboBox, useListBox as $hgUW1$useListBox, useOption as $hgUW1$useOption, useListBoxSection as $hgUW1$useListBoxSection, useRadio as $hgUW1$useRadio, useRadioGroup as $hgUW1$useRadioGroup, HiddenSelect as $hgUW1$HiddenSelect, useDatePicker as $hgUW1$useDatePicker, useDateField as $hgUW1$useDateField, useDateSegment as $hgUW1$useDateSegment, useCalendar as $hgUW1$useCalendar, useCalendarGrid as $hgUW1$useCalendarGrid, useCalendarCell as $hgUW1$useCalendarCell, useDrop as $hgUW1$useDrop, useProgressBar as $hgUW1$useProgressBar, useTabList as $hgUW1$useTabList, useTab as $hgUW1$useTab, useTabPanel as $hgUW1$useTabPanel, useHover as $hgUW1$useHover, useSwitch as $hgUW1$useSwitch, useModalOverlay as $hgUW1$useModalOverlay, useDialog as $hgUW1$useDialog} from "react-aria";
 import {HiMinus as $hgUW1$HiMinus, HiPlus as $hgUW1$HiPlus, HiEye as $hgUW1$HiEye, HiCheck as $hgUW1$HiCheck, HiSelector as $hgUW1$HiSelector, HiX as $hgUW1$HiX, HiOutlineCalendar as $hgUW1$HiOutlineCalendar, HiChevronLeft as $hgUW1$HiChevronLeft, HiChevronRight as $hgUW1$HiChevronRight, HiOutlineDocumentAdd as $hgUW1$HiOutlineDocumentAdd, HiOutlineCheckCircle as $hgUW1$HiOutlineCheckCircle, HiOutlineTrash as $hgUW1$HiOutlineTrash, HiOutlineExclamationCircle as $hgUW1$HiOutlineExclamationCircle, HiOutlineRefresh as $hgUW1$HiOutlineRefresh, HiOutlinePaperClip as $hgUW1$HiOutlinePaperClip} from "react-icons/hi";
 import {useNumberFieldState as $hgUW1$useNumberFieldState, useToggleState as $hgUW1$useToggleState, useCheckboxGroupState as $hgUW1$useCheckboxGroupState, useMenuTriggerState as $hgUW1$useMenuTriggerState, useTreeState as $hgUW1$useTreeState, Item as $hgUW1$Item, Section as $hgUW1$Section, useComboBoxState as $hgUW1$useComboBoxState, useListState as $hgUW1$useListState, useRadioGroupState as $hgUW1$useRadioGroupState, useDatePickerState as $hgUW1$useDatePickerState, useDateFieldState as $hgUW1$useDateFieldState, useCalendarState as $hgUW1$useCalendarState, useTabListState as $hgUW1$useTabListState, useOverlayTriggerState as $hgUW1$useOverlayTriggerState} from "react-stately";
@@ -108,39 +108,107 @@ const $ee0105641360f1c1$export$e71c4d32a2263218 = /*#__PURE__*/ $hgUW1$forwardRe
 
 
 
-const $11bc53f9891a6532$export$ef2184bd89960b14 = /*#__PURE__*/ $hgUW1$forwardRef(({ columns: columns = 12, gap: gap, gapX: gapX, gapY: gapY, align: align, justify: justify, as: as, className: className, ...props }, ref)=>{
-    return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $ee0105641360f1c1$export$e71c4d32a2263218), {
+const $074ec3363f6c932f$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 $074ec3363f6c932f$export$b4e0e71242920c6a = {
+    sharp: "none",
+    pill: "full",
+    rounded: undefined
+};
+function $074ec3363f6c932f$var$ps(styles) {
+// 1. iterate over the keys of the styles object
+// 2. for each key, check is is valid css property
+}
+
+
+function $0ad0bc75b5eb16a6$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 $0ad0bc75b5eb16a6$export$d560c7e4a29451c2() {
+    return Math.random().toString(36);
+}
+function $0ad0bc75b5eb16a6$export$e4369cabd7e84cd9(string) {
+    const hash = $0ad0bc75b5eb16a6$export$d41d9ab3de2def3d(string);
+    return (0, $074ec3363f6c932f$export$36308cce1deef340)[hash % (0, $074ec3363f6c932f$export$36308cce1deef340).length];
+}
+function $0ad0bc75b5eb16a6$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 $11bc53f9891a6532$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, $hgUW1$jsx)((0, $ee0105641360f1c1$export$e71c4d32a2263218), {
         as: as,
         ref: ref,
-        className: (0, $cce662c1d2ec881b$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
-    });
-});
-$11bc53f9891a6532$export$ef2184bd89960b14.displayName = "Grid";
-const $11bc53f9891a6532$export$9eb849b9b922d396 = /*#__PURE__*/ $hgUW1$forwardRef(({ colSpan: colSpan = 1, as: as, className: className, ...props }, ref)=>{
+        className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)("p-grid", "display-grid", (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("columns", columns), (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("gap", gap), (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("column-gap", gapX), (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("row-gap", gapY), (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("flex-align", align), (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("flex-justify", justify), className),
+        ...otherProps
+    }));
+};
+$11bc53f9891a6532$export$de87bc49c164ff72.displayName = "Grid";
+const $11bc53f9891a6532$export$ef2184bd89960b14 = /*#__PURE__*/ $hgUW1$forwardRef($11bc53f9891a6532$export$de87bc49c164ff72);
+const $11bc53f9891a6532$export$faaf771f35016530 = (props, ref)=>{
     return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $ee0105641360f1c1$export$e71c4d32a2263218), {
-        as: as,
-        stretchX: true,
-        className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)({
-            "p-grid-item": true,
-            [`col-span-${colSpan}`]: !!colSpan,
-            [`${className}`]: !!className
-        }),
         ref: ref,
+        className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)("p-grid-item", (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("col-span", props.colSpan), props.className),
         ...props
     });
-});
-$11bc53f9891a6532$export$9eb849b9b922d396.displayName = "GridItem";
+};
+const $11bc53f9891a6532$export$9eb849b9b922d396 = /*#__PURE__*/ $hgUW1$forwardRef($11bc53f9891a6532$export$faaf771f35016530);
+$11bc53f9891a6532$export$faaf771f35016530.displayName = "GridItem";
+
 
 
 
@@ -151,25 +219,9 @@ $11bc53f9891a6532$export$9eb849b9b922d396.displayName = "GridItem";
 
 const $e2f278d76a00796a$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 = $hgUW1$useCallback(()=>{
-        if (stack) return "column";
-        return direction || "row";
-    }, [
-        stack,
-        direction
-    ]);
+    const flexDirection = stack ? "column" : direction ?? "row";
     return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $ee0105641360f1c1$export$e71c4d32a2263218), {
-        className: (0, $cce662c1d2ec881b$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, $cce662c1d2ec881b$export$a274e22fb40f762e)(className, inline ? "display-inline-flex" : "display-flex", `flex-direction-${flexDirection}`, wrap && `flex-${wrap}`, justify && `flex-justify-${justify}`, align && `flex-align-${align}`, (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("gap", gap), (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("column-gap", columnGap), (0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("row-gap", rowGap)),
         // TODO - Fix types here - seems to work just fine though
         ref: ref,
         ...otherProps,
@@ -192,19 +244,17 @@ const $e2f278d76a00796a$export$f51f4c4ede09e011 = /*#__PURE__*/ $hgUW1$forwardRe
 
 
 
+
 const $3157c40f7d0e6fa2$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, $hgUW1$jsx)(Comp, {
-        className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)({
+        className: (0, $cce662c1d2ec881b$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, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("text-size", size)),
         "data-underline": underline,
         "data-italic": italic,
         "data-color": color,
@@ -318,13 +368,14 @@ function $41cc567ab0625f8f$export$450c36e0b0e62ccd() {
 
 const $5fc28f26e128d5c0$var$ThemeContext = /*#__PURE__*/ $hgUW1$createContext(null);
 function $5fc28f26e128d5c0$export$d8964aec282183a3(props) {
-    const { children: children, className: className, ...themeProps } = props;
+    const { children: children, className: className, scaling: scaling = "100%", ...themeProps } = props;
     return /*#__PURE__*/ (0, $hgUW1$jsx)($5fc28f26e128d5c0$var$ThemeContext.Provider, {
         value: themeProps,
         children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
             id: "parrot-theme-provider",
             "data-radius": themeProps.radius,
             "data-color": themeProps.color,
+            "data-scaling": scaling,
             className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)([
                 "parrot-theme",
                 className
@@ -534,6 +585,7 @@ function $9230e224c5c26d9c$export$749e21be8b14b968() {
 
 
 
+
 const $d95a2216d3ccf702$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $hgUW1$react).forwardRef((props, ref)=>{
     const space = (0, $41cc567ab0625f8f$export$450c36e0b0e62ccd)();
     const buttonGroupProps = (0, $9230e224c5c26d9c$export$749e21be8b14b968)();
@@ -574,8 +626,7 @@ const $d95a2216d3ccf702$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $hgUW1$react
         "aria-busy": isLoading,
         "data-color": getColor().color,
         "data-variant": getColor().variant,
-        "data-size": size,
-        className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)(className, "p-button", space.classNames),
+        className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)((0, $0ad0bc75b5eb16a6$export$2db1d02db18b2d82)("size", size), className, "p-button", space.classNames),
         ref: (0, $cce662c1d2ec881b$export$c9058316764c140e)(ref, buttonRef),
         form: otherProps.form,
         ...buttonProps,
@@ -1673,68 +1724,6 @@ $e3711da06539818f$export$f8afaea2e9656b91.displayName = "RadioCard";
 
 
 
-const $074ec3363f6c932f$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 $074ec3363f6c932f$export$b4e0e71242920c6a = {
-    sharp: "none",
-    pill: "full",
-    rounded: undefined
-};
-function $074ec3363f6c932f$var$ps(styles) {
-// 1. iterate over the keys of the styles object
-// 2. for each key, check is is valid css property
-}
-
-
-function $0ad0bc75b5eb16a6$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 $0ad0bc75b5eb16a6$export$d560c7e4a29451c2() {
-    return Math.random().toString(36);
-}
-function $0ad0bc75b5eb16a6$export$e4369cabd7e84cd9(string) {
-    const hash = $0ad0bc75b5eb16a6$export$d41d9ab3de2def3d(string);
-    return (0, $074ec3363f6c932f$export$36308cce1deef340)[hash % (0, $074ec3363f6c932f$export$36308cce1deef340).length];
-}
-