@varlet/ui 2.10.1 → 2.10.2-alpha.1683283732565

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.
@@ -26,13 +26,14 @@ function __render__(_ctx, _cache) {
26
26
  return _openBlock(), _createBlock(_component_var_popup, _mergeProps({
27
27
  class: _ctx.n('popup-radius'),
28
28
  position: "bottom",
29
+ show: _ctx.popupShow,
29
30
  overlay: _ctx.overlay,
30
31
  "overlay-class": _ctx.overlayClass,
31
32
  "overlay-style": _ctx.overlayStyle,
32
33
  "lock-scroll": _ctx.lockScroll,
33
34
  "close-on-click-overlay": _ctx.closeOnClickOverlay,
34
35
  teleport: _ctx.teleport,
35
- show: _ctx.popupShow
36
+ "safe-area": _ctx.safeArea
36
37
  }, {
37
38
  'onUpdate:show': _ctx.handlePopupUpdateShow
38
39
  }, {
@@ -83,7 +84,7 @@ function __render__(_ctx, _cache) {
83
84
 
84
85
  }, 16
85
86
  /* FULL_PROPS */
86
- , ["class", "overlay", "overlay-class", "overlay-style", "lock-scroll", "close-on-click-overlay", "teleport", "show", "onOpen", "onClose", "onClosed", "onOpened", "onRouteChange"]);
87
+ , ["class", "show", "overlay", "overlay-class", "overlay-style", "lock-scroll", "close-on-click-overlay", "teleport", "safe-area", "onOpen", "onClose", "onClosed", "onOpened", "onRouteChange"]);
87
88
  }
88
89
 
89
90
  var __sfc__ = defineComponent({
@@ -20,5 +20,5 @@ export var props = _extends({
20
20
  },
21
21
  onSelect: defineListenerProp(),
22
22
  'onUpdate:show': defineListenerProp()
23
- }, pickProps(popupProps, ['overlay', 'overlayClass', 'overlayStyle', 'lockScroll', 'closeOnClickOverlay', 'teleport', 'onOpen', 'onClose', 'onOpened', 'onClosed', 'onClickOverlay', // internal for function call closes the dialog
23
+ }, pickProps(popupProps, ['overlay', 'overlayClass', 'overlayStyle', 'lockScroll', 'closeOnClickOverlay', 'safeArea', 'teleport', 'onOpen', 'onClose', 'onOpened', 'onClosed', 'onClickOverlay', // internal for function call closes the dialog
24
24
  'onRouteChange']));
@@ -1 +1 @@
1
- :root { --image-preview-swipe-indicators-text-color: #ddd; --image-preview-swipe-indicators-padding: 16px 0; --image-preview-zoom-container-background: #000; --image-preview-close-icon-top: 14px; --image-preview-close-icon-right: 14px; --image-preview-extra-top: 14px; --image-preview-extra-left: 14px; --image-preview-close-icon-size: 22px; --image-preview-close-icon-color: #fff;}.var-image-preview__popup[var-image-preview-cover] { background: transparent;}.var-image-preview__swipe[var-image-preview-cover] { width: 100vw; height: 100vh;}.var-image-preview__swipe-item[var-image-preview-cover] { overflow: hidden;}.var-image-preview__close-icon[var-image-preview-cover] { position: absolute; top: var(--image-preview-close-icon-top); right: var(--image-preview-close-icon-right); color: var(--image-preview-close-icon-color); font-size: var(--image-preview-close-icon-size);}.var-image-preview__extra { position: absolute; top: var(--image-preview-extra-top); left: var(--image-preview-extra-left);}.var-image-preview__indicators { position: absolute; top: 0; width: 100%; padding: var(--image-preview-swipe-indicators-padding); color: var(--image-preview-swipe-indicators-text-color); text-align: center;}.var-image-preview__image { width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none;}.var-image-preview__zoom-container { display: flex; justify-content: center; align-items: center; width: 100vw; height: 100vh; transition: transform 0.2s; background: var(--image-preview-zoom-container-background);}
1
+ :root { --image-preview-swipe-indicators-text-color: #ddd; --image-preview-swipe-indicators-padding: 16px 0; --image-preview-zoom-container-background: #000; --image-preview-close-icon-top: 14px; --image-preview-close-icon-right: 14px; --image-preview-extra-top: 14px; --image-preview-extra-left: 14px; --image-preview-close-icon-size: 22px; --image-preview-close-icon-color: #fff;}.var-image-preview__popup[var-image-preview-cover] { height: 100%; background: transparent;}.var-image-preview__swipe[var-image-preview-cover] { width: 100vw; height: 100%;}.var-image-preview__swipe-item[var-image-preview-cover] { overflow: hidden;}.var-image-preview__close-icon[var-image-preview-cover] { position: absolute; top: var(--image-preview-close-icon-top); right: var(--image-preview-close-icon-right); color: var(--image-preview-close-icon-color); font-size: var(--image-preview-close-icon-size);}.var-image-preview__extra { position: absolute; top: var(--image-preview-extra-top); left: var(--image-preview-extra-left);}.var-image-preview__indicators { position: absolute; top: 0; width: 100%; padding: var(--image-preview-swipe-indicators-padding); color: var(--image-preview-swipe-indicators-text-color); text-align: center;}.var-image-preview__image { width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none;}.var-image-preview__zoom-container { display: flex; justify-content: center; align-items: center; width: 100vw; height: 100%; transition: transform 0.2s; background: var(--image-preview-zoom-container-background);}
@@ -241,7 +241,7 @@ import './time-picker/style/index.mjs'
241
241
  import './tooltip/style/index.mjs'
242
242
  import './uploader/style/index.mjs'
243
243
 
244
- const version = '2.10.1'
244
+ const version = '2.10.2-alpha.1683283732565'
245
245
 
246
246
  function install(app) {
247
247
  ActionSheet.install && app.use(ActionSheet)
package/es/index.mjs CHANGED
@@ -160,7 +160,7 @@ export * from './time-picker/index.mjs'
160
160
  export * from './tooltip/index.mjs'
161
161
  export * from './uploader/index.mjs'
162
162
 
163
- const version = '2.10.1'
163
+ const version = '2.10.2-alpha.1683283732565'
164
164
 
165
165
  function install(app) {
166
166
  ActionSheet.install && app.use(ActionSheet)
@@ -34,6 +34,7 @@ function __render__(_ctx, _cache) {
34
34
  closeOnClickOverlay: _ctx.closeOnClickOverlay,
35
35
  teleport: _ctx.teleport,
36
36
  show: _ctx.show,
37
+ safeArea: _ctx.safeArea,
37
38
  'onUpdate:show': _ctx.handlePopupUpdateShow,
38
39
  position: 'bottom',
39
40
  class: _ctx.n('popup')
@@ -58,4 +58,4 @@ export var props = _extends({
58
58
  onChange: defineListenerProp(),
59
59
  onConfirm: defineListenerProp(),
60
60
  onCancel: defineListenerProp()
61
- }, pickProps(popupProps, ['show', 'onUpdate:show', 'closeOnClickOverlay', 'teleport', 'onOpen', 'onClose', 'onOpened', 'onClosed', 'onClickOverlay', 'onRouteChange']));
61
+ }, pickProps(popupProps, ['show', 'onUpdate:show', 'closeOnClickOverlay', 'teleport', 'safeArea', 'onOpen', 'onClose', 'onOpened', 'onClosed', 'onClickOverlay', 'onRouteChange']));
@@ -72,7 +72,7 @@ export default defineComponent({
72
72
 
73
73
  var renderContent = () => {
74
74
  return _createVNode("div", _mergeProps({
75
- "class": classes(n('content'), n("--" + props.position), [props.defaultStyle, n('--content-background-color')], [props.defaultStyle, n('$-elevation--3')]),
75
+ "class": classes(n('content'), n("--" + props.position), [props.defaultStyle, n('--content-background-color')], [props.defaultStyle, n('$-elevation--3')], [props.safeArea, n('--safe-area')], [props.safeAreaTop, n('--safe-area-top')]),
76
76
  "style": {
77
77
  zIndex: zIndex.value
78
78
  }
@@ -1 +1 @@
1
- :root { --popup-content-background-color: #fff; --popup-overlay-background-color: rgba(0, 0, 0, 0.6);}.var-fade-enter-from,.var-fade-leave-to { opacity: 0;}.var-fade-enter-active,.var-fade-leave-active { transition: opacity 0.25s;}.var-pop-center-enter-from,.var-pop-center-leave-to { transform: scale(0.3);}.var-pop-center-enter-active,.var-pop-center-leave-active { transition: all 0.25s;}.var-pop-bottom-enter-from,.var-pop-bottom-leave-to { transform: translateY(100%);}.var-pop-bottom-enter-active,.var-pop-bottom-leave-active { transition: all 0.25s;}.var-pop-top-enter-from,.var-pop-top-leave-to { transform: translateY(-100%);}.var-pop-top-enter-active,.var-pop-top-leave-active { transition: all 0.25s;}.var-pop-left-enter-from,.var-pop-left-leave-to { transform: translateX(-100%);}.var-pop-left-enter-active,.var-pop-left-leave-active { transition: all 0.25s;}.var-pop-right-enter-from,.var-pop-right-leave-to { transform: translateX(100%);}.var-pop-right-enter-active,.var-pop-right-leave-active { transition: all 0.25s;}.var-popup { display: flex; justify-content: center; align-items: center; position: fixed; top: 0; right: 0; bottom: 0; left: 0; overflow: auto;}.var-popup__overlay { display: flex; justify-content: center; align-items: center; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: var(--popup-overlay-background-color); transition: all 0.25s;}.var-popup__content { overflow: auto; transition: all 0.25s;}.var-popup--content-background-color { background-color: var(--popup-content-background-color);}.var-popup--center { position: relative;}.var-popup--bottom { min-width: 100%; position: absolute; left: 0; bottom: 0;}.var-popup--top { min-width: 100%; position: absolute; left: 0; top: 0;}.var-popup--left { min-height: 100%; position: absolute; left: 0; top: 0;}.var-popup--right { min-height: 100%; position: absolute; right: 0; top: 0;}
1
+ :root { --popup-content-background-color: #fff; --popup-overlay-background-color: rgba(0, 0, 0, 0.6);}.var-fade-enter-from,.var-fade-leave-to { opacity: 0;}.var-fade-enter-active,.var-fade-leave-active { transition: opacity 0.25s;}.var-pop-center-enter-from,.var-pop-center-leave-to { transform: scale(0.3);}.var-pop-center-enter-active,.var-pop-center-leave-active { transition: all 0.25s;}.var-pop-bottom-enter-from,.var-pop-bottom-leave-to { transform: translateY(100%);}.var-pop-bottom-enter-active,.var-pop-bottom-leave-active { transition: all 0.25s;}.var-pop-top-enter-from,.var-pop-top-leave-to { transform: translateY(-100%);}.var-pop-top-enter-active,.var-pop-top-leave-active { transition: all 0.25s;}.var-pop-left-enter-from,.var-pop-left-leave-to { transform: translateX(-100%);}.var-pop-left-enter-active,.var-pop-left-leave-active { transition: all 0.25s;}.var-pop-right-enter-from,.var-pop-right-leave-to { transform: translateX(100%);}.var-pop-right-enter-active,.var-pop-right-leave-active { transition: all 0.25s;}.var-popup { display: flex; justify-content: center; align-items: center; position: fixed; top: 0; right: 0; bottom: 0; left: 0; overflow: auto;}.var-popup__overlay { display: flex; justify-content: center; align-items: center; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: var(--popup-overlay-background-color); transition: all 0.25s;}.var-popup__content { overflow: auto; transition: all 0.25s;}.var-popup--content-background-color { background-color: var(--popup-content-background-color);}.var-popup--center { position: relative;}.var-popup--bottom { min-width: 100%; position: absolute; left: 0; bottom: 0;}.var-popup--top { min-width: 100%; position: absolute; left: 0; top: 0;}.var-popup--left { min-height: 100%; position: absolute; left: 0; top: 0;}.var-popup--right { min-height: 100%; position: absolute; right: 0; top: 0;}.var-popup--safe-area { padding-bottom: constant(safe-area-inset-top); padding-bottom: env(safe-area-inset-top);}.var-popup--safe-area-top { padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top);}
@@ -39,6 +39,14 @@ export var props = {
39
39
  type: Boolean,
40
40
  default: true
41
41
  },
42
+ safeArea: {
43
+ type: Boolean,
44
+ default: false
45
+ },
46
+ safeAreaTop: {
47
+ type: Boolean,
48
+ default: false
49
+ },
42
50
  teleport: {
43
51
  type: String
44
52
  },