@parrot-co/parrot-ui 0.1.10 → 0.1.12

package/dist/module.js

@@ -675,10 +675,11 @@ function $095d89378519ff08$export$a455218a85c89869({ label: label, description:
 $095d89378519ff08$export$a455218a85c89869.displayName = "Field";
 
 
-function $ef10b8551376ecd8$export$f5b8910cec6cf069({ className: className, classNames: classNames, style: style, styles: styles, inputRef: inputRef, ...props }) {
+function $ef10b8551376ecd8$export$f5b8910cec6cf069({ className: className, classNames: classNames, style: style, styles: styles, onChange: onChange, inputRef: inputRef, ...props }) {
     const internalInputRef = (0, $hgUW1$react).useRef(null);
     const { labelProps: labelProps, inputProps: inputProps, errorMessageProps: errorMessageProps, descriptionProps: descriptionProps } = (0, $hgUW1$useTextField)({
         ...props,
+        onChange: onChange,
         inputElementType: "input"
     }, internalInputRef);
     return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $095d89378519ff08$export$a455218a85c89869), {
@@ -691,7 +692,7 @@ function $ef10b8551376ecd8$export$f5b8910cec6cf069({ className: className, class
         style: style,
         ...props,
         children: /*#__PURE__*/ (0, $hgUW1$jsx)("input", {
-            ref: (0, $cce662c1d2ec881b$export$c9058316764c140e)(internalInputRef, inputRef),
+            ref: (0, $cce662c1d2ec881b$export$c9058316764c140e)(inputRef, internalInputRef),
             "data-has-left-addon": !!props.prepend,
             "data-has-right-addon": !!props.append,
             className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)("p-text-input-el"),
@@ -922,12 +923,13 @@ $e3f71af5eaf1c216$export$c25acd513dcc8062.displayName = "IconButton";
 
 
 
-function $2e89c7375b40283e$export$6bf0cd3a219bbade({ appearance: appearance = "outline", size: size = "md", color: color = "gray", classNames: classNames, styles: styles, append: append, prepend: prepend, placeholder: placeholder, showSteppers: showSteppers = false, error: error, label: label, minValue: minValue, maxValue: maxValue, formatOptions: formatOptions, inputRef: inputRef, incrementIcon: incrementIcon, decrementIcon: decrementIcon, ...props }) {
+function $2e89c7375b40283e$export$6bf0cd3a219bbade({ appearance: appearance = "outline", size: size = "md", color: color = "gray", classNames: classNames, styles: styles, append: append, prepend: prepend, placeholder: placeholder, showSteppers: showSteppers = false, error: error, label: label, minValue: minValue, maxValue: maxValue, formatOptions: formatOptions, inputRef: inputRef, incrementIcon: incrementIcon, decrementIcon: decrementIcon, onChange: onChange, ...props }) {
     const ariaProps = {
         ...props,
         maxValue: maxValue,
         formatOptions: formatOptions,
         minValue: minValue,
+        onChange: onChange,
         "aria-label": props["aria-label"] ?? "number input"
     };
     const space = (0, $41cc567ab0625f8f$export$450c36e0b0e62ccd)();
@@ -4256,5 +4258,176 @@ function $8f49d2e6ba434739$export$6e865ea70d7724f(color) {
 
 
 
-export {$ee0105641360f1c1$export$e71c4d32a2263218 as Box, $11bc53f9891a6532$export$ef2184bd89960b14 as Grid, $11bc53f9891a6532$export$9eb849b9b922d396 as GridItem, $e2f278d76a00796a$export$f51f4c4ede09e011 as Flex, $ef10b8551376ecd8$export$f5b8910cec6cf069 as Input, $2e89c7375b40283e$export$6bf0cd3a219bbade as NumberInput, $3157c40f7d0e6fa2$export$5f1af8db9871e1d6 as Text, $7794de767effca39$export$379139ebc1c2b235 as Textarea, $d95a2216d3ccf702$export$353f5b6fc5456de1 as Button, $e3f71af5eaf1c216$export$c25acd513dcc8062 as IconButton, $9230e224c5c26d9c$export$69b1032f2ecdf404 as ButtonGroup, $0ca204e719955216$export$48513f6b9f8ce62d as Checkbox, $1ab2e355b7aa4310$export$4aa08d5625cb8ead as CheckboxGroup, $3ba60d401cc6cc09$export$e44a253a59704894 as DropdownMenu, $618e53c42107439d$export$72b9695b8216309a as ComboBox, $e00a258f2e8c7774$export$d7b12c4107be0d61 as Radio, $e00a258f2e8c7774$export$a98f0dcb43a68a25 as RadioGroup, $e3711da06539818f$export$f8afaea2e9656b91 as RadioCard, $9f79d30a629e2c71$export$ef9b1a59e592288f as Select, $c35269c9504bc94d$export$5b7f4051a57920d0 as Option, $c35269c9504bc94d$export$5b7f4051a57920d0 as ListBoxItem, $c35269c9504bc94d$export$ef146090a6472d9e as Section, $c35269c9504bc94d$export$ef146090a6472d9e as ListBoxSection, $48aceaf3289ec325$export$7edc06cf1783b30f as DateInput, $11e1beb2a56c81ba$export$e1aef45b828286de as Calendar, $55bcc0e5986993c4$export$e2255cf6045e8d47 as Avatar, $f9f5a5b674d0a63f$export$1a5cb5295a7d2749 as FileUploader, $1a0bc09c6bea5bcc$export$1ff3c3f08ae963c0 as Separator, $2cc726bf01dd2fe8$export$b25a304ec7d746bb as Progress, $e1148cdb3a130657$export$3b0d6d7590275603 as Loader, $c700d45659d35204$export$3288d34c523a1192 as Tag, $fac55dfefd316398$export$b5d5cf8927ab7262 as Switch, $17f80f062b7f107f$export$472062a354075cee as Slider, $62ecff109eaa29fb$export$50e381fea3a45244 as IconTray, $6bbafdf52af7a191$export$ea98c603db73aee7 as Sticker, $28ce03a907630a4d$export$b2539bed5023c21c as Tabs, $28ce03a907630a4d$export$6d08773d2e66f8f2 as Tab, $18afd8c09c9f3065$export$54ec01a60f47d33d as Table, $727b3a4d9b39464f$export$e6a97ba2cae5bb94 as Timeline, $4bad2c10a2b6e638$export$2b77a92f1a5ad772 as Modal, $4bad2c10a2b6e638$export$33ffd74ebf07f060 as useModal, $41cc567ab0625f8f$export$eef1e68107c58ef2 as Space, $aca304249f917497$export$39299b56cfd4e361 as TagInput, $61ac9d13c14b7f5b$export$5b6b19405a83ff9d as Popover, $61ac9d13c14b7f5b$export$d7e1f420b25549ff as PopoverContent, $61ac9d13c14b7f5b$export$7dacb05d26466c3 as PopoverTrigger, $31aad62a65b342bc$export$67ea30858aaf75e3 as TagGroup, $31aad62a65b342bc$export$a79147a60006308c as TagGroupItem, $5fc28f26e128d5c0$export$d8964aec282183a3 as ThemeProvider, $5fc28f26e128d5c0$export$93d4e7f90805808f as useTheme, $d03055b0909e9e3a$export$b2103f68a961418e as ColorArea, $2abac2409e7cef4a$export$b865d4358897bb17 as ColorField, $b925f0cf89a3187d$export$9feb1bc2e5f1ccb3 as ColorPicker, $216a62c521cf5bbd$export$44fd664bcca5b6fb as ColorSlider, $a364ffae99b57fd7$export$b46792416e3d8515 as ColorSwatchPicker, $8f49d2e6ba434739$export$6e865ea70d7724f as parseColor};
+
+
+
+
+
+
+const $aae8cd5f0e2ea26c$var$ToggleGroupContext = /*#__PURE__*/ $hgUW1$createContext(null);
+function $aae8cd5f0e2ea26c$export$af3ec21f6cfb5e30({ children: children, mode: mode = "single", value: value, defaultValue: defaultValue, onChange: onChange, validate: validate, styles: styles, classNames: classNames, className: className, style: style, ...props }) {
+    const Wrapper = $hgUW1$useMemo(()=>{
+        if (mode === "single") return $aae8cd5f0e2ea26c$var$SingleSelectGroup;
+        return $aae8cd5f0e2ea26c$var$MultiSelectGroup;
+    }, [
+        mode
+    ]);
+    props = {
+        ...props
+    };
+    return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $095d89378519ff08$export$a455218a85c89869), {
+        label: props.label,
+        replaceDefaultControlWrapper: true,
+        children: /*#__PURE__*/ (0, $hgUW1$jsx)(Wrapper, {
+            value: value,
+            defaultValue: defaultValue,
+            onChange: onChange,
+            validate: validate,
+            ...props,
+            children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $41cc567ab0625f8f$export$eef1e68107c58ef2), {
+                className: className,
+                styles: styles,
+                classNames: classNames,
+                style: style,
+                ...props,
+                children: children
+            })
+        })
+    });
+}
+function $aae8cd5f0e2ea26c$var$SingleSelectGroup({ children: children, orientation: orientation = "horizontal", ...props }) {
+    const state = (0, $hgUW1$useRadioGroupState)(props);
+    const { radioGroupProps: radioGroupProps } = (0, $hgUW1$useRadioGroup)({
+        ...props,
+        orientation: orientation,
+        "aria-label": "single toggle group"
+    }, state);
+    return /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+        ...radioGroupProps,
+        children: /*#__PURE__*/ (0, $hgUW1$jsx)($aae8cd5f0e2ea26c$var$ToggleGroupContext.Provider, {
+            value: {
+                state: state,
+                mode: "single",
+                props: props
+            },
+            children: children
+        })
+    });
+}
+function $aae8cd5f0e2ea26c$var$MultiSelectGroup({ children: children, ...props }) {
+    const state = (0, $hgUW1$useCheckboxGroupState)(props);
+    const { groupProps: groupProps } = (0, $hgUW1$useCheckboxGroup)({
+        ...props,
+        "aria-label": "multiple toggle group"
+    }, state);
+    return /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+        ...groupProps,
+        children: /*#__PURE__*/ (0, $hgUW1$jsx)($aae8cd5f0e2ea26c$var$ToggleGroupContext.Provider, {
+            value: {
+                state: state,
+                mode: "multiple",
+                props: props
+            },
+            children: children
+        })
+    });
+}
+function $aae8cd5f0e2ea26c$var$SingleToggle({ ...props }) {
+    const ctx = $hgUW1$useContext($aae8cd5f0e2ea26c$var$ToggleGroupContext);
+    const state = ctx?.state;
+    const ref = $hgUW1$useRef(null);
+    if (!ctx) throw new Error("Toggle must be used within a ToggleGroup");
+    const { focusProps: focusProps, isFocusVisible: isFocusVisible } = (0, $hgUW1$useFocusRing)();
+    const isSelected = state.selectedValue === props.value;
+    const { inputProps: inputProps } = (0, $hgUW1$useRadio)(props, ctx.state, ref);
+    return /*#__PURE__*/ (0, $hgUW1$jsxs)($aae8cd5f0e2ea26c$var$ToggleButton, {
+        isSelected: isSelected,
+        isFocusVisible: isFocusVisible,
+        children: [
+            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$VisuallyHidden), {
+                children: /*#__PURE__*/ (0, $hgUW1$jsx)("input", {
+                    ref: ref,
+                    ...(0, $hgUW1$mergeProps)(inputProps, focusProps)
+                })
+            }),
+            props.children
+        ]
+    });
+}
+function $aae8cd5f0e2ea26c$var$MultiToggle({ ...props }) {
+    const ctx = $hgUW1$useContext($aae8cd5f0e2ea26c$var$ToggleGroupContext);
+    const state = ctx?.state;
+    const ref = $hgUW1$useRef(null);
+    if (!ctx) throw new Error("Toggle must be used within a ToggleGroup");
+    const { focusProps: focusProps, isFocusVisible: isFocusVisible } = (0, $hgUW1$useFocusRing)();
+    const isSelected = state.isSelected(props.value);
+    const { inputProps: inputProps } = (0, $hgUW1$useCheckboxGroupItem)(props, ctx.state, ref);
+    return /*#__PURE__*/ (0, $hgUW1$jsxs)($aae8cd5f0e2ea26c$var$ToggleButton, {
+        isSelected: isSelected,
+        isFocusVisible: isFocusVisible,
+        children: [
+            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$VisuallyHidden), {
+                children: /*#__PURE__*/ (0, $hgUW1$jsx)("input", {
+                    ref: ref,
+                    ...(0, $hgUW1$mergeProps)(inputProps, focusProps)
+                })
+            }),
+            props.children
+        ]
+    });
+}
+const $aae8cd5f0e2ea26c$var$ToggleContext = /*#__PURE__*/ $hgUW1$createContext(null);
+function $aae8cd5f0e2ea26c$export$bea8ebba691c5813({ ...props }) {
+    const ctx = $hgUW1$useContext($aae8cd5f0e2ea26c$var$ToggleGroupContext);
+    if (!ctx) throw new Error("Toggle must be used within a ToggleGroup");
+    const Wrapper = $hgUW1$useMemo(()=>{
+        if (ctx?.mode === "single") return $aae8cd5f0e2ea26c$var$SingleToggle;
+        return $aae8cd5f0e2ea26c$var$MultiToggle;
+    }, [
+        ctx?.mode
+    ]);
+    return /*#__PURE__*/ (0, $hgUW1$jsx)($aae8cd5f0e2ea26c$var$ToggleContext.Provider, {
+        value: {
+            props: props
+        },
+        children: /*#__PURE__*/ (0, $hgUW1$jsx)(Wrapper, {
+            value: props.value,
+            children: props.children
+        })
+    });
+}
+function $aae8cd5f0e2ea26c$var$ToggleButton({ children: children, isFocusVisible: isFocusVisible, isSelected: isSelected, ...props }) {
+    const ctx = $hgUW1$useContext($aae8cd5f0e2ea26c$var$ToggleContext)?.props;
+    const groupCtx = $hgUW1$useContext($aae8cd5f0e2ea26c$var$ToggleGroupContext);
+    if (!ctx || !groupCtx) throw new Error("Toggle must be used within a ToggleGroup");
+    const theme = (0, $5fc28f26e128d5c0$export$93d4e7f90805808f)();
+    const space = (0, $41cc567ab0625f8f$export$450c36e0b0e62ccd)();
+    const idleColor = ctx.idleColor ?? groupCtx.props.idleColor ?? "gray";
+    const activeColor = ctx.activeColor ?? groupCtx.props.activeColor ?? theme?.color ?? "gray";
+    const idleVariant = ctx.idleVariant ?? groupCtx.props.idleVariant ?? "light";
+    const activeVariant = ctx.activeVariant ?? groupCtx.props.activeVariant ?? "solid";
+    const color = isSelected ? activeColor : idleColor;
+    const variant = isSelected ? activeVariant : idleVariant;
+    const radius = ctx.radius ?? groupCtx.props.radius ?? "full";
+    const size = ctx.size ?? groupCtx.props.size ?? "md";
+    return /*#__PURE__*/ (0, $hgUW1$jsx)("label", {
+        "data-icon-button": ctx.isIconButton,
+        "data-is-toggle": true,
+        "data-radius": radius,
+        "data-color": color,
+        "data-variant": variant,
+        className: (0, $cce662c1d2ec881b$export$a274e22fb40f762e)("p-button", ctx.className, ctx.classNames?.wrapper, `size-${size}`, space.classNames),
+        "data-selected": isSelected,
+        "data-focus-visible": isFocusVisible,
+        ...props,
+        children: children
+    });
+}
+
+
+
+
+
+
+export {$ee0105641360f1c1$export$e71c4d32a2263218 as Box, $11bc53f9891a6532$export$ef2184bd89960b14 as Grid, $11bc53f9891a6532$export$9eb849b9b922d396 as GridItem, $e2f278d76a00796a$export$f51f4c4ede09e011 as Flex, $ef10b8551376ecd8$export$f5b8910cec6cf069 as Input, $2e89c7375b40283e$export$6bf0cd3a219bbade as NumberInput, $3157c40f7d0e6fa2$export$5f1af8db9871e1d6 as Text, $7794de767effca39$export$379139ebc1c2b235 as Textarea, $d95a2216d3ccf702$export$353f5b6fc5456de1 as Button, $e3f71af5eaf1c216$export$c25acd513dcc8062 as IconButton, $9230e224c5c26d9c$export$69b1032f2ecdf404 as ButtonGroup, $0ca204e719955216$export$48513f6b9f8ce62d as Checkbox, $1ab2e355b7aa4310$export$4aa08d5625cb8ead as CheckboxGroup, $3ba60d401cc6cc09$export$e44a253a59704894 as DropdownMenu, $618e53c42107439d$export$72b9695b8216309a as ComboBox, $e00a258f2e8c7774$export$d7b12c4107be0d61 as Radio, $e00a258f2e8c7774$export$a98f0dcb43a68a25 as RadioGroup, $e3711da06539818f$export$f8afaea2e9656b91 as RadioCard, $9f79d30a629e2c71$export$ef9b1a59e592288f as Select, $c35269c9504bc94d$export$5b7f4051a57920d0 as Option, $c35269c9504bc94d$export$5b7f4051a57920d0 as ListBoxItem, $c35269c9504bc94d$export$ef146090a6472d9e as Section, $c35269c9504bc94d$export$ef146090a6472d9e as ListBoxSection, $48aceaf3289ec325$export$7edc06cf1783b30f as DateInput, $11e1beb2a56c81ba$export$e1aef45b828286de as Calendar, $55bcc0e5986993c4$export$e2255cf6045e8d47 as Avatar, $f9f5a5b674d0a63f$export$1a5cb5295a7d2749 as FileUploader, $1a0bc09c6bea5bcc$export$1ff3c3f08ae963c0 as Separator, $2cc726bf01dd2fe8$export$b25a304ec7d746bb as Progress, $e1148cdb3a130657$export$3b0d6d7590275603 as Loader, $c700d45659d35204$export$3288d34c523a1192 as Tag, $fac55dfefd316398$export$b5d5cf8927ab7262 as Switch, $17f80f062b7f107f$export$472062a354075cee as Slider, $62ecff109eaa29fb$export$50e381fea3a45244 as IconTray, $6bbafdf52af7a191$export$ea98c603db73aee7 as Sticker, $28ce03a907630a4d$export$b2539bed5023c21c as Tabs, $28ce03a907630a4d$export$6d08773d2e66f8f2 as Tab, $18afd8c09c9f3065$export$54ec01a60f47d33d as Table, $727b3a4d9b39464f$export$e6a97ba2cae5bb94 as Timeline, $4bad2c10a2b6e638$export$2b77a92f1a5ad772 as Modal, $4bad2c10a2b6e638$export$33ffd74ebf07f060 as useModal, $41cc567ab0625f8f$export$eef1e68107c58ef2 as Space, $aca304249f917497$export$39299b56cfd4e361 as TagInput, $61ac9d13c14b7f5b$export$5b6b19405a83ff9d as Popover, $61ac9d13c14b7f5b$export$d7e1f420b25549ff as PopoverContent, $61ac9d13c14b7f5b$export$7dacb05d26466c3 as PopoverTrigger, $31aad62a65b342bc$export$67ea30858aaf75e3 as TagGroup, $31aad62a65b342bc$export$a79147a60006308c as TagGroupItem, $5fc28f26e128d5c0$export$d8964aec282183a3 as ThemeProvider, $5fc28f26e128d5c0$export$93d4e7f90805808f as useTheme, $d03055b0909e9e3a$export$b2103f68a961418e as ColorArea, $2abac2409e7cef4a$export$b865d4358897bb17 as ColorField, $b925f0cf89a3187d$export$9feb1bc2e5f1ccb3 as ColorPicker, $216a62c521cf5bbd$export$44fd664bcca5b6fb as ColorSlider, $a364ffae99b57fd7$export$b46792416e3d8515 as ColorSwatchPicker, $8f49d2e6ba434739$export$6e865ea70d7724f as parseColor, $aae8cd5f0e2ea26c$export$bea8ebba691c5813 as Toggle, $aae8cd5f0e2ea26c$export$af3ec21f6cfb5e30 as ToggleGroup};
 //# sourceMappingURL=module.js.map