nitro-web 0.0.111 → 0.0.113

package/components/auth/auth.api.js

@@ -309,6 +309,7 @@ export async function getStore(user) {
 
 export async function signinAndGetStore(user, isDesktop, getStore) {
   if (user.loginActive === false) throw 'This user is not available.'
+  if (!getStore) throw new Error('Please provide a getStore function')
   user.desktop = isDesktop
 
   const jwt = jsonwebtoken.sign({ _id: user._id }, JWT_SECRET, { expiresIn: '30d' })

package/components/partials/element/dropdown.tsx

@@ -11,7 +11,14 @@ type DropdownProps = {
   css?: string
   /** The direction of the menu **/
   dir?: 'bottom-left'|'bottom-right'|'top-left'|'top-right'
-  options?: { label: string|React.ReactNode, onClick?: Function, isSelected?: boolean, icon?: React.ReactNode, className?: string }[]
+  options?: { 
+    label: string|React.ReactNode,
+    onClick?: Function,
+    isSelected?: boolean,
+    icon?: React.ReactNode,
+    iconLeft?: React.ReactNode,
+    className?: string 
+  }[]
   /** Whether the dropdown is hoverable **/
   isHoverable?: boolean
   /** The content to render inside the top of the dropdown **/
@@ -22,6 +29,7 @@ type DropdownProps = {
   menuToggles?: boolean
   /** The minimum width of the menu **/
   minWidth?: number | string
+  maxHeight?: number | string
   toggleCallback?: (isActive: boolean) => void
 }
 
@@ -39,6 +47,7 @@ export const Dropdown = forwardRef(function Dropdown({
   menuIsOpen, 
   menuToggles=true,
   minWidth,
+  maxHeight,
   toggleCallback,
 }: DropdownProps, ref) {
   // https://letsbuildui.dev/articles/building-a-dropdown-menu-component-with-react-hooks
@@ -156,7 +165,11 @@ export const Dropdown = forwardRef(function Dropdown({
         })
       }
       <ul
-        style={{ minWidth }}
+        style={{ 
+          minWidth: minWidth, 
+          maxHeight: maxHeight, 
+          ...(maxHeight ? { overflow: 'auto' } : {}),
+        }}
         class={
           twMerge(`${menuStyle} ${ready ? 'is-ready' : ''} absolute invisible opacity-0 select-none min-w-full z-[1] ${menuClassName||''}`)}
       >
@@ -170,6 +183,7 @@ export const Dropdown = forwardRef(function Dropdown({
                 className={twMerge(`${optionStyle} ${option.className} ${menuOptionClassName}`)}
                 onClick={(e: React.MouseEvent) => onClick(option, e)}
               >
+                { !!option.iconLeft && option.iconLeft }
                 <span class="flex-auto">{option.label}</span>
                 { !!option.icon && option.icon }
                 { option.isSelected && <CheckCircleIcon className="size-[22px] text-primary -my-1 -mx-0.5" /> }

package/components/partials/element/table.tsx

@@ -14,6 +14,7 @@ export interface TableColumn {
   /** Use if the value is different from the sortBy */
   sortByValue?: string 
   align?: 'left' | 'center' | 'right'
+  isHidden?: boolean 
 }
 
 export type TableRow = {
@@ -83,6 +84,7 @@ export function Table<T extends TableRow>({
       rowLinesMax: typeof col.rowLinesMax != 'undefined' ? col.rowLinesMax : rowLinesMax,
       sortByValue: col.sortByValue || col.value,
       align: col.align || 'left',
+      isHidden: col.isHidden ?? false,
     }))
     return cols
   }, [columnsProp])
@@ -124,7 +126,7 @@ export function Table<T extends TableRow>({
   return (
     <div 
       style={{ marginTop: -rowGap }}
-      className={twMerge('overflow-x-auto thin-scrollbar', className)}
+      className={twMerge('overflow-x-auto thin-scrollbar min-h-full', className)}
     >
       <div 
         style={{ borderSpacing: `0 ${rowGap}px` }}
@@ -139,6 +141,8 @@ export function Table<T extends TableRow>({
               const sideColorPadding = sideColor && rows.length > 0 ? sideColor.width + 5 : 0
               const pl = sideColorPadding + (j == 0 ? columnPaddingX : columnGap)
               const pr = j == columns.length - 1 ? columnPaddingX : columnGap
+
+              if(col.isHidden) return <></>
               return (
                 <div
                   key={j}
@@ -219,6 +223,8 @@ export function Table<T extends TableRow>({
                     const sideColor = j == 0 && rowSideColor ? rowSideColor(row) : undefined
                     const pl = j == 0 ? columnPaddingX : columnGap
                     const pr = j == columns.length - 1 ? columnPaddingX : columnGap
+
+                    if(col.isHidden) return <></>
                     return (
                       <div
                         key={j}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nitro-web",
-  "version": "0.0.111",
+  "version": "0.0.113",
   "repository": "github:boycce/nitro-web",
   "homepage": "https://boycce.github.io/nitro-web/",
   "description": "Nitro is a battle-tested, modular base project to turbocharge your projects, styled using Tailwind 🚀",

package/types/components/auth/auth.api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"auth.api.d.ts","sourceRoot":"","sources":["../../../components/auth/auth.api.js"],"names":[],"mappings":"AAmQA,qGAyCC;AAED;;GAKC;AAED,0FAOC;AAED;;;;iBAkDC;AAED,mDAOC;AAED,4CAYC;AAED,kFAiBC;AA5YD;;;;;;;;;;;;;;;;;;EAqBC;AAmED,0DAEC;AAkCD,mDAEC;AAnBD,iDAeC;AA9BD,2DAaC;AAuBD,sEAuBC;AAED,kEAuBC;AAED,sEAqCC;AAED,2DAwBC;AA1ND,4DA+DC"}
+{"version":3,"file":"auth.api.d.ts","sourceRoot":"","sources":["../../../components/auth/auth.api.js"],"names":[],"mappings":"AAmQA,qGAyCC;AAED;;GAKC;AAED,0FAQC;AAED;;;;iBAkDC;AAED,mDAOC;AAED,4CAYC;AAED,kFAiBC;AA7YD;;;;;;;;;;;;;;;;;;EAqBC;AAmED,0DAEC;AAkCD,mDAEC;AAnBD,iDAeC;AA9BD,2DAaC;AAuBD,sEAuBC;AAED,kEAuBC;AAED,sEAqCC;AAED,2DAwBC;AA1ND,4DA+DC"}