@wow-two-beta/ui 0.0.61 → 0.0.63

package/dist/{chunk-DUWEP5T3.js → chunk-XB4TU643.js}

@@ -1,10 +1,10 @@
 import { listboxItemVariants, listboxVariants, listboxGroupLabelVariants, listboxSeparatorVariants, listboxEmptyVariants } from './chunk-FMTBJJP6.js';
-import { PopoverTrigger, Popover, PopoverContent } from './chunk-5LFMQORR.js';
+import { PopoverTrigger, Popover, PopoverContent } from './chunk-BLU5JZAB.js';
 import { startOfMonth, isSameDay, isToday, isDateDisabled, parseISODate, formatISODate, parseISOTime, Tag, addMonths, Kbd, addDays, buildMonthGrid, MONTHS_LONG, WEEKDAYS_SHORT, formatISOTime, startOfDay, isInRange } from './chunk-3SWPYYRQ.js';
 import { useControlled, useTypeahead } from './chunk-V267IMBH.js';
 import { Icon } from './chunk-MVMDDGW7.js';
 import { tv, CssExtensions, ColorExtensions, dataAttr, surfaceVariants, Equality } from './chunk-DX7FYAKY.js';
-import { useFormControl, FormControlProvider, Announce, RovingFocusGroup, useRovingFocusItem, Portal, AnchoredPositioner, DismissableLayer } from './chunk-TTSJZEL7.js';
+import { useFormControl, FormControlProvider, Announce, RovingFocusGroup, useRovingFocusItem, Portal, AnchoredPositioner, DismissableLayer } from './chunk-XLYJF3HC.js';
 import { useId } from './chunk-LGTGZ3RW.js';
 import { cn, composeRefs } from './chunk-X2MYOHOB.js';
 import * as React from 'react';
@@ -101,7 +101,7 @@ Legend.displayName = "Legend";
 
 // src/forms/InputStyles.ts
 var inputBaseVariants = tv({
-  base: "flex w-full rounded-md border bg-popover text-foreground placeholder:text-subtle-foreground transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-60 read-only:bg-muted",
+  base: "flex w-full rounded-md bg-popover text-foreground placeholder:text-subtle-foreground transition-colors focus-visible:outline-none focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-60 read-only:bg-muted",
   variants: {
     size: {
       xs: "h-7 px-2 text-xs",
@@ -112,15 +112,33 @@ var inputBaseVariants = tv({
     state: {
       default: "border-input hover:border-border-strong",
       invalid: "border-destructive focus-visible:ring-destructive"
+    },
+    /* Border weight — scale like `size`/`radius`; default `sm` (1px). Set a literal via `className="border-[1.5px]"`. */
+    border: {
+      none: "border-0",
+      xs: "border-[0.5px]",
+      sm: "border",
+      md: "border-2",
+      lg: "border-4",
+      xl: "border-8"
+    },
+    /* Focus-ring weight — default `md` (2px). The ring being wider than the border read as "thick"; use `sm` for a hairline focus. */
+    ring: {
+      none: "focus-visible:ring-0",
+      sm: "focus-visible:ring-1",
+      md: "focus-visible:ring-2",
+      lg: "focus-visible:ring-4"
     }
   },
   defaultVariants: {
     size: "md",
-    state: "default"
+    state: "default",
+    border: "sm",
+    ring: "md"
   }
 });
 var TextInput = forwardRef(
-  ({ className, size, state, id, disabled, required, readOnly, ...props }, ref) => {
+  ({ className, size, state, border, ring, id, disabled, required, readOnly, ...props }, ref) => {
     const ctx = useFormControl();
     const finalState = state ?? (ctx?.isInvalid ? "invalid" : "default");
     return /* @__PURE__ */ jsx(
@@ -134,7 +152,7 @@ var TextInput = forwardRef(
         readOnly: readOnly ?? ctx?.isReadOnly,
         "aria-invalid": ctx?.isInvalid || void 0,
         "aria-describedby": ctx ? `${ctx.helperId} ${ctx.errorId}` : void 0,
-        className: cn(inputBaseVariants({ size, state: finalState }), className),
+        className: cn(inputBaseVariants({ size, state: finalState, border, ring }), className),
         ...props
       }
     );
@@ -3445,6 +3463,8 @@ var ColorField = forwardRef(function ColorField2({
   hasAlpha = false,
   size,
   state,
+  border,
+  ring,
   className,
   id,
   disabled,
@@ -3506,7 +3526,7 @@ var ColorField = forwardRef(function ColorField2({
           }
         },
         className: cn(
-          inputBaseVariants({ size, state: state ?? (ctx?.isInvalid ? "invalid" : "default") }),
+          inputBaseVariants({ size, state: state ?? (ctx?.isInvalid ? "invalid" : "default"), border, ring }),
           "pl-9 font-mono uppercase",
           className
         ),
@@ -7748,5 +7768,5 @@ var ChatComposer = forwardRef(
 ChatComposer.displayName = "ChatComposer";
 
 export { ADDRESS_COUNTRIES, AddressForm, BUILT_IN_EMOJI, BUILT_IN_FONTS, Calendar, CharacterCount, ChatComposer, Checkbox, CheckboxField, CheckboxGroup, ChoiceCard, CodeEditor, ColorArea, ColorField, ColorPicker, ColorSlider, ColorSwatch, ColorSwatchPicker, ColorWheel, Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxSeparator, CronInput, CurrencyInput, DateField, DatePicker, DateRangePicker, Editable, EditableCancel, EditableInput, EditablePreview, EditableSubmit, EmailInput, EmojiPicker, Fieldset, FilePicker, FileUpload, FontPicker, FormErrorMessage, FormField, FormHelperText, GradientPicker, IconPicker, InputAddon, InputGroup, JSONEditor, KeyboardShortcutPicker, Knob, Label, LabeledInput, Legend, Listbox, ListboxEmpty, ListboxGroup, ListboxItem, ListboxSeparator, MarkdownEditor, MaskedInput, MultiSelect, MultiSelectContent, MultiSelectItem, MultiSelectTags, MultiSelectTrigger, NumberInput, PHONE_COUNTRIES, PasswordInput, PasswordStrength, PercentInput, PhoneInput, PinInput, Radio, RadioField, RadioGroup, RangeCalendar, ReactionPicker, RecurrenceEditor, SearchInput, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Slider, Stepper, StepperList, StepperPanel, StepperStep, Switch, SwitchField, TagsInput, TelInput, TextInput, Textarea, TimeField, TimePicker, UrlInput, Wizard, WizardFooter, WizardStep, WizardSteps, colorSwatchVariants, gradientToCss, useWizard };
-//# sourceMappingURL=chunk-DUWEP5T3.js.map
-//# sourceMappingURL=chunk-DUWEP5T3.js.map
+//# sourceMappingURL=chunk-XB4TU643.js.map
+//# sourceMappingURL=chunk-XB4TU643.js.map