beez-ui 2.7.1 → 3.0.0

package/dist/components/rich-link-editor.js

@@ -5,7 +5,7 @@ import { useEffect, useRef } from "react";
 import { cn } from "../lib/utils.js";
 import { RICH_LINK_POPOVER_MODE, RICH_TEXT_EDITOR_KEY, RICH_TEXT_SEGMENT_TYPE } from "../lib/rich-text/link-markdown-constants.js";
 import { ControlButton } from "./control-button.js";
-import { Popover, PopoverContent, PopoverTrigger } from "./popover.js";
+import { Popover, PopoverContent, PopoverTrigger } from "./primitives/popover.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const BUTTON_TYPE = "button";
 const BUTTON_VARIANT = {

package/dist/components/select.d.ts

@@ -1,46 +1,55 @@
 /**
- * Arc's Select (https://uiarc.dev, MIT License, see THIRD_PARTY_NOTICES.md) as beez-ui's composable Radix select:
- * Arc's trigger, whose hover, press and open states answer in color only so the anchored list never shifts, and its
- * raised list with option rows and an end check, on Arc's tokens. It keeps every subcomponent, prop and `data-slot`
- * of the previous API and beez-ui's option entrance, check pop and chevron rotation.
+ * Arc's Select (https://uiarc.dev, MIT License, see THIRD_PARTY_NOTICES.md): a labelled choice field whose trigger
+ * answers hover, press and open in color only, so the anchored list never shifts, and whose raised list matches the
+ * trigger width, with option rows and an end check. It follows Arc's closed API (`label`, `options`, `placeholder`,
+ * `description` and Radix's root props) and shares the label, helper and error rows of `Input`.
  */
-import * as React from "react";
-import { Select as SelectPrimitive } from "radix-ui";
-declare function Select({ ...props }: React.ComponentProps<typeof SelectPrimitive.Root>): React.JSX.Element;
-declare function SelectGroup({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Group>): React.JSX.Element;
-declare function SelectValue({ ...props }: React.ComponentProps<typeof SelectPrimitive.Value>): React.JSX.Element;
+import type { AriaAttributes, ComponentProps, Ref } from "react";
+import { Select as SelectRoot } from "./primitives/select.js";
+/** One choice of a `Select`. */
+export type SelectOption = {
+    value: string;
+    label: string;
+    disabled?: boolean;
+};
+/** Height of the trigger: `default` matches `Input` and `Button`, `sm` their small size. */
+export type SelectSize = "default" | "sm";
+export type SelectProps = Omit<ComponentProps<typeof SelectRoot>, "children"> & {
+    /** Visible label, tied to the trigger with `htmlFor`. */
+    label: string;
+    /** Choices, in list order. Readonly arrays, such as lists declared `as const`, are accepted as they are. */
+    options: readonly SelectOption[];
+    /** Shown while no option is chosen. Defaults to "Seleccioná una opción". */
+    placeholder?: string;
+    /** Helper copy under the trigger, linked through `aria-describedby`. */
+    description?: string;
+    /** Error copy: marks the trigger invalid and renders in a `role="alert"` row, as in `Input`. */
+    error?: string;
+    /** Trigger id, so an external `<label htmlFor>` can point at it. Generated when omitted. */
+    id?: string;
+    /** Class on the field that wraps the label, the trigger and the helper rows. */
+    className?: string;
+    /** Keeps `label` for assistive technology only, for layouts that already show their own label. */
+    hideLabel?: boolean;
+    /** Height of the trigger. Defaults to `default`. */
+    size?: SelectSize;
+    /** Class on the trigger. */
+    triggerClassName?: string;
+    /** Marks the trigger invalid without an error message. `error` sets it too. */
+    "aria-invalid"?: AriaAttributes["aria-invalid"];
+    /**
+     * Ids of external elements that describe the trigger. They are combined with the ids of `description` and
+     * `error`, which follow them.
+     */
+    "aria-describedby"?: string;
+    /** The trigger button. */
+    ref?: Ref<HTMLButtonElement>;
+};
 /**
- * Renders Arc's selection control: `default` matches the height of `Input` and `Button`, `sm` their small size.
- * Hover only answers on fine pointers, keyboard focus draws the shared outline, and `aria-invalid` turns the border
- * to the danger color.
- * @param props - Primitive properties, the `size` and optional consumer overrides.
- * @returns The styled primitive with its original interaction contract.
+ * A compact choice field with a keyboard friendly list, controlled with `value` and `onValueChange` or uncontrolled
+ * with `defaultValue`; pass `name` to submit it with a form.
+ * @param props - Label, options, optional copy and layout, and Radix select root properties.
+ * @returns The labelled field.
  */
-declare function SelectTrigger({ className, size, children, ...props }: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
-    size?: "sm" | "default";
-}): React.JSX.Element;
-/**
- * Renders Arc's raised option list, at least twelve rem wide so options stay readable. With `position="popper"` it
- * grows from the trigger edge, matches the trigger width, keeps 12px from the viewport edges and caps its height at
- * 20rem.
- * @param props - Primitive properties and optional consumer overrides.
- * @returns The styled primitive with its original interaction contract.
- */
-declare function SelectContent({ className, children, position, align, collisionPadding, ...props }: React.ComponentProps<typeof SelectPrimitive.Content>): React.JSX.Element;
-/**
- * Renders a muted option group label aligned with the option text.
- * @param props - Primitive properties and optional consumer overrides.
- * @returns The styled primitive with its original interaction contract.
- */
-declare function SelectLabel({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Label>): React.JSX.Element;
-/**
- * Renders Arc's option row: 36px tall, a muted fill when highlighted and the check of the chosen option at the end,
- * while retaining selection and disabled semantics.
- * @param props - Primitive properties and optional consumer overrides.
- * @returns The styled primitive with its original interaction contract.
- */
-declare function SelectItem({ className, children, ...props }: React.ComponentProps<typeof SelectPrimitive.Item>): React.JSX.Element;
-declare function SelectSeparator({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Separator>): React.JSX.Element;
-declare function SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>): React.JSX.Element;
-declare function SelectScrollDownButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>): React.JSX.Element;
-export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, };
+declare function Select({ label, options, placeholder, description, error, id, className, hideLabel, size, triggerClassName, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedBy, ref, ...rootProps }: SelectProps): import("react").JSX.Element;
+export { Select };