@parrot-co/parrot-ui 0.0.80 → 0.0.81

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.
package/dist/module.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import {createStitches as $kF5Av$createStitches} from "@stitches/react";
2
2
  import {gray as $kF5Av$gray, mauve as $kF5Av$mauve, slate as $kF5Av$slate, sage as $kF5Av$sage, olive as $kF5Av$olive, sand as $kF5Av$sand, tomato as $kF5Av$tomato, red as $kF5Av$red, crimson as $kF5Av$crimson, pink as $kF5Av$pink, plum as $kF5Av$plum, purple as $kF5Av$purple, violet as $kF5Av$violet, indigo as $kF5Av$indigo, blue as $kF5Av$blue, sky as $kF5Av$sky, mint as $kF5Av$mint, cyan as $kF5Av$cyan, teal as $kF5Av$teal, green as $kF5Av$green, grass as $kF5Av$grass, lime as $kF5Av$lime, yellow as $kF5Av$yellow, amber as $kF5Av$amber, orange as $kF5Av$orange, brown as $kF5Av$brown, bronze as $kF5Av$bronze, gold as $kF5Av$gold, grayA as $kF5Av$grayA, mauveA as $kF5Av$mauveA, slateA as $kF5Av$slateA, sageA as $kF5Av$sageA, oliveA as $kF5Av$oliveA, sandA as $kF5Av$sandA, tomatoA as $kF5Av$tomatoA, redA as $kF5Av$redA, crimsonA as $kF5Av$crimsonA, pinkA as $kF5Av$pinkA, plumA as $kF5Av$plumA, purpleA as $kF5Av$purpleA, violetA as $kF5Av$violetA, indigoA as $kF5Av$indigoA, blueA as $kF5Av$blueA, skyA as $kF5Av$skyA, mintA as $kF5Av$mintA, cyanA as $kF5Av$cyanA, tealA as $kF5Av$tealA, greenA as $kF5Av$greenA, grassA as $kF5Av$grassA, limeA as $kF5Av$limeA, yellowA as $kF5Av$yellowA, amberA as $kF5Av$amberA, orangeA as $kF5Av$orangeA, brownA as $kF5Av$brownA, bronzeA as $kF5Av$bronzeA, goldA as $kF5Av$goldA, whiteA as $kF5Av$whiteA, blackA as $kF5Av$blackA} from "@radix-ui/colors";
3
3
  import {jsxs as $kF5Av$jsxs, jsx as $kF5Av$jsx, Fragment as $kF5Av$Fragment} from "react/jsx-runtime";
4
- import $kF5Av$react, {createContext as $kF5Av$createContext, Children as $kF5Av$Children, useMemo as $kF5Av$useMemo, isValidElement as $kF5Av$isValidElement, useContext as $kF5Av$useContext, forwardRef as $kF5Av$forwardRef, useRef as $kF5Av$useRef, useState as $kF5Av$useState, useEffect as $kF5Av$useEffect, cloneElement as $kF5Av$cloneElement} from "react";
5
- import {useTextField as $kF5Av$useTextField, useLocale as $kF5Av$useLocale, useNumberField as $kF5Av$useNumberField, useToggleButton as $kF5Av$useToggleButton, useCheckbox as $kF5Av$useCheckbox, useCheckboxGroupItem as $kF5Av$useCheckboxGroupItem, useFocusRing as $kF5Av$useFocusRing, VisuallyHidden as $kF5Av$VisuallyHidden, useCheckboxGroup as $kF5Av$useCheckboxGroup, useRadio as $kF5Av$useRadio, useRadioGroup as $kF5Av$useRadioGroup, useSelect as $kF5Av$useSelect, useButton as $kF5Av$useButton, HiddenSelect as $kF5Av$HiddenSelect, mergeProps as $kF5Av$mergeProps, useListBox as $kF5Av$useListBox, useOption as $kF5Av$useOption, useListBoxSection as $kF5Av$useListBoxSection, useSeparator as $kF5Av$useSeparator, usePopover as $kF5Av$usePopover, Overlay as $kF5Av$Overlay, useDatePicker as $kF5Av$useDatePicker, useDateField as $kF5Av$useDateField, useDateSegment as $kF5Av$useDateSegment, useCalendar as $kF5Av$useCalendar, useCalendarGrid as $kF5Av$useCalendarGrid, useCalendarCell as $kF5Av$useCalendarCell, useDrop as $kF5Av$useDrop, useProgressBar as $kF5Av$useProgressBar, useTabList as $kF5Av$useTabList, useTab as $kF5Av$useTab, useTabPanel as $kF5Av$useTabPanel, useHover as $kF5Av$useHover, usePress as $kF5Av$usePress, useSwitch as $kF5Av$useSwitch, useMenuTrigger as $kF5Av$useMenuTrigger, useMenu as $kF5Av$useMenu, useMenuSection as $kF5Av$useMenuSection, useMenuItem as $kF5Av$useMenuItem, useTable as $kF5Av$useTable, useTableRowGroup as $kF5Av$useTableRowGroup, useTableHeaderRow as $kF5Av$useTableHeaderRow, useTableColumnHeader as $kF5Av$useTableColumnHeader, useTableRow as $kF5Av$useTableRow, useTableCell as $kF5Av$useTableCell, useTableSelectionCheckbox as $kF5Av$useTableSelectionCheckbox, useTableSelectAllCheckbox as $kF5Av$useTableSelectAllCheckbox, useModalOverlay as $kF5Av$useModalOverlay, useDialog as $kF5Av$useDialog} from "react-aria";
6
- import {HiChevronUp as $kF5Av$HiChevronUp, HiChevronDown as $kF5Av$HiChevronDown, HiSelector as $kF5Av$HiSelector, HiOutlineCalendar as $kF5Av$HiOutlineCalendar, HiChevronLeft as $kF5Av$HiChevronLeft, HiChevronRight as $kF5Av$HiChevronRight, HiOutlineDocumentAdd as $kF5Av$HiOutlineDocumentAdd, HiOutlineCheckCircle as $kF5Av$HiOutlineCheckCircle, HiOutlineTrash as $kF5Av$HiOutlineTrash, HiOutlineExclamationCircle as $kF5Av$HiOutlineExclamationCircle, HiOutlineRefresh as $kF5Av$HiOutlineRefresh, HiOutlinePaperClip as $kF5Av$HiOutlinePaperClip, HiCheck as $kF5Av$HiCheck, HiOutlineGlobe as $kF5Av$HiOutlineGlobe, HiOutlineCurrencyDollar as $kF5Av$HiOutlineCurrencyDollar, HiOutlineGlobeAlt as $kF5Av$HiOutlineGlobeAlt, HiOutlineArchive as $kF5Av$HiOutlineArchive, HiOutlineAnnotation as $kF5Av$HiOutlineAnnotation, HiOutlineFire as $kF5Av$HiOutlineFire, HiOutlineBadgeCheck as $kF5Av$HiOutlineBadgeCheck, HiOutlineSparkles as $kF5Av$HiOutlineSparkles, HiOutlineSpeakerphone as $kF5Av$HiOutlineSpeakerphone, HiOutlineCreditCard as $kF5Av$HiOutlineCreditCard, HiOutlineHeart as $kF5Av$HiOutlineHeart, HiOutlineLocationMarker as $kF5Av$HiOutlineLocationMarker, HiOutlineCursorClick as $kF5Av$HiOutlineCursorClick, HiOutlineLightningBolt as $kF5Av$HiOutlineLightningBolt, HiOutlineDocumentDownload as $kF5Av$HiOutlineDocumentDownload, HiOutlineTag as $kF5Av$HiOutlineTag, HiOutlineAtSymbol as $kF5Av$HiOutlineAtSymbol, HiOutlineUserCircle as $kF5Av$HiOutlineUserCircle, HiOutlineTerminal as $kF5Av$HiOutlineTerminal, HiOutlineMoon as $kF5Av$HiOutlineMoon, HiSortAscending as $kF5Av$HiSortAscending, HiSortDescending as $kF5Av$HiSortDescending} from "react-icons/hi";
4
+ import $kF5Av$react, {createContext as $kF5Av$createContext, Children as $kF5Av$Children, useMemo as $kF5Av$useMemo, isValidElement as $kF5Av$isValidElement, forwardRef as $kF5Av$forwardRef, useContext as $kF5Av$useContext, useRef as $kF5Av$useRef, useState as $kF5Av$useState, useEffect as $kF5Av$useEffect, cloneElement as $kF5Av$cloneElement, useCallback as $kF5Av$useCallback} from "react";
5
+ import {useTextField as $kF5Av$useTextField, useFocusRing as $kF5Av$useFocusRing, mergeProps as $kF5Av$mergeProps, useLocale as $kF5Av$useLocale, useNumberField as $kF5Av$useNumberField, useToggleButton as $kF5Av$useToggleButton, useCheckbox as $kF5Av$useCheckbox, useCheckboxGroupItem as $kF5Av$useCheckboxGroupItem, VisuallyHidden as $kF5Av$VisuallyHidden, useCheckboxGroup as $kF5Av$useCheckboxGroup, useRadio as $kF5Av$useRadio, useRadioGroup as $kF5Av$useRadioGroup, useSelect as $kF5Av$useSelect, useButton as $kF5Av$useButton, HiddenSelect as $kF5Av$HiddenSelect, useListBox as $kF5Av$useListBox, useOption as $kF5Av$useOption, useListBoxSection as $kF5Av$useListBoxSection, useSeparator as $kF5Av$useSeparator, usePopover as $kF5Av$usePopover, Overlay as $kF5Av$Overlay, useDatePicker as $kF5Av$useDatePicker, useDateField as $kF5Av$useDateField, useDateSegment as $kF5Av$useDateSegment, useCalendar as $kF5Av$useCalendar, useCalendarGrid as $kF5Av$useCalendarGrid, useCalendarCell as $kF5Av$useCalendarCell, useDrop as $kF5Av$useDrop, useProgressBar as $kF5Av$useProgressBar, useTabList as $kF5Av$useTabList, useTab as $kF5Av$useTab, useTabPanel as $kF5Av$useTabPanel, useHover as $kF5Av$useHover, usePress as $kF5Av$usePress, useSwitch as $kF5Av$useSwitch, useMenuTrigger as $kF5Av$useMenuTrigger, useMenu as $kF5Av$useMenu, useMenuSection as $kF5Av$useMenuSection, useMenuItem as $kF5Av$useMenuItem, useTable as $kF5Av$useTable, useTableRowGroup as $kF5Av$useTableRowGroup, useTableHeaderRow as $kF5Av$useTableHeaderRow, useTableColumnHeader as $kF5Av$useTableColumnHeader, useTableRow as $kF5Av$useTableRow, useTableCell as $kF5Av$useTableCell, useTableSelectionCheckbox as $kF5Av$useTableSelectionCheckbox, useTableSelectAllCheckbox as $kF5Av$useTableSelectAllCheckbox, useModalOverlay as $kF5Av$useModalOverlay, useDialog as $kF5Av$useDialog} from "react-aria";
6
+ import {HiChevronUp as $kF5Av$HiChevronUp, HiChevronDown as $kF5Av$HiChevronDown, HiSelector as $kF5Av$HiSelector, HiOutlineCalendar as $kF5Av$HiOutlineCalendar, HiChevronLeft as $kF5Av$HiChevronLeft, HiChevronRight as $kF5Av$HiChevronRight, HiOutlineDocumentAdd as $kF5Av$HiOutlineDocumentAdd, HiOutlineCheckCircle as $kF5Av$HiOutlineCheckCircle, HiOutlineTrash as $kF5Av$HiOutlineTrash, HiOutlineExclamationCircle as $kF5Av$HiOutlineExclamationCircle, HiOutlineRefresh as $kF5Av$HiOutlineRefresh, HiOutlinePaperClip as $kF5Av$HiOutlinePaperClip, HiCheck as $kF5Av$HiCheck, HiOutlineGlobe as $kF5Av$HiOutlineGlobe, HiOutlineCurrencyDollar as $kF5Av$HiOutlineCurrencyDollar, HiOutlineGlobeAlt as $kF5Av$HiOutlineGlobeAlt, HiOutlineArchive as $kF5Av$HiOutlineArchive, HiOutlineAnnotation as $kF5Av$HiOutlineAnnotation, HiOutlineFire as $kF5Av$HiOutlineFire, HiOutlineBadgeCheck as $kF5Av$HiOutlineBadgeCheck, HiOutlineSparkles as $kF5Av$HiOutlineSparkles, HiOutlineSpeakerphone as $kF5Av$HiOutlineSpeakerphone, HiOutlineCreditCard as $kF5Av$HiOutlineCreditCard, HiOutlineHeart as $kF5Av$HiOutlineHeart, HiOutlineLocationMarker as $kF5Av$HiOutlineLocationMarker, HiOutlineCursorClick as $kF5Av$HiOutlineCursorClick, HiOutlineLightningBolt as $kF5Av$HiOutlineLightningBolt, HiOutlineDocumentDownload as $kF5Av$HiOutlineDocumentDownload, HiOutlineTag as $kF5Av$HiOutlineTag, HiOutlineAtSymbol as $kF5Av$HiOutlineAtSymbol, HiOutlineUserCircle as $kF5Av$HiOutlineUserCircle, HiOutlineTerminal as $kF5Av$HiOutlineTerminal, HiOutlineMoon as $kF5Av$HiOutlineMoon, HiSortAscending as $kF5Av$HiSortAscending, HiSortDescending as $kF5Av$HiSortDescending, HiX as $kF5Av$HiX} from "react-icons/hi";
7
7
  import {useNumberFieldState as $kF5Av$useNumberFieldState, useToggleState as $kF5Av$useToggleState, useCheckboxGroupState as $kF5Av$useCheckboxGroupState, useRadioGroupState as $kF5Av$useRadioGroupState, useSelectState as $kF5Av$useSelectState, Item as $kF5Av$Item, useListState as $kF5Av$useListState, useDatePickerState as $kF5Av$useDatePickerState, useDateFieldState as $kF5Av$useDateFieldState, useCalendarState as $kF5Av$useCalendarState, useTabListState as $kF5Av$useTabListState, useMenuTriggerState as $kF5Av$useMenuTriggerState, useTreeState as $kF5Av$useTreeState, useTableState as $kF5Av$useTableState, TableHeader as $kF5Av$TableHeader, TableBody as $kF5Av$TableBody, Column as $kF5Av$Column, Row as $kF5Av$Row, Cell as $kF5Av$Cell, useOverlayTriggerState as $kF5Av$useOverlayTriggerState} from "react-stately";
8
8
  import {createCalendar as $kF5Av$createCalendar, endOfMonth as $kF5Av$endOfMonth, getWeeksInMonth as $kF5Av$getWeeksInMonth, isSameMonth as $kF5Av$isSameMonth, CalendarDate as $kF5Av$CalendarDate} from "@internationalized/date";
9
9
 
@@ -822,22 +822,28 @@ var $f09084fde7cc0470$export$2e2bcd8739ae039 = $f09084fde7cc0470$var$Column;
822
822
 
823
823
 
824
824
  const $dc7f74b9d5fb40ad$export$719e80a44b5e9ad0 = (0, $9ade691eb9e41cfb$export$dbf350e5966cf602)({
825
+ "$$input-height": "24px",
825
826
  boxSizing: "border-box",
826
827
  fontFamily: "$sans",
827
828
  lineHeight: "$base",
828
- "&:not(button):focus-within": {
829
- boxShadow: "$focusRing",
830
- border: "1px solid $violet6",
831
- background: "white"
832
- },
833
- "&:where(button):focus": {
829
+ minHeight: "$$input-height",
830
+ "&[data-focused=true]": {
834
831
  boxShadow: "$focusRing",
835
832
  border: "1px solid $violet6"
836
833
  },
834
+ // "&:not(button):focus-within": {
835
+ // boxShadow: "$focusRing",
836
+ // border: "1px solid $violet6",
837
+ // background: "white",
838
+ // },
839
+ // "&:where(button):focus": {
840
+ // boxShadow: "$focusRing",
841
+ // border: "1px solid $violet6",
842
+ // },
837
843
  defaultVariants: {
838
- appearance: "filled",
839
844
  size: "sm",
840
- shape: "round"
845
+ shape: "round",
846
+ appearance: "outline"
841
847
  },
842
848
  variants: {
843
849
  isDisabled: {
@@ -871,69 +877,33 @@ const $dc7f74b9d5fb40ad$export$719e80a44b5e9ad0 = (0, $9ade691eb9e41cfb$export$d
871
877
  }
872
878
  },
873
879
  shape: {
874
- round: {},
880
+ round: {
881
+ borderRadius: "calc($$input-height / 4)"
882
+ },
875
883
  sharp: {}
876
884
  },
877
885
  size: {
878
886
  xs: {
879
- height: 24,
880
887
  fontSize: "$2"
881
888
  },
882
889
  sm: {
883
- height: 32,
890
+ "$$input-height": "32px",
884
891
  fontSize: "$3"
885
892
  },
886
893
  md: {
887
- height: 40,
894
+ "$$input-height": "40px",
888
895
  fontSize: "$3"
889
896
  },
890
897
  lg: {
891
- height: 44,
898
+ "$$input-height": "44px",
892
899
  fontSize: "$4"
893
900
  },
894
901
  xl: {
895
- height: 52,
902
+ "$$input-height": "52px",
896
903
  fontSize: "$5"
897
904
  }
898
905
  }
899
- },
900
- compoundVariants: [
901
- {
902
- size: "xs",
903
- shape: "round",
904
- css: {
905
- borderRadius: 8
906
- }
907
- },
908
- {
909
- size: "sm",
910
- shape: "round",
911
- css: {
912
- borderRadius: 7
913
- }
914
- },
915
- {
916
- size: "md",
917
- shape: "round",
918
- css: {
919
- borderRadius: 8
920
- }
921
- },
922
- {
923
- size: "lg",
924
- shape: "round",
925
- css: {
926
- borderRadius: 8
927
- }
928
- },
929
- {
930
- size: "xl",
931
- shape: "round",
932
- css: {
933
- borderRadius: 8
934
- }
935
- }
936
- ]
906
+ }
937
907
  });
938
908
 
939
909
 
@@ -1079,8 +1049,10 @@ function $22d93d8ad1e2d08d$export$ccdcc3b9d72a654(color, variant) {
1079
1049
  background: `$${color}4`,
1080
1050
  color: `$${color}11`,
1081
1051
  fill: `$${color}11`,
1052
+ border: "none",
1082
1053
  "&:focus": {
1083
- boxShadow: $22d93d8ad1e2d08d$export$71074ab0ed740397(color)
1054
+ boxShadow: $22d93d8ad1e2d08d$export$71074ab0ed740397(color),
1055
+ border: `1.5px solid $${color}5`
1084
1056
  }
1085
1057
  }
1086
1058
  };
@@ -1550,7 +1522,7 @@ const $aca95339810194aa$var$SpaceContext = /*#__PURE__*/ $kF5Av$createContext({
1550
1522
  classNames: {},
1551
1523
  compactItemWrapperAdjust: ""
1552
1524
  });
1553
- function $aca95339810194aa$export$eef1e68107c58ef2({ children: children , compact: compact , gap: gap , ...props }) {
1525
+ function $aca95339810194aa$var$SpaceComponent({ children: children , compact: compact , gap: gap , ...props }, ref) {
1554
1526
  const childrenCount = $kF5Av$Children.count(children);
1555
1527
  const nodes = $kF5Av$useMemo(()=>{
1556
1528
  return $kF5Av$Children.map(children, (child, index)=>{
@@ -1574,30 +1546,30 @@ function $aca95339810194aa$export$eef1e68107c58ef2({ children: children , compac
1574
1546
  ]);
1575
1547
  const realGap = compact ? undefined : gap;
1576
1548
  return /*#__PURE__*/ (0, $kF5Av$jsx)($aca95339810194aa$export$30d85e96e785900a, {
1549
+ ref: ref,
1577
1550
  gap: realGap,
1578
1551
  ...props,
1579
1552
  compact: compact,
1580
1553
  children: nodes
1581
1554
  });
1582
1555
  }
1556
+ const $aca95339810194aa$export$eef1e68107c58ef2 = /*#__PURE__*/ $kF5Av$forwardRef($aca95339810194aa$var$SpaceComponent);
1583
1557
  function $aca95339810194aa$export$450c36e0b0e62ccd() {
1584
1558
  return $kF5Av$useContext($aca95339810194aa$var$SpaceContext);
1585
1559
  }
1586
1560
 
1587
1561
 
1588
1562
 
1589
- const $61dde3060428563f$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $kF5Av$react).forwardRef(({ label: label , error: error , appearance: appearance , size: size , shape: shape , append: append , prepend: prepend , description: description , css: css , isDisabled: isDisabled , validationStatus: validationStatus , className: className , ...props }, ref)=>{
1563
+ const $61dde3060428563f$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $kF5Av$react).forwardRef(({ label: label , error: error , appearance: appearance , size: size , shape: shape , append: append , prepend: prepend , description: description , css: css , isDisabled: isDisabled , validationStatus: validationStatus , className: className , inputRef: inputRef , ...props }, ref)=>{
1590
1564
  const space = (0, $aca95339810194aa$export$450c36e0b0e62ccd)();
1591
- const inputRef = (0, $kF5Av$react).useRef(null);
1565
+ const internalInputRef = (0, $kF5Av$react).useRef(null);
1592
1566
  const { labelProps: labelProps , inputProps: inputProps , errorMessageProps: errorMessageProps , descriptionProps: descriptionProps } = (0, $kF5Av$useTextField)({
1593
1567
  ...props,
1594
1568
  inputElementType: "input",
1595
1569
  label: label,
1596
1570
  description: description,
1597
1571
  isDisabled: isDisabled
1598
- }, inputRef);
1599
- //This is messy
1600
- //TODO Fix how props are extracted for variants and html props
1572
+ }, internalInputRef);
1601
1573
  const variantProps = {
1602
1574
  appearance: appearance,
1603
1575
  size: size,
@@ -1607,7 +1579,7 @@ const $61dde3060428563f$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $kF5Av$react
1607
1579
  };
1608
1580
  const hasAddOns = !!prepend || !!append;
1609
1581
  function captureFocus() {
1610
- inputRef.current?.focus();
1582
+ internalInputRef.current?.focus();
1611
1583
  }
1612
1584
  const commonProps = {
1613
1585
  className: (0, $625847aeb8796968$export$a274e22fb40f762e)({
@@ -1616,6 +1588,7 @@ const $61dde3060428563f$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $kF5Av$react
1616
1588
  ...space.classNames
1617
1589
  })
1618
1590
  };
1591
+ const { isFocused: isFocused , focusProps: focusProps } = (0, $kF5Av$useFocusRing)();
1619
1592
  return /*#__PURE__*/ (0, $kF5Av$jsxs)((0, $391d62e0590dec97$export$2e2bcd8739ae039), {
1620
1593
  className: space.compactItemWrapperAdjust,
1621
1594
  css: css,
@@ -1629,21 +1602,21 @@ const $61dde3060428563f$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $kF5Av$react
1629
1602
  children: label
1630
1603
  }),
1631
1604
  !hasAddOns && /*#__PURE__*/ (0, $kF5Av$jsx)((0, $9158bbabd058e6d9$export$a195049fd73b3fe2), {
1632
- ...commonProps,
1633
- ...variantProps,
1634
- ...inputProps
1605
+ "data-focused": isFocused,
1606
+ ref: (0, $625847aeb8796968$export$c9058316764c140e)(internalInputRef, inputRef),
1607
+ ...(0, $kF5Av$mergeProps)(focusProps, commonProps, variantProps, inputProps)
1635
1608
  }),
1636
1609
  hasAddOns && /*#__PURE__*/ (0, $kF5Av$jsx)((0, $9158bbabd058e6d9$export$479bffa770f4fc8b), {
1637
- ...commonProps,
1610
+ "data-focused": isFocused,
1638
1611
  onClick: captureFocus,
1639
1612
  hasPrependComponent: !!prepend,
1640
- ...variantProps,
1613
+ ...(0, $kF5Av$mergeProps)(focusProps, commonProps, variantProps),
1641
1614
  children: /*#__PURE__*/ (0, $kF5Av$jsx)((0, $f8db34c11dd03189$export$2e2bcd8739ae039), {
1642
1615
  append: append,
1643
1616
  prepend: prepend,
1644
1617
  children: /*#__PURE__*/ (0, $kF5Av$jsx)("input", {
1645
- ...inputProps,
1646
- ref: inputRef
1618
+ ...(0, $kF5Av$mergeProps)(focusProps, inputProps),
1619
+ ref: (0, $625847aeb8796968$export$c9058316764c140e)(inputRef, internalInputRef)
1647
1620
  })
1648
1621
  })
1649
1622
  }),
@@ -1679,7 +1652,7 @@ $61dde3060428563f$export$f5b8910cec6cf069.displayName = "Input";
1679
1652
  /* eslint-disable @typescript-eslint/no-explicit-any */
1680
1653
 
1681
1654
  const $6be0cf1a8e0dd120$export$303ef672e091d99 = (0, $9ade691eb9e41cfb$export$dbf350e5966cf602)((0, $22d93d8ad1e2d08d$export$5a7eb6284e7684f5), {
1682
- "$$button-base-height": "28px",
1655
+ "$$button-base-height": "18px",
1683
1656
  display: "inline-flex",
1684
1657
  flexWrap: "nowrap",
1685
1658
  alignItems: "center",
@@ -1727,7 +1700,12 @@ const $6be0cf1a8e0dd120$export$303ef672e091d99 = (0, $9ade691eb9e41cfb$export$db
1727
1700
  }
1728
1701
  },
1729
1702
  size: {
1703
+ "2xs": {
1704
+ px: 12,
1705
+ fontSize: "$2"
1706
+ },
1730
1707
  xs: {
1708
+ "$$button-base-height": "28px",
1731
1709
  px: 12,
1732
1710
  fontSize: "$2"
1733
1711
  },
@@ -2721,7 +2699,6 @@ $f7762930a14621d8$export$f8afaea2e9656b91.displayName = "RadioCard";
2721
2699
 
2722
2700
 
2723
2701
 
2724
-
2725
2702
  const $49848f925ef854b6$export$5ff5fb60b45fffad = (0, $9ade691eb9e41cfb$export$3817b7a54a07cec7)("div", {
2726
2703
  fontFamily: "$sans",
2727
2704
  fontSize: "$3",
@@ -2763,7 +2740,8 @@ const $49848f925ef854b6$export$844bee7de236d7ec = (0, $9ade691eb9e41cfb$export$3
2763
2740
  });
2764
2741
 
2765
2742
 
2766
- const $e5cd8bc466d59863$var$_ListBox = /*#__PURE__*/ (0, $kF5Av$react).forwardRef((props, ref)=>{
2743
+
2744
+ function $e5cd8bc466d59863$var$AriaListBox(props) {
2767
2745
  const internalState = (0, $kF5Av$useListState)(props);
2768
2746
  const listRef = (0, $kF5Av$useRef)(null);
2769
2747
  const state = props.state || internalState;
@@ -2781,7 +2759,7 @@ const $e5cd8bc466d59863$var$_ListBox = /*#__PURE__*/ (0, $kF5Av$react).forwardRe
2781
2759
  overflow: "auto",
2782
2760
  outline: "none"
2783
2761
  },
2784
- ref: (0, $625847aeb8796968$export$c9058316764c140e)(listRef, ref),
2762
+ ref: (0, $625847aeb8796968$export$c9058316764c140e)(listRef),
2785
2763
  ...listBoxProps,
2786
2764
  children: [
2787
2765
  ...state.collection
@@ -2797,8 +2775,25 @@ const $e5cd8bc466d59863$var$_ListBox = /*#__PURE__*/ (0, $kF5Av$react).forwardRe
2797
2775
  })
2798
2776
  ]
2799
2777
  });
2800
- });
2801
- const $e5cd8bc466d59863$var$_Option = (props, ref)=>{
2778
+ }
2779
+ const $e5cd8bc466d59863$export$41f133550aa26f48 = ({ labelKey: labelKey , valueKey: valueKey , renderOption: renderOption , ...props })=>{
2780
+ if (props.items) return /*#__PURE__*/ (0, $kF5Av$jsx)($e5cd8bc466d59863$var$AriaListBox, {
2781
+ ...props,
2782
+ children: (item)=>{
2783
+ const label = item?.[labelKey || "label"];
2784
+ const value = item?.[valueKey || "value"];
2785
+ return /*#__PURE__*/ (0, $kF5Av$jsx)((0, $kF5Av$Item), {
2786
+ textValue: value ?? label,
2787
+ children: renderOption ? renderOption(item) : label
2788
+ }, value);
2789
+ }
2790
+ });
2791
+ return /*#__PURE__*/ (0, $kF5Av$jsx)($e5cd8bc466d59863$var$AriaListBox, {
2792
+ ...props
2793
+ });
2794
+ };
2795
+ $e5cd8bc466d59863$export$41f133550aa26f48.displayName = "ListBox";
2796
+ const $e5cd8bc466d59863$var$Option = (props)=>{
2802
2797
  const { item: item , state: state } = props;
2803
2798
  const optionRef = (0, $kF5Av$useRef)(null);
2804
2799
  const { optionProps: optionProps , isSelected: isSelected , isDisabled: isDisabled , isFocused: isFocused , isPressed: isPressed } = (0, $kF5Av$useOption)({
@@ -2810,12 +2805,12 @@ const $e5cd8bc466d59863$var$_Option = (props, ref)=>{
2810
2805
  "data-selected": isSelected,
2811
2806
  "data-disabled": isDisabled,
2812
2807
  "data-pressed": isPressed,
2813
- ref: (0, $625847aeb8796968$export$c9058316764c140e)(optionRef, ref),
2808
+ ref: optionRef,
2814
2809
  ...(0, $kF5Av$mergeProps)(focusProps, optionProps),
2815
2810
  children: item.rendered
2816
2811
  });
2817
2812
  };
2818
- const $e5cd8bc466d59863$var$_ListSection = (props, ref)=>{
2813
+ const $e5cd8bc466d59863$var$ListSection = (props)=>{
2819
2814
  const { section: section , state: state } = props;
2820
2815
  const { itemProps: itemProps , headingProps: headingProps , groupProps: groupProps } = (0, $kF5Av$useListBoxSection)({
2821
2816
  heading: section.rendered,
@@ -2827,7 +2822,6 @@ const $e5cd8bc466d59863$var$_ListSection = (props, ref)=>{
2827
2822
  return /*#__PURE__*/ (0, $kF5Av$jsxs)((0, $kF5Av$Fragment), {
2828
2823
  children: [
2829
2824
  section.key !== state.collection.getFirstKey() && /*#__PURE__*/ (0, $kF5Av$jsx)("li", {
2830
- ref: ref,
2831
2825
  ...separatorProps
2832
2826
  }),
2833
2827
  /*#__PURE__*/ (0, $kF5Av$jsxs)((0, $49848f925ef854b6$export$844bee7de236d7ec), {
@@ -2853,24 +2847,6 @@ const $e5cd8bc466d59863$var$_ListSection = (props, ref)=>{
2853
2847
  ]
2854
2848
  });
2855
2849
  };
2856
- const $e5cd8bc466d59863$export$41f133550aa26f48 = /*#__PURE__*/ (0, $kF5Av$react).forwardRef((props, ref)=>{
2857
- const { labelKey: labelKey = "label" , renderOption: renderOption } = props;
2858
- if (!props.items) return /*#__PURE__*/ (0, $kF5Av$jsx)($e5cd8bc466d59863$var$_ListBox, {
2859
- ref: ref,
2860
- ...props
2861
- });
2862
- return /*#__PURE__*/ (0, $kF5Av$jsx)($e5cd8bc466d59863$var$_ListBox, {
2863
- ref: ref,
2864
- ...props,
2865
- children: (item)=>/*#__PURE__*/ (0, $kF5Av$jsx)((0, $kF5Av$Item), {
2866
- children: renderOption ? renderOption?.(item) : item?.[labelKey]
2867
- })
2868
- });
2869
- });
2870
- $e5cd8bc466d59863$var$_ListBox.displayName = "ListBox";
2871
- $e5cd8bc466d59863$export$41f133550aa26f48.displayName = "WrappedListBox";
2872
- const $e5cd8bc466d59863$var$ListSection = /*#__PURE__*/ (0, $kF5Av$react).forwardRef($e5cd8bc466d59863$var$_ListSection);
2873
- const $e5cd8bc466d59863$var$Option = /*#__PURE__*/ (0, $kF5Av$react).forwardRef($e5cd8bc466d59863$var$_Option);
2874
2850
 
2875
2851
 
2876
2852
 
@@ -2878,7 +2854,6 @@ const $e5cd8bc466d59863$var$Option = /*#__PURE__*/ (0, $kF5Av$react).forwardRef(
2878
2854
 
2879
2855
 
2880
2856
  const $8f062ce7b62fd0a2$export$3ac1e88a1c0b9f1 = (0, $9ade691eb9e41cfb$export$3817b7a54a07cec7)("button", (0, $dc7f74b9d5fb40ad$export$719e80a44b5e9ad0), {
2881
- all: "unset",
2882
2857
  boxSizing: "border-box",
2883
2858
  display: "inline-flex",
2884
2859
  alignItems: "center",
@@ -2947,7 +2922,7 @@ $c4793c1ed42b26da$export$5b6b19405a83ff9d.displayName = "Popover";
2947
2922
 
2948
2923
 
2949
2924
 
2950
- const $604e914a624d5a0f$export$cd0225d99c675387 = /*#__PURE__*/ (0, $kF5Av$react).forwardRef((props, ref)=>{
2925
+ function $604e914a624d5a0f$var$AriaSelect(props) {
2951
2926
  const space = (0, $aca95339810194aa$export$450c36e0b0e62ccd)();
2952
2927
  const { renderValue: renderValue , renderOption: renderOption , placeholder: placeholder = "Select an option" , appearance: appearance , size: size , css: css , labelKey: labelKey , label: label } = props;
2953
2928
  const state = (0, $kF5Av$useSelectState)(props);
@@ -2956,13 +2931,16 @@ const $604e914a624d5a0f$export$cd0225d99c675387 = /*#__PURE__*/ (0, $kF5Av$react
2956
2931
  const { buttonProps: buttonProps } = (0, $kF5Av$useButton)(triggerProps, selectRef);
2957
2932
  const { focusProps: focusProps , isFocused: isFocused } = (0, $kF5Av$useFocusRing)();
2958
2933
  const hasSelection = state.selectedItem != null;
2934
+ function renderSelectedValue() {
2935
+ if (renderValue) return renderValue(state.selectedItem.value);
2936
+ return (state.selectedItem?.value)?.[labelKey || "label"] ?? state?.selectedItem?.rendered;
2937
+ }
2959
2938
  return /*#__PURE__*/ (0, $kF5Av$jsxs)((0, $391d62e0590dec97$export$2e2bcd8739ae039), {
2960
2939
  className: space.compactItemWrapperAdjust,
2961
2940
  stretchX: true,
2962
2941
  css: css,
2963
2942
  position: "relative",
2964
2943
  gap: 2,
2965
- ref: ref,
2966
2944
  align: "start",
2967
2945
  stack: true,
2968
2946
  children: [
@@ -2992,7 +2970,7 @@ const $604e914a624d5a0f$export$cd0225d99c675387 = /*#__PURE__*/ (0, $kF5Av$react
2992
2970
  ...valueProps,
2993
2971
  children: [
2994
2972
  !hasSelection && placeholder,
2995
- hasSelection && renderValue ? renderValue(state.selectedItem) : (state.selectedItem?.value)?.[labelKey || "label"]
2973
+ hasSelection && renderSelectedValue()
2996
2974
  ]
2997
2975
  }),
2998
2976
  /*#__PURE__*/ (0, $kF5Av$jsx)((0, $kF5Av$HiSelector), {})
@@ -3018,25 +2996,21 @@ const $604e914a624d5a0f$export$cd0225d99c675387 = /*#__PURE__*/ (0, $kF5Av$react
3018
2996
  })
3019
2997
  ]
3020
2998
  });
3021
- });
3022
- const $604e914a624d5a0f$export$a26e8b900a29a570 = /*#__PURE__*/ (0, $kF5Av$react).forwardRef((props, ref)=>{
3023
- if (!props.items) return /*#__PURE__*/ (0, $kF5Av$jsx)($604e914a624d5a0f$export$cd0225d99c675387, {
3024
- ...props,
3025
- ref: ref
2999
+ }
3000
+ function $604e914a624d5a0f$export$ef9b1a59e592288f(props) {
3001
+ if (!props.items) return /*#__PURE__*/ (0, $kF5Av$jsx)($604e914a624d5a0f$var$AriaSelect, {
3002
+ ...props
3026
3003
  });
3027
- const key = props.valueKey || "id";
3004
+ const key = props.valueKey || "value";
3028
3005
  const labelKey = props.labelKey || "label";
3029
- return /*#__PURE__*/ (0, $kF5Av$jsx)($604e914a624d5a0f$export$cd0225d99c675387, {
3030
- ref: ref,
3006
+ return /*#__PURE__*/ (0, $kF5Av$jsx)($604e914a624d5a0f$var$AriaSelect, {
3031
3007
  ...props,
3032
3008
  children: (item)=>/*#__PURE__*/ (0, $kF5Av$jsx)((0, $kF5Av$Item), {
3033
3009
  textValue: item[key] || "key",
3034
3010
  children: props.renderOption ? props.renderOption?.(item) : item?.[labelKey]
3035
3011
  }, item[key] ?? "key")
3036
3012
  });
3037
- });
3038
- $604e914a624d5a0f$export$a26e8b900a29a570.displayName = "Select";
3039
- $604e914a624d5a0f$export$cd0225d99c675387.displayName = "_Select";
3013
+ }
3040
3014
 
3041
3015
 
3042
3016
 
@@ -3489,39 +3463,48 @@ const $bc830feefb2f8a48$export$f7513421c53ce141 = (0, $9ade691eb9e41cfb$export$3
3489
3463
  size: {
3490
3464
  "3xs": {
3491
3465
  size: 12,
3492
- borderRadius: 4
3466
+ borderRadius: 4,
3467
+ fontSize: "$1"
3493
3468
  },
3494
3469
  "2xs": {
3495
3470
  size: 18,
3496
- borderRadius: 6
3471
+ borderRadius: 6,
3472
+ fontSize: "$2"
3497
3473
  },
3498
3474
  xs: {
3499
3475
  size: 24,
3500
- borderRadius: 6
3476
+ borderRadius: 6,
3477
+ fontSize: "$2"
3501
3478
  },
3502
3479
  sm: {
3503
3480
  size: 32,
3504
- borderRadius: 6
3481
+ borderRadius: 6,
3482
+ fontSize: "$3"
3505
3483
  },
3506
3484
  md: {
3507
3485
  size: 40,
3508
- borderRadius: 6
3486
+ borderRadius: 6,
3487
+ fontSize: "$4"
3509
3488
  },
3510
3489
  lg: {
3511
3490
  size: 48,
3512
- borderRadius: 8
3491
+ borderRadius: 8,
3492
+ fontSize: "$4"
3513
3493
  },
3514
3494
  xl: {
3515
3495
  size: 56,
3516
- borderRadius: 8
3496
+ borderRadius: 8,
3497
+ fontSize: "$5"
3517
3498
  },
3518
3499
  "2xl": {
3519
3500
  size: 64,
3520
- borderRadius: 8
3501
+ borderRadius: 8,
3502
+ fontSize: "$5"
3521
3503
  },
3522
3504
  "3xl": {
3523
3505
  size: 72,
3524
- borderRadius: 8
3506
+ borderRadius: 8,
3507
+ fontSize: "$5"
3525
3508
  }
3526
3509
  }
3527
3510
  }
@@ -4074,7 +4057,7 @@ const $b3ab9230425b9da4$export$7a4af5518e2bbe67 = (0, $9ade691eb9e41cfb$export$3
4074
4057
  },
4075
4058
  sm: {
4076
4059
  "$$tag-base-height": "24px",
4077
- px: 6,
4060
+ px: 10,
4078
4061
  fontSize: 13
4079
4062
  },
4080
4063
  md: {
@@ -4086,6 +4069,11 @@ const $b3ab9230425b9da4$export$7a4af5518e2bbe67 = (0, $9ade691eb9e41cfb$export$3
4086
4069
  "$$tag-base-height": "32px",
4087
4070
  px: 6,
4088
4071
  fontSize: 14
4072
+ },
4073
+ xl: {
4074
+ "$$tag-base-height": "36px",
4075
+ px: 6,
4076
+ fontSize: 14
4089
4077
  }
4090
4078
  },
4091
4079
  shape: {
@@ -5246,5 +5234,200 @@ $9da3b07c262d31a5$export$2b77a92f1a5ad772.useModal = $9da3b07c262d31a5$export$33
5246
5234
 
5247
5235
 
5248
5236
 
5249
- export {$d22d8a7881f7b33f$export$2e2bcd8739ae039 as Box, $07781ffe9a5ae30b$export$ef2184bd89960b14 as Grid, $07781ffe9a5ae30b$export$9eb849b9b922d396 as GridItem, $f09084fde7cc0470$export$2e2bcd8739ae039 as Column, $391d62e0590dec97$export$2e2bcd8739ae039 as Flex, $61dde3060428563f$export$f5b8910cec6cf069 as Input, $4fdef5d0844b7575$export$2e2bcd8739ae039 as Text, $7f7599719bb2a749$export$379139ebc1c2b235 as Textarea, $59636f06ede7befa$export$353f5b6fc5456de1 as Button, $39ebe5a116c39d6c$export$c25acd513dcc8062 as IconButton, $b5830f3daeb33bb2$export$48513f6b9f8ce62d as Checkbox, $5711a5825d7012d3$export$4aa08d5625cb8ead as CheckboxGroup, $b5c60232b181c4bd$export$d7b12c4107be0d61 as Radio, $b5c60232b181c4bd$export$a98f0dcb43a68a25 as RadioGroup, $f7762930a14621d8$export$f8afaea2e9656b91 as RadioCard, $604e914a624d5a0f$export$a26e8b900a29a570 as Select, $8370e4d32f002899$export$5109c6dd95d8fb00 as DatePicker, $2b3b1dc9b2ed8672$export$e2255cf6045e8d47 as Avatar, $c0386802302e82e5$export$1a5cb5295a7d2749 as FileUploader, $4724a2c0da358be5$export$1ff3c3f08ae963c0 as Separator, $12105c91de6d0b91$export$b25a304ec7d746bb as Progress, $8eafe9f534066907$export$3b0d6d7590275603 as Loader, $d20773ec72923119$export$be92b6f5f03c0fe9 as Root, $d20773ec72923119$export$6d08773d2e66f8f2 as Item, $827cce002ec16c4b$export$3288d34c523a1192 as Tag, $4fd64b5726f94f78$export$b5d5cf8927ab7262 as Switch, $fd0a1cc8c4288e44$export$dbada5ace43900dd as ColorTray, $d2eff3f3a30a8f9a$export$50e381fea3a45244 as IconTray, $ea604f064e7efbe1$export$ea98c603db73aee7 as Sticker, $b13859906e03ed0f$export$e44a253a59704894 as DropdownMenu, $40e1dcf58e198ee9$export$1aaa3deaa90ea306 as Tabs, $2c3cbfa2e31957ff$export$54ec01a60f47d33d as Table, $cdf79c1aee6c465f$export$e6a97ba2cae5bb94 as Timeline, $9da3b07c262d31a5$export$2b77a92f1a5ad772 as Modal, $aca95339810194aa$export$eef1e68107c58ef2 as Space, $9ade691eb9e41cfb$export$3817b7a54a07cec7 as parrot, $9ade691eb9e41cfb$export$bca14c5b3b88a9c9 as ParrotTheme, $9ade691eb9e41cfb$export$e506a1d27d1eaa20 as ParrotThemeConfig};
5237
+
5238
+
5239
+ const $ca4f8631ba3dcb8d$export$7b7637218245c8a = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
5240
+
5241
+
5242
+
5243
+
5244
+
5245
+ const $ecda4e9d21366060$export$a455218a85c89869 = (0, $9ade691eb9e41cfb$export$3817b7a54a07cec7)((0, $d22d8a7881f7b33f$export$2e2bcd8739ae039), (0, $dc7f74b9d5fb40ad$export$719e80a44b5e9ad0), {
5246
+ display: "flex",
5247
+ alignItems: "center",
5248
+ flexWrap: "wrap",
5249
+ px: 4,
5250
+ py: 4,
5251
+ gap: "$1",
5252
+ boxSizing: "border-box",
5253
+ // ".input-container": {
5254
+ // width: 4,
5255
+ // },
5256
+ input: {
5257
+ border: "none",
5258
+ background: "transparent",
5259
+ outline: "none",
5260
+ minWidth: 4,
5261
+ width: "100%",
5262
+ marginInlineStart: 4,
5263
+ writingMode: "horizontal-tb"
5264
+ }
5265
+ });
5266
+
5267
+
5268
+
5269
+
5270
+
5271
+ function $fe4e891d5f5fb623$export$40bfa8c7b0832715(value, defaultValue, onChange) {
5272
+ const [state, setState] = $kF5Av$useState(value || defaultValue);
5273
+ const isControlled = !(0, $12bf997be8e9d203$export$ae45edb09e2fe7c2)(value);
5274
+ const controlledValue = isControlled ? value : state;
5275
+ const setValue = $kF5Av$useCallback((value)=>{
5276
+ if (!isControlled) setState(value);
5277
+ if (!Object.is(controlledValue, value)) onChange?.(value);
5278
+ }, [
5279
+ isControlled,
5280
+ controlledValue
5281
+ ]);
5282
+ return [
5283
+ controlledValue,
5284
+ setValue
5285
+ ];
5286
+ }
5287
+
5288
+
5289
+
5290
+
5291
+
5292
+ function $53b8753217e575e6$export$39299b56cfd4e361({ css: css , appearance: appearance , size: size , label: label , error: error , placeholder: placeholder , tags: tags , defaultTags: defaultTags , tagColor: tagColor = "gray" , tagVariant: tagVariant = "light" , tagShape: tagShape = "round" , tagSize: tagSize = "md" , onChange: onChange , renderTag: renderTag }) {
5293
+ const [inputValue, setInputValue] = $kF5Av$useState("");
5294
+ const [values, setValues] = (0, $fe4e891d5f5fb623$export$40bfa8c7b0832715)(dedupe(tags), dedupe(defaultTags), onChange);
5295
+ const [isFocused, setIsFocused] = $kF5Av$useState(false);
5296
+ function dedupe(values) {
5297
+ if (!values) return undefined;
5298
+ return Array.from(new Set(values));
5299
+ }
5300
+ const inputRef = $kF5Av$useRef(null);
5301
+ function onInputChange(e) {
5302
+ const { value: value } = e.target;
5303
+ setInputValue(value);
5304
+ }
5305
+ // function hasTrailingSpace(value: string) {
5306
+ // return /\s$/.test(value);
5307
+ // }
5308
+ function hasTrailingComma(value) {
5309
+ return /,$/.test(value);
5310
+ }
5311
+ function onInputFocus() {
5312
+ setIsFocused(true);
5313
+ }
5314
+ function onInputBlur() {
5315
+ setIsFocused(false);
5316
+ }
5317
+ function onKeyDown(e) {
5318
+ switch(e.key){
5319
+ case "Enter":
5320
+ case " ":
5321
+ if (isValid(inputValue.trim())) commit([
5322
+ inputValue
5323
+ ]);
5324
+ break;
5325
+ case "Backspace":
5326
+ if (!inputValue) onRemove(values[values.length - 1]);
5327
+ break;
5328
+ default:
5329
+ break;
5330
+ }
5331
+ }
5332
+ function captureFocus() {
5333
+ inputRef.current?.focus();
5334
+ }
5335
+ function onRemove(value) {
5336
+ setValues(values.filter((v)=>v !== value));
5337
+ }
5338
+ function isValid(value) {
5339
+ return (0, $ca4f8631ba3dcb8d$export$7b7637218245c8a).test(value);
5340
+ }
5341
+ function commit(newValues) {
5342
+ const validValues = newValues.map((v)=>v.trim()).filter((v)=>isValid(v));
5343
+ if (validValues.length > 0) setInputValue("");
5344
+ const finalValues = Array.from(new Set([
5345
+ ...values,
5346
+ ...validValues
5347
+ ]));
5348
+ setValues(finalValues);
5349
+ }
5350
+ const showPlaceholder = !inputValue && values.length === 0;
5351
+ function getInputContainerWidth() {
5352
+ if (showPlaceholder) return (placeholder?.length ?? 0) * 10;
5353
+ if (!showPlaceholder && isFocused) return inputValue.length * 10 || 10;
5354
+ return 0;
5355
+ }
5356
+ $kF5Av$useEffect(()=>{
5357
+ if (hasTrailingComma(inputValue.trim())) {
5358
+ const split = inputValue.split(",");
5359
+ commit(split);
5360
+ }
5361
+ }, [
5362
+ inputValue
5363
+ ]);
5364
+ return /*#__PURE__*/ (0, $kF5Av$jsxs)((0, $391d62e0590dec97$export$2e2bcd8739ae039), {
5365
+ css: css,
5366
+ stack: true,
5367
+ gap: 2,
5368
+ children: [
5369
+ label && /*#__PURE__*/ (0, $kF5Av$jsx)((0, $d9b0db66cd7e721a$export$2e2bcd8739ae039), {
5370
+ children: label
5371
+ }),
5372
+ /*#__PURE__*/ (0, $kF5Av$jsxs)((0, $ecda4e9d21366060$export$a455218a85c89869), {
5373
+ "data-focused": isFocused,
5374
+ onClick: captureFocus,
5375
+ size: size,
5376
+ appearance: appearance,
5377
+ children: [
5378
+ values.map((value)=>{
5379
+ return renderTag ? renderTag?.(value, onRemove) : /*#__PURE__*/ (0, $kF5Av$jsx)((0, $827cce002ec16c4b$export$3288d34c523a1192), {
5380
+ variant: tagVariant,
5381
+ color: tagColor,
5382
+ shape: tagShape,
5383
+ size: tagSize,
5384
+ append: /*#__PURE__*/ (0, $kF5Av$jsx)((0, $39ebe5a116c39d6c$export$c25acd513dcc8062), {
5385
+ variant: "plain",
5386
+ color: "gray",
5387
+ shape: "round",
5388
+ css: {
5389
+ marginLeft: 8
5390
+ },
5391
+ onPress: ()=>{
5392
+ onRemove(value);
5393
+ },
5394
+ size: "2xs",
5395
+ children: /*#__PURE__*/ (0, $kF5Av$jsx)((0, $kF5Av$HiX), {
5396
+ size: 16
5397
+ })
5398
+ }),
5399
+ children: value
5400
+ }, value);
5401
+ }),
5402
+ /*#__PURE__*/ (0, $kF5Av$jsx)((0, $d22d8a7881f7b33f$export$2e2bcd8739ae039), {
5403
+ css: {
5404
+ width: getInputContainerWidth()
5405
+ },
5406
+ className: "input-container",
5407
+ children: /*#__PURE__*/ (0, $kF5Av$jsx)("input", {
5408
+ ref: inputRef,
5409
+ placeholder: showPlaceholder ? placeholder : "",
5410
+ onKeyDown: onKeyDown,
5411
+ value: inputValue,
5412
+ onChange: onInputChange,
5413
+ onFocus: onInputFocus,
5414
+ onBlur: onInputBlur
5415
+ })
5416
+ })
5417
+ ]
5418
+ }),
5419
+ error && /*#__PURE__*/ (0, $kF5Av$jsx)((0, $19752cc72b827664$export$2e2bcd8739ae039), {
5420
+ children: error
5421
+ })
5422
+ ]
5423
+ });
5424
+ }
5425
+
5426
+
5427
+
5428
+
5429
+
5430
+
5431
+
5432
+ export {$d22d8a7881f7b33f$export$2e2bcd8739ae039 as Box, $07781ffe9a5ae30b$export$ef2184bd89960b14 as Grid, $07781ffe9a5ae30b$export$9eb849b9b922d396 as GridItem, $f09084fde7cc0470$export$2e2bcd8739ae039 as Column, $391d62e0590dec97$export$2e2bcd8739ae039 as Flex, $61dde3060428563f$export$f5b8910cec6cf069 as Input, $4fdef5d0844b7575$export$2e2bcd8739ae039 as Text, $7f7599719bb2a749$export$379139ebc1c2b235 as Textarea, $59636f06ede7befa$export$353f5b6fc5456de1 as Button, $39ebe5a116c39d6c$export$c25acd513dcc8062 as IconButton, $b5830f3daeb33bb2$export$48513f6b9f8ce62d as Checkbox, $5711a5825d7012d3$export$4aa08d5625cb8ead as CheckboxGroup, $b5c60232b181c4bd$export$d7b12c4107be0d61 as Radio, $b5c60232b181c4bd$export$a98f0dcb43a68a25 as RadioGroup, $f7762930a14621d8$export$f8afaea2e9656b91 as RadioCard, $604e914a624d5a0f$export$ef9b1a59e592288f as Select, $8370e4d32f002899$export$5109c6dd95d8fb00 as DatePicker, $2b3b1dc9b2ed8672$export$e2255cf6045e8d47 as Avatar, $c0386802302e82e5$export$1a5cb5295a7d2749 as FileUploader, $4724a2c0da358be5$export$1ff3c3f08ae963c0 as Separator, $12105c91de6d0b91$export$b25a304ec7d746bb as Progress, $8eafe9f534066907$export$3b0d6d7590275603 as Loader, $d20773ec72923119$export$be92b6f5f03c0fe9 as Root, $d20773ec72923119$export$6d08773d2e66f8f2 as Item, $827cce002ec16c4b$export$3288d34c523a1192 as Tag, $4fd64b5726f94f78$export$b5d5cf8927ab7262 as Switch, $fd0a1cc8c4288e44$export$dbada5ace43900dd as ColorTray, $d2eff3f3a30a8f9a$export$50e381fea3a45244 as IconTray, $ea604f064e7efbe1$export$ea98c603db73aee7 as Sticker, $b13859906e03ed0f$export$e44a253a59704894 as DropdownMenu, $40e1dcf58e198ee9$export$1aaa3deaa90ea306 as Tabs, $2c3cbfa2e31957ff$export$54ec01a60f47d33d as Table, $cdf79c1aee6c465f$export$e6a97ba2cae5bb94 as Timeline, $9da3b07c262d31a5$export$2b77a92f1a5ad772 as Modal, $aca95339810194aa$export$eef1e68107c58ef2 as Space, $53b8753217e575e6$export$39299b56cfd4e361 as TagInput, $9ade691eb9e41cfb$export$3817b7a54a07cec7 as parrot, $9ade691eb9e41cfb$export$bca14c5b3b88a9c9 as ParrotTheme, $9ade691eb9e41cfb$export$e506a1d27d1eaa20 as ParrotThemeConfig};
5250
5433
  //# sourceMappingURL=module.js.map