@plexui/vue 0.3.0 → 0.5.0

package/dist/types/components/Select/Select.d.ts

@@ -157,15 +157,12 @@ declare const SelectComponent: import("vue").DefineComponent<import("vue").Extra
         type: BooleanConstructor;
         default: boolean;
     };
-    /** Width of the menu. @default "auto" */
+    /** Width of the menu. @default the trigger width (fits the options when not block) */
     listWidth: PropType<ListSize>;
-    /** `min-width` of the menu, in pixels. @default the trigger width (300 when not block) */
+    /** `min-width` of the menu, in pixels. @default the trigger width */
     listMinWidth: PropType<ListSize>;
-    /** `max-width` of the menu, in pixels. @default "auto" */
-    listMaxWidth: {
-        type: PropType<ListSize>;
-        default: string;
-    };
+    /** `max-width` of the menu, in pixels. @default "auto" (300 when not block) */
+    listMaxWidth: PropType<ListSize>;
     /** Predicate used to filter searches */
     searchPredicate: PropType<SearchPredicate<Option>>;
     /** Placeholder of the search input */
@@ -309,15 +306,12 @@ declare const SelectComponent: import("vue").DefineComponent<import("vue").Extra
         type: BooleanConstructor;
         default: boolean;
     };
-    /** Width of the menu. @default "auto" */
+    /** Width of the menu. @default the trigger width (fits the options when not block) */
     listWidth: PropType<ListSize>;
-    /** `min-width` of the menu, in pixels. @default the trigger width (300 when not block) */
+    /** `min-width` of the menu, in pixels. @default the trigger width */
     listMinWidth: PropType<ListSize>;
-    /** `max-width` of the menu, in pixels. @default "auto" */
-    listMaxWidth: {
-        type: PropType<ListSize>;
-        default: string;
-    };
+    /** `max-width` of the menu, in pixels. @default "auto" (300 when not block) */
+    listMaxWidth: PropType<ListSize>;
     /** Predicate used to filter searches */
     searchPredicate: PropType<SearchPredicate<Option>>;
     /** Placeholder of the search input */
@@ -370,7 +364,6 @@ declare const SelectComponent: import("vue").DefineComponent<import("vue").Extra
     dropdownIconType: DropdownIconType;
     loadingPlaceholder: string;
     allSelectedLabel: string;
-    listMaxWidth: ListSize;
     searchPlaceholder: string;
     searchAriaLabel: string;
     searchEmptyMessage: string | number | VNode<import("vue").RendererNode, import("vue").RendererElement, {

package/dist/types/components/Sidebar/Sidebar.d.ts

@@ -1,8 +1,8 @@
 import { type AnchorHTMLAttributes, type ButtonHTMLAttributes, type DefineComponent, type HTMLAttributes, type LiHTMLAttributes, type PropType, type VNode } from "vue";
 import { Input, type InputProps } from "../Input/index.js";
-import { SidebarProvider, useSidebar, type SidebarCollapsible, type SidebarSide, type SidebarVariant } from "./useSidebarContext.js";
+import { SidebarProvider, useSidebar, type SidebarCollapsible, type SidebarSide, type SidebarProviderVariant, type SidebarVariant } from "./useSidebarContext.js";
 export { SidebarProvider, useSidebar };
-export type { SidebarCollapsible, SidebarSide, SidebarVariant };
+export type { SidebarCollapsible, SidebarProviderVariant, SidebarSide, SidebarVariant };
 type Part<A> = DefineComponent & {
     new (): {
         $props: A;

package/dist/types/components/Sidebar/index.d.ts

@@ -1,4 +1,4 @@
 export { Sidebar, SidebarCard, SidebarCardContent, SidebarCardFooter, SidebarCardHeader, SidebarCardTitle, SidebarCardTitleLink, SidebarContent, SidebarFooter, SidebarFooterLinks, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarLayout, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuButtonIcon, SidebarMenuButtonLabel, SidebarMenuChevron, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarMobile, SidebarMobileFooter, SidebarMobileHeader, SidebarMobileMenuButton, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar, } from "./Sidebar.js";
-export type { SidebarCardContentProps, SidebarCardFooterProps, SidebarCardHeaderProps, SidebarCardProps, SidebarCardTitleLinkProps, SidebarCardTitleProps, SidebarCollapsible, SidebarContentProps, SidebarFooterLinksProps, SidebarFooterProps, SidebarGroupActionProps, SidebarGroupContentProps, SidebarGroupLabelProps, SidebarGroupProps, SidebarHeaderProps, SidebarInputProps, SidebarInsetProps, SidebarLayoutProps, SidebarMenuActionProps, SidebarMenuBadgeProps, SidebarMenuButtonIconProps, SidebarMenuButtonLabelProps, SidebarMenuButtonProps, SidebarMenuChevronProps, SidebarMenuItemProps, SidebarMenuProps, SidebarMenuSkeletonProps, SidebarMenuSubButtonProps, SidebarMenuSubItemProps, SidebarMenuSubProps, SidebarMobileFooterProps, SidebarMobileHeaderProps, SidebarMobileMenuButtonProps, SidebarMobileProps, SidebarProps, SidebarRailProps, SidebarSeparatorProps, SidebarSide, SidebarTriggerProps, SidebarVariant, } from "./Sidebar.js";
+export type { SidebarCardContentProps, SidebarCardFooterProps, SidebarCardHeaderProps, SidebarCardProps, SidebarCardTitleLinkProps, SidebarCardTitleProps, SidebarCollapsible, SidebarContentProps, SidebarFooterLinksProps, SidebarFooterProps, SidebarGroupActionProps, SidebarGroupContentProps, SidebarGroupLabelProps, SidebarGroupProps, SidebarHeaderProps, SidebarInputProps, SidebarInsetProps, SidebarLayoutProps, SidebarMenuActionProps, SidebarMenuBadgeProps, SidebarMenuButtonIconProps, SidebarMenuButtonLabelProps, SidebarMenuButtonProps, SidebarMenuChevronProps, SidebarMenuItemProps, SidebarMenuProps, SidebarMenuSkeletonProps, SidebarMenuSubButtonProps, SidebarMenuSubItemProps, SidebarMenuSubProps, SidebarMobileFooterProps, SidebarMobileHeaderProps, SidebarMobileMenuButtonProps, SidebarMobileProps, SidebarProps, SidebarRailProps, SidebarSeparatorProps, SidebarSide, SidebarTriggerProps, SidebarProviderVariant, SidebarVariant, } from "./Sidebar.js";
 export type { SidebarContextValue, SidebarProviderProps, SidebarState } from "./useSidebarContext.js";
 export { SIDEBAR_CONSTANTS } from "./useSidebarContext.js";

package/dist/types/components/Sidebar/useSidebarContext.d.ts

@@ -3,6 +3,7 @@ export type SidebarState = "expanded" | "collapsed";
 export type SidebarCollapsible = "offcanvas" | "icon" | "none";
 export type SidebarSide = "left" | "right";
 export type SidebarVariant = "sidebar" | "docs";
+export type SidebarProviderVariant = "sidebar" | "app";
 export type SidebarContextValue = {
     state: SidebarState;
     open: boolean;
@@ -36,6 +37,11 @@ declare const SidebarProviderComponent: import("vue").DefineComponent<import("vu
         type: PropType<SidebarCollapsible>;
         default: string;
     };
+    /** "app" is the shell of a product: a quiet rail, pill rows and on a phone a drawer under the page. @default "sidebar" */
+    variant: {
+        type: PropType<SidebarProviderVariant>;
+        default: string;
+    };
 }>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -57,12 +63,18 @@ declare const SidebarProviderComponent: import("vue").DefineComponent<import("vu
         type: PropType<SidebarCollapsible>;
         default: string;
     };
+    /** "app" is the shell of a product: a quiet rail, pill rows and on a phone a drawer under the page. @default "sidebar" */
+    variant: {
+        type: PropType<SidebarProviderVariant>;
+        default: string;
+    };
 }>> & Readonly<{
     "onUpdate:open"?: ((_open: boolean) => any) | undefined;
 }>, {
     collapsible: SidebarCollapsible;
     open: boolean;
     defaultOpen: boolean;
+    variant: SidebarProviderVariant;
 }, SlotsType<{
     default?: (context: SidebarContextValue) => unknown;
 }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -80,6 +92,7 @@ export declare const SidebarProvider: typeof SidebarProviderComponent & {
 };
 export declare const SIDEBAR_CONSTANTS: {
     readonly WIDTH: "240px";
+    readonly WIDTH_APP: "260px";
     readonly WIDTH_MOBILE: "288px";
     readonly WIDTH_ICON: "64px";
     readonly KEYBOARD_SHORTCUT: "b";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plexui/vue",
-  "version": "0.3.0",
+  "version": "0.5.0",
   "description": "Plex UI components for Vue 3, built on Reka UI and the shared @plexui/styles CSS",
   "type": "module",
   "license": "MIT",