nitro-web 0.0.62 → 0.0.64

package/components/auth/auth.api.js

@@ -11,28 +11,31 @@ import { isArray, pick, isString, ucFirst, fullNameSplit } from 'nitro-web/util'
 let authConfig = null
 const JWT_SECRET = process.env.JWT_SECRET || 'replace_this_with_secure_env_secret'
 
-export default {
-  routes: {
-    'get     /api/store': ['store'],
-    'get     /api/signout': ['signout'],
-    'post    /api/signin': ['signin'],
-    'post    /api/signup': ['signup'],
-    'post    /api/reset-instructions': ['resetInstructions'],
-    'post    /api/reset-password': ['resetPassword'],
-    'delete  /api/account/:uid': ['isUser', 'remove'],
-  },
+export const routes = {
+  // Routes
+  'get     /api/store': [store],
+  'get     /api/signout': [signout],
+  'post    /api/signin': [signin],
+  'post    /api/signup': [signup],
+  'post    /api/reset-instructions': [resetInstructions],
+  'post    /api/reset-password': [resetPassword],
+  'post    /api/invite-instructions': [inviteInstructions],
+  'post    /api/invite-accept': [resetPassword],
+  'delete  /api/account/:uid': [remove],
+
+  // Overridable helpers
   setup: setup,
-  store: store,
-  signup: signup,
-  signin: signin,
-  signout: signout,
-  resetInstructions: resetInstructions,
-  resetPassword: resetPassword,
-  remove: remove,
+  findUserFromProvider: findUserFromProvider,
+  getStore: getStore,
+  signinAndGetStore: signinAndGetStore,
+  tokenCreate: tokenCreate,
+  tokenParse: tokenParse,
+  userCreate: userCreate,
+  validatePassword: validatePassword,
 }
 
 function setup(middleware, _config) {
-  // Setup is called automatically when the server starts
+  // routes.setup is called automatically when express starts
   // Set config values
   const configKeys = ['clientUrl', 'emailFrom', 'env', 'name', 'mailgunDomain', 'mailgunKey', 'masterPassword', 'isNotMultiTenant']
   authConfig = pick(_config, configKeys)
@@ -45,7 +48,7 @@ function setup(middleware, _config) {
       { usernameField: 'email' },
       async (email, password, next) => {
         try {
-          const user = await findUserFromProvider({ email }, password)
+          const user = await this.findUserFromProvider({ email }, password)
           next(null, user)
         } catch (err) {
           next(err.message)
@@ -62,7 +65,7 @@ function setup(middleware, _config) {
       },
       async (payload, done) => {
         try {
-          const user = await findUserFromProvider({ _id: payload._id })
+          const user = await this.findUserFromProvider({ _id: payload._id })
           if (!user) return done(null, false)
           return done(null, user)
         } catch (err) {
@@ -97,24 +100,26 @@ function setup(middleware, _config) {
 }
 
 async function store(req, res) {
-  res.json(await getStore(req.user))
+  res.json(await this.getStore(req.user))
 }
 
 async function signup(req, res) {
   try {
-    let user = await userCreate(req.body)
+    const desktop = req.query.desktop
+    let user = await this.userCreate(req.body, this.findUserFromProvider)
     sendEmail({
       config: authConfig,
       template: 'welcome',
       to: `${ucFirst(user.firstName)}<${user.email}>`,
     }).catch(console.error)
-    res.send(await signinAndGetState(user, req.query.desktop))
+    res.send(await this.signinAndGetStore(user, desktop, this.getStore))
   } catch (err) {
     res.error(err)
   }
 }
 
 function signin(req, res) {
+  const desktop = req.query.desktop
   if (!req.body.email) return res.error('email', 'The email you entered is incorrect.')
   if (!req.body.password) return res.error('password', 'The password you entered is incorrect.')
 
@@ -122,7 +127,7 @@ function signin(req, res) {
     if (err) return res.error(err)
     if (!user && info) return res.error('email', info.message)
     try {
-      const response = await signinAndGetState(user, req.query.desktop)
+      const response = await this.signinAndGetStore(user, desktop, this.getStore)
       res.send(response)
     } catch (err) {
       res.error(err)
@@ -137,7 +142,7 @@ function signout(req, res) {
 async function resetInstructions(req, res) {
   try {
     let email = (req.body.email || '').trim().toLowerCase()
-    if (!email || !isString(email)) throw { title: 'email', detail: 'The email you entered is incorrect.' }
+    if (!email) throw { title: 'email', detail: 'The email you entered is incorrect.' }
 
     let user = await db.user.findOne({ query: { email }, _privateData: true })
     if (!user) throw { title: 'email', detail: 'The email you entered is incorrect.' }
@@ -162,11 +167,13 @@ async function resetInstructions(req, res) {
 async function resetPassword(req, res) {
   try {
     const { token, password, password2 } = req.body
+    const name = req.path.includes('invite') ? 'inviteToken' : 'resetToken'
+    const desktop = req.query.desktop
     const id = tokenParse(token)
     await validatePassword(password, password2)
 
-    let user = await db.user.findOne({ query: id, blacklist: ['-resetToken'], _privateData: true })
-    if (!user || user.resetToken !== token) throw new Error('Sorry your email token is invalid or has already been used.')
+    let user = await db.user.findOne({ query: id, blacklist: ['-' + name], _privateData: true })
+    if (!user || user[name] !== token) throw new Error('Sorry your token is invalid or has already been used.')
 
     await db.user.update({
       query: user._id,
@@ -174,14 +181,53 @@ async function resetPassword(req, res) {
         password: await bcrypt.hash(password, 10),
         resetToken: '',
       },
-      blacklist: ['-resetToken', '-password'],
+      blacklist: ['-' + name, '-password'],
     })
-    res.send(await signinAndGetState({ ...user, resetToken: undefined }, req.query.desktop))
+    res.send(await this.signinAndGetStore({ ...user, [name]: undefined }, desktop, this.getStore))
   } catch (err) {
     res.error(err)
   }
 }
 
+async function inviteInstructions(req, res) {
+  try {
+    // Check if user is admin here rather than in middleware (which may not exist yet)
+    if (req.user.type != 'admin') {
+      throw new Error('You are not authorized to invite users.')
+    }
+    const inviteToken = await tokenCreate()
+    const userData = await db.user.validate({
+      ...pick(req.body, ['email', 'firstName', 'lastName']),
+      status: 'invited',
+      inviteToken: inviteToken,
+    })
+
+    // Check if user already exists
+    if (await db.user.findOne({ query: { email: userData.email } })) {
+      throw { title: 'email', detail: 'User already exists.' }
+    }
+
+    // Create user
+    const user = await db.user.insert({
+      data: userData,
+    })
+
+    // Send email
+    res.send(user)
+    sendEmail({
+      config: authConfig,
+      template: 'invite-user',
+      to: `${ucFirst(userData.firstName)}<${userData.email}>`,
+      data: {
+        token: inviteToken + (req.query.hasOwnProperty('desktop') ? '?desktop' : ''),
+      },
+    }).catch(err => console.error('sendEmail(..) mailgun error', err))
+
+  } catch (err) {
+    return res.error(err)
+  }
+}
+
 async function remove(req, res) {
   try {
     const uid = db.id(req.params.uid || 'badid')
@@ -208,7 +254,7 @@ async function remove(req, res) {
   }
 }
 
-/* ---- Auth helpers ------------------------- */
+/* ---- Overridable helpers ------------------ */
 
 export async function findUserFromProvider(query, passwordToCheck) {
   /**
@@ -260,7 +306,7 @@ export async function getStore(user) {
   }
 }
 
-export async function signinAndGetState(user, isDesktop) {
+export async function signinAndGetStore(user, isDesktop, getStore) {
   if (user.loginActive === false) throw 'This user is not available.'
   user.desktop = isDesktop
 
@@ -269,30 +315,7 @@ export async function signinAndGetState(user, isDesktop) {
   return { ...store, jwt }
 }
 
-export function tokenCreate(id) {
-  return new Promise((resolve) => {
-    crypto.randomBytes(16, (err, buff) => {
-      let hash = buff.toString('hex') // 32 chars
-      resolve(`${hash}${id || ''}:${Date.now()}`)
-    })
-  })
-}
-
-export function tokenParse(token) {
-  let split = (token  ||  '').split(':')
-  let hash = split[0].slice(0, 32)
-  let userId = split[0].slice(32)
-  let time = split[1]
-  if (!hash || !userId || !time) {
-    throw { title: 'error', detail: 'Sorry your code is invalid.' }
-  } else if (parseFloat(time) + 1000 * 60 * 60 * 24 < Date.now()) {
-    throw { title: 'error', detail: 'Sorry your code has timed out.' }
-  } else {
-    return userId
-  }
-}
-
-export async function userCreate({ name, business, email, password }) {
+export async function userCreate({ name, business, email, password, findUserFromProvider }) {
   try {
     const options = { blacklist: ['-_id'] }
     const isMultiTenant = !authConfig.isNotMultiTenant
@@ -342,6 +365,29 @@ export async function userCreate({ name, business, email, password }) {
   }
 }
 
+export function tokenCreate(id) {
+  return new Promise((resolve) => {
+    crypto.randomBytes(16, (err, buff) => {
+      let hash = buff.toString('hex') // 32 chars
+      resolve(`${hash}${id || ''}:${Date.now()}`)
+    })
+  })
+}
+
+export function tokenParse(token) {
+  let split = (token  ||  '').split(':')
+  let hash = split[0].slice(0, 32)
+  let userId = split[0].slice(32)
+  let time = split[1]
+  if (!hash || !userId || !time) {
+    throw { title: 'error', detail: 'Sorry your code is invalid.' }
+  } else if (parseFloat(time) + 1000 * 60 * 60 * 24 < Date.now()) {
+    throw { title: 'error', detail: 'Sorry your code has timed out.' }
+  } else {
+    return userId
+  }
+}
+
 export async function validatePassword(password='', password2) {
   // let hasLowerChar = password.match(/[a-z]/)
   // let hasUpperChar = password.match(/[A-Z]/)
@@ -359,4 +405,4 @@ export async function validatePassword(password='', password2) {
   } else if (typeof password2 != 'undefined' && password !== password2) {
     throw [{ title: 'password2', detail: 'Your passwords need to match.' }]
   }
-}
+}

package/components/billing/stripe.api.js

@@ -7,16 +7,14 @@ let stripe = undefined
 let stripeProducts = []
 let config = {}
 
-export default {
-  routes: {
-    'post   /api/stripe/webhook': ['stripeWebhook'],
-    'post   /api/stripe/create-billing-portal-session': ['isUser', 'billingPortalSessionCreate'],
-    'get    /api/stripe/upcoming-invoices': ['isUser', 'upcomingInvoicesFind'],
-  },
+export const routes = {
+  // Routes
+  'post   /api/stripe/webhook': [stripeWebhook],
+  'post   /api/stripe/create-billing-portal-session': [billingPortalSessionCreate],
+  'get    /api/stripe/upcoming-invoices': [upcomingInvoicesFind],
+
+  // Overridable helpers
   setup: setup,
-  stripeWebhook: stripeWebhook,
-  billingPortalSessionCreate: billingPortalSessionCreate,
-  upcomingInvoicesFind: upcomingInvoicesFind,
 }
 
 function setup(middleware, _config) {
@@ -104,7 +102,80 @@ async function upcomingInvoicesFind(req, res) {
   }
 }
 
-/* Private webhook actions */
+/* ---- Overridable helpers ------------------ */
+
+async function error(req, res, err) {
+  if (err && err.response && err.response.body) console.log(err.response.body)
+  if (util.isString(err) && err.match(/Cannot find company with id/)) {
+    res.json({ user: 'no company found' })
+  } else res.error(err)
+}
+
+export async function getProducts() {
+  /**
+   * Returns all products and caches it on the app
+   * @returns {Array} products
+   */
+  try {
+    if (stripeProducts) return stripeProducts
+    if (!config.stripeSecretKey) {
+      stripeProducts = []
+      throw new Error('Missing process.env.stripeSecretKey for retrieving products')
+    }
+
+    let products = (await stripe.products.list({ limit: 100, active: true })).data
+    let prices = (await stripe.prices.list({ limit: 100, active: true, expand: ['data.tiers'] })).data
+
+    return (stripeProducts = products.map((product) => ({
+      // remove default_price when new pricing is ready
+      ...util.pick(product, ['id', 'created', 'default_price', 'description', 'name', 'metadata']),
+      type: product.name.match(/housing/i) ? 'project' : 'subscription', // overwriting, was 'service'
+      prices: prices
+        .filter((price) => price.product == product.id)
+        .map((price) => ({
+          ...util.pick(price, ['id', 'product', 'nickname', 'recurring', 'unit_amount', 'tiers', 'tiers_mode']),
+          interval: price.recurring?.interval, // 'year', 'month', undefined
+        })),
+    })))
+  } catch (err) {
+    console.error(new Error(err)) // when stripe throws errors, the callstack is missing.
+    return []
+  }
+}
+
+async function getUserFromEvent(event) {
+  // User retreived from the event's customer. 
+  // The customer is created before the paymentIntent and subscriptionIntent is set up
+  let object = event.data.object
+  let customerId = object.object == 'customer'? object.id : object.customer
+  if (customerId) {
+    var user = await db.user.findOne({
+      query: { 'stripeCustomer.id': customerId },
+      populate: db.user.populate({}),
+      blacklist: false, // ['-company.users.inviteToken'],
+    })
+  }
+  if (!user) {
+    await db.log.insert({ data: {
+      date: Date.now(),
+      event: event.type,
+      message: `Cannot find user with id: ${customerId}.`,
+    }})
+    throw new Error(`Cannot find user with id: ${customerId}.`)
+  }
+  // populate company owner with user data (handy for _addSubscriptionBillingChange)
+  if (user.company?.users) {
+    user.company.users = user.company.users.map(o => {
+      if (o.role == 'owner' && o._id.toString() == user._id.toString()) {
+        o.firstName = user.firstName
+        o.name = user.name
+        o.email = user.email
+      }
+      return o
+    })
+  }
+  return user
+}
 
 async function webhookCustomerCreatedUpdated(req, res, event) {
   try {
@@ -169,72 +240,6 @@ async function webhookSubUpdated(req, res, event) {
   }
 }
 
-async function getUserFromEvent(event) {
-  // User retreived from the event's customer. 
-  // The customer is created before the paymentIntent and subscriptionIntent is set up
-  let object = event.data.object
-  let customerId = object.object == 'customer'? object.id : object.customer
-  if (customerId) {
-    var user = await db.user.findOne({
-      query: { 'stripeCustomer.id': customerId },
-      populate: db.user.populate({}),
-      blacklist: false, // ['-company.users.inviteToken'],
-    })
-  }
-  if (!user) {
-    await db.log.insert({ data: {
-      date: Date.now(),
-      event: event.type,
-      message: `Cannot find user with id: ${customerId}.`,
-    }})
-    throw new Error(`Cannot find user with id: ${customerId}.`)
-  }
-  // populate company owner with user data (handy for _addSubscriptionBillingChange)
-  if (user.company?.users) {
-    user.company.users = user.company.users.map(o => {
-      if (o.role == 'owner' && o._id.toString() == user._id.toString()) {
-        o.firstName = user.firstName
-        o.name = user.name
-        o.email = user.email
-      }
-      return o
-    })
-  }
-  return user
-}
-
-export async function getProducts() {
-  /**
-   * Returns all products and caches it on the app
-   * @returns {Array} products
-   */
-  try {
-    if (stripeProducts) return stripeProducts
-    if (!config.stripeSecretKey) {
-      stripeProducts = []
-      throw new Error('Missing process.env.stripeSecretKey for retrieving products')
-    }
-
-    let products = (await stripe.products.list({ limit: 100, active: true })).data
-    let prices = (await stripe.prices.list({ limit: 100, active: true, expand: ['data.tiers'] })).data
-
-    return (stripeProducts = products.map((product) => ({
-      // remove default_price when new pricing is ready
-      ...util.pick(product, ['id', 'created', 'default_price', 'description', 'name', 'metadata']),
-      type: product.name.match(/housing/i) ? 'project' : 'subscription', // overwriting, was 'service'
-      prices: prices
-        .filter((price) => price.product == product.id)
-        .map((price) => ({
-          ...util.pick(price, ['id', 'product', 'nickname', 'recurring', 'unit_amount', 'tiers', 'tiers_mode']),
-          interval: price.recurring?.interval, // 'year', 'month', undefined
-        })),
-    })))
-  } catch (err) {
-    console.error(new Error(err)) // when stripe throws errors, the callstack is missing.
-    return []
-  }
-}
-
 // async function createOrUpdateCustomer(user, paymentMethod=null) {
 //   /**
 //    * Creates or updates a stripe customer and saves it to the user
@@ -261,10 +266,3 @@ export async function getProducts() {
 //     blacklist: ['-stripeCustomer'],
 //   })
 // }
-
-async function error(req, res, err) {
-  if (err && err.response && err.response.body) console.log(err.response.body)
-  if (util.isString(err) && err.match(/Cannot find company with id/)) {
-    res.json({ user: 'no company found' })
-  } else res.error(err)
-}

package/components/partials/element/button.tsx

@@ -24,7 +24,8 @@ export function Button({
   IconLeftEnd, 
   IconRight, 
   IconRightEnd, 
-  children, 
+  children,
+  type='button',
   ...props 
 }: Button) {
   // const size = (color.match(/xs|sm|md|lg/)?.[0] || 'md') as 'xs'|'sm'|'md'|'lg'
@@ -37,7 +38,7 @@ export function Button({
   const colors = {
     'primary': 'bg-primary hover:bg-primary-hover ring-transparent text-white [&>.loader]:border-white',
     'secondary': 'bg-secondary hover:bg-secondary-hover ring-transparent text-white [&>.loader]:border-white',
-    'black': 'bg-black hover:bg-gray-700 ring-transparent text-white [&>.loader]:border-white',
+    'black': 'bg-black hover:bg-gray-800 ring-transparent text-white [&>.loader]:border-white',
     'dark': 'bg-gray-800 hover:bg-gray-700 ring-transparent text-white [&>.loader]:border-white',
     'white': 'bg-white hover:bg-gray-50 ring-gray-300 text-gray-900 [&>.loader]:border-black', // maybe change to text-foreground
     'clear': 'hover:bg-gray-50 ring-gray-300 text-foreground [&>.loader]:border-foreground !shadow-none',
@@ -62,7 +63,11 @@ export function Button({
   }
   
   return (
-    <button class={twMerge(`${base} ${sizes[size]} ${appliedColor} ${contentLayout} ${loading} nitro-button ${className||''}`)} {...props}>
+    <button
+      type={type} 
+      class={twMerge(`${base} ${sizes[size]} ${appliedColor} ${contentLayout} ${loading} nitro-button ${className||''}`)} 
+      {...props}
+    >
       {IconLeft && getIcon(IconLeft)}
       {IconLeftEnd && getIcon(IconLeftEnd)}
       <span class={`${iconPosition == 'leftEnd' || iconPosition == 'rightEnd' ? 'flex-1' : ''}`}>{children}</span>

package/components/partials/element/message.tsx

@@ -25,8 +25,8 @@ export function Message({ className }: { className?: string }) {
     'unauth': { type: 'error', text: 'You are unauthorised' },
   }
   const colorMap = {
-    'error': 'text-critical',
-    'warning': 'text-error',
+    'error': 'text-danger',
+    'warning': 'text-warning',
     'info': 'text-info',
     'success': 'text-success',
   }
@@ -70,7 +70,7 @@ export function Message({ className }: { className?: string }) {
     // Show message and hide it again after some time. Send back cleanup if store.message changes
     } else if (messageObject && now - 500 < messageObject.date) {
       const timeout1 = setTimeout(() => setVisible(true), 50)
-      if (messageObject.timeout !== 0 && !devDontHide) var timeout2 = setTimeout(hide, messageObject.timeout || 5000)
+      if (messageObject.timeout !== 0 && !devDontHide) var timeout2 = setTimeout(hide, messageObject.timeout || 5000000)
       return () => {
         clearTimeout(timeout1)
         clearTimeout(timeout2)
@@ -97,24 +97,24 @@ export function Message({ className }: { className?: string }) {
               (visible ? 'translate-x-0 opacity-100' : 'translate-x-1 opacity-0')
             }>
               <div className="p-3">
-                <div className="flex items-start">
-                  <div className="shrink-0">
-                    <CircleCheck aria-hidden="true" size={21} className={`${color} mt-0.5`} />
+                <div className="flex items-start gap-3 text-sm leading-[1.4em]">
+                  <div className="flex items-center shrink-0 min-h-[1.4em]">
+                    <CircleCheck aria-hidden="true" size={19} className={`${color}`} />
                   </div>
-                  <div className="ml-3 flex-1 pt-0.5">
-                    <p className="text-sm font-medium text-gray-900">{typeof store.message === 'object' && store.message?.text}
+                  <div className="flex flex-1 items-center min-h-[1.4em]">
+                    <p className="font-medium text-gray-900">{typeof store.message === 'object' && store.message?.text}
                     </p>
                     {/* <p className="mt-1 text-sm text-gray-500">{store.message.text}</p> */}
                   </div>
-                  <div className="ml-4 flex shrink-0">
+                  <div className="flex items-center shrink-0 min-h-[1.4em]">
                     <button
                       type="button"
                       onClick={hide}
-                      className="inline-flex  rounded-md bg-white text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 
+                      className="inline-flex rounded-md bg-white text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 
                         focus:ring-indigo-500 focus:ring-offset-2"
                     >
                       <span className="sr-only">Close</span>
-                      <X aria-hidden="true" size={19} className="mt-0.5" />
+                      <X aria-hidden="true" size={19} />
                     </button>
                   </div>
                 </div>

package/components/partials/element/modal.tsx

@@ -5,13 +5,15 @@ type ModalProps = {
   show: boolean
   setShow: (show: boolean) => void
   children: React.ReactNode
+  className?: string
+  rootClassName?: string
+  dismissable?: boolean
   maxWidth?: string
   minHeight?: string
-  dismissable?: boolean
   [key: string]: unknown
 }
 
-export function Modal({ show, setShow, children, maxWidth, minHeight, dismissable = true, ...props }: ModalProps) {
+export function Modal({ show, setShow, children, maxWidth, minHeight, dismissable = true, className, rootClassName }: ModalProps) {
   const [state, setState] = useState(show ? 'open' : 'close')
   const containerEl = useRef<HTMLDivElement>(null)
   const isFirst = IsFirstRender()
@@ -33,8 +35,7 @@ export function Modal({ show, setShow, children, maxWidth, minHeight, dismissabl
       container: 'opacity-100 scale-[1] duration-200',
     },
   }
-  const _state = states[state as keyof typeof states]
-
+  const stateObj = states[state as keyof typeof states]
 
   useEffect(() => {
     if (isFirst) return
@@ -64,15 +65,15 @@ export function Modal({ show, setShow, children, maxWidth, minHeight, dismissabl
   return (
     <div 
       onClick={(e) => e.stopPropagation()} 
-      class={`${twMerge(`fixed top-0 w-[100vw] h-[100vh] z-[100] ${_state.root} ${props.className}`)} nitro-modal`}
+      class={`${twMerge(`fixed top-0 w-[100vw] h-[100vh] z-[100] ${stateObj.root} ${rootClassName||''}`)} nitro-modal`}
     >
-      <div class={`!absolute inset-0 box-content bg-gray-500/70 transition-opacity ${_state.bg}`}></div>
-      <div class={`relative h-[100vh] overflow-y-auto transition-[opacity,transform] ${_state.container}`}>
+      <div class={`!absolute inset-0 box-content bg-gray-500/70 transition-opacity ${stateObj.bg}`}></div>
+      <div class={`relative h-[100vh] overflow-y-auto transition-[opacity,transform] ${stateObj.container}`}>
         <div class="flex items-center justify-center min-h-full" onMouseDown={onClick}> 
           <div 
             ref={containerEl} 
             style={{ maxWidth: maxWidth || '550px', minHeight: minHeight }} 
-            class={`relative w-full mx-6 mt-4 mb-8 bg-white rounded-lg shadow-lg ${props.className}`}
+            class={`relative w-full mx-6 mt-4 mb-8 bg-white rounded-lg shadow-lg p-9 ${className||''}`}
           >
             <div 
               class="absolute top-0 right-0 p-3 m-1 cursor-pointer" 

package/components/partials/form/field.tsx

@@ -133,7 +133,7 @@ function FieldContainer({ children, className, error }: { children: React.ReactN
   return (
     <div css={style} className={twMerge(`mt-2.5 mb-6 mt-input-before mb-input-after grid grid-cols-1 nitro-field ${className || ''}`)}>
       {children}
-      {error && <div class="mt-1.5 text-xs text-danger nitro-error">{error.detail}</div>}
+      {error && <div class="mt-1.5 text-xs text-danger-foreground nitro-error">{error.detail}</div>}
     </div>
   )
 }
@@ -149,7 +149,7 @@ function getInputClasses({ error, Icon, iconPos, type }: { error?: Error, Icon?:
     'placeholder:text-input-placeholder focus:outline focus:outline-2 focus:-outline-offset-2 ' +
     (iconPos == 'right' && Icon ? `${pl} ${prWithIcon} ` : (Icon ? `${plWithIcon} ${pr} ` : `${pl} ${pr} `)) +
     (error 
-      ? 'text-red-900 outline-danger focus:outline-danger ' 
+      ? 'text-danger-foreground outline-danger focus:outline-danger ' 
       : 'text-input outline-input-border focus:outline-input-border-focus ') + 
     (iconPos == 'right' ? 'justify-self-start ' : 'justify-self-end ') + 
     'nitro-input'

package/components/partials/form/form-error.tsx

@@ -18,7 +18,7 @@ export function FormError({ state, fields, className }: FormError) {
   return (
     <>
       {error ? (
-        <div class={`text-danger mt-1 text-sm nitro-error ${className||''}`}>
+        <div class={`text-danger-foreground mt-1 text-sm nitro-error ${className||''}`}>
           {error.detail}
         </div>
       ) : null}

package/components/partials/form/select.tsx

@@ -151,7 +151,7 @@ function SelectBase({ inputId, minMenuWidth, name, prefix='', onChange, options,
         // isDisabled={true}
         // maxMenuHeight={200}
       />
-      {error && <div class="mt-1.5 text-xs text-danger">{error.detail}</div>}
+      {error && <div class="mt-1.5 text-xs text-danger-foreground">{error.detail}</div>}
     </div>
   )
 }
@@ -257,7 +257,7 @@ const selectStyles = {
   // Input container objects
   input: {
     base: 'text-input',
-    error: 'text-red-900',
+    error: 'text-danger-foreground',
   },
   multiValue: 'bg-primary text-white rounded items-center pl-2 pr-1.5 gap-1.5',
   multiValueLabel: 'text-xs',
@@ -265,10 +265,10 @@ const selectStyles = {
   placeholder: 'text-input-placeholder',
   singleValue: {
     base: 'text-input',
-    error: 'text-red-900',
+    error: 'text-danger-foreground',
   },
   // Icon indicators
-  clearIndicator: 'text-gray-500 p-1 rounded-md hover:bg-red-50 hover:text-red-800',
+  clearIndicator: 'text-gray-500 p-1 rounded-md hover:bg-red-50 hover:text-danger-foreground',
   dropdownIndicator: 'p-1 hover:bg-gray-100 text-gray-500 rounded-md hover:text-black',
   indicatorsContainer: 'p-1 px-2 gap-1',
   indicatorSeparator: 'py-0.5 before:content-[""] before:block before:bg-gray-100 before:w-px before:h-full',
@@ -279,7 +279,7 @@ const selectStyles = {
   option: {
     base: 'relative px-3 py-2 !flex items-center gap-2 cursor-default',
     hover: 'bg-gray-50',
-    selected: '!bg-gray-100 text-primary-dark',
+    selected: '!bg-gray-100 text-dropdown-selected-foreground',
   },
 }
 

package/components/partials/styleguide.tsx

@@ -348,7 +348,7 @@ export function Styleguide({ className, elements, children }: StyleguideProps) {
         </div>
       </div>
 
-      <Modal show={showModal1} setShow={setShowModal1} class="p-9">
+      <Modal show={showModal1} setShow={setShowModal1}>
         <h3 class="h3">Edit Profile</h3>
         <p class="mb-5">An example modal containing a basic form for editing profiles.</p>
         <form class="mb-8 text-left">

package/components/settings/settings.api.js

@@ -1,13 +1,9 @@
 // @ts-nocheck
 import db from 'monastery'
 
-export default {
-  routes: {
-    'put  /api/company/:cid': ['isCompanyUser', 'update'],
-    'put  /api/user/:uid': ['isUser', 'updateUser'],
-  },
-  update: update,
-  updateUser: updateUser,
+export const routes = {
+  'put  /api/company/:cid': ['isCompanyUser', update],
+  'put  /api/user/:uid': ['isUser', updateUser],
 }
 
 async function update(req, res) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nitro-web",
-  "version": "0.0.62",
+  "version": "0.0.64",
   "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 🚀",
@@ -55,7 +55,7 @@
   },
   "peerDependencies": {
     "@stripe/stripe-js": "^1.34.0",
-    "monastery": "~3.5.5",
+    "monastery": "~3.5.6",
     "stripe": "^9.16.0"
   },
   "_peers-are-packages-that-will-be-used-in-the-host-repo-too": "",

package/server/email/invite-user.html

@@ -0,0 +1,23 @@
+<!-- extends references the default nitro layout file -->
+{% extends "partials/layout1.swig" %}
+
+<!-- block content is the content of the email -->
+{% block content %}
+
+  [[ subject = You've been invited to join IMG ]]
+  <b>%recipient.greet%</b>,<br/>
+  <br/>
+  You've been invited to join IMG.<br/>
+  <br/>
+  If you didn't expect to receive this email, feel free to disregard this email.<br/>
+  <br/>
+  <span mc:edit="button">
+    <a class="button" href="%recipient.domain%/invite/%recipient.token%" target="_blank">
+      Accept Invite
+    </a>
+  </span><br/>
+  <br/>
+  Thanks,<br/>
+  <b>The %recipient.configName% Team</b>
+
+{% endblock %}

package/server/index.js

@@ -18,16 +18,12 @@ export { setupRouter } from './router.js'
 // Export email utility
 export { sendEmail } from './email/index.js'
 
-// Export api default controllers
-export { 
-  default as auth, 
-  findUserFromProvider, 
-  signinAndGetState, 
-  userCreate, 
-  tokenCreate, 
-  tokenParse,
-  validatePassword,
-  getStore,
-} from '../components/auth/auth.api.js'
-export { default as settings } from '../components/settings/settings.api.js'
-export { default as stripe } from '../components/billing/stripe.api.js'
+// Export API controllers
+export * from '../components/auth/auth.api.js'
+export * from '../components/settings/settings.api.js'
+export * from '../components/billing/stripe.api.js'
+
+export { routes as authRoutes } from '../components/auth/auth.api.js'
+export { routes as settingsRoutes } from '../components/settings/settings.api.js'
+export { routes as stripeRoutes } from '../components/billing/stripe.api.js'
+

package/server/router.js

@@ -20,8 +20,9 @@ export async function setupRouter (config) {
   const expressApp = express()
   const server = http.createServer(expressApp)
   const apiRoutes = {}
-  const controllers = {}
+  const controllers = {} // { controllerName: { ...routes, ...helpers } }
   const allMiddleware = { ...defaultMiddleware, ...(middleware || {}) }
+  const verbs = ['get', 'post', 'put', 'patch', 'delete', 'options', 'head', 'all']
 
   if (!env) {
     throw new Error('setupRouter: `config.env` missing')
@@ -40,23 +41,27 @@ export async function setupRouter (config) {
   let filepaths = getFiles(componentsDir, /\.api\.js$/)
   // console.log(filepaths, componentsDir)
   for (let filepath of filepaths) {
-    let file = (await import(filepath)).default
-    let name = filepath.replace(/^.*[\\\/]|\.api\.js$/g, '') // eslint-disable-line
-    controllers[name] = file
+    const file = await import(filepath)
+    const routes = file.routes
+    const name = filepath.replace(/^.*[\\\/]|\.api\.js$/g, '') // eslint-disable-line
+    controllers[name] = routes // { ...routes, ...helpers }
 
-    if (!file) {
-      console.warn(`API warning: no default export found on file ${filepath}`)
+    if (!routes) {
+      console.warn(`API warning: no 'routes' export found on file ${filepath}`)
       continue
     }
 
-    if (file.setup) file.setup(allMiddleware, config)
-    if (file.routes) {
-      util.each(file.routes, (_middleware, key) => {
+    if (routes?.setup) routes.setup.call(routes, allMiddleware, config)
+    if (routes) {
+      util.each(routes, (_middleware, key) => {
+        if (!key.match(/\s/)) return
+        const match = key.match(new RegExp(`^(${verbs.join('|')})\\s+(.*)$`, 'i'))
+        if (!match) throw new Error(`Invalid verb or path: ${key}`)
         apiRoutes[key] = {
           middleware: util.toArray(_middleware),
           filename: name,
-          path: key.replace(/^[a-z]+\s+/, ''),
-          verb: key.match(/^[a-z]+/)? key.match(/^[a-z]+/)[0] : 'get',
+          path: match[2],
+          verb: match[1],
         }
       })
     }
@@ -265,39 +270,23 @@ function getFiles (dir, regexp) {
   return paths
 }
 
-function resolveMiddleware (controllers, middleware, route, item, last) {
+function resolveMiddleware (controllers, middleware, route, item) {
   /**
    * Resolves a placeholder string into a function
+   * @param {object} controllers - { controllerName: { routes, setup, ...other exported functions } }
+   * @param {object} middleware
    * @param {object} route
    * @param {fn|string} item
    * @param {boolean} last - last item
    * @return function(req, res){..}
    */
   if (util.isFunction(item)) {
-    return item
+    return item.bind(controllers[route.filename])
 
-  } else if (!util.isString(item)) {
-    console.error('Invalid middleware item:', item)
+  } else if (typeof item !== 'string') {
+    console.error('Invalid middleware item on route:', route.path, item)
     return
 
-  } else if (item.match(/\./) || last) { // e.g. user.read
-    let arr = item.split('.')
-    let controllerGroup = controllers[arr[1]? arr[0] : route.filename]
-    let controllerName = arr[1] || arr[0]
-    if (controllerGroup && controllerGroup[controllerName]) {
-      if (middleware.endpointSwitcher && controllerGroup[controllerName + 'Desktop']) {
-        return middleware.endpointSwitcher.bind(
-          null,
-          controllerGroup[controllerName].bind(controllerGroup),
-          controllerGroup[controllerName + 'Desktop'].bind(controllerGroup)
-        )
-      } else {
-        return controllerGroup[controllerName].bind(controllerGroup)
-      }
-    } else  {
-      console.error(`The controller '${item}' defined in '${route.filename}.api' doesn't exist.`)
-    }
-
   } else if (middleware[item]) {
     return middleware[item]
 

package/types/util.d.ts

@@ -583,13 +583,14 @@ export function s3Image(awsUrl: string, imageOrArray: Image[] | Image, size?: st
 export function sanitizeHTML(string: string): string;
 /**
  * Process scrollbar width once.
- * @param {string} paddingClass - class name to give padding to
- * @param {string} marginClass - class name to give margin to
- * @param {number} maxWidth - enclose css in a max-width media query
+ * @param {string} [paddingClass] - class name to give padding to
+ * @param {string} [marginClass] - class name to give margin to
+ * @param {number} [maxWidth] - enclose css in a max-width media query
+ * @param {string} [marginClassNegative] - class name to give negative margin to
  * @returns {number}
  *
  */
-export function scrollbar(paddingClass: string, marginClass: string, maxWidth: number): number;
+export function scrollbar(paddingClass?: string, marginClass?: string, marginClassNegative?: string, maxWidth?: number): number;
 /**
  * Convert seconds to time
  * @param {number} seconds

package/types/util.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../util.js"],"names":[],"mappings":"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"}
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../util.js"],"names":[],"mappings":"AAkBA;;GAEG;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+BC;AAED;;;GAGG;AACH,yBAFa,OAAO,OAAO,EAAE,WAAW,CAevC;AAED;;;;;GAKG;AACH,8BAJW,MAAM,cACN;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;CAAC,GACrB,MAAM,CAKlB;AAED;;;;;;GAMG;AACH,+BALW,MAAM,oBACN,OAAO,gBACP,OAAO,GACL,MAAM,CAelB;AAED;;;;;GAKG;AACH,sCAJW,MAAM,wBACN,OAAO,GACL,MAAM,CAMlB;AAED;;;;GAIG;AACH,sCAHW,MAAM,GACJ,MAAM,CAIlB;AAED;;;;GAIG;AACH,iCAHW,MAAM,GACJ,MAAM,CAIlB;AAED;;;;;;GAMG;AACH,gCALW,MAAM,aACN,MAAM,oBACN,MAAM,GACJ,MAAM,CAUlB;AAED;;;;GAIG;AACH,0CAHW,MAAM,GACJ,MAAM,CAMlB;AAED;;;;;;;;;;;GAWG;AACH,4BAVW,MAAM,GAAC,IAAI,WACX,MAAM,aACN,MAAM,GACJ,MAAM,CAsBlB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,yBAlBuC,CAAC,SAA3B,CAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAI,QAI3B,CAAC,SACD,MAAM,YACN;IACN,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GACS,CAAC,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,CAAC,GAAG;IACpD,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,KAAK,EAAE,MAAM,UAAU,CAAC,CAAC,CAAC,CAAA;CAC7B,CAuKH;AAED;;;;;GAKG;AACH,yBAJa,CAAC,OACH,CAAC,GACC,CAAC,CAgBb;AAED;;;;;GAKG;AACH,8BAJW,MAAM,GAAC,GAAG,EAAE,QACZ,MAAM,GACJ,OAAO,CAgBnB;AAED;;;;;;;GAOG;AACH,yBANa,CAAC,OACH,CAAC,QACD,MAAM,SACN,OAAO,WAAS,GACd,CAAC,CA8Bb;AAED;;;;;;GAMG;AACH,0BALW;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAC,GAAC,EAAE,GAAC,IAAI,gCAE5B,MAAM,GACJ,MAAM,GAAC,EAAE,GAAC,IAAI,CAmB1B;AAED;;;;;;;;;GASG;AACH,mCARW,MAAM,GAAC,IAAI,GAAC,IAAI,YAChB,MAAM,SACN,MAAM,QACN,MAAM,GACJ,IAAI,CA+BhB;AAED;;;;;GAKG;AACH,mCAJW,MAAM,iBACN,OAAO,GACL,MAAM,CAMlB;AAED;;;;GAIG;AACH,mCAHW,MAAM,GACJ,MAAM,CAWlB;AAED;;;;;;;;GAQG;AACH,8BAPW,MAAM,QACN;IAAE,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAAC,kBAAkB,CAAC,EAAE,OAAO,CAAA;CAAE,qBAC5G,QAAQ,cACR,MAAM,GACJ,QAAQ,CAwEpB;AAED;;;;GAIG;AACH,iCAHW;IAAC,SAAS,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAC,GACnC,MAAM,CAIlB;AAED;;;;GAIG;AACH,sCAHW,MAAM,GACJ,MAAM,EAAE,CASpB;AAED;;;;GAIG;AACH,6CAHW;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,GACjC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,EAAE,CAS5D;AAED;;;;GAIG;AACH,+CAHW;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,GACjC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,EAAE,CAS9C;AAED;;;;;GAKG;AACH,yCAJW;IAAE,MAAM,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;CAAE,GAAC,SAAS,QAC1D,MAAM,GACJ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAAC,SAAS,CAQvD;AAED;;;;;GAKG;AACH,uCAJW,MAAM,iBACN,MAAM,GACJ,MAAM,CAYlB;AAED;;;;;GAKG;AACH,qCAJW;IAAE,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,MAAM,EAAE,KAAK,MAAM,CAAA;CAAE,QACvC,MAAM,GACJ,MAAM,CAYlB;AAED;;;;GAIG;AACH,6DAHW,MAAM,GACJ,OAAO,CAAC,OAAO,mBAAmB,EAAE,MAAM,GAAC,IAAI,CAAC,CAI5D;AAED;;;;;;;;;;;GAWG;AACH,wCAHW,aAAa,GACX,UAAU,EAAE,CAgCxB;AAED;;;;;;GAMG;AACH,+BALW,GAAG,EAAE,UACL,OAAO,QACP,MAAM,GACJ,OAAO,CAcnB;AAED;;;;GAIG;AACH,kCAHW,OAAO,GACL,OAAO,CAInB;AAED;;;;GAIG;AACH,iCAHW,OAAO,GACL,OAAO,CAInB;AAED;;;;GAIG;AACH,oCAHW,OAAO,GACL,OAAO,CAInB;AAED;;;;GAIG;AACH,+BAHW,MAAM,GACJ,OAAO,CAMnB;AAED;;;;;GAKG;AACH,8BAJW;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CAAC,GAAC,IAAI,qBAC7B,OAAO,GACL,OAAO,CASnB;AAED;;;;GAIG;AACH,qCAHW,OAAO,GACL,OAAO,CAInB;AAED;;;;GAIG;AACH,+BAHW,OAAO,GACL,OAAO,CAmBnB;AAED;;;;GAIG;AACH,mCAHW,OAAO,GACL,OAAO,CAInB;AAED;;;;GAIG;AACH,mCAHW,OAAO,GACL,OAAO,CAKnB;AAED;;;;GAIG;AACH,kCAHW,OAAO,GACL,OAAO,CAInB;AAED;;;;GAIG;AACH,mCAHW,OAAO,GACL,OAAO,CAInB;AAED;;;;GAIG;AACH,gCAHW,MAAM,GACJ,MAAM,CAIlB;AAED;;;;;;GAMG;AACH,kCALW,MAAM,QACN,MAAM,iBACN,OAAO,GACL,MAAM,CAalB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,qCAxBW,MAAM,mBACN,KAAK,GAAC,GAAG,aACT,KAAK,GACH,CAAC,KAAK,EAAE,KAAK,CAAC,GAAC,IAAI,CAuC/B;AAED;;;;;;;;;GASG;AACH,qDARW;IACN,IAAI,CAAC,EAAE;QAAC,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;KAAC,CAAA;IACjE,QAAQ,CAAC,EAAE;QAAC,WAAW,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;KAAC,CAAA;CAC3C,MACO,MAAM,UACN,MAAM,OA+ChB;AAED;;;;;GAKG;AACH,6CAJW,MAAM,EAAE,UACR,MAAM,EAAE,GACP,MAAM,CAgBjB;AAED;;;;GAIG;AACH,kCAHW;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,MACtB,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,KAAK,GAAG;;EAS1C;AAED;;;;;GAKG;AACH,0BAJW;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CAAE,UAC1B,MAAM,EAAE,GACN;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CAAE,CAStC;AAED;;;;;;;;;;;;;GAaG;AACH,yBAVa,CAAC,YACH,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,oBACvC;IAAC,MAAM,EAAE;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,OAAO,CAAA;KAAC,CAAA;CAAC,GAAC,CAAC,MAAM,EAAE,WAAS,OAAO,CAAC,8BAEjE,OAAO,CAAC,CAAC,CAAC,CA2DtB;AAED;;;;;;GAMG;AACH,0BALW,MAAM,YACN,MAAM,eACN,MAAM,GACJ,MAAM,CAUlB;AAED;;;;GAIG;AACH,0BAHW;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,QACtB,MAAM,GAAC,MAAM,GAAC,MAAM,EAAE,GAAC,MAAM,EAAE;;EAiBzC;AAED;;;;;;;GAOG;AACH,0CALW,MAAM,iBACN,OAAO,GACL;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAC,IAAI,CAAA;CAAC,CA+BxC;AAED;;;;GAIG;AACH,yCAHW,MAAM,GACJ,MAAM,EAAE,CAOpB;AAED;;;;GAIG;AACH,kCAHW;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CAAC,GACtB,MAAM,CAclB;AAED;;;;;;;;;;;GAWG;AACH,+BAVW,MAAM,SACN;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,UACtB;IAAC,cAAc,CAAC,WAAU;CAAC,cAC3B,CAAC,OAAO,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC,GACjC,OAAO,CAAC,GAAG,CAAC,CAyDxB;AAED;;;;GAIG;AACH,0CAHW,EAAE,GAAC;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAC,GACrB,EAAE,GAAC;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAC,CAcnC;AAED;;;;;;;;GAQG;AACH,gCANW,MAAM,gBACN,KAAK,EAAE,GAAC,KAAK,SACb,MAAM,MACN,MAAM,GACJ,MAAM,CAclB;AAED;;;;GAIG;AACH,qCAHW,MAAM,GACJ,MAAM,CAMlB;AAED;;;;;;;;GAQG;AACH,yCAPW,MAAM,gBACN,MAAM,wBAEN,MAAM,aADN,MAAM,GAEJ,MAAM,CA8ClB;AAED;;;;;GAKG;AACH,uCAJW,MAAM,cACN,OAAO,GACL,MAAM,CAelB;AAED;;;;;GAKG;AACH,gEAHW,MAAM,GACJ,OAAO,CAAC,IAAI,CAAC,CAMzB;AAED;;;;GAIG;AACH,oDAFW,aAAa,QAKvB;AAED;;;;;GAKG;AACH,sCAJW;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAC,EAAE,OACtB,MAAM,GACJ,MAAM,EAAE,CAQpB;AAED;;;;;;;;;;;GAWG;AACH,+BAVW,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,SACvB,MAAM,YACN;IACL,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACrB,YAoBH;AAED;;;;;GAKG;AACH,wBAJa,CAAC,YACH,CAAC,GAAG,SAAS,GACX,CAAC,CAAC,SAAS,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CASvC;AAED;;;;GAIG;AACH,6BAHW,MAAM,GACJ,MAAM,CAKlB;AAED;;;;GAIG;AACH,iCAHe,MAAM,EAAA,GACR,MAAM,CAelB;AAED;;;;GAIG;AACH,gCAHW,MAAM,GACJ,MAAM,CAKlB;;;;yBA11BY;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE;;;;yBACjC;IAAE,MAAM,EAAE,MAAM;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE;;;;8BACrC;IAAE,QAAQ,EAAE;QAAE,IAAI,EAAE;YAAE,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;YAAC,KAAK,CAAC,EAAE,MAAM,CAAC;YAAC,iBAAiB,CAAC,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAA;CAAE;;;;4BAE7F,KAAK,GAAC,UAAU,EAAE,GAAC,UAAU,GAAC,eAAe,GAAC,MAAM,GAAC,GAAG;;;;oBAoNxD,CAAC,MAAM,EAAE,MAAM,CAAC;;;;kBAChB;IAAC,UAAU,EAAE,KAAK,CAAC;IAAC,QAAQ,EAAE,KAAK,CAAA;CAAC;;;;oBAgapC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAC"}

package/util.js

@@ -1410,13 +1410,14 @@ export function sanitizeHTML (string) {
 
 /**
  * Process scrollbar width once.
- * @param {string} paddingClass - class name to give padding to
- * @param {string} marginClass - class name to give margin to
- * @param {number} maxWidth - enclose css in a max-width media query
+ * @param {string} [paddingClass] - class name to give padding to
+ * @param {string} [marginClass] - class name to give margin to
+ * @param {number} [maxWidth] - enclose css in a max-width media query
+ * @param {string} [marginClassNegative] - class name to give negative margin to
  * @returns {number}
  * 
  */
-export function scrollbar (paddingClass, marginClass, maxWidth) {
+export function scrollbar (paddingClass, marginClass, marginClassNegative, maxWidth) {
   if (typeof window === 'undefined') return 0
   if (scrollbarCache || scrollbarCache === 0) {
     return scrollbarCache
@@ -1452,6 +1453,7 @@ export function scrollbar (paddingClass, marginClass, maxWidth) {
       (maxWidth ? '@media only screen and (max-width: ' + maxWidth + 'px) {' : '') +
       (paddingClass ? paddingClass + ' {padding-right:' + scrollbarCache + 'px}' : '') +
       (marginClass ? marginClass + ' {margin-right:' + scrollbarCache + 'px}' : '') +
+      (marginClassNegative ? marginClassNegative + ' {margin-right:' + scrollbarCache * -1 + 'px}' : '') +
       (maxWidth ? '}' : '')
     document.head.appendChild(style)
   }