Initial commit

resources/js/@core/utils/colorConverter.js

@@ -0,0 +1,31 @@
+/**
+ * Convert Hex color to rgb
+ * @param hex
+ */
+export const hexToRgb = hex => {
+  // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
+  const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i
+
+  hex = hex.replace(shorthandRegex, (m, r, g, b) => {
+    return r + r + g + g + b + b
+  })
+
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex)
+  
+  return result ? `${Number.parseInt(result[1], 16)},${Number.parseInt(result[2], 16)},${Number.parseInt(result[3], 16)}` : null
+}
+
+/**
+ *RGBA color to Hex color with / without opacity
+ */
+export const rgbaToHex = (rgba, forceRemoveAlpha = false) => {
+  return (`#${rgba
+    .replace(/^rgba?\(|\s+|\)$/g, '') // Get's rgba / rgb string values
+    .split(',') // splits them at ","
+    .filter((string, index) => !forceRemoveAlpha || index !== 3)
+    .map(string => Number.parseFloat(string)) // Converts them to numbers
+    .map((number, index) => (index === 3 ? Math.round(number * 255) : number)) // Converts alpha to 255 number
+    .map(number => number.toString(16)) // Converts numbers to hex
+    .map(string => (string.length === 1 ? `0${string}` : string)) // Adds 0 when length of one number is 1
+    .join('')}`)
+}

resources/js/@core/utils/formatters.js

@@ -0,0 +1,46 @@
+import { isToday } from './helpers'
+
+export const avatarText = value => {
+  if (!value)
+    return ''
+  const nameArray = value.split(' ')
+  
+  return nameArray.map(word => word.charAt(0).toUpperCase()).join('')
+}
+
+// TODO: Try to implement this: https://twitter.com/fireship_dev/status/1565424801216311297
+export const kFormatter = num => {
+  const regex = /\B(?=(\d{3})+(?!\d))/g
+  
+  return Math.abs(num) > 9999 ? `${Math.sign(num) * +((Math.abs(num) / 1000).toFixed(1))}k` : Math.abs(num).toFixed(0).replace(regex, ',')
+}
+
+/**
+ * Format and return date in Humanize format
+ * Intl docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/format
+ * Intl Constructor: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat
+ * @param {string} value date to format
+ * @param {Intl.DateTimeFormatOptions} formatting Intl object to format with
+ */
+export const formatDate = (value, formatting = { month: 'short', day: 'numeric', year: 'numeric' }) => {
+  if (!value)
+    return value
+  
+  return new Intl.DateTimeFormat('en-US', formatting).format(new Date(value))
+}
+
+/**
+ * Return short human friendly month representation of date
+ * Can also convert date to only time if date is of today (Better UX)
+ * @param {string} value date to format
+ * @param {boolean} toTimeForCurrentDay Shall convert to time if day is today/current
+ */
+export const formatDateToMonthShort = (value, toTimeForCurrentDay = true) => {
+  const date = new Date(value)
+  let formatting = { month: 'short', day: 'numeric' }
+  if (toTimeForCurrentDay && isToday(date))
+    formatting = { hour: 'numeric', minute: 'numeric' }
+  
+  return new Intl.DateTimeFormat('en-US', formatting).format(new Date(value))
+}
+export const prefixWithPlus = value => value > 0 ? `+${value}` : value

resources/js/@core/utils/helpers.js

@@ -0,0 +1,29 @@
+// 👉 IsEmpty
+export const isEmpty = value => {
+  if (value === null || value === undefined || value === '')
+    return true
+  
+  return !!(Array.isArray(value) && value.length === 0)
+}
+
+// 👉 IsNullOrUndefined
+export const isNullOrUndefined = value => {
+  return value === null || value === undefined
+}
+
+// 👉 IsEmptyArray
+export const isEmptyArray = arr => {
+  return Array.isArray(arr) && arr.length === 0
+}
+
+// 👉 IsObject
+export const isObject = obj => obj !== null && !!obj && typeof obj === 'object' && !Array.isArray(obj)
+
+// 👉 IsToday
+export const isToday = date => {
+  const today = new Date()
+  
+  return (date.getDate() === today.getDate()
+        && date.getMonth() === today.getMonth()
+        && date.getFullYear() === today.getFullYear())
+}

resources/js/@core/utils/plugins.js

@@ -0,0 +1,49 @@
+/**
+ * This is helper function to register plugins like a nuxt
+ * To register a plugin just export a const function `defineVuePlugin` that takes `app` as argument and call `app.use`
+ * For Scanning plugins it will include all files in `src/plugins` and `src/plugins/**\/index.ts`
+ *
+ *
+ * @param {App} app Vue app instance
+ *
+ * @example
+ * ```ts
+ * // File: src/plugins/vuetify/index.ts
+ *
+ * import type { App } from 'vue'
+ * import { createVuetify } from 'vuetify'
+ *
+ * const vuetify = createVuetify({ ... })
+ *
+ * export default function (app: App) {
+ *   app.use(vuetify)
+ * }
+ * ```
+ *
+ * All you have to do is use this helper function in `main.ts` file like below:
+ * ```ts
+ * // File: src/main.ts
+ * import { registerPlugins } from '@core/utils/plugins'
+ * import { createApp } from 'vue'
+ * import App from '@/App.vue'
+ *
+ * // Create vue app
+ * const app = createApp(App)
+ *
+ * // Register plugins
+ * registerPlugins(app) // [!code focus]
+ *
+ * // Mount vue app
+ * app.mount('#app')
+ * ```
+ */
+export const registerPlugins = app => {
+  const imports = import.meta.glob(['../../plugins/*.{ts,js}', '../../plugins/*/index.{ts,js}'], { eager: true })
+  const importPaths = Object.keys(imports).sort()
+
+  importPaths.forEach(path => {
+    const pluginImportModule = imports[path]
+
+    pluginImportModule.default?.(app)
+  })
+}

resources/js/@core/utils/validators.js

@@ -0,0 +1,95 @@
+import { isEmpty, isEmptyArray, isNullOrUndefined } from './helpers'
+
+// 👉 Required Validator
+export const requiredValidator = value => {
+  if (isNullOrUndefined(value) || isEmptyArray(value) || value === false)
+    return 'This field is required'
+  
+  return !!String(value).trim().length || 'This field is required'
+}
+
+// 👉 Email Validator
+export const emailValidator = value => {
+  if (isEmpty(value))
+    return true
+  const re = /^(?:[^<>()[\]\\.,;:\s@"]+(?:\.[^<>()[\]\\.,;:\s@"]+)*|".+")@(?:\[\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}\]|(?:[a-z\-\d]+\.)+[a-z]{2,})$/i
+  if (Array.isArray(value))
+    return value.every(val => re.test(String(val))) || 'The Email field must be a valid email'
+  
+  return re.test(String(value)) || 'The Email field must be a valid email'
+}
+
+// 👉 Password Validator
+export const passwordValidator = password => {
+  const regExp = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[!@#$%&*()]).{8,}/
+  const validPassword = regExp.test(password)
+  
+  return validPassword || 'Field must contain at least one uppercase, lowercase, special character and digit with min 8 chars'
+}
+
+// 👉 Confirm Password Validator
+export const confirmedValidator = (value, target) => value === target || 'The Confirm Password field confirmation does not match'
+
+// 👉 Between Validator
+export const betweenValidator = (value, min, max) => {
+  const valueAsNumber = Number(value)
+  
+  return (Number(min) <= valueAsNumber && Number(max) >= valueAsNumber) || `Enter number between ${min} and ${max}`
+}
+
+// 👉 Integer Validator
+export const integerValidator = value => {
+  if (isEmpty(value))
+    return true
+  if (Array.isArray(value))
+    return value.every(val => /^-?\d+$/.test(String(val))) || 'This field must be an integer'
+  
+  return /^-?\d+$/.test(String(value)) || 'This field must be an integer'
+}
+
+// 👉 Regex Validator
+export const regexValidator = (value, regex) => {
+  if (isEmpty(value))
+    return true
+  let regeX = regex
+  if (typeof regeX === 'string')
+    regeX = new RegExp(regeX)
+  if (Array.isArray(value))
+    return value.every(val => regexValidator(val, regeX))
+  
+  return regeX.test(String(value)) || 'The Regex field format is invalid'
+}
+
+// 👉 Alpha Validator
+export const alphaValidator = value => {
+  if (isEmpty(value))
+    return true
+  
+  return /^[A-Z]*$/i.test(String(value)) || 'The Alpha field may only contain alphabetic characters'
+}
+
+// 👉 URL Validator
+export const urlValidator = value => {
+  if (isEmpty(value))
+    return true
+  const re = /^https?:\/\/[^\s$.?#].\S*$/
+  
+  return re.test(String(value)) || 'URL is invalid'
+}
+
+// 👉 Length Validator
+export const lengthValidator = (value, length) => {
+  if (isEmpty(value))
+    return true
+  
+  return String(value).length === length || `"The length of the Characters field must be ${length} characters."`
+}
+
+// 👉 Alpha-dash Validator
+export const alphaDashValidator = value => {
+  if (isEmpty(value))
+    return true
+  const valueAsString = String(value)
+  
+  return /^[\w-]*$/.test(valueAsString) || 'All Character are not valid'
+}

resources/js/@core/utils/vuetify.js

@@ -0,0 +1,12 @@
+import { cookieRef } from '@layouts/stores/config'
+
+export const resolveVuetifyTheme = defaultTheme => {
+  const cookieColorScheme = cookieRef('color-scheme', usePreferredDark().value ? 'dark' : 'light')
+  const storedTheme = cookieRef('theme', defaultTheme).value
+  
+  return storedTheme === 'system'
+    ? cookieColorScheme.value === 'dark'
+      ? 'dark'
+      : 'light'
+    : storedTheme
+}