@iris-ui-kit/vue 0.1.0 → 0.2.0

package/dist/admin.d.cts

@@ -1,9 +1,12 @@
 import * as vue from 'vue';
 import { PropType, VNode, ComputedRef, MaybeRefOrGetter } from 'vue';
-import { NavNode, TabsNav, TabItem } from '@iris-ui-kit/core';
-export { NavNode, TabItem, TabsNav, TabsNavConfig, TabsNavState, createTabsNav, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, visibleNav } from '@iris-ui-kit/core';
+import { NavNode, TabsNav, TabItem, AdminPreferencesState, AdminPreferences } from '@iris-ui-kit/core';
+export { AdminPreferences, AdminPreferencesState, NavNode, TabItem, TabsNav, TabsNavConfig, TabsNavState, createAdminPreferences, createTabsNav, filterNavByAccess, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, localStorageAdminPreferencesStorage, nodeAllowsRoles, visibleNav } from '@iris-ui-kit/core';
 
-type IrisAdminLayoutMode = 'sidebar' | 'full-content';
+type IrisAdminLayoutMode = 'sidebar' | 'horizontal' | 'full-content';
+type IrisAdminMenuAlign = 'start' | 'center' | 'end';
+type IrisAdminContentWidth = 'fluid' | 'centered';
+type IrisAdminContentHeight = 'auto' | 'viewport';
 /**
  * The CMS / admin shell — a Vben-style, router-agnostic, data-driven layout that
  * composes IrisSidebarLayout + IrisHeaderLayout with the admin nav pieces. One
@@ -27,6 +30,11 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
         type: StringConstructor;
         default: undefined;
     };
+    /** Initial active page key when `activeKey` is uncontrolled. */
+    defaultActiveKey: {
+        type: StringConstructor;
+        default: undefined;
+    };
     /** Sidebar collapsed (v-model:collapsed); undefined = uncontrolled. */
     collapsed: {
         type: PropType<boolean | undefined>;
@@ -50,10 +58,34 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
         type: PropType<TabsNav>;
         default: undefined;
     };
+    showTabs: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showBreadcrumb: {
         type: BooleanConstructor;
         default: boolean;
     };
+    stickyHeader: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    stickyTabs: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    menuAlign: {
+        type: PropType<IrisAdminMenuAlign>;
+        default: string;
+    };
+    contentWidth: {
+        type: PropType<IrisAdminContentWidth>;
+        default: string;
+    };
+    contentHeight: {
+        type: PropType<IrisAdminContentHeight>;
+        default: string;
+    };
     sidebarWidth: {
         type: PropType<number | string>;
         default: number;
@@ -79,6 +111,11 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
         type: StringConstructor;
         default: undefined;
     };
+    /** Initial active page key when `activeKey` is uncontrolled. */
+    defaultActiveKey: {
+        type: StringConstructor;
+        default: undefined;
+    };
     /** Sidebar collapsed (v-model:collapsed); undefined = uncontrolled. */
     collapsed: {
         type: PropType<boolean | undefined>;
@@ -102,10 +139,34 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
         type: PropType<TabsNav>;
         default: undefined;
     };
+    showTabs: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showBreadcrumb: {
         type: BooleanConstructor;
         default: boolean;
     };
+    stickyHeader: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    stickyTabs: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    menuAlign: {
+        type: PropType<IrisAdminMenuAlign>;
+        default: string;
+    };
+    contentWidth: {
+        type: PropType<IrisAdminContentWidth>;
+        default: string;
+    };
+    contentHeight: {
+        type: PropType<IrisAdminContentHeight>;
+        default: string;
+    };
     sidebarWidth: {
         type: PropType<number | string>;
         default: number;
@@ -125,10 +186,19 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
     collapsedWidth: string | number;
     activeKey: string;
     tabs: TabsNav;
+    defaultActiveKey: string;
     appTitle: string;
+    showTabs: boolean;
     showBreadcrumb: boolean;
+    stickyHeader: boolean;
+    stickyTabs: boolean;
+    menuAlign: IrisAdminMenuAlign;
+    contentWidth: IrisAdminContentWidth;
+    contentHeight: IrisAdminContentHeight;
     sidebarWidth: string | number;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+/** Public input/event surface inferred from the runtime Vue component. */
+type IrisAdminLayoutProps = InstanceType<typeof IrisAdminLayout>['$props'];
 
 /**
  * Data-driven nested navigation menu — the sidebar nav of the admin shell.
@@ -166,6 +236,10 @@ declare const IrisNavMenu: vue.DefineComponent<vue.ExtractPropTypes<{
         type: BooleanConstructor;
         default: boolean;
     };
+    orientation: {
+        type: PropType<"vertical" | "horizontal">;
+        default: string;
+    };
     ariaLabel: {
         type: StringConstructor;
         default: undefined;
@@ -201,6 +275,10 @@ declare const IrisNavMenu: vue.DefineComponent<vue.ExtractPropTypes<{
         type: BooleanConstructor;
         default: boolean;
     };
+    orientation: {
+        type: PropType<"vertical" | "horizontal">;
+        default: string;
+    };
     ariaLabel: {
         type: StringConstructor;
         default: undefined;
@@ -213,6 +291,7 @@ declare const IrisNavMenu: vue.DefineComponent<vue.ExtractPropTypes<{
     activeKey: string;
     expandedKeys: string[];
     defaultExpandedKeys: string[];
+    orientation: "vertical" | "horizontal";
     ariaLabel: string;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
@@ -291,23 +370,35 @@ declare const IrisAdminTabs: vue.DefineComponent<vue.ExtractPropTypes<{
         type: PropType<TabsNav>;
         required: true;
     };
+    reorderable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
     change: (_key: string) => true;
     close: (_key: string) => true;
     refresh: (_key: string) => true;
+    reorder: (_tabs: TabItem[]) => true;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /** Shared tabs store (from `createTabsNav`). */
     nav: {
         type: PropType<TabsNav>;
         required: true;
     };
+    reorderable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     onChange?: ((_key: string) => any) | undefined;
     onClose?: ((_key: string) => any) | undefined;
     onRefresh?: ((_key: string) => any) | undefined;
-}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+    onReorder?: ((_tabs: TabItem[]) => any) | undefined;
+}>, {
+    reorderable: boolean;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
 interface UseTabsNavReturn {
     tabs: ComputedRef<TabItem[]>;
@@ -323,6 +414,7 @@ interface UseTabsNavReturn {
     closeRight: TabsNav['closeRight'];
     refresh: TabsNav['refresh'];
     setPinned: TabsNav['setPinned'];
+    move: TabsNav['move'];
     cacheKey: TabsNav['cacheKey'];
 }
 /**
@@ -338,6 +430,17 @@ interface UseTabsNavReturn {
  */
 declare function useTabsNav(nav: TabsNav): UseTabsNavReturn;
 
+interface UseAdminPreferencesReturn {
+    state: ComputedRef<AdminPreferencesState>;
+    set: AdminPreferences['set'];
+    patch: AdminPreferences['patch'];
+    reset: AdminPreferences['reset'];
+    hydrate: AdminPreferences['hydrate'];
+    flush: AdminPreferences['flush'];
+}
+/** Thin Vue bridge for the framework-agnostic admin preferences controller. */
+declare function useAdminPreferences(preferences: AdminPreferences, hydrate?: boolean): UseAdminPreferencesReturn;
+
 interface UseAdminShellConfig {
     /** Normalized nav tree driving menu + breadcrumb. */
     menus: MaybeRefOrGetter<NavNode[]>;
@@ -373,4 +476,4 @@ interface UseAdminShellReturn {
  */
 declare function useAdminShell(config: UseAdminShellConfig): UseAdminShellReturn;
 
-export { IrisAdminBreadcrumb, IrisAdminLayout, type IrisAdminLayoutMode, IrisAdminTabs, IrisNavMenu, type UseAdminShellConfig, type UseAdminShellReturn, type UseTabsNavReturn, useAdminShell, useTabsNav };
+export { IrisAdminBreadcrumb, type IrisAdminContentHeight, type IrisAdminContentWidth, IrisAdminLayout, type IrisAdminLayoutMode, type IrisAdminLayoutProps, type IrisAdminMenuAlign, IrisAdminTabs, IrisNavMenu, type UseAdminPreferencesReturn, type UseAdminShellConfig, type UseAdminShellReturn, type UseTabsNavReturn, useAdminPreferences, useAdminShell, useTabsNav };

package/dist/admin.d.ts

@@ -1,9 +1,12 @@
 import * as vue from 'vue';
 import { PropType, VNode, ComputedRef, MaybeRefOrGetter } from 'vue';
-import { NavNode, TabsNav, TabItem } from '@iris-ui-kit/core';
-export { NavNode, TabItem, TabsNav, TabsNavConfig, TabsNavState, createTabsNav, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, visibleNav } from '@iris-ui-kit/core';
+import { NavNode, TabsNav, TabItem, AdminPreferencesState, AdminPreferences } from '@iris-ui-kit/core';
+export { AdminPreferences, AdminPreferencesState, NavNode, TabItem, TabsNav, TabsNavConfig, TabsNavState, createAdminPreferences, createTabsNav, filterNavByAccess, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, localStorageAdminPreferencesStorage, nodeAllowsRoles, visibleNav } from '@iris-ui-kit/core';
 
-type IrisAdminLayoutMode = 'sidebar' | 'full-content';
+type IrisAdminLayoutMode = 'sidebar' | 'horizontal' | 'full-content';
+type IrisAdminMenuAlign = 'start' | 'center' | 'end';
+type IrisAdminContentWidth = 'fluid' | 'centered';
+type IrisAdminContentHeight = 'auto' | 'viewport';
 /**
  * The CMS / admin shell — a Vben-style, router-agnostic, data-driven layout that
  * composes IrisSidebarLayout + IrisHeaderLayout with the admin nav pieces. One
@@ -27,6 +30,11 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
         type: StringConstructor;
         default: undefined;
     };
+    /** Initial active page key when `activeKey` is uncontrolled. */
+    defaultActiveKey: {
+        type: StringConstructor;
+        default: undefined;
+    };
     /** Sidebar collapsed (v-model:collapsed); undefined = uncontrolled. */
     collapsed: {
         type: PropType<boolean | undefined>;
@@ -50,10 +58,34 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
         type: PropType<TabsNav>;
         default: undefined;
     };
+    showTabs: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showBreadcrumb: {
         type: BooleanConstructor;
         default: boolean;
     };
+    stickyHeader: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    stickyTabs: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    menuAlign: {
+        type: PropType<IrisAdminMenuAlign>;
+        default: string;
+    };
+    contentWidth: {
+        type: PropType<IrisAdminContentWidth>;
+        default: string;
+    };
+    contentHeight: {
+        type: PropType<IrisAdminContentHeight>;
+        default: string;
+    };
     sidebarWidth: {
         type: PropType<number | string>;
         default: number;
@@ -79,6 +111,11 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
         type: StringConstructor;
         default: undefined;
     };
+    /** Initial active page key when `activeKey` is uncontrolled. */
+    defaultActiveKey: {
+        type: StringConstructor;
+        default: undefined;
+    };
     /** Sidebar collapsed (v-model:collapsed); undefined = uncontrolled. */
     collapsed: {
         type: PropType<boolean | undefined>;
@@ -102,10 +139,34 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
         type: PropType<TabsNav>;
         default: undefined;
     };
+    showTabs: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showBreadcrumb: {
         type: BooleanConstructor;
         default: boolean;
     };
+    stickyHeader: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    stickyTabs: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    menuAlign: {
+        type: PropType<IrisAdminMenuAlign>;
+        default: string;
+    };
+    contentWidth: {
+        type: PropType<IrisAdminContentWidth>;
+        default: string;
+    };
+    contentHeight: {
+        type: PropType<IrisAdminContentHeight>;
+        default: string;
+    };
     sidebarWidth: {
         type: PropType<number | string>;
         default: number;
@@ -125,10 +186,19 @@ declare const IrisAdminLayout: vue.DefineComponent<vue.ExtractPropTypes<{
     collapsedWidth: string | number;
     activeKey: string;
     tabs: TabsNav;
+    defaultActiveKey: string;
     appTitle: string;
+    showTabs: boolean;
     showBreadcrumb: boolean;
+    stickyHeader: boolean;
+    stickyTabs: boolean;
+    menuAlign: IrisAdminMenuAlign;
+    contentWidth: IrisAdminContentWidth;
+    contentHeight: IrisAdminContentHeight;
     sidebarWidth: string | number;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+/** Public input/event surface inferred from the runtime Vue component. */
+type IrisAdminLayoutProps = InstanceType<typeof IrisAdminLayout>['$props'];
 
 /**
  * Data-driven nested navigation menu — the sidebar nav of the admin shell.
@@ -166,6 +236,10 @@ declare const IrisNavMenu: vue.DefineComponent<vue.ExtractPropTypes<{
         type: BooleanConstructor;
         default: boolean;
     };
+    orientation: {
+        type: PropType<"vertical" | "horizontal">;
+        default: string;
+    };
     ariaLabel: {
         type: StringConstructor;
         default: undefined;
@@ -201,6 +275,10 @@ declare const IrisNavMenu: vue.DefineComponent<vue.ExtractPropTypes<{
         type: BooleanConstructor;
         default: boolean;
     };
+    orientation: {
+        type: PropType<"vertical" | "horizontal">;
+        default: string;
+    };
     ariaLabel: {
         type: StringConstructor;
         default: undefined;
@@ -213,6 +291,7 @@ declare const IrisNavMenu: vue.DefineComponent<vue.ExtractPropTypes<{
     activeKey: string;
     expandedKeys: string[];
     defaultExpandedKeys: string[];
+    orientation: "vertical" | "horizontal";
     ariaLabel: string;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
@@ -291,23 +370,35 @@ declare const IrisAdminTabs: vue.DefineComponent<vue.ExtractPropTypes<{
         type: PropType<TabsNav>;
         required: true;
     };
+    reorderable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
     change: (_key: string) => true;
     close: (_key: string) => true;
     refresh: (_key: string) => true;
+    reorder: (_tabs: TabItem[]) => true;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /** Shared tabs store (from `createTabsNav`). */
     nav: {
         type: PropType<TabsNav>;
         required: true;
     };
+    reorderable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     onChange?: ((_key: string) => any) | undefined;
     onClose?: ((_key: string) => any) | undefined;
     onRefresh?: ((_key: string) => any) | undefined;
-}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+    onReorder?: ((_tabs: TabItem[]) => any) | undefined;
+}>, {
+    reorderable: boolean;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
 interface UseTabsNavReturn {
     tabs: ComputedRef<TabItem[]>;
@@ -323,6 +414,7 @@ interface UseTabsNavReturn {
     closeRight: TabsNav['closeRight'];
     refresh: TabsNav['refresh'];
     setPinned: TabsNav['setPinned'];
+    move: TabsNav['move'];
     cacheKey: TabsNav['cacheKey'];
 }
 /**
@@ -338,6 +430,17 @@ interface UseTabsNavReturn {
  */
 declare function useTabsNav(nav: TabsNav): UseTabsNavReturn;
 
+interface UseAdminPreferencesReturn {
+    state: ComputedRef<AdminPreferencesState>;
+    set: AdminPreferences['set'];
+    patch: AdminPreferences['patch'];
+    reset: AdminPreferences['reset'];
+    hydrate: AdminPreferences['hydrate'];
+    flush: AdminPreferences['flush'];
+}
+/** Thin Vue bridge for the framework-agnostic admin preferences controller. */
+declare function useAdminPreferences(preferences: AdminPreferences, hydrate?: boolean): UseAdminPreferencesReturn;
+
 interface UseAdminShellConfig {
     /** Normalized nav tree driving menu + breadcrumb. */
     menus: MaybeRefOrGetter<NavNode[]>;
@@ -373,4 +476,4 @@ interface UseAdminShellReturn {
  */
 declare function useAdminShell(config: UseAdminShellConfig): UseAdminShellReturn;
 
-export { IrisAdminBreadcrumb, IrisAdminLayout, type IrisAdminLayoutMode, IrisAdminTabs, IrisNavMenu, type UseAdminShellConfig, type UseAdminShellReturn, type UseTabsNavReturn, useAdminShell, useTabsNav };
+export { IrisAdminBreadcrumb, type IrisAdminContentHeight, type IrisAdminContentWidth, IrisAdminLayout, type IrisAdminLayoutMode, type IrisAdminLayoutProps, type IrisAdminMenuAlign, IrisAdminTabs, IrisNavMenu, type UseAdminPreferencesReturn, type UseAdminShellConfig, type UseAdminShellReturn, type UseTabsNavReturn, useAdminPreferences, useAdminShell, useTabsNav };

package/dist/admin.js

@@ -1,9 +1,10 @@
-export { IrisAdminBreadcrumb, IrisAdminLayout, IrisAdminTabs, IrisNavMenu, createTabsNav, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, useAdminShell, useTabsNav, visibleNav } from './chunk-FJBYAIL4.js';
+export { IrisAdminBreadcrumb, IrisAdminLayout, IrisAdminTabs, IrisNavMenu, createAdminPreferences, createTabsNav, filterNavByAccess, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, localStorageAdminPreferencesStorage, nodeAllowsRoles, useAdminPreferences, useAdminShell, useTabsNav, visibleNav } from './chunk-4V4CT3Z4.js';
 import './chunk-3FJUCHCC.js';
 import './chunk-TQB5LVOH.js';
 import './chunk-F77KIPOH.js';
 import './chunk-I6D5VXQK.js';
 import './chunk-72PZMU6R.js';
+import './chunk-W3B6E5GN.js';
 import './chunk-75GSYEJS.js';
 import './chunk-TCAXRWT6.js';
 //# sourceMappingURL=admin.js.map

package/dist/behaviors.cjs

@@ -459,6 +459,10 @@ var IrisSortable = vue.defineComponent({
       type: Boolean,
       default: false
     },
+    orientation: {
+      type: String,
+      default: "vertical"
+    },
     class: {
       type: String,
       default: void 0
@@ -577,7 +581,7 @@ var IrisSortable = vue.defineComponent({
           class: props.class,
           style: {
             display: "flex",
-            flexDirection: "column",
+            flexDirection: props.orientation === "horizontal" ? "row" : "column",
             gap: "var(--iris-gap-sm, 4px)",
             opacity: props.disabled ? 0.6 : 1,
             userSelect: activeKey.value ? "none" : void 0,