@wow-two-beta/ui 0.0.62 → 0.0.63

package/dist/actions/index.js

@@ -1,4 +1,5 @@
-export { BackToTopButton, Button, ButtonGroup, CopyButton, DisclosureButton, FAB, Link, SegmentedControl, SpeedDial, SpeedDialAction, SpeedDialTrigger, ToggleButton, ToggleButtonGroup, Toolbar, ToolbarButton, ToolbarLink, ToolbarSeparator, buttonVariants, fabVariants, linkVariants, toggleButtonVariants } from '../chunk-DPB2K3BH.js';
+export { BackToTopButton, Button, ButtonGroup, CopyButton, DisclosureButton, FAB, Link, SegmentedControl, SpeedDial, SpeedDialAction, SpeedDialTrigger, ToggleButton, ToggleButtonGroup, Toolbar, ToolbarButton, ToolbarLink, ToolbarSeparator, buttonVariants, fabVariants, linkVariants, toggleButtonVariants } from '../chunk-XPUKDLD3.js';
+import '../chunk-4QQLJOGP.js';
 import '../chunk-V267IMBH.js';
 import '../chunk-MVMDDGW7.js';
 import '../chunk-DX7FYAKY.js';

package/dist/actions/toggleButton/ToggleButton.d.ts

@@ -15,6 +15,7 @@ export interface ToggleButtonProps extends Omit<ButtonProps, 'variant' | 'tone'
     title?: StateAware<string>;
     'aria-label'?: StateAware<string>;
     color?: ColorProp;
+    tooltip?: ReactNode;
 }
 export declare const ToggleButton: import("react").ForwardRefExoticComponent<ToggleButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
 export {};

package/dist/chunk-4QQLJOGP.js

@@ -0,0 +1,95 @@
+import { useControlled, useEscape } from './chunk-V267IMBH.js';
+import { Portal, AnchoredPositioner } from './chunk-XLYJF3HC.js';
+import { useId } from './chunk-LGTGZ3RW.js';
+import { composeRefs, cn } from './chunk-X2MYOHOB.js';
+import { useState, useRef, useEffect, isValidElement, cloneElement } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+function Tooltip({
+  content,
+  children,
+  placement = "top",
+  openDelay = 700,
+  closeDelay = 0,
+  open: openProp,
+  defaultOpen = false,
+  onOpenChange,
+  isDisabled
+}) {
+  const [open, setOpen] = useControlled({
+    controlled: openProp,
+    default: defaultOpen,
+    onChange: onOpenChange
+  });
+  const [anchor, setAnchor] = useState(null);
+  const tooltipId = useId("tooltip");
+  const openTimer = useRef(null);
+  const closeTimer = useRef(null);
+  const clear = () => {
+    if (openTimer.current) clearTimeout(openTimer.current);
+    if (closeTimer.current) clearTimeout(closeTimer.current);
+    openTimer.current = null;
+    closeTimer.current = null;
+  };
+  const show = () => {
+    clear();
+    openTimer.current = setTimeout(() => setOpen(true), openDelay);
+  };
+  const hide = () => {
+    clear();
+    closeTimer.current = setTimeout(() => setOpen(false), closeDelay);
+  };
+  useEffect(
+    () => () => {
+      if (openTimer.current) clearTimeout(openTimer.current);
+      if (closeTimer.current) clearTimeout(closeTimer.current);
+    },
+    []
+  );
+  useEscape(() => {
+    clear();
+    setOpen(false);
+  }, open);
+  const visible = !isDisabled && open && !!content;
+  if (!isValidElement(children)) return children;
+  const trigger = children;
+  const cloned = cloneElement(trigger, {
+    ref: composeRefs(setAnchor, trigger.ref),
+    "aria-describedby": visible ? [trigger.props["aria-describedby"], tooltipId].filter(Boolean).join(" ") : trigger.props["aria-describedby"],
+    onPointerEnter: (e) => {
+      trigger.props.onPointerEnter?.(e);
+      show();
+    },
+    onPointerLeave: (e) => {
+      trigger.props.onPointerLeave?.(e);
+      hide();
+    },
+    onFocus: (e) => {
+      trigger.props.onFocus?.(e);
+      show();
+    },
+    onBlur: (e) => {
+      trigger.props.onBlur?.(e);
+      hide();
+    }
+  });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    cloned,
+    visible && /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(AnchoredPositioner, { anchor, placement, offset: 6, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        id: tooltipId,
+        role: "tooltip",
+        className: cn(
+          "z-tooltip rounded-md bg-inverse px-2.5 py-1.5 text-xs text-inverse-foreground shadow-md",
+          "animate-in fade-in-0 zoom-in-95"
+        ),
+        children: content
+      }
+    ) }) })
+  ] });
+}
+
+export { Tooltip };
+//# sourceMappingURL=chunk-4QQLJOGP.js.map
+//# sourceMappingURL=chunk-4QQLJOGP.js.map

package/dist/chunk-4QQLJOGP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/display/tooltip/Tooltip.tsx"],"names":[],"mappings":"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","file":"chunk-4QQLJOGP.js","sourcesContent":["import {\n  cloneElement,\n  isValidElement,\n  useEffect,\n  useRef,\n  useState,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport { cn, composeRefs } from '../../utils';\nimport { useControlled, useEscape, useId } from '../../hooks';\nimport {\n  AnchoredPositioner,\n  Portal,\n  type AnchoredPositionerProps,\n} from '../../primitives';\n\nexport interface TooltipProps {\n  /** Tooltip body. */\n  content: ReactNode;\n  /** Single child element — the trigger. Receives event handlers + ref. */\n  children: ReactElement;\n  /** Floating UI placement. Default `top`. */\n  placement?: AnchoredPositionerProps['placement'];\n  /** Delay before opening on hover, in ms. Default 700. */\n  openDelay?: number;\n  /** Delay before closing on leave, in ms. Default 0. */\n  closeDelay?: number;\n  /** Controlled open state. */\n  open?: boolean;\n  /** Initial open state when uncontrolled. Default `false`. */\n  defaultOpen?: boolean;\n  /** Fires on every open-state change (hover, focus, Escape). */\n  onOpenChange?: (open: boolean) => void;\n  /** Disable rendering even on hover (e.g. when content is empty). */\n  isDisabled?: boolean;\n}\n\n/**\n * Hover-/focus-triggered tooltip. Wraps a single child as the trigger; the\n * tooltip body renders into a Portal positioned by Floating UI. Default\n * delays mirror the OS pattern (700ms in, 0 out). Escape dismisses without\n * moving focus (WCAG 1.4.13); the trigger is described by the tooltip via\n * `aria-describedby` while open.\n */\nexport function Tooltip({\n  content,\n  children,\n  placement = 'top',\n  openDelay = 700,\n  closeDelay = 0,\n  open: openProp,\n  defaultOpen = false,\n  onOpenChange,\n  isDisabled,\n}: TooltipProps) {\n  const [open, setOpen] = useControlled({\n    controlled: openProp,\n    default: defaultOpen,\n    onChange: onOpenChange,\n  });\n  const [anchor, setAnchor] = useState<HTMLElement | null>(null);\n  const tooltipId = useId('tooltip');\n  const openTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const closeTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const clear = () => {\n    if (openTimer.current) clearTimeout(openTimer.current);\n    if (closeTimer.current) clearTimeout(closeTimer.current);\n    openTimer.current = null;\n    closeTimer.current = null;\n  };\n  const show = () => {\n    clear();\n    openTimer.current = setTimeout(() => setOpen(true), openDelay);\n  };\n  const hide = () => {\n    clear();\n    closeTimer.current = setTimeout(() => setOpen(false), closeDelay);\n  };\n\n  /* Clear pending timers on unmount. */\n  useEffect(\n    () => () => {\n      if (openTimer.current) clearTimeout(openTimer.current);\n      if (closeTimer.current) clearTimeout(closeTimer.current);\n    },\n    [],\n  );\n\n  /* WCAG 1.4.13 — Escape dismisses immediately, without moving focus. */\n  useEscape(() => {\n    clear();\n    setOpen(false);\n  }, open);\n\n  const visible = !isDisabled && open && !!content;\n\n  if (!isValidElement(children)) return children;\n  const trigger = children as ReactElement<{\n    ref?: Ref<HTMLElement>;\n    'aria-describedby'?: string;\n    onPointerEnter?: (e: React.PointerEvent) => void;\n    onPointerLeave?: (e: React.PointerEvent) => void;\n    onFocus?: (e: React.FocusEvent) => void;\n    onBlur?: (e: React.FocusEvent) => void;\n  }> & { ref?: Ref<HTMLElement> };\n\n  const cloned = cloneElement(trigger, {\n    ref: composeRefs(setAnchor, trigger.ref),\n    'aria-describedby': visible\n      ? [trigger.props['aria-describedby'], tooltipId].filter(Boolean).join(' ')\n      : trigger.props['aria-describedby'],\n    onPointerEnter: (e: React.PointerEvent) => {\n      trigger.props.onPointerEnter?.(e);\n      show();\n    },\n    onPointerLeave: (e: React.PointerEvent) => {\n      trigger.props.onPointerLeave?.(e);\n      hide();\n    },\n    onFocus: (e: React.FocusEvent) => {\n      trigger.props.onFocus?.(e);\n      show();\n    },\n    onBlur: (e: React.FocusEvent) => {\n      trigger.props.onBlur?.(e);\n      hide();\n    },\n  });\n\n  return (\n    <>\n      {cloned}\n      {visible && (\n        <Portal>\n          <AnchoredPositioner anchor={anchor} placement={placement} offset={6}>\n            <div\n              id={tooltipId}\n              role=\"tooltip\"\n              className={cn(\n                'z-tooltip rounded-md bg-inverse px-2.5 py-1.5 text-xs text-inverse-foreground shadow-md',\n                'animate-in fade-in-0 zoom-in-95',\n              )}\n            >\n              {content}\n            </div>\n          </AnchoredPositioner>\n        </Portal>\n      )}\n    </>\n  );\n}\n"]}

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

@@ -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-INSI3NPU.js.map
-//# sourceMappingURL=chunk-INSI3NPU.js.map
+//# sourceMappingURL=chunk-XB4TU643.js.map
+//# sourceMappingURL=chunk-XB4TU643.js.map