@fileverse/ui 5.1.8-dropdownmenu-2 → 5.1.8-dropdownmenu-3

package/dist/index.css

@@ -541,7 +541,6 @@ video {
     --color-bg-tertiary: 195, 10%, 92%, 1; /* Tertiary */
     --color-bg-success: 126, 73%, 39%, 1;
     --color-bg-success-light: 124, 79%, 93%, 1; /* Green-100 */
-    --color-bg-info-light: 248, 100%, 97%, 1;
 
     /* Border */
     --color-border-default: 195, 10%, 92%, 1; /* Gray-200 */
@@ -572,12 +571,7 @@ video {
     --color-bg-tooltip: 0, 0%, 0%, 1; /* Black */
     --color-text-tooltip: 0, 0%, 100%, 1; /* White */
 
-    /* Inline Comment */
-    --color-inline-comment: 124, 79%, 93%, 1; /* #DDFBDF */
-    --color-inline-comment-active: 126, 74%, 73%, 1; /* #88ED92 */
-
     /* Utility */
-    --color-bg-transparent: 0, 0%, 0%, 0.04; /* Black 4% */
     --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
 
     /* Elevation */
@@ -622,11 +616,10 @@ video {
     --color-bg-brand-light: 57, 92%, 76%, 1; /* Yellow-100 */
     --color-bg-danger: 354, 84%, 42%, 1; /* Red-200 */
     --color-bg-danger-light: 356, 100%, 97%, 1; /* Red-50 */
-    --color-bg-default-inverse: 0, 0%, 0%, 1; /* White */
+    --color-bg-default-inverse: 0, 0%, 100%, 1; /* White */
     --color-bg-tertiary: 0, 0%, 25%, 1; /* Gray-800 */
     --color-bg-success: 128, 59%, 20%, 1;
     --color-bg-success-light: 128, 59%, 20%, 1; /* Green-900 */
-    --color-bg-info-light: 254, 100%, 73%, 0.16;
 
     /* Border */
     --color-border-default: 0, 0%, 25%, 1; /* Gray-800 */
@@ -657,12 +650,7 @@ video {
     --color-bg-tooltip: 0, 0%, 100%, 1; /* White */
     --color-text-tooltip: 0, 0%, 0%, 1; /* Black */
 
-    /* Inline Comment */
-    --color-inline-comment: 128, 59%, 20%, 1; /* #15521D */
-    --color-inline-comment-active: 127, 69%, 29%, 1; /* #177E23 */
-
     /* Utility */
-    --color-bg-transparent: 0, 0%, 100%, 0.04; /* White 4% */
     --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
   }
 
@@ -705,7 +693,6 @@ video {
     --color-bg-tertiary: 44, 32%, 86%, 1; /* #E7E1D0 */
     --color-bg-success: 77, 23%, 35%, 1; /* #616C44 */
     --color-bg-success-light: 76, 23%, 64%, 1; /* #ADB88E */
-    --color-bg-info-light: 199, 45%, 87%, 1;
 
     /* Border */
     --color-border-default: 41, 49%, 76%, 1; /* #E0CDA4 */
@@ -736,12 +723,7 @@ video {
     --color-bg-tooltip: 28, 16%, 21%, 1; /* #3E352D */
     --color-text-tooltip: 41, 61%, 84%, 1; /* #EFDFBD */
 
-    /* Inline Comment */
-    --color-inline-comment: 76, 23%, 72%, 1; /* #BFC8A7 */
-    --color-inline-comment-active: 75, 23%, 62%, 1; /* #A9B488 */
-
     /* Utility */
-    --color-bg-transparent: 28, 16%, 21%, 0.04; /* #3E352D 4% */
     --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
   }
 
@@ -772,7 +754,7 @@ video {
     --color-bg-default-hover: 3, 88%, 26%, 0.08; /* #7C0E08 8% */
     --color-bg-default-active: 45, 100%, 65%, 1; /* #FFD24D */
     --color-bg-default-selected: 3, 88%, 26%, 0.06; /* #7C0E08 6% */
-    --color-bg-secondary: 346, 100%, 92%, 1; /* #FFD6E0 */
+    --color-bg-secondary: 345, 100%, 92%, 1; /* #FFD6E0 */
     --color-bg-secondary-hover: 3, 88%, 26%, 0.12; /* #7C0E08 12% */
     --color-bg-disabled: 24, 16%, 21%, 0.04; /* #3E352D 4% */
     --color-bg-brand: 45, 100%, 65%, 1; /* #FFD24D */
@@ -780,11 +762,10 @@ video {
     --color-bg-brand-light: 45, 100%, 90%, 1; /* #FFF2CC */
     --color-bg-danger: 2, 79%, 56%, 1; /* #E73D36 */
     --color-bg-danger-light: 2, 79%, 56%, 0.14; /* #E73D36 14% */
-    --color-bg-default-inverse: 3, 88%, 26%, 1;
+    --color-bg-default-inverse: 28, 16%, 21%, 1; /* #3E352D */
     --color-bg-tertiary: 3, 88%, 26%, 0.12; /* #7C0E08 12% */
     --color-bg-success: 139, 35%, 42%, 1; /* #46905E */
     --color-bg-success-light: 140, 34%, 88%, 1; /* #D6EBDD */
-    --color-bg-info-light: 209, 89%, 88%, 1;
 
     /* Border */
     --color-border-default: 346, 100%, 90%, 1; /* #FFCCD8 */
@@ -815,12 +796,7 @@ video {
     --color-bg-tooltip: 3, 88%, 26%, 1; /* #7C0E08 */
     --color-text-tooltip: 346, 100%, 95%, 1; /* #FFE6EC */
 
-    /* Inline Comment */
-    --color-inline-comment: 139, 35%, 86%, 1; /* #CFE8D7 */
-    --color-inline-comment-active: 139, 36%, 78%, 1; /* #B3DBC0 */
-
     /* Utility */
-    --color-bg-transparent: 3, 88%, 26%, 0.04; /* #7C0E08 4% */
     --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
   }
 
@@ -837,7 +813,7 @@ video {
     --color-button-floating-hover: 63, 15%, 74%, 0.06; /* #C6C7B3 6% */
 
     /* Text */
-    --color-text-default: 63, 27%, 83%, 1; /* #DFE0C9 */
+    --color-text-default: 62, 27%, 83%, 1; /* #DFE0C9 */
     --color-text-secondary: 84, 5%, 56%, 1; /* #909688 */
     --color-text-disabled: 104, 7%, 42%, 1; /* #687364 */
     --color-text-danger: 2, 99%, 68%, 1; /* #FE625D */
@@ -863,7 +839,6 @@ video {
     --color-bg-tertiary: 63, 15%, 74%, 0.12; /* #C6C7B3 12% */
     --color-bg-success: 120, 46%, 55%, 1; /* #59C259 */
     --color-bg-success-light: 120, 46%, 55%, 0.16; /* #59C259 16% */
-    --color-bg-info-light: 197, 78%, 64%, 0.16;
 
     /* Border */
     --color-border-default: 120, 8%, 30%, 1; /* #465346 */
@@ -894,12 +869,7 @@ video {
     --color-bg-tooltip: 120, 9%, 76%, 1; /* #BCC7BC */
     --color-text-tooltip: 120, 9%, 24%, 1; /* #384338 */
 
-    /* Inline Comment */
-    --color-inline-comment: 120, 47%, 20%, 1; /* #1B4B1B */
-    --color-inline-comment-active: 120, 47%, 28%, 1; /* #266826 */
-
     /* Utility */
-    --color-bg-transparent: 63, 15%, 74%, 0.04; /* #C6C7B3 4% */
     --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
   }
   * {
@@ -1137,10 +1107,6 @@ video {
     background-color: hsl(var(--color-bg-success-light));
   }
 
-  .color-bg-info-light {
-    background-color: hsl(var(--color-bg-info-light));
-  }
-
   .color-bg-success {
     background-color: hsl(var(--color-bg-success));
   }
@@ -1161,10 +1127,6 @@ video {
     color: hsl(var(--color-text-tooltip));
   }
 
-  .color-bg-transparent {
-    background-color: hsl(var(--color-bg-transparent));
-  }
-
   .color-button-default {
     background-color: hsl(var(--color-button-default));
     border-color: hsl(var(--color-button-default));
@@ -1235,18 +1197,6 @@ video {
     border-color: hsl(var(--color-border-focused));
   }
 
-  .color-border-warning {
-    border-color: hsl(var(--color-border-warning));
-  }
-
-  .color-border-success {
-    border-color: hsl(var(--color-border-success));
-  }
-
-  .color-border-info {
-    border-color: hsl(var(--color-border-info));
-  }
-
   .color-border-danger {
     border-color: hsl(var(--color-border-danger));
   }
@@ -1676,9 +1626,6 @@ video {
 .h-14 {
   height: 3.5rem;
 }
-.h-2 {
-  height: 0.5rem;
-}
 .h-3 {
   height: 0.75rem;
 }
@@ -1843,9 +1790,6 @@ video {
 .w-16 {
   width: 4rem;
 }
-.w-2 {
-  width: 0.5rem;
-}
 .w-20 {
   width: 5rem;
 }
@@ -1873,9 +1817,6 @@ video {
 .w-52 {
   width: 13rem;
 }
-.w-56 {
-  width: 14rem;
-}
 .w-6 {
   width: 1.5rem;
 }
@@ -2580,9 +2521,6 @@ video {
 .bg-none {
   background-image: none;
 }
-.fill-current {
-  fill: currentColor;
-}
 .stroke-\[hsl\(var\(--color-bg-default\)\)\] {
   stroke: hsl(var(--color-bg-default));
 }
@@ -2741,15 +2679,9 @@ video {
 .pl-6 {
   padding-left: 1.5rem;
 }
-.pl-8 {
-  padding-left: 2rem;
-}
 .pr-10 {
   padding-right: 2.5rem;
 }
-.pr-2 {
-  padding-right: 0.5rem;
-}
 .pr-3 {
   padding-right: 0.75rem;
 }
@@ -3420,9 +3352,6 @@ textarea:is(:-webkit-autofill, :autofill) {
 .data-\[disabled\]\:color-text-disabled[data-disabled] {
     color: hsl(var(--color-text-disabled));
   }
-.data-\[highlighted\]\:color-bg-default-hover[data-highlighted] {
-    background-color: hsl(var(--color-bg-default-hover));
-  }
 .data-\[state\=unchecked\]\:color-bg-default-hover[data-state="unchecked"] {
     background-color: hsl(var(--color-bg-default-hover));
   }

package/dist/index.es.d.ts

@@ -7,7 +7,6 @@ import { default as default_2 } from 'react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { DialogProps } from '@radix-ui/react-dialog';
 import { Drawer as Drawer_2 } from 'vaul';
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { EmojiClickData } from 'emoji-picker-react';
 import { default as EmojiPicker } from 'emoji-picker-react';
 import { EmojiStyle } from 'emoji-picker-react';
@@ -350,177 +349,6 @@ export declare const DrawerTitle: React_2.ForwardRefExoticComponent<Omit<DialogP
 
 export declare const DrawerTrigger: React_2.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React_2.RefAttributes<HTMLButtonElement>>;
 
-/**
- * `DropdownMenu` — a menu of actions or options shown when a button is
- * activated. Built on Radix UI's DropdownMenu primitive and styled with the
- * Fileverse design system.
- *
- * Composition-first: import the parts you need and assemble them. Every part
- * forwards its `ref` and spreads props onto the underlying Radix primitive, so
- * any Radix prop works without extra wiring.
- *
- * Parts: {@link DropdownMenuTrigger}, {@link DropdownMenuContent},
- * {@link DropdownMenuItem}, {@link DropdownMenuCheckboxItem},
- * {@link DropdownMenuRadioGroup}/{@link DropdownMenuRadioItem},
- * {@link DropdownMenuLabel}, {@link DropdownMenuSeparator},
- * {@link DropdownMenuShortcut}, {@link DropdownMenuGroup},
- * {@link DropdownMenuSub}/{@link DropdownMenuSubTrigger}/{@link DropdownMenuSubContent},
- * {@link DropdownMenuPortal}, {@link DropdownMenuArrow}.
- *
- * @example Basic menu
- * ```tsx
- * <DropdownMenu>
- *   <DropdownMenuTrigger asChild>
- *     <Button>Open</Button>
- *   </DropdownMenuTrigger>
- *   <DropdownMenuContent align="start">
- *     <DropdownMenuLabel>My Account</DropdownMenuLabel>
- *     <DropdownMenuSeparator />
- *     <DropdownMenuItem>
- *       Profile <DropdownMenuShortcut>⇧⌘P</DropdownMenuShortcut>
- *     </DropdownMenuItem>
- *     <DropdownMenuItem disabled>Log out</DropdownMenuItem>
- *   </DropdownMenuContent>
- * </DropdownMenu>
- * ```
- *
- * @example Checkbox items, a radio group, and a nested sub-menu
- * ```tsx
- * <DropdownMenuContent>
- *   <DropdownMenuCheckboxItem checked={show} onCheckedChange={setShow}>
- *     Show panel
- *   </DropdownMenuCheckboxItem>
- *   <DropdownMenuRadioGroup value={pos} onValueChange={setPos}>
- *     <DropdownMenuRadioItem value="top">Top</DropdownMenuRadioItem>
- *     <DropdownMenuRadioItem value="bottom">Bottom</DropdownMenuRadioItem>
- *   </DropdownMenuRadioGroup>
- *   <DropdownMenuSub>
- *     <DropdownMenuSubTrigger>More</DropdownMenuSubTrigger>
- *     <DropdownMenuSubContent>
- *       <DropdownMenuItem>Email</DropdownMenuItem>
- *     </DropdownMenuSubContent>
- *   </DropdownMenuSub>
- * </DropdownMenuContent>
- * ```
- *
- * @see Storybook — https://fileverse-ui.vercel.app/?path=/docs/components-dropdownmenu--docs
- * @see Radix primitive — https://www.radix-ui.com/primitives/docs/components/dropdown-menu
- *
- * @remarks
- * The root. Manages open state and must wrap the trigger and content. Pass
- * `open` / `onOpenChange` to control it, or `defaultOpen` for the uncontrolled
- * case.
- */
-export declare const DropdownMenu: React_2.FC<DropdownMenuPrimitive.DropdownMenuProps>;
-
-/**
- * Optional arrow pointing at the trigger. Not rendered by default — drop it
- * inside {@link DropdownMenuContent} to opt in.
- */
-export declare const DropdownMenuArrow: React_2.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuArrowProps & React_2.RefAttributes<SVGSVGElement>>;
-
-/**
- * A toggleable item with a check indicator. Controlled via `checked` /
- * `onCheckedChange`; `checked` also accepts `"indeterminate"`.
- */
-export declare const DropdownMenuCheckboxItem: React_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * Floating panel that holds the menu's items. Portaled automatically.
- * Position it with `side` / `align` / `sideOffset` (defaults to `4`).
- */
-export declare const DropdownMenuContent: React_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * Groups related {@link DropdownMenuItem}s for semantics/accessibility. Pair
- * with a {@link DropdownMenuLabel} to title the group.
- */
-export declare const DropdownMenuGroup: React_2.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * A selectable action. Wire up `onSelect`, set `disabled`, or use `inset` to
- * align its label with sibling checkbox/radio items.
- */
-export declare const DropdownMenuItem: React_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & {
-    inset?: boolean;
-} & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * Non-interactive heading for a section of items. Use `inset` to align it with
- * sibling checkbox/radio items.
- */
-export declare const DropdownMenuLabel: React_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & {
-    inset?: boolean;
-} & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * Renders menu content into a portal. {@link DropdownMenuContent} already
- * portals its children, so reach for this only when you need to control the
- * portal container yourself.
- */
-export declare const DropdownMenuPortal: React_2.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
-
-/**
- * Wraps {@link DropdownMenuRadioItem}s so only one can be selected at a time.
- * Controlled via `value` / `onValueChange`.
- */
-export declare const DropdownMenuRadioGroup: React_2.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * A single-choice item with a dot indicator. Must live inside a
- * {@link DropdownMenuRadioGroup}; identified by its `value`.
- */
-export declare const DropdownMenuRadioItem: React_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
-
-/** Thin horizontal divider between groups of items. */
-export declare const DropdownMenuSeparator: React_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * Right-aligned, muted hint for a keyboard shortcut. Purely presentational —
- * render it as the trailing child of a {@link DropdownMenuItem}. It does not
- * register the shortcut.
- *
- * @example
- * ```tsx
- * <DropdownMenuItem>Save <DropdownMenuShortcut>⌘S</DropdownMenuShortcut></DropdownMenuItem>
- * ```
- */
-export declare const DropdownMenuShortcut: {
-    ({ className, ...props }: React_2.HTMLAttributes<HTMLSpanElement>): JSX_2.Element;
-    displayName: string;
-};
-
-/**
- * Wraps a {@link DropdownMenuSubTrigger} and a {@link DropdownMenuSubContent}
- * to create a nested sub-menu.
- */
-export declare const DropdownMenuSub: React_2.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
-
-/** Floating panel that holds a sub-menu's items. Belongs inside {@link DropdownMenuSub}. */
-export declare const DropdownMenuSubContent: React_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * Trigger row inside {@link DropdownMenuContent} that opens a nested sub-menu.
- * Shows a trailing chevron. Set `inset` to align its label with sibling
- * checkbox/radio items.
- */
-export declare const DropdownMenuSubTrigger: React_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & {
-    inset?: boolean;
-} & React_2.RefAttributes<HTMLDivElement>>;
-
-/**
- * Button that opens the menu. Use `asChild` to render your own element (e.g.
- * `Button` / `IconButton`) as the trigger instead of the default `<button>`.
- *
- * @example
- * ```tsx
- * <DropdownMenuTrigger asChild>
- *   <Button>Open</Button>
- * </DropdownMenuTrigger>
- * ```
- */
-export declare const DropdownMenuTrigger: React_2.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React_2.RefAttributes<HTMLButtonElement>>;
-
 export declare const DynamicAlert: ({ title, description, variant, icon, className, iconClassName, ...props }: DynamicAlertProps) => JSX_2.Element;
 
 export declare interface DynamicAlertProps {
@@ -1198,7 +1026,6 @@ export declare const Tooltip: React_2.ForwardRefExoticComponent<TooltipProps & R
 export declare interface TooltipProps extends React_2.HTMLAttributes<HTMLElement>, VariantProps<typeof tooltipVariants> {
     text: string | React_2.ReactNode;
     sideOffset?: number;
-    asTriggerChild?: boolean;
     open?: boolean;
 }