@noxickon/onyx 1.0.5 → 1.1.0

package/dist/layouts.d.ts

@@ -1,6 +1,5 @@
-import { AnchorHTMLAttributes } from 'react';
-import { ButtonHTMLAttributes } from 'react';
-import { HTMLAttributes } from 'react';
+import { ComponentPropsWithoutRef } from 'react';
+import { ComponentPropsWithRef } from 'react';
 import { IconProps } from '@mdi/react/dist/IconProps';
 import { JSX } from 'react/jsx-runtime';
 import { ReactNode } from 'react';
@@ -138,11 +137,11 @@ declare type ColorStyleName = keyof typeof COLOR_STYLES;
 
 export declare const OxAppLayout: ({ children, className, ...domProps }: OxAppLayoutProps) => JSX.Element;
 
-export declare interface OxAppLayoutProps extends React.HTMLAttributes<HTMLDivElement> {
+export declare interface OxAppLayoutProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
-declare interface OxHeaderProps extends Omit<HTMLAttributes<HTMLHeadElement>, 'children'> {
+declare interface OxHeaderProps extends ComponentPropsWithRef<'header'> {
     brand?: ReactNode;
     children: ReactNode;
     hasSidebar?: boolean;
@@ -175,19 +174,19 @@ export declare const OxMainContent: (({ children, className, ...domProps }: OxMa
     Body: ({ children, className, ...domProps }: OxMainContentBodyProps) => JSX.Element;
 };
 
-export declare interface OxMainContentBodyProps extends React.HTMLAttributes<HTMLDivElement> {
+export declare interface OxMainContentBodyProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
-export declare interface OxMainContentHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+export declare interface OxMainContentHeaderProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
-export declare interface OxMainContentProps extends React.HTMLAttributes<HTMLElement> {
+export declare interface OxMainContentProps extends ComponentPropsWithRef<'main'> {
     children: ReactNode;
 }
 
-declare interface OxMainContentProps_2 extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
+declare interface OxMainContentProps_2 extends ComponentPropsWithRef<'main'> {
     children: ReactNode;
     color?: ColorStyleName;
     icon?: string;
@@ -209,13 +208,13 @@ declare const OxSidebar_3: ({ children, className, ...domProps }: OxSidebarProps
 
 declare const OxSidebarBody: ({ children, className, ...domProps }: OxSidebarBodyProps) => JSX.Element;
 
-declare interface OxSidebarBodyProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+declare interface OxSidebarBodyProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
 declare const OxSidebarButton: ({ active, children, className, disabled, ...domProps }: OxSidebarButtonProps) => JSX.Element;
 
-declare interface OxSidebarButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
+declare interface OxSidebarButtonProps extends ComponentPropsWithRef<'button'> {
     active?: boolean;
     children: ReactNode;
     onClick: () => void;
@@ -223,7 +222,7 @@ declare interface OxSidebarButtonProps extends Omit<ButtonHTMLAttributes<HTMLBut
 
 declare const OxSidebarContent: ({ children, className, ...domProps }: OxSidebarContentProps) => JSX.Element;
 
-export declare interface OxSidebarContentProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface OxSidebarContentProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
@@ -239,11 +238,11 @@ declare const OxSidebarFooter: ({ children, className, ...domProps }: OxSidebarF
 
 declare const OxSidebarFooter_2: ({ children, className, ...domProps }: OxSidebarFooterProps) => JSX.Element;
 
-export declare interface OxSidebarFooterProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface OxSidebarFooterProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
-declare interface OxSidebarFooterProps_2 extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+declare interface OxSidebarFooterProps_2 extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
@@ -259,27 +258,27 @@ declare const OxSidebarGroup_3: ({ children, className, ...domProps }: OxSidebar
 
 declare const OxSidebarGroupAction: ({ children, className, ...domProps }: OxSidebarGroupActionProps) => JSX.Element;
 
-export declare interface OxSidebarGroupActionProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+export declare interface OxSidebarGroupActionProps extends ComponentPropsWithRef<'button'> {
     children: ReactNode;
 }
 
 declare const OxSidebarGroupContent: ({ children, className, ...domProps }: OxSidebarGroupContentProps) => JSX.Element;
 
-export declare interface OxSidebarGroupContentProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface OxSidebarGroupContentProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
 declare const OxSidebarGroupLabel: ({ children, className, ...domProps }: OxSidebarGroupLabelProps) => JSX.Element;
 
-export declare interface OxSidebarGroupLabelProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface OxSidebarGroupLabelProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
-export declare interface OxSidebarGroupProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface OxSidebarGroupProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
-declare interface OxSidebarGroupProps_2 extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+declare interface OxSidebarGroupProps_2 extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
     headline: string;
 }
@@ -288,11 +287,11 @@ declare const OxSidebarHeader: ({ children, className, ...domProps }: OxSidebarH
 
 declare const OxSidebarHeader_2: ({ children, className, ...domProps }: OxSidebarHeaderProps) => JSX.Element;
 
-export declare interface OxSidebarHeaderProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface OxSidebarHeaderProps extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
-declare interface OxSidebarHeaderProps_2 extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+declare interface OxSidebarHeaderProps_2 extends ComponentPropsWithRef<'div'> {
     children: ReactNode;
 }
 
@@ -302,13 +301,13 @@ declare type OxSidebarIconProps = OxIconProps;
 
 declare const OxSidebarLabel: ({ children, className, ...domProps }: OxSidebarLabelProps) => JSX.Element;
 
-declare interface OxSidebarLabelProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
+declare interface OxSidebarLabelProps extends ComponentPropsWithRef<'span'> {
     children: ReactNode;
 }
 
 declare const OxSidebarLink: ({ active, children, className, disabled, href, ...domProps }: OxSidebarLinkProps) => JSX.Element;
 
-declare interface OxSidebarLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> {
+declare interface OxSidebarLinkProps extends ComponentPropsWithRef<'a'> {
     active?: boolean;
     children: ReactNode;
     disabled?: boolean;
@@ -331,7 +330,7 @@ declare const OxSidebarMenu_2: ({ children, className, ...domProps }: OxSidebarM
 
 declare const OxSidebarMenuAction: ({ children, className, ...domProps }: OxSidebarMenuActionProps) => JSX.Element;
 
-export declare interface OxSidebarMenuActionProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+export declare interface OxSidebarMenuActionProps extends ComponentPropsWithRef<'button'> {
     children: ReactNode;
 }
 
@@ -342,12 +341,19 @@ export declare interface OxSidebarMenuBadgeProps {
     className?: string;
 }
 
-declare const OxSidebarMenuButton: ({ children, className, disabled, href, onClick, ...domProps }: OxSidebarMenuButtonProps) => JSX.Element;
+declare const OxSidebarMenuButton: (props: OxSidebarMenuButtonProps) => JSX.Element;
 
-export declare interface OxSidebarMenuButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-    children: ReactNode;
-    href?: string;
-}
+export declare type OxSidebarMenuButtonButtonProps = SidebarMenuButtonBaseProps & Omit<ComponentPropsWithRef<'button'>, keyof SidebarMenuButtonBaseProps | 'type'> & {
+    href?: never;
+    type?: 'button';
+};
+
+export declare type OxSidebarMenuButtonLinkProps = SidebarMenuButtonBaseProps & Omit<ComponentPropsWithRef<'a'>, keyof SidebarMenuButtonBaseProps | 'href'> & {
+    disabled?: boolean;
+    href: string;
+};
+
+export declare type OxSidebarMenuButtonProps = OxSidebarMenuButtonLinkProps | OxSidebarMenuButtonButtonProps;
 
 declare const OxSidebarMenuIcon: ({ className, path, placeholder }: OxSidebarMenuIconProps) => JSX.Element;
 
@@ -359,13 +365,13 @@ export declare interface OxSidebarMenuIconProps {
 
 declare const OxSidebarMenuItem: ({ children, className, defaultOpen, hasSub, ...domProps }: OxSidebarMenuItemProps) => JSX.Element;
 
-export declare interface OxSidebarMenuItemProps extends HTMLAttributes<HTMLLIElement> {
+export declare interface OxSidebarMenuItemProps extends ComponentPropsWithRef<'li'> {
     children: ReactNode;
     defaultOpen?: boolean;
     hasSub?: boolean;
 }
 
-export declare interface OxSidebarMenuProps extends HTMLAttributes<HTMLUListElement> {
+export declare interface OxSidebarMenuProps extends ComponentPropsWithRef<'ul'> {
     children: ReactNode;
 }
 
@@ -379,26 +385,26 @@ declare const OxSidebarMenuSub: ({ children, className, ...domProps }: OxSidebar
 
 declare const OxSidebarMenuSubButton: ({ children, className, href, ...domProps }: OxSidebarMenuSubButtonProps) => JSX.Element;
 
-export declare interface OxSidebarMenuSubButtonProps extends HTMLAttributes<HTMLButtonElement> {
+export declare interface OxSidebarMenuSubButtonProps extends ComponentPropsWithRef<'button'> {
     children: ReactNode;
     href?: string;
 }
 
 declare const OxSidebarMenuSubItem: ({ children, className, ...domProps }: OxSidebarMenuSubItemProps) => JSX.Element;
 
-export declare interface OxSidebarMenuSubItemProps extends HTMLAttributes<HTMLLIElement> {
+export declare interface OxSidebarMenuSubItemProps extends ComponentPropsWithRef<'li'> {
     children: ReactNode;
 }
 
-export declare interface OxSidebarMenuSubProps extends HTMLAttributes<HTMLUListElement> {
+export declare interface OxSidebarMenuSubProps extends ComponentPropsWithRef<'ul'> {
     children: ReactNode;
 }
 
-export declare interface OxSidebarProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface OxSidebarProps extends ComponentPropsWithoutRef<'aside'> {
     children: ReactNode;
 }
 
-declare interface OxSidebarProps_2 extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
+declare interface OxSidebarProps_2 extends ComponentPropsWithRef<'nav'> {
     children: ReactNode;
     desktopCollapsed?: boolean;
     hasHeader?: boolean;
@@ -425,6 +431,10 @@ export declare interface OxSidebarTriggerProps {
     onClick?: () => void;
 }
 
+declare type SidebarMenuButtonBaseProps = {
+    children: ReactNode;
+};
+
 export declare function useOxSidebar(): OxSidebarContextType;
 
 export { }

package/dist/onyx.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("./chunks/ui-CZGrB58H.js");exports.OxAccordion=x.OxAccordion;exports.OxAlert=x.OxAlert;exports.OxAvatar=x.OxAvatar;exports.OxBadge=x.OxBadge;exports.OxBreadcrumb=x.OxBreadcrumb;exports.OxButton=x.OxButton;exports.OxCalendar=x.OxCalendar;exports.OxCard=x.OxCard;exports.OxCheckbox=x.OxCheckbox;exports.OxDateInput=x.OxDateInput;exports.OxDescription=x.OxDescription;exports.OxDescriptionList=x.OxDescriptionList;exports.OxDialog=x.OxDialog;exports.OxDrawer=x.OxDrawer;exports.OxDropdown=x.OxDropdown;exports.OxError=x.OxError;exports.OxFileUpload=x.OxFileUpload;exports.OxFloating=x.OxFloating;exports.OxForm=x.OxForm;exports.OxHeading=x.OxHeading;exports.OxIcon=x.OxIcon;exports.OxJsonField=x.OxJsonField;exports.OxLabel=x.OxLabel;exports.OxLegend=x.OxLegend;exports.OxLink=x.OxLink;exports.OxNotifications=x.OxNotifications;exports.OxNumberInput=x.OxNumberInput;exports.OxOtpInput=x.OxOtpInput;exports.OxPagination=x.OxPagination;exports.OxPopover=x.OxPopover;exports.OxProgress=x.OxProgress;exports.OxRadio=x.OxRadio;exports.OxSelect=x.OxSelect;exports.OxSeparator=x.OxSeparator;exports.OxSkeleton=x.OxSkeleton;exports.OxSkeletonText=x.OxSkeletonText;exports.OxSlider=x.OxSlider;exports.OxSpinner=x.OxSpinner;exports.OxStatusDisplay=x.OxStatusDisplay;exports.OxStepper=x.OxStepper;exports.OxSwitch=x.OxSwitch;exports.OxTable=x.OxTable;exports.OxTabs=x.OxTabs;exports.OxTextInput=x.OxTextInput;exports.OxTextarea=x.OxTextarea;exports.OxTimeInput=x.OxTimeInput;exports.OxTimeline=x.OxTimeline;exports.OxToast=x.OxToast;exports.OxToastProvider=x.OxToastProvider;exports.OxToggle=x.OxToggle;exports.OxTooltip=x.OxTooltip;exports.useOxToast=x.useOxToast;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("./chunks/ui-DRRDAnVI.js");exports.OxAccordion=x.OxAccordion;exports.OxAlert=x.OxAlert;exports.OxAvatar=x.OxAvatar;exports.OxBadge=x.OxBadge;exports.OxBreadcrumb=x.OxBreadcrumb;exports.OxButton=x.OxButton;exports.OxCalendar=x.OxCalendar;exports.OxCard=x.OxCard;exports.OxCheckbox=x.OxCheckbox;exports.OxDateInput=x.OxDateInput;exports.OxDescription=x.OxDescription;exports.OxDescriptionList=x.OxDescriptionList;exports.OxDialog=x.OxDialog;exports.OxDrawer=x.OxDrawer;exports.OxDropdown=x.OxDropdown;exports.OxError=x.OxError;exports.OxFileUpload=x.OxFileUpload;exports.OxFloating=x.OxFloating;exports.OxFloatingContext=x.OxFloatingContext;exports.OxForm=x.OxForm;exports.OxHeading=x.OxHeading;exports.OxIcon=x.OxIcon;exports.OxJsonField=x.OxJsonField;exports.OxLabel=x.OxLabel;exports.OxLegend=x.OxLegend;exports.OxLink=x.OxLink;exports.OxNotifications=x.OxNotifications;exports.OxNumberInput=x.OxNumberInput;exports.OxOtpInput=x.OxOtpInput;exports.OxPagination=x.OxPagination;exports.OxPopover=x.OxPopover;exports.OxProgress=x.OxProgress;exports.OxRadio=x.OxRadio;exports.OxSelect=x.OxSelect;exports.OxSeparator=x.OxSeparator;exports.OxSkeleton=x.OxSkeleton;exports.OxSkeletonText=x.OxSkeletonText;exports.OxSlider=x.OxSlider;exports.OxSpinner=x.OxSpinner;exports.OxStatusDisplay=x.OxStatusDisplay;exports.OxStepper=x.OxStepper;exports.OxSwitch=x.OxSwitch;exports.OxTable=x.OxTable;exports.OxTabs=x.OxTabs;exports.OxTextInput=x.OxTextInput;exports.OxTextarea=x.OxTextarea;exports.OxTimeInput=x.OxTimeInput;exports.OxTimeline=x.OxTimeline;exports.OxToast=x.OxToast;exports.OxToastProvider=x.OxToastProvider;exports.OxToggle=x.OxToggle;exports.OxTooltip=x.OxTooltip;exports.useOxFloatingContext=x.useOxFloatingContext;exports.useOxToast=x.useOxToast;

package/dist/onyx.es.js

@@ -1,55 +1,57 @@
-import { O as x, a as O, b as e, c as o, d as t, e as r, f as i, g as n, I as p, L as l, V as d, h as T, o as c, i as u, j as g, W as S, J as D, k as b, K as m, X as I, l as k, m as F, Y as L, Z as P, n as v, p as w, M as A, N as B, q as C, r as f, s as h, R as N, S as y, t as E, u as H, v as J, w as R, x as U, y as j, z as q, T as z, A as G, B as K, P as M, U as Q, Q as V, C as W, F as X, D as Y, G as Z, H as _, E as $ } from "./chunks/ui-Dmzl3_Y3.js";
+import { O as x, a as O, b as e, c as t, d as o, e as r, f as i, g as n, K as l, N as p, X as d, h as T, p as g, i as u, j as c, Y as S, L as D, k as b, l as m, M as F, Z as I, m as C, n as k, _ as L, $ as P, o as v, q as w, P as A, Q as B, r as f, s as h, t as N, T as y, U as E, v as H, w as J, x as R, y as U, z as j, A as q, B as z, V as G, C as K, D as M, R as Q, W as V, S as W, E as X, H as Y, F as Z, I as _, J as $, u as aa, G as sa } from "./chunks/ui-DGkJW_Fa.js";
 export {
   x as OxAccordion,
   O as OxAlert,
   e as OxAvatar,
-  o as OxBadge,
-  t as OxBreadcrumb,
+  t as OxBadge,
+  o as OxBreadcrumb,
   r as OxButton,
   i as OxCalendar,
   n as OxCard,
-  p as OxCheckbox,
-  l as OxDateInput,
+  l as OxCheckbox,
+  p as OxDateInput,
   d as OxDescription,
   T as OxDescriptionList,
-  c as OxDialog,
+  g as OxDialog,
   u as OxDrawer,
-  g as OxDropdown,
+  c as OxDropdown,
   S as OxError,
   D as OxFileUpload,
   b as OxFloating,
-  m as OxForm,
+  m as OxFloatingContext,
+  F as OxForm,
   I as OxHeading,
-  k as OxIcon,
-  F as OxJsonField,
+  C as OxIcon,
+  k as OxJsonField,
   L as OxLabel,
   P as OxLegend,
   v as OxLink,
   w as OxNotifications,
   A as OxNumberInput,
   B as OxOtpInput,
-  C as OxPagination,
-  f as OxPopover,
-  h as OxProgress,
-  N as OxRadio,
-  y as OxSelect,
-  E as OxSeparator,
-  H as OxSkeleton,
-  J as OxSkeletonText,
-  R as OxSlider,
-  U as OxSpinner,
-  j as OxStatusDisplay,
-  q as OxStepper,
-  z as OxSwitch,
-  G as OxTable,
-  K as OxTabs,
-  M as OxTextInput,
-  Q as OxTextarea,
-  V as OxTimeInput,
-  W as OxTimeline,
-  X as OxToast,
-  Y as OxToastProvider,
-  Z as OxToggle,
-  _ as OxTooltip,
-  $ as useOxToast
+  f as OxPagination,
+  h as OxPopover,
+  N as OxProgress,
+  y as OxRadio,
+  E as OxSelect,
+  H as OxSeparator,
+  J as OxSkeleton,
+  R as OxSkeletonText,
+  U as OxSlider,
+  j as OxSpinner,
+  q as OxStatusDisplay,
+  z as OxStepper,
+  G as OxSwitch,
+  K as OxTable,
+  M as OxTabs,
+  Q as OxTextInput,
+  V as OxTextarea,
+  W as OxTimeInput,
+  X as OxTimeline,
+  Y as OxToast,
+  Z as OxToastProvider,
+  _ as OxToggle,
+  $ as OxTooltip,
+  aa as useOxFloatingContext,
+  sa as useOxToast
 };

package/dist/pages/pages.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../chunks/ui-CZGrB58H.js"),e=require("react/jsx-runtime"),m=require("@apollo/client");require("react");const p=require("../chunks/hooks-BGvU5VHk.js"),g=require("../chunks/query-CIsrxNi-.js"),h=m.gql`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../chunks/ui-DRRDAnVI.js"),s=require("react/jsx-runtime"),H=require("../chunks/hooks-UiKjBucd.js"),X=require("@apollo/client");require("react");const Y=require("../chunks/query-CIsrxNi-.js"),Z=X.gql`
   mutation Login($input: LoginInput!) {
     login(input: $input) {
       success
@@ -10,4 +10,4 @@
       }
     }
   }
-`,j=({cacheQuery:a=g.DEFAULT_GET_CURRENT_USER,className:t,mutation:u=h,onSubmit:l,subtitle:o="",title:d="noxickon",...c})=>{const s=p.useForm({initialData:{username:"",password:""},validationRules:{username:["required"],password:["required"]},operation:u,options:{update:(i,{data:n})=>{n?.login.success&&i.writeQuery({query:a,data:{me:n.login.me}})}}}),x=async i=>{i.preventDefault(),s.submit({onError:n=>{r.handleGraphQLFormErrors(n,s)},onSuccess:n=>{n.data&&n.data.login.success?l?.(n):console.error("Login failed: Invalid credentials")}})};return e.jsx("div",{className:r.cn("w-80",t),...c,children:e.jsxs("div",{className:"ox-gray-border rounded-lg bg-gray-50 p-6",children:[e.jsxs("div",{className:"mb-4 text-center",children:[e.jsx("h1",{className:"text-gray-1200 px-2 font-mono text-2xl",children:d}),o?e.jsx("p",{className:"px-2 py-1 font-mono text-xs",children:o}):null]}),e.jsxs(r.OxForm,{className:"space-y-6",onSubmit:x,children:[e.jsxs(r.OxForm.Field,{children:[e.jsx(r.OxLabel,{children:"username"}),e.jsxs(r.OxTextInput.Container,{disabled:s.isLoading,error:s.hasError("username"),required:!0,value:s.data.username,onChange:i=>s.setData("username",i),children:[e.jsx(r.OxTextInput.Icon,{path:"mdiAccount"}),e.jsx(r.OxTextInput,{autoComplete:"off",name:"username",placeholder:"Enter your username"})]})]}),e.jsxs(r.OxForm.Field,{children:[e.jsx(r.OxLabel,{children:"password"}),e.jsxs(r.OxTextInput.Container,{disabled:s.isLoading,error:s.hasError("password"),required:!0,type:"password",value:s.data.password,onChange:i=>s.setData("password",i),children:[e.jsx(r.OxTextInput.Icon,{path:"mdiLockOutline"}),e.jsx(r.OxTextInput,{autoComplete:"off",name:"password",placeholder:"Enter your password"}),e.jsx(r.OxTextInput.VisibilityButton,{})]})]}),s.hasErrors?e.jsx(r.OxError,{icon:"mdiAlertCircleOutline",children:"username or password is wrong"}):null,e.jsx(r.OxButton,{disabled:s.isLoading,fullWidth:!0,isLoading:s.isLoading,size:"sm",type:"submit",variant:"primary",children:s.isLoading?"Signing in...":"Sign In"})]})]})})};exports.OxLogin=j;
+`,ee=$=>{const e=H.compilerRuntimeExports.c(70);let l,o,a,E,v,I,S;e[0]!==$?({cacheQuery:E,className:l,mutation:v,onSubmit:o,subtitle:I,title:S,...a}=$,e[0]=$,e[1]=l,e[2]=o,e[3]=a,e[4]=E,e[5]=v,e[6]=I,e[7]=S):(l=e[1],o=e[2],a=e[3],E=e[4],v=e[5],I=e[6],S=e[7]);const B=E===void 0?Y.DEFAULT_GET_CURRENT_USER:E,M=v===void 0?Z:v,_=I===void 0?"":I,z=S===void 0?"noxickon":S;let q,T;e[8]===Symbol.for("react.memo_cache_sentinel")?(q={username:"",password:""},T={username:["required"],password:["required"]},e[8]=q,e[9]=T):(q=e[8],T=e[9]);let c;e[10]!==B?(c={update:(r,n)=>{const{data:W}=n;W?.login.success&&r.writeQuery({query:B,data:{me:W.login.me}})}},e[10]=B,e[11]=c):c=e[11];let N;e[12]!==M||e[13]!==c?(N={initialData:q,validationRules:T,operation:M,options:c},e[12]=M,e[13]=c,e[14]=N):N=e[14];const t=H.useForm(N);let C;e[15]!==t||e[16]!==o?(C=async r=>{r.preventDefault(),t.submit({onError:n=>{i.handleGraphQLFormErrors(n,t)},onSuccess:n=>{n.data&&n.data.login.success?o?.(n):console.error("Login failed: Invalid credentials")}})},e[15]=t,e[16]=o,e[17]=C):C=e[17];const P=C;let d;e[18]!==l?(d=i.cn("w-80",l),e[18]=l,e[19]=d):d=e[19];let u;e[20]!==z?(u=s.jsx("h1",{className:"px-2 font-mono text-2xl text-gray-1200",children:z}),e[20]=z,e[21]=u):u=e[21];let m;e[22]!==_?(m=_?s.jsx("p",{className:"px-2 py-1 font-mono text-xs",children:_}):null,e[22]=_,e[23]=m):m=e[23];let x;e[24]!==u||e[25]!==m?(x=s.jsxs("div",{className:"mb-4 text-center",children:[u,m]}),e[24]=u,e[25]=m,e[26]=x):x=e[26];let F;e[27]===Symbol.for("react.memo_cache_sentinel")?(F=s.jsx(i.OxLabel,{children:"username"}),e[27]=F):F=e[27];const J=t.isLoading;let p;e[28]!==t?(p=t.hasError("username"),e[28]=t,e[29]=p):p=e[29];let f;e[30]!==t?(f=r=>t.setData("username",r),e[30]=t,e[31]=f):f=e[31];let R,D;e[32]===Symbol.for("react.memo_cache_sentinel")?(R=s.jsx(i.OxTextInput.Icon,{path:"mdiAccount"}),D=s.jsx(i.OxTextInput,{autoComplete:"off",name:"username",placeholder:"Enter your username"}),e[32]=R,e[33]=D):(R=e[32],D=e[33]);let h;e[34]!==t.data.username||e[35]!==t.isLoading||e[36]!==p||e[37]!==f?(h=s.jsxs(i.OxForm.Field,{children:[F,s.jsxs(i.OxTextInput.Container,{disabled:J,error:p,required:!0,value:t.data.username,onChange:f,children:[R,D]})]}),e[34]=t.data.username,e[35]=t.isLoading,e[36]=p,e[37]=f,e[38]=h):h=e[38];let A;e[39]===Symbol.for("react.memo_cache_sentinel")?(A=s.jsx(i.OxLabel,{children:"password"}),e[39]=A):A=e[39];const K=t.isLoading;let g;e[40]!==t?(g=t.hasError("password"),e[40]=t,e[41]=g):g=e[41];let y;e[42]!==t?(y=r=>t.setData("password",r),e[42]=t,e[43]=y):y=e[43];let Q,U,k;e[44]===Symbol.for("react.memo_cache_sentinel")?(Q=s.jsx(i.OxTextInput.Icon,{path:"mdiLockOutline"}),U=s.jsx(i.OxTextInput,{autoComplete:"off",name:"password",placeholder:"Enter your password"}),k=s.jsx(i.OxTextInput.VisibilityButton,{}),e[44]=Q,e[45]=U,e[46]=k):(Q=e[44],U=e[45],k=e[46]);let b;e[47]!==t.data.password||e[48]!==t.isLoading||e[49]!==g||e[50]!==y?(b=s.jsxs(i.OxForm.Field,{children:[A,s.jsxs(i.OxTextInput.Container,{disabled:K,error:g,required:!0,type:"password",value:t.data.password,onChange:y,children:[Q,U,k]})]}),e[47]=t.data.password,e[48]=t.isLoading,e[49]=g,e[50]=y,e[51]=b):b=e[51];let L;e[52]!==t.hasErrors?(L=t.hasErrors?s.jsx(i.OxError,{icon:"mdiAlertCircleOutline",children:"username or password is wrong"}):null,e[52]=t.hasErrors,e[53]=L):L=e[53];const V=t.isLoading?"Signing in...":"Sign In";let j;e[54]!==t.isLoading||e[55]!==V?(j=s.jsx(i.OxButton,{disabled:t.isLoading,fullWidth:!0,isLoading:t.isLoading,size:"sm",type:"submit",variant:"primary",children:V}),e[54]=t.isLoading,e[55]=V,e[56]=j):j=e[56];let O;e[57]!==P||e[58]!==h||e[59]!==b||e[60]!==L||e[61]!==j?(O=s.jsxs(i.OxForm,{className:"space-y-6",onSubmit:P,children:[h,b,L,j]}),e[57]=P,e[58]=h,e[59]=b,e[60]=L,e[61]=j,e[62]=O):O=e[62];let w;e[63]!==x||e[64]!==O?(w=s.jsxs("div",{className:"ox-gray-border rounded-lg bg-gray-50 p-6",children:[x,O]}),e[63]=x,e[64]=O,e[65]=w):w=e[65];let G;return e[66]!==a||e[67]!==d||e[68]!==w?(G=s.jsx("div",{className:d,...a,children:w}),e[66]=a,e[67]=d,e[68]=w,e[69]=G):G=e[69],G};exports.OxLogin=ee;

package/dist/pages/pages.es.js

@@ -1,10 +1,10 @@
-import { _ as x, K as s, Y as d, P as i, W as f, e as L, $ as y } from "../chunks/ui-Dmzl3_Y3.js";
-import { jsx as r, jsxs as o } from "react/jsx-runtime";
-import { gql as w } from "@apollo/client";
+import { a0 as Z, R as r, M as H, Y as ee, e as te, a1 as se, _ as K } from "../chunks/ui-DGkJW_Fa.js";
+import { jsx as s, jsxs as o } from "react/jsx-runtime";
+import { d as ie, q as ae } from "../chunks/hooks-CUNBk2tZ.js";
+import { gql as re } from "@apollo/client";
 import "react";
-import { l as E } from "../chunks/hooks-B6Ov6Z0O.js";
-import { D as b } from "../chunks/query-D2S9cFBP.js";
-const O = w`
+import { D as oe } from "../chunks/query-D2S9cFBP.js";
+const le = re`
   mutation Login($input: LoginInput!) {
     login(input: $input) {
       success
@@ -16,101 +16,127 @@ const O = w`
       }
     }
   }
-`, F = ({
-  cacheQuery: l = b,
-  className: m,
-  mutation: u = O,
-  onSubmit: c,
-  subtitle: t = "",
-  title: p = "noxickon",
-  ...h
-}) => {
-  const e = E({
-    initialData: {
-      username: "",
-      password: ""
-    },
-    validationRules: {
-      username: ["required"],
-      password: ["required"]
-    },
-    operation: u,
-    options: {
-      update: (n, { data: a }) => {
-        a?.login.success && n.writeQuery({
-          query: l,
-          data: { me: a.login.me }
-        });
-      }
+`, pe = (B) => {
+  const e = ie.c(70);
+  let l, n, d, S, N, O, C;
+  e[0] !== B ? ({
+    cacheQuery: S,
+    className: l,
+    mutation: N,
+    onSubmit: n,
+    subtitle: O,
+    title: C,
+    ...d
+  } = B, e[0] = B, e[1] = l, e[2] = n, e[3] = d, e[4] = S, e[5] = N, e[6] = O, e[7] = C) : (l = e[1], n = e[2], d = e[3], S = e[4], N = e[5], O = e[6], C = e[7]);
+  const M = S === void 0 ? oe : S, z = N === void 0 ? le : N, I = O === void 0 ? "" : O, V = C === void 0 ? "noxickon" : C;
+  let q, D;
+  e[8] === Symbol.for("react.memo_cache_sentinel") ? (q = {
+    username: "",
+    password: ""
+  }, D = {
+    username: ["required"],
+    password: ["required"]
+  }, e[8] = q, e[9] = D) : (q = e[8], D = e[9]);
+  let c;
+  e[10] !== M ? (c = {
+    update: (i, a) => {
+      const {
+        data: J
+      } = a;
+      J?.login.success && i.writeQuery({
+        query: M,
+        data: {
+          me: J.login.me
+        }
+      });
     }
-  }), g = async (n) => {
-    n.preventDefault(), e.submit({
+  }, e[10] = M, e[11] = c) : c = e[11];
+  let F;
+  e[12] !== z || e[13] !== c ? (F = {
+    initialData: q,
+    validationRules: D,
+    operation: z,
+    options: c
+  }, e[12] = z, e[13] = c, e[14] = F) : F = e[14];
+  const t = ae(F);
+  let R;
+  e[15] !== t || e[16] !== n ? (R = async (i) => {
+    i.preventDefault(), t.submit({
       onError: (a) => {
-        y(a, e);
+        se(a, t);
       },
       onSuccess: (a) => {
-        a.data && a.data.login.success ? c?.(a) : console.error("Login failed: Invalid credentials");
+        a.data && a.data.login.success ? n?.(a) : console.error("Login failed: Invalid credentials");
       }
     });
-  };
-  return /* @__PURE__ */ r("div", { className: x("w-80", m), ...h, children: /* @__PURE__ */ o("div", { className: "ox-gray-border rounded-lg bg-gray-50 p-6", children: [
-    /* @__PURE__ */ o("div", { className: "mb-4 text-center", children: [
-      /* @__PURE__ */ r("h1", { className: "text-gray-1200 px-2 font-mono text-2xl", children: p }),
-      t ? /* @__PURE__ */ r("p", { className: "px-2 py-1 font-mono text-xs", children: t }) : null
-    ] }),
-    /* @__PURE__ */ o(s, { className: "space-y-6", onSubmit: g, children: [
-      /* @__PURE__ */ o(s.Field, { children: [
-        /* @__PURE__ */ r(d, { children: "username" }),
-        /* @__PURE__ */ o(
-          i.Container,
-          {
-            disabled: e.isLoading,
-            error: e.hasError("username"),
-            required: !0,
-            value: e.data.username,
-            onChange: (n) => e.setData("username", n),
-            children: [
-              /* @__PURE__ */ r(i.Icon, { path: "mdiAccount" }),
-              /* @__PURE__ */ r(i, { autoComplete: "off", name: "username", placeholder: "Enter your username" })
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ o(s.Field, { children: [
-        /* @__PURE__ */ r(d, { children: "password" }),
-        /* @__PURE__ */ o(
-          i.Container,
-          {
-            disabled: e.isLoading,
-            error: e.hasError("password"),
-            required: !0,
-            type: "password",
-            value: e.data.password,
-            onChange: (n) => e.setData("password", n),
-            children: [
-              /* @__PURE__ */ r(i.Icon, { path: "mdiLockOutline" }),
-              /* @__PURE__ */ r(i, { autoComplete: "off", name: "password", placeholder: "Enter your password" }),
-              /* @__PURE__ */ r(i.VisibilityButton, {})
-            ]
-          }
-        )
-      ] }),
-      e.hasErrors ? /* @__PURE__ */ r(f, { icon: "mdiAlertCircleOutline", children: "username or password is wrong" }) : null,
-      /* @__PURE__ */ r(
-        L,
-        {
-          disabled: e.isLoading,
-          fullWidth: !0,
-          isLoading: e.isLoading,
-          size: "sm",
-          type: "submit",
-          variant: "primary",
-          children: e.isLoading ? "Signing in..." : "Sign In"
-        }
-      )
+  }, e[15] = t, e[16] = n, e[17] = R) : R = e[17];
+  const W = R;
+  let m;
+  e[18] !== l ? (m = Z("w-80", l), e[18] = l, e[19] = m) : m = e[19];
+  let u;
+  e[20] !== V ? (u = /* @__PURE__ */ s("h1", { className: "px-2 font-mono text-2xl text-gray-1200", children: V }), e[20] = V, e[21] = u) : u = e[21];
+  let f;
+  e[22] !== I ? (f = I ? /* @__PURE__ */ s("p", { className: "px-2 py-1 font-mono text-xs", children: I }) : null, e[22] = I, e[23] = f) : f = e[23];
+  let p;
+  e[24] !== u || e[25] !== f ? (p = /* @__PURE__ */ o("div", { className: "mb-4 text-center", children: [
+    u,
+    f
+  ] }), e[24] = u, e[25] = f, e[26] = p) : p = e[26];
+  let T;
+  e[27] === Symbol.for("react.memo_cache_sentinel") ? (T = /* @__PURE__ */ s(K, { children: "username" }), e[27] = T) : T = e[27];
+  const P = t.isLoading;
+  let h;
+  e[28] !== t ? (h = t.hasError("username"), e[28] = t, e[29] = h) : h = e[29];
+  let g;
+  e[30] !== t ? (g = (i) => t.setData("username", i), e[30] = t, e[31] = g) : g = e[31];
+  let A, Q;
+  e[32] === Symbol.for("react.memo_cache_sentinel") ? (A = /* @__PURE__ */ s(r.Icon, { path: "mdiAccount" }), Q = /* @__PURE__ */ s(r, { autoComplete: "off", name: "username", placeholder: "Enter your username" }), e[32] = A, e[33] = Q) : (A = e[32], Q = e[33]);
+  let x;
+  e[34] !== t.data.username || e[35] !== t.isLoading || e[36] !== h || e[37] !== g ? (x = /* @__PURE__ */ o(H.Field, { children: [
+    T,
+    /* @__PURE__ */ o(r.Container, { disabled: P, error: h, required: !0, value: t.data.username, onChange: g, children: [
+      A,
+      Q
+    ] })
+  ] }), e[34] = t.data.username, e[35] = t.isLoading, e[36] = h, e[37] = g, e[38] = x) : x = e[38];
+  let U;
+  e[39] === Symbol.for("react.memo_cache_sentinel") ? (U = /* @__PURE__ */ s(K, { children: "password" }), e[39] = U) : U = e[39];
+  const X = t.isLoading;
+  let y;
+  e[40] !== t ? (y = t.hasError("password"), e[40] = t, e[41] = y) : y = e[41];
+  let L;
+  e[42] !== t ? (L = (i) => t.setData("password", i), e[42] = t, e[43] = L) : L = e[43];
+  let G, $, j;
+  e[44] === Symbol.for("react.memo_cache_sentinel") ? (G = /* @__PURE__ */ s(r.Icon, { path: "mdiLockOutline" }), $ = /* @__PURE__ */ s(r, { autoComplete: "off", name: "password", placeholder: "Enter your password" }), j = /* @__PURE__ */ s(r.VisibilityButton, {}), e[44] = G, e[45] = $, e[46] = j) : (G = e[44], $ = e[45], j = e[46]);
+  let b;
+  e[47] !== t.data.password || e[48] !== t.isLoading || e[49] !== y || e[50] !== L ? (b = /* @__PURE__ */ o(H.Field, { children: [
+    U,
+    /* @__PURE__ */ o(r.Container, { disabled: X, error: y, required: !0, type: "password", value: t.data.password, onChange: L, children: [
+      G,
+      $,
+      j
     ] })
-  ] }) });
+  ] }), e[47] = t.data.password, e[48] = t.isLoading, e[49] = y, e[50] = L, e[51] = b) : b = e[51];
+  let w;
+  e[52] !== t.hasErrors ? (w = t.hasErrors ? /* @__PURE__ */ s(ee, { icon: "mdiAlertCircleOutline", children: "username or password is wrong" }) : null, e[52] = t.hasErrors, e[53] = w) : w = e[53];
+  const Y = t.isLoading ? "Signing in..." : "Sign In";
+  let E;
+  e[54] !== t.isLoading || e[55] !== Y ? (E = /* @__PURE__ */ s(te, { disabled: t.isLoading, fullWidth: !0, isLoading: t.isLoading, size: "sm", type: "submit", variant: "primary", children: Y }), e[54] = t.isLoading, e[55] = Y, e[56] = E) : E = e[56];
+  let _;
+  e[57] !== W || e[58] !== x || e[59] !== b || e[60] !== w || e[61] !== E ? (_ = /* @__PURE__ */ o(H, { className: "space-y-6", onSubmit: W, children: [
+    x,
+    b,
+    w,
+    E
+  ] }), e[57] = W, e[58] = x, e[59] = b, e[60] = w, e[61] = E, e[62] = _) : _ = e[62];
+  let v;
+  e[63] !== p || e[64] !== _ ? (v = /* @__PURE__ */ o("div", { className: "ox-gray-border rounded-lg bg-gray-50 p-6", children: [
+    p,
+    _
+  ] }), e[63] = p, e[64] = _, e[65] = v) : v = e[65];
+  let k;
+  return e[66] !== d || e[67] !== m || e[68] !== v ? (k = /* @__PURE__ */ s("div", { className: m, ...d, children: v }), e[66] = d, e[67] = m, e[68] = v, e[69] = k) : k = e[69], k;
 };
 export {
-  F as OxLogin
+  pe as OxLogin
 };

package/dist/pages.d.ts

@@ -1,10 +1,10 @@
+import { ComponentPropsWithRef } from 'react';
 import { DocumentNode } from 'graphql';
-import { HTMLAttributes } from 'react';
 import { JSX } from 'react/jsx-runtime';
 
 export declare const OxLogin: ({ cacheQuery, className, mutation, onSubmit, subtitle, title, ...props }: OxLoginProps) => JSX.Element;
 
-export declare interface OxLoginProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface OxLoginProps extends ComponentPropsWithRef<'div'> {
     cacheQuery?: DocumentNode;
     mutation?: DocumentNode;
     onSubmit: (response: unknown) => void;

package/dist/routes/routes.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../chunks/ui-CZGrB58H.js");const o=require("../chunks/useAuth-DxoDe3YA.js"),s=require("../chunks/hooks-BGvU5VHk.js"),i=({children:t,onAuthenticated:u=null,onLoading:n=null})=>{const{isLoggedIn:e,loading:r}=o.useOxAuth();return r?n:e?u:t},c=({children:t,onLoading:u=null,onUnauthenticated:n=null})=>{const{isLoggedIn:e,loading:r}=o.useOxAuth();return r?u:e?t:n},d=({children:t,onLoading:u=null,onUnauthorized:n=null,roles:e=["admin"]})=>{const{loading:r,user:l}=o.useOxAuth();return r?u:!l||s.isEmpty(e)||!e.includes(l.role)?n:t};exports.OxGuestRoute=i;exports.OxProtectedRoute=c;exports.OxRoleRoute=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../chunks/ui-DRRDAnVI.js");const d=require("../chunks/useAuth-DxoDe3YA.js"),a=require("../chunks/hooks-UiKjBucd.js"),g=u=>{const{children:i,onAuthenticated:n,onLoading:t}=u,o=n===void 0?null:n,r=t===void 0?null:t,{isLoggedIn:s,loading:e}=d.useOxAuth();return e?r:s?o:i},h=u=>{const{children:i,onLoading:n,onUnauthenticated:t}=u,o=n===void 0?null:n,r=t===void 0?null:t,{isLoggedIn:s,loading:e}=d.useOxAuth();return e?o:s?i:r},O=u=>{const{children:i,onLoading:n,onUnauthorized:t,roles:o}=u,r=n===void 0?null:n,s=t===void 0?null:t,e=o===void 0?["admin"]:o,{loading:l,user:c}=d.useOxAuth();return l?r:!c||a.isEmpty(e)||!e.includes(c.role)?s:i};exports.OxGuestRoute=g;exports.OxProtectedRoute=h;exports.OxRoleRoute=O;