@proteos/ui 0.56.0 → 0.57.1

package/dist/index.d.cts

@@ -113,6 +113,10 @@ declare const avatarStyles: tailwind_variants.TVReturnType<{
         terra: string;
         slate: string;
     };
+    shape: {
+        circle: string;
+        square: string;
+    };
 }, undefined, string[], {
     size: {
         sm: string;
@@ -127,6 +131,10 @@ declare const avatarStyles: tailwind_variants.TVReturnType<{
         terra: string;
         slate: string;
     };
+    shape: {
+        circle: string;
+        square: string;
+    };
 }, undefined, tailwind_variants.TVReturnType<{
     size: {
         sm: string;
@@ -141,6 +149,10 @@ declare const avatarStyles: tailwind_variants.TVReturnType<{
         terra: string;
         slate: string;
     };
+    shape: {
+        circle: string;
+        square: string;
+    };
 }, undefined, string[], unknown, unknown, undefined>>;
 type AvatarVariants = VariantProps<typeof avatarStyles>;
 type AvatarProps = HTMLAttributes<HTMLSpanElement> & AvatarVariants & {
@@ -154,7 +166,7 @@ type AvatarProps = HTMLAttributes<HTMLSpanElement> & AvatarVariants & {
     /** Alt text for the image. Defaults to empty — the avatar is decorative. */
     alt?: string;
 };
-declare function Avatar({ size, tone, initials, src, alt, className, children, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
+declare function Avatar({ size, tone, shape, initials, src, alt, className, children, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
 
 declare const avatarGroupStyles: tailwind_variants.TVReturnType<{
     size: {
@@ -477,12 +489,14 @@ declare function Breadcrumbs({ items, separator, className, ...props }: Breadcru
 
 declare const buttonStyles: tailwind_variants.TVReturnType<{
     variant: {
-        primary: string[];
+        cta: string[];
         accent: string[];
+        primary: string[];
         secondary: string[];
         ghost: string[];
         subtle: string[];
         link: string[];
+        danger: string[];
     };
     size: {
         sm: string;
@@ -498,12 +512,14 @@ declare const buttonStyles: tailwind_variants.TVReturnType<{
     };
 }, undefined, string[], {
     variant: {
-        primary: string[];
+        cta: string[];
         accent: string[];
+        primary: string[];
         secondary: string[];
         ghost: string[];
         subtle: string[];
         link: string[];
+        danger: string[];
     };
     size: {
         sm: string;
@@ -519,12 +535,14 @@ declare const buttonStyles: tailwind_variants.TVReturnType<{
     };
 }, undefined, tailwind_variants.TVReturnType<{
     variant: {
-        primary: string[];
+        cta: string[];
         accent: string[];
+        primary: string[];
         secondary: string[];
         ghost: string[];
         subtle: string[];
         link: string[];
+        danger: string[];
     };
     size: {
         sm: string;
@@ -2100,12 +2118,19 @@ type ModalContentProps = ModalOverlayProps & {
     children: DialogProps['children'];
     /** Visual override for the panel wrapper (affects width, padding, etc.). */
     modalClassName?: string;
+    /** Visual override for the dialog element inside the panel — the column the
+     *  slots sit in. It hugs its content by default; a panel given a height of
+     *  its own needs `grow` here for the slots to fill it. */
+    dialogClassName?: string;
+    /** Accessible name for a dialog WITHOUT a `<ModalTitle>`. A titled dialog is
+     *  named by its title and doesn't need this. */
+    'aria-label'?: string;
 };
 /**
  * Portaled overlay + floating panel + dialog role. Backdrop darkens the page
  * with a warm ink tint; panel uses vellum bg + rule border + the float shadow.
  */
-declare function ModalContent({ children, className, modalClassName, isDismissable, ...props }: ModalContentProps): react_jsx_runtime.JSX.Element;
+declare function ModalContent({ children, className, modalClassName, dialogClassName, isDismissable, 'aria-label': ariaLabel, ...props }: ModalContentProps): react_jsx_runtime.JSX.Element;
 /** Padded top block. Contains `<ModalTitle>` and optionally `<ModalDescription>`. */
 declare function ModalHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
 /** The modal's accessible name. Uses RAC `<Heading slot="title">` so the
@@ -2705,10 +2730,12 @@ declare const segmentedControlStyles: tailwind_variants.TVReturnType<{
             segment: string;
         };
     };
-    tone: {
-        default: {
+    wrap: {
+        true: {
+            group: string;
             segment: string;
         };
+        false: {};
     };
 }, {
     group: string;
@@ -2722,10 +2749,12 @@ declare const segmentedControlStyles: tailwind_variants.TVReturnType<{
             segment: string;
         };
     };
-    tone: {
-        default: {
+    wrap: {
+        true: {
+            group: string;
             segment: string;
         };
+        false: {};
     };
 }, {
     group: string;
@@ -2739,10 +2768,12 @@ declare const segmentedControlStyles: tailwind_variants.TVReturnType<{
             segment: string;
         };
     };
-    tone: {
-        default: {
+    wrap: {
+        true: {
+            group: string;
             segment: string;
         };
+        false: {};
     };
 }, {
     group: string;
@@ -2753,12 +2784,17 @@ type SegmentedControlOption<T extends Key$1 = Key$1> = {
     id: T;
     label: ReactNode;
     isDisabled?: boolean;
+    /** Accessible name for icon-only segments. */
+    'aria-label'?: string;
 };
 type SegmentedControlProps<T extends Key$1 = Key$1> = Omit<RadioGroupProps$1, 'children' | 'value' | 'onChange'> & {
     options: ReadonlyArray<SegmentedControlOption<T>>;
-    value: T;
+    /** `null` renders no selected segment. */
+    value: T | null;
     onChange: (value: T) => void;
     size?: SegmentedControlVariants['size'];
+    /** Flow-wrap long option lists; segments share the line equally. */
+    wrap?: boolean;
     /** Focus the selected segment on mount. RAC's RadioGroup doesn't surface
      *  `autoFocus` itself — it's a per-Radio prop — so we apply it to the
      *  Radio whose value matches `value`. */
@@ -2766,7 +2802,7 @@ type SegmentedControlProps<T extends Key$1 = Key$1> = Omit<RadioGroupProps$1, 'c
     /** Visual override for the group wrapper. */
     className?: string;
 };
-declare function SegmentedControl<T extends Key$1>({ options, value, onChange, size, autoFocus, className, orientation, ...props }: SegmentedControlProps<T>): react_jsx_runtime.JSX.Element;
+declare function SegmentedControl<T extends Key$1>({ options, value, onChange, size, wrap, autoFocus, className, orientation, ...props }: SegmentedControlProps<T>): react_jsx_runtime.JSX.Element;
 
 type SelectOption<T extends Key = Key> = {
     id: T;

package/dist/index.d.ts

@@ -113,6 +113,10 @@ declare const avatarStyles: tailwind_variants.TVReturnType<{
         terra: string;
         slate: string;
     };
+    shape: {
+        circle: string;
+        square: string;
+    };
 }, undefined, string[], {
     size: {
         sm: string;
@@ -127,6 +131,10 @@ declare const avatarStyles: tailwind_variants.TVReturnType<{
         terra: string;
         slate: string;
     };
+    shape: {
+        circle: string;
+        square: string;
+    };
 }, undefined, tailwind_variants.TVReturnType<{
     size: {
         sm: string;
@@ -141,6 +149,10 @@ declare const avatarStyles: tailwind_variants.TVReturnType<{
         terra: string;
         slate: string;
     };
+    shape: {
+        circle: string;
+        square: string;
+    };
 }, undefined, string[], unknown, unknown, undefined>>;
 type AvatarVariants = VariantProps<typeof avatarStyles>;
 type AvatarProps = HTMLAttributes<HTMLSpanElement> & AvatarVariants & {
@@ -154,7 +166,7 @@ type AvatarProps = HTMLAttributes<HTMLSpanElement> & AvatarVariants & {
     /** Alt text for the image. Defaults to empty — the avatar is decorative. */
     alt?: string;
 };
-declare function Avatar({ size, tone, initials, src, alt, className, children, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
+declare function Avatar({ size, tone, shape, initials, src, alt, className, children, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
 
 declare const avatarGroupStyles: tailwind_variants.TVReturnType<{
     size: {
@@ -477,12 +489,14 @@ declare function Breadcrumbs({ items, separator, className, ...props }: Breadcru
 
 declare const buttonStyles: tailwind_variants.TVReturnType<{
     variant: {
-        primary: string[];
+        cta: string[];
         accent: string[];
+        primary: string[];
         secondary: string[];
         ghost: string[];
         subtle: string[];
         link: string[];
+        danger: string[];
     };
     size: {
         sm: string;
@@ -498,12 +512,14 @@ declare const buttonStyles: tailwind_variants.TVReturnType<{
     };
 }, undefined, string[], {
     variant: {
-        primary: string[];
+        cta: string[];
         accent: string[];
+        primary: string[];
         secondary: string[];
         ghost: string[];
         subtle: string[];
         link: string[];
+        danger: string[];
     };
     size: {
         sm: string;
@@ -519,12 +535,14 @@ declare const buttonStyles: tailwind_variants.TVReturnType<{
     };
 }, undefined, tailwind_variants.TVReturnType<{
     variant: {
-        primary: string[];
+        cta: string[];
         accent: string[];
+        primary: string[];
         secondary: string[];
         ghost: string[];
         subtle: string[];
         link: string[];
+        danger: string[];
     };
     size: {
         sm: string;
@@ -2100,12 +2118,19 @@ type ModalContentProps = ModalOverlayProps & {
     children: DialogProps['children'];
     /** Visual override for the panel wrapper (affects width, padding, etc.). */
     modalClassName?: string;
+    /** Visual override for the dialog element inside the panel — the column the
+     *  slots sit in. It hugs its content by default; a panel given a height of
+     *  its own needs `grow` here for the slots to fill it. */
+    dialogClassName?: string;
+    /** Accessible name for a dialog WITHOUT a `<ModalTitle>`. A titled dialog is
+     *  named by its title and doesn't need this. */
+    'aria-label'?: string;
 };
 /**
  * Portaled overlay + floating panel + dialog role. Backdrop darkens the page
  * with a warm ink tint; panel uses vellum bg + rule border + the float shadow.
  */
-declare function ModalContent({ children, className, modalClassName, isDismissable, ...props }: ModalContentProps): react_jsx_runtime.JSX.Element;
+declare function ModalContent({ children, className, modalClassName, dialogClassName, isDismissable, 'aria-label': ariaLabel, ...props }: ModalContentProps): react_jsx_runtime.JSX.Element;
 /** Padded top block. Contains `<ModalTitle>` and optionally `<ModalDescription>`. */
 declare function ModalHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
 /** The modal's accessible name. Uses RAC `<Heading slot="title">` so the
@@ -2705,10 +2730,12 @@ declare const segmentedControlStyles: tailwind_variants.TVReturnType<{
             segment: string;
         };
     };
-    tone: {
-        default: {
+    wrap: {
+        true: {
+            group: string;
             segment: string;
         };
+        false: {};
     };
 }, {
     group: string;
@@ -2722,10 +2749,12 @@ declare const segmentedControlStyles: tailwind_variants.TVReturnType<{
             segment: string;
         };
     };
-    tone: {
-        default: {
+    wrap: {
+        true: {
+            group: string;
             segment: string;
         };
+        false: {};
     };
 }, {
     group: string;
@@ -2739,10 +2768,12 @@ declare const segmentedControlStyles: tailwind_variants.TVReturnType<{
             segment: string;
         };
     };
-    tone: {
-        default: {
+    wrap: {
+        true: {
+            group: string;
             segment: string;
         };
+        false: {};
     };
 }, {
     group: string;
@@ -2753,12 +2784,17 @@ type SegmentedControlOption<T extends Key$1 = Key$1> = {
     id: T;
     label: ReactNode;
     isDisabled?: boolean;
+    /** Accessible name for icon-only segments. */
+    'aria-label'?: string;
 };
 type SegmentedControlProps<T extends Key$1 = Key$1> = Omit<RadioGroupProps$1, 'children' | 'value' | 'onChange'> & {
     options: ReadonlyArray<SegmentedControlOption<T>>;
-    value: T;
+    /** `null` renders no selected segment. */
+    value: T | null;
     onChange: (value: T) => void;
     size?: SegmentedControlVariants['size'];
+    /** Flow-wrap long option lists; segments share the line equally. */
+    wrap?: boolean;
     /** Focus the selected segment on mount. RAC's RadioGroup doesn't surface
      *  `autoFocus` itself — it's a per-Radio prop — so we apply it to the
      *  Radio whose value matches `value`. */
@@ -2766,7 +2802,7 @@ type SegmentedControlProps<T extends Key$1 = Key$1> = Omit<RadioGroupProps$1, 'c
     /** Visual override for the group wrapper. */
     className?: string;
 };
-declare function SegmentedControl<T extends Key$1>({ options, value, onChange, size, autoFocus, className, orientation, ...props }: SegmentedControlProps<T>): react_jsx_runtime.JSX.Element;
+declare function SegmentedControl<T extends Key$1>({ options, value, onChange, size, wrap, autoFocus, className, orientation, ...props }: SegmentedControlProps<T>): react_jsx_runtime.JSX.Element;
 
 type SelectOption<T extends Key = Key> = {
     id: T;