@mixd-id/web-scaffold 0.1.230406050 → 0.1.230406052

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mixd-id/web-scaffold",
3
3
  "private": false,
4
- "version": "0.1.230406050",
4
+ "version": "0.1.230406052",
5
5
  "scripts": {
6
6
  "dev": "vite serve",
7
7
  "build": "vite build",
@@ -129,7 +129,7 @@ export default {
129
129
 
130
130
  if(caller){
131
131
 
132
- const media = this.$util.getMediaPrefix(window.innerWidth)
132
+ const media = this.$util.calculateMediaPrefix(window.innerWidth)
133
133
  let maxHeight, transformOrigin
134
134
  let top, right, bottom, left
135
135
  if([ '*', 'sm' ].includes(media)){
@@ -63,7 +63,10 @@ export default{
63
63
  class:{ type: String, default: '' },
64
64
  dismissable: undefined,
65
65
  height: String,
66
- position: String,
66
+ position: {
67
+ type: String,
68
+ default: 'bottom'
69
+ },
67
70
  state: [ Number, Boolean, String ],
68
71
  transition: { type: String, default: 'slideup' },
69
72
  width: String,
@@ -406,7 +406,7 @@ export default{
406
406
  <style module>
407
407
 
408
408
  .comp{
409
- @apply flex flex-col gap-4;
409
+ @apply flex flex-col gap-4 bg-base-400;
410
410
  }
411
411
 
412
412
  .column{
@@ -400,7 +400,7 @@ export default{
400
400
 
401
401
  .comp{
402
402
  @apply flex flex-col overflow-hidden;
403
- @apply border-[1px] border-text-50 rounded-sm;
403
+ @apply border-[1px] border-text-50 rounded-sm bg-base-300;
404
404
  }
405
405
 
406
406
  .comp>*:last-child{
package/src/index.js CHANGED
@@ -2,11 +2,6 @@ import {defineAsyncComponent, ref} from "vue"
2
2
  import {observeInit} from './utils/helpers.mjs'
3
3
  import throttle from "lodash/throttle"
4
4
 
5
- const calculateIsMobile = () => {
6
- if(typeof window === 'undefined') return false
7
- return window.innerWidth < window.innerHeight && window.innerWidth <= 800
8
- }
9
-
10
5
  let _UNIQID = 0
11
6
  const uniqid = () => {
12
7
  return _UNIQID++
@@ -191,7 +186,7 @@ const util = {
191
186
  })
192
187
  },
193
188
 
194
- getMediaPrefix(width){
189
+ calculateMediaPrefix(width){
195
190
 
196
191
  let prefix = '*'
197
192
  for(let breakpoint in mediaBreakpoints){
@@ -201,7 +196,9 @@ const util = {
201
196
  }
202
197
 
203
198
  return prefix
204
- }
199
+ },
200
+
201
+ uniqid
205
202
 
206
203
  }
207
204
 
@@ -209,18 +206,17 @@ export default{
209
206
 
210
207
  install: (app, options) => {
211
208
 
212
- let isMobile = ref(calculateIsMobile())
213
-
214
209
  if(typeof window !== 'undefined' && 'IntersectionObserver' in window) {
215
210
  app.config.globalProperties.$observe = observeInit()
216
211
 
217
- window.addEventListener('resize', throttle(() => {
218
- isMobile.value = calculateIsMobile()
219
- }, 300, { trailing:true }))
212
+ app.config.globalProperties.$screenPrefix = ref(util.calculateMediaPrefix(window.innerWidth))
213
+ const onWindowResize = throttle(() => {
214
+ app.config.globalProperties.$screenPrefix.value = util.calculateMediaPrefix(window.innerWidth)
215
+ }, 500, { leading:true })
216
+ window.addEventListener('resize', onWindowResize)
220
217
  }
221
218
 
222
219
  app.config.globalProperties.uniqid = uniqid
223
- app.config.globalProperties.isMobile = isMobile
224
220
  app.config.globalProperties.$download = download
225
221
  app.config.globalProperties.$preload = preload
226
222
  app.config.globalProperties.$popPreloads = popPreloads
@@ -10,6 +10,10 @@ const plugin = Plugin(function({ addBase, config, theme }) {
10
10
  'fontSize': '13px'
11
11
  },
12
12
 
13
+ 'html, body': {
14
+ 'height': '100%'
15
+ },
16
+
13
17
  'html, .html': {
14
18
 
15
19
  "--h-cp-sm": '2rem',