@mixd-id/web-scaffold 0.1.230406231 → 0.1.230406233

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mixd-id/web-scaffold",
   "private": false,
-  "version": "0.1.230406231",
+  "version": "0.1.230406233",
   "scripts": {
     "dev": "vite serve",
     "build": "vite build",

package/src/components/Button.vue

@@ -140,7 +140,7 @@ export default{
 	@apply p-2;
 	@apply relative flex items-center justify-center;
 	@apply whitespace-nowrap text-ellipsis overflow-hidden;
-	@apply rounded-lg;
+	@apply rounded-lg appearance-none;
 }
 .button>*:first-child{
 	@apply flex items-center justify-center
@@ -155,21 +155,17 @@ export default{
 .button-primary{
 	@apply bg-primary-500 text-white rounded-lg;
 	box-shadow: 0 2px 1px rgba(0, 0, 0, .05);
-	outline: solid 1px rgb(var(--primary-700));
 	border: solid 1px rgb(var(--primary-400));
 }
 .button-primary:focus{
-	outline-color: rgb(var(--primary-800));
 	border-color: rgb(var(--primary-600));
 }
 .button-primary:hover{
 	@apply bg-primary-600;
-	outline-color: rgb(var(--primary-800))
 }
 .button-primary:disabled{
 	@apply bg-primary-500 opacity-50 top-0 left-0 cursor-not-allowed;
 	@apply top-0 left-0;
-	outline: solid 1px rgb(var(--primary-700));
 }
 .button-primary *{
 	@apply text-white fill-white;
@@ -188,10 +184,8 @@ export default{
 
 .button-outline{
 	@apply bg-transparent text-primary-500;
-	outline: solid 1px rgb(var(--primary-700));
 }
 .button-outline:hover{
-	outline-color: rgb(var(--primary-800))
 }
 .button-outline:disabled{
 	@apply opacity-50 top-0 left-0 cursor-not-allowed;
@@ -215,17 +209,14 @@ export default{
 .button-secondary{
 	@apply bg-secondary-200 text-text-500 rounded-lg;
 	box-shadow: 0 2px 1px rgba(0, 0, 0, .05);
-	outline: solid 1px rgb(var(--secondary-200));
 	border: solid 1px rgb(var(--secondary-200));
 }
 .button-secondary:hover{
 	@apply bg-secondary-100;
-	outline-color: rgb(var(--secondary-100));
 	border-color: rgb(var(--secondary-100));
 }
 .button-secondary:disabled{
 	@apply bg-secondary-500 opacity-50 top-0 left-0 cursor-not-allowed;
-	outline: solid 1px rgb(var(--secondary-700));
 }
 .button-secondary *{
 	@apply text-text-500 fill-white;

package/src/components/Toast.vue

@@ -6,10 +6,9 @@
 				<slot>
 					<div class="p-6">
 						<div ref="item" :class="$style.item" @mouseover="onMouseOver" @mouseout="onMouseOut">
-							<div></div>
-							<div class="flex-1 break-all whitespace-pre-line">{{ text }}</div>
+							<div class="flex-1">{{ text }}</div>
 							<div>
-								<button type="button" class="text-sm" @click="close">Dismiss</button>
+								<button type="button" class="text-sm text-primary" @click="close">Dismiss</button>
 							</div>
 						</div>
 					</div>

package/src/index.js

@@ -1,6 +1,7 @@
 import {defineAsyncComponent, ref} from "vue"
 import {observeInit} from './utils/helpers.mjs'
 import throttle from "lodash/throttle"
+import dayjs from "dayjs";
 
 let _UNIQID = 0
 const uniqid = (additionalKey = '') => {
@@ -150,6 +151,11 @@ const consoleTime = (text) => { console.time(text) }
 const consoleTimeLog = (text) => { console.timeLog(text) }
 const consoleTimeEnd = (text) => { console.timeEnd(text) }
 
+const formatDate = (date, format = 'YYYY-MM-DD HH:mm:ss') => {
+  if(!date) return ''
+  return dayjs(date).format(format)
+}
+
 const util = {
 
   dragResize: (e, callback) => {
@@ -314,9 +320,11 @@ export default{
             const uid = el.getAttribute('data-tooltip')
             const tooltip = tooltips[uid]
             const rect = el.getBoundingClientRect()
-            tooltip.style.top = (rect.y + rect.height + 10) + 'px'
-            tooltip.style.left = rect.x - (Math.round((tooltip.clientWidth - rect.width) / 2)) + 'px'
-            tooltip.classList.add('active')
+            if(rect && rect.width > 0){
+              tooltip.style.top = (rect.y + rect.height + 10) + 'px'
+              tooltip.style.left = rect.x - (Math.round((tooltip.clientWidth - rect.width) / 2)) + 'px'
+              tooltip.classList.add('active')
+            }
           }
         }, 1300)
         el.setAttribute('data-tooltip-open', true)
@@ -335,6 +343,7 @@ export default{
     const privateVars = {}
 
     app.config.globalProperties.uniqid = uniqid
+    app.config.globalProperties.formatDate = formatDate
     app.config.globalProperties.$download = download
     app.config.globalProperties.$preload = preload
     app.config.globalProperties.$popPreloads = popPreloads

package/src/themes/default/index.js

@@ -57,6 +57,9 @@ const plugin = Plugin(function({ addBase, config, theme }) {
       '--whatsapp-100': '179, 206, 201',
       '--whatsapp-500': '0, 93, 75',
 
+      '--facebook-100': '205, 215, 231',
+      '--facebook-500': '8, 102, 255',
+
     },
 
     'html[data-theme="dark"], .html[data-theme="dark"]': {

package/src/utils/listview.js

@@ -90,7 +90,7 @@ let ListView = {
   async unsubscribe(params, socket){
     const { name } = params
     if(name){
-      socket.leave(this.name)
+      socket.leave(name)
     }
   },