@parrot-co/parrot-ui 1.0.0-beta.2 → 1.0.0-beta.3

package/dist/index.mjs

@@ -464,8 +464,10 @@ function Field({
         ref: groupRef,
         className: cn(
           "prt-input-control relative inline-flex w-full items-center",
-          space.classNames
+          space.classNames,
+          classNames?.control
         ),
+        style: styles?.control,
         "data-has-error": !!error,
         "data-appearance": resolvedAppearance,
         "data-disabled": isDisabled
@@ -912,6 +914,9 @@ function HiChevronRight({ size = "1em", ...props }) {
 function HiChevronUp({ size = "1em", ...props }) {
   return /* @__PURE__ */ React13.createElement("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", width: size, height: size, ...props }, /* @__PURE__ */ React13.createElement("path", { fillRule: "evenodd", d: "M14.707 12.707a1 1 0 01-1.414 0L10 9.414l-3.293 3.293a1 1 0 01-1.414-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 010 1.414z", clipRule: "evenodd" }));
 }
+function HiEye({ size = "1em", ...props }) {
+  return /* @__PURE__ */ React13.createElement("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", width: size, height: size, ...props }, /* @__PURE__ */ React13.createElement("path", { d: "M10 12a2 2 0 100-4 2 2 0 000 4z" }), /* @__PURE__ */ React13.createElement("path", { fillRule: "evenodd", d: "M.458 10C1.732 5.943 5.522 3 10 3s8.268 2.943 9.542 7c-1.274 4.057-5.064 7-9.542 7S1.732 14.057.458 10zM14 10a4 4 0 11-8 0 4 4 0 018 0z", clipRule: "evenodd" }));
+}
 function HiOutlineCalendar({ size = "1em", ...props }) {
   return /* @__PURE__ */ React13.createElement("svg", { fill: "none", viewBox: "0 0 24 24", strokeWidth: "2", stroke: "currentColor", "aria-hidden": "true", width: size, height: size, ...props }, /* @__PURE__ */ React13.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }));
 }
@@ -942,6 +947,28 @@ function HiSelector({ size = "1em", ...props }) {
 function HiX({ size = "1em", ...props }) {
   return /* @__PURE__ */ React13.createElement("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", width: size, height: size, ...props }, /* @__PURE__ */ React13.createElement("path", { fillRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z", clipRule: "evenodd" }));
 }
+
+// src/components/input/password-input.tsx
+function PasswordInput({ wrapperRef, ...props }) {
+  const [showPassword, setShowPassword] = React13__default.useState(false);
+  return /* @__PURE__ */ React13__default.createElement(
+    Input,
+    {
+      wrapperRef,
+      ...props,
+      type: showPassword ? "text" : "password",
+      append: /* @__PURE__ */ React13__default.createElement(
+        IconButton,
+        {
+          onPress: () => setShowPassword((p) => !p),
+          size: "sm",
+          variant: "light"
+        },
+        /* @__PURE__ */ React13__default.createElement(HiEye, { size: 16 })
+      )
+    }
+  );
+}
 var PATTERNS = {
   numeric: REGEXP_ONLY_DIGITS,
   alphanumeric: REGEXP_ONLY_DIGITS_AND_CHARS,
@@ -1975,14 +2002,25 @@ function Select({
   classNames,
   style,
   styles,
+  value,
+  defaultValue,
+  onChange,
   "aria-label": ariaLabel,
   ...racProps
 }) {
   const theme = useTheme();
   const resolvedColor = color ?? theme?.color;
-  const resolvedSize = size ?? theme?.size ?? "sm";
+  const resolvedSize = size ?? theme?.size ?? "md";
   const resolvedAppearance = appearance ?? theme?.inputAppearance ?? "outline";
   const isMultiple = racProps.selectionMode === "multiple";
+  const selectionProps = {
+    value,
+    defaultValue,
+    onChange: onChange ? (next) => {
+      if (next && typeof next === "object" && "nativeEvent" in next) return;
+      onChange(next);
+    } : void 0
+  };
   function labelOf(item) {
     if (item == null) return null;
     return item[labelKey];
@@ -1991,6 +2029,7 @@ function Select({
     Select$1,
     {
       ...racProps,
+      ...selectionProps,
       placeholder,
       isInvalid: !!error,
       "aria-label": ariaLabel ?? (label == null ? placeholder ?? "Select" : void 0),
@@ -4791,6 +4830,6 @@ function compose(...fns) {
   };
 }
 
-export { Avatar, AvatarGroup, Button, ButtonGroup, Calendar, Checkbox, CheckboxGroup, CheckboxItem, ColorArea, ColorField, ColorPicker, ColorSlider, ColorSwatchPicker, ComboBox, DateField, DatePicker, DateRangePicker, FileUploader, HoverCard, IconButton, Input, ListBox, ListBoxItem, ListBoxSection, Loader, Menu, MenuContent, MenuItem, MenuSection, MenuTrigger, Modal, ModalProvider, NumberInput, ListBoxItem as Option, PinInput, PinInputGroup, PinInputSeparator, PinInputSlot, Popover, PopoverContent, PopoverTrigger, Progress, Radio, RadioCard, RadioGroup, RadioItem, RangeCalendar, ListBoxSection as Section, Select, Separator, Slider, Space, Sticker, Switch, Tab, Table, Tabs, Tag, TagGroup, TagGroupItem, TagInput, Text, Textarea, ThemeProvider, TimeField, Timeline, ToastRegion, Toggle, ToggleButton, ToggleGroup, Tooltip, compose, email, matches, max, maxLength, min, minLength, parseColor2 as parseColor, pattern, required, toast, useForm, useModal, useModals, useTheme };
+export { Avatar, AvatarGroup, Button, ButtonGroup, Calendar, Checkbox, CheckboxGroup, CheckboxItem, ColorArea, ColorField, ColorPicker, ColorSlider, ColorSwatchPicker, ComboBox, DateField, DatePicker, DateRangePicker, FileUploader, HoverCard, IconButton, Input, ListBox, ListBoxItem, ListBoxSection, Loader, Menu, MenuContent, MenuItem, MenuSection, MenuTrigger, Modal, ModalProvider, NumberInput, ListBoxItem as Option, PasswordInput, PinInput, PinInputGroup, PinInputSeparator, PinInputSlot, Popover, PopoverContent, PopoverTrigger, Progress, Radio, RadioCard, RadioGroup, RadioItem, RangeCalendar, ListBoxSection as Section, Select, Separator, Slider, Space, Sticker, Switch, Tab, Table, Tabs, Tag, TagGroup, TagGroupItem, TagInput, Text, Textarea, ThemeProvider, TimeField, Timeline, ToastRegion, Toggle, ToggleButton, ToggleGroup, Tooltip, compose, email, matches, max, maxLength, min, minLength, parseColor2 as parseColor, pattern, required, toast, useForm, useModal, useModals, useTheme };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map