@varlet/ui 3.3.2-alpha.1718701627164 → 3.3.3

package/es/action-sheet/style/index.mjs

@@ -3,5 +3,5 @@ import '../../icon/icon.css'
 import '../../ripple/ripple.css'
 import '../../popup/popup.css'
 import '../actionSheet.css'
-import '../ActionItemSfc.css'
 import '../ActionSheetSfc.css'
+import '../ActionItemSfc.css'

package/es/app-bar/AppBar.mjs

@@ -20,6 +20,7 @@ function __render__(_ctx, _cache) {
             [_ctx.safeAreaTop, _ctx.n("--safe-area-top")],
             [_ctx.round, _ctx.n("--round")],
             [_ctx.fixed, _ctx.n("--fixed")],
+            [_ctx.border, _ctx.n("--border")],
             _ctx.formatElevation(_ctx.elevation, 3)
           ),
           ref: "appBar",

package/es/app-bar/appBar.css

@@ -1 +1 @@
-:root { --app-bar-color: var(--color-primary); --app-bar-title-padding: 0 12px; --app-bar-title-font-size: var(--font-size-lg); --app-bar-text-color: #fff; --app-bar-height: 54px; --app-bar-left-gap: 6px; --app-bar-right-gap: 6px; --app-bar-border-radius: 4px; --app-bar-font-size: var(--font-size-lg);}.var-app-bar { position: relative; width: 100%; font-size: var(--app-bar-font-size); background: var(--app-bar-color); color: var(--app-bar-text-color); transition: background-color 0.25s;}.var-app-bar__toolbar { position: relative; display: flex; justify-content: center; align-items: center; height: var(--app-bar-height);}.var-app-bar__title { font-size: var(--app-bar-title-font-size); flex: 1; display: flex; justify-content: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: var(--app-bar-title-padding);}.var-app-bar__left,.var-app-bar__right { display: flex; align-items: center; height: 100%;}.var-app-bar__left { position: absolute; top: 0; left: var(--app-bar-left-gap);}.var-app-bar__right { position: absolute; top: 0; right: var(--app-bar-right-gap);}.var-app-bar--round { border-radius: var(--app-bar-border-radius);}.var-app-bar--safe-area-top { padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top); box-sizing: content-box !important;}.var-app-bar--fixed { position: fixed; top: 0; left: 0;}
+:root { --app-bar-color: var(--color-primary); --app-bar-title-padding: 0 12px; --app-bar-title-font-size: var(--font-size-lg); --app-bar-text-color: #fff; --app-bar-height: 54px; --app-bar-left-gap: 6px; --app-bar-right-gap: 6px; --app-bar-border-radius: 4px; --app-bar-font-size: var(--font-size-lg); --app-bar-border-bottom: thin solid var(--color-outline);}.var-app-bar { position: relative; width: 100%; font-size: var(--app-bar-font-size); background: var(--app-bar-color); color: var(--app-bar-text-color); transition: background-color 0.25s;}.var-app-bar__toolbar { position: relative; display: flex; justify-content: center; align-items: center; height: var(--app-bar-height);}.var-app-bar__title { font-size: var(--app-bar-title-font-size); flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: var(--app-bar-title-padding);}.var-app-bar__left,.var-app-bar__right { display: flex; align-items: center; height: 100%;}.var-app-bar__left { position: absolute; top: 0; left: var(--app-bar-left-gap);}.var-app-bar__right { position: absolute; top: 0; right: var(--app-bar-right-gap);}.var-app-bar--round { border-radius: var(--app-bar-border-radius);}.var-app-bar--safe-area-top { padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top); box-sizing: content-box !important;}.var-app-bar--fixed { position: fixed; top: 0; left: 0;}.var-app-bar--border { border-bottom: var(--app-bar-border-bottom);}

package/es/app-bar/props.mjs

@@ -14,6 +14,7 @@ const props = {
   image: String,
   imageLinearGradient: String,
   safeAreaTop: Boolean,
+  border: Boolean,
   zIndex: {
     type: [Number, String],
     default: 1

package/es/checkbox-group/CheckboxGroup.mjs

@@ -1,15 +1,16 @@
 import VarFormDetails from "../form-details/index.mjs";
-import CheckboxGroupOption from "./CheckboxGroupOption.mjs";
+import VarCheckbox from "../checkbox/index.mjs";
 import { defineComponent, computed, watch, nextTick } from "vue";
 import { props } from "./props.mjs";
-import { useValidation, createNamespace } from "../utils/components.mjs";
+import { useValidation, createNamespace, MaybeVNode } from "../utils/components.mjs";
 import { useCheckboxes } from "./provide.mjs";
 import { useForm } from "../form/provide.mjs";
-import { uniq, call, isArray } from "@varlet/shared";
+import { uniq, call, isArray, isFunction } from "@varlet/shared";
 const { name, n, classes } = createNamespace("checkbox-group");
-import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, resolveComponent as _resolveComponent, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, createVNode as _createVNode } from "vue";
+import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, resolveComponent as _resolveComponent, createVNode as _createVNode, withCtx as _withCtx, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode } from "vue";
 function __render__(_ctx, _cache) {
-  const _component_checkbox_group_option = _resolveComponent("checkbox-group-option");
+  const _component_maybe_v_node = _resolveComponent("maybe-v-node");
+  const _component_var_checkbox = _resolveComponent("var-checkbox");
   const _component_var_form_details = _resolveComponent("var-form-details");
   return _openBlock(), _createElementBlock(
     "div",
@@ -27,12 +28,19 @@ function __render__(_ctx, _cache) {
             _Fragment,
             { key: 0 },
             _renderList(_ctx.checkboxGroupOptions, (option) => {
-              return _openBlock(), _createBlock(_component_checkbox_group_option, {
+              return _openBlock(), _createBlock(_component_var_checkbox, {
                 key: option[_ctx.valueKey],
-                "label-key": _ctx.labelKey,
-                "value-key": _ctx.valueKey,
-                option
-              }, null, 8, ["label-key", "value-key", "option"]);
+                "checked-value": option[_ctx.valueKey],
+                disabled: option.disabled
+              }, {
+                default: _withCtx(({ checked }) => [
+                  _createVNode(_component_maybe_v_node, {
+                    is: _ctx.isFunction(option[_ctx.labelKey]) ? option[_ctx.labelKey](option, checked) : option[_ctx.labelKey]
+                  }, null, 8, ["is"])
+                ]),
+                _: 2
+                /* DYNAMIC */
+              }, 1032, ["checked-value", "disabled"]);
             }),
             128
             /* KEYED_FRAGMENT */
@@ -50,7 +58,7 @@ function __render__(_ctx, _cache) {
 }
 const __sfc__ = defineComponent({
   name,
-  components: { VarFormDetails, CheckboxGroupOption },
+  components: { VarFormDetails, VarCheckbox, MaybeVNode },
   props,
   setup(props2) {
     const max = computed(() => props2.max);
@@ -140,7 +148,8 @@ const __sfc__ = defineComponent({
       inverseAll,
       reset,
       validate,
-      resetValidation
+      resetValidation,
+      isFunction
     };
   }
 });

package/es/dialog/Dialog.mjs

@@ -93,60 +93,66 @@ function __render__(_ctx, _cache) {
             6
             /* CLASS, STYLE */
           ),
-          _createElementVNode(
-            "div",
-            {
-              class: _normalizeClass(_ctx.n("actions"))
-            },
-            [
-              _ctx.cancelButton ? (_openBlock(), _createBlock(_component_var_button, {
-                key: 0,
-                class: _normalizeClass(_ctx.classes(_ctx.n("button"), _ctx.n("cancel-button"))),
-                "var-dialog-cover": "",
-                text: "",
-                "text-color": _ctx.cancelButtonTextColor,
-                color: _ctx.cancelButtonColor,
-                onClick: _ctx.cancel
-              }, {
-                default: _withCtx(() => {
-                  var _a;
-                  return [
-                    _createTextVNode(
-                      _toDisplayString((_a = _ctx.cancelButtonText) != null ? _a : (_ctx.pt ? _ctx.pt : _ctx.t)("dialogCancelButtonText")),
-                      1
-                      /* TEXT */
-                    )
-                  ];
-                }),
-                _: 1
-                /* STABLE */
-              }, 8, ["class", "text-color", "color", "onClick"])) : _createCommentVNode("v-if", true),
-              _ctx.confirmButton ? (_openBlock(), _createBlock(_component_var_button, {
-                key: 1,
-                class: _normalizeClass(_ctx.classes(_ctx.n("button"), _ctx.n("confirm-button"))),
-                "var-dialog-cover": "",
-                text: "",
-                "text-color": _ctx.confirmButtonTextColor,
-                color: _ctx.confirmButtonColor,
-                onClick: _ctx.confirm
-              }, {
-                default: _withCtx(() => {
-                  var _a;
-                  return [
-                    _createTextVNode(
-                      _toDisplayString((_a = _ctx.confirmButtonText) != null ? _a : (_ctx.pt ? _ctx.pt : _ctx.t)("dialogConfirmButtonText")),
-                      1
-                      /* TEXT */
-                    )
-                  ];
-                }),
-                _: 1
-                /* STABLE */
-              }, 8, ["class", "text-color", "color", "onClick"])) : _createCommentVNode("v-if", true)
-            ],
-            2
-            /* CLASS */
-          )
+          _renderSlot(_ctx.$slots, "actions", {
+            slotClass: _ctx.n("actions"),
+            cancel: _ctx.cancel,
+            confirm: _ctx.confirm
+          }, () => [
+            _createElementVNode(
+              "div",
+              {
+                class: _normalizeClass(_ctx.n("actions"))
+              },
+              [
+                _ctx.cancelButton ? (_openBlock(), _createBlock(_component_var_button, {
+                  key: 0,
+                  class: _normalizeClass(_ctx.classes(_ctx.n("button"), _ctx.n("cancel-button"))),
+                  "var-dialog-cover": "",
+                  text: "",
+                  "text-color": _ctx.cancelButtonTextColor,
+                  color: _ctx.cancelButtonColor,
+                  onClick: _ctx.cancel
+                }, {
+                  default: _withCtx(() => {
+                    var _a;
+                    return [
+                      _createTextVNode(
+                        _toDisplayString((_a = _ctx.cancelButtonText) != null ? _a : (_ctx.pt ? _ctx.pt : _ctx.t)("dialogCancelButtonText")),
+                        1
+                        /* TEXT */
+                      )
+                    ];
+                  }),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["class", "text-color", "color", "onClick"])) : _createCommentVNode("v-if", true),
+                _ctx.confirmButton ? (_openBlock(), _createBlock(_component_var_button, {
+                  key: 1,
+                  class: _normalizeClass(_ctx.classes(_ctx.n("button"), _ctx.n("confirm-button"))),
+                  "var-dialog-cover": "",
+                  text: "",
+                  "text-color": _ctx.confirmButtonTextColor,
+                  color: _ctx.confirmButtonColor,
+                  onClick: _ctx.confirm
+                }, {
+                  default: _withCtx(() => {
+                    var _a;
+                    return [
+                      _createTextVNode(
+                        _toDisplayString((_a = _ctx.confirmButtonText) != null ? _a : (_ctx.pt ? _ctx.pt : _ctx.t)("dialogConfirmButtonText")),
+                        1
+                        /* TEXT */
+                      )
+                    ];
+                  }),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["class", "text-color", "color", "onClick"])) : _createCommentVNode("v-if", true)
+              ],
+              2
+              /* CLASS */
+            )
+          ])
         ],
         16
         /* FULL_PROPS */

package/es/index.bundle.mjs

@@ -265,7 +265,7 @@ import './tooltip/style/index.mjs'
 import './uploader/style/index.mjs'
 import './watermark/style/index.mjs'
 
-const version = '3.3.2-alpha.1718701627164'
+const version = '3.3.3'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)

package/es/index.mjs

@@ -176,7 +176,7 @@ export * from './tooltip/index.mjs'
 export * from './uploader/index.mjs'
 export * from './watermark/index.mjs'
 
-const version = '3.3.2-alpha.1718701627164'
+const version = '3.3.3'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)

package/es/radio-group/RadioGroup.mjs

@@ -1,16 +1,17 @@
 import VarFormDetails from "../form-details/index.mjs";
-import RadioGroupOption from "./RadioGroupOption.mjs";
+import VarRadio from "../radio/index.mjs";
 import { computed, defineComponent, nextTick, watch } from "vue";
 import { props } from "./props.mjs";
-import { useValidation, createNamespace } from "../utils/components.mjs";
+import { useValidation, createNamespace, MaybeVNode } from "../utils/components.mjs";
 import { useRadios } from "./provide.mjs";
 import { useForm } from "../form/provide.mjs";
-import { call, preventDefault, isArray } from "@varlet/shared";
+import { call, preventDefault, isArray, isFunction } from "@varlet/shared";
 import { useEventListener } from "@varlet/use";
 const { name, n, classes } = createNamespace("radio-group");
-import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, resolveComponent as _resolveComponent, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, createVNode as _createVNode } from "vue";
+import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, resolveComponent as _resolveComponent, createVNode as _createVNode, withCtx as _withCtx, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode } from "vue";
 function __render__(_ctx, _cache) {
-  const _component_radio_group_option = _resolveComponent("radio-group-option");
+  const _component_maybe_v_node = _resolveComponent("maybe-v-node");
+  const _component_var_radio = _resolveComponent("var-radio");
   const _component_var_form_details = _resolveComponent("var-form-details");
   return _openBlock(), _createElementBlock(
     "div",
@@ -28,12 +29,19 @@ function __render__(_ctx, _cache) {
             _Fragment,
             { key: 0 },
             _renderList(_ctx.radioGroupOptions, (option) => {
-              return _openBlock(), _createBlock(_component_radio_group_option, {
+              return _openBlock(), _createBlock(_component_var_radio, {
                 key: option[_ctx.valueKey],
-                "label-key": _ctx.labelKey,
-                "value-key": _ctx.valueKey,
-                option
-              }, null, 8, ["label-key", "value-key", "option"]);
+                "checked-value": option[_ctx.valueKey],
+                disabled: option.disabled
+              }, {
+                default: _withCtx(({ checked }) => [
+                  _createVNode(_component_maybe_v_node, {
+                    is: _ctx.isFunction(option[_ctx.labelKey]) ? option[_ctx.labelKey](option, checked) : option[_ctx.labelKey]
+                  }, null, 8, ["is"])
+                ]),
+                _: 2
+                /* DYNAMIC */
+              }, 1032, ["checked-value", "disabled"]);
             }),
             128
             /* KEYED_FRAGMENT */
@@ -51,7 +59,7 @@ function __render__(_ctx, _cache) {
 }
 const __sfc__ = defineComponent({
   name,
-  components: { VarFormDetails, RadioGroupOption },
+  components: { VarFormDetails, VarRadio, MaybeVNode },
   props,
   setup(props2) {
     const { length, radios, bindRadios } = useRadios();
@@ -145,6 +153,7 @@ const __sfc__ = defineComponent({
       reset,
       validate,
       resetValidation,
+      isFunction,
       radioGroupOptions
     };
   }

package/es/ripple/style/index.mjs

@@ -1,2 +1,2 @@
-import '../ripple.css'
 import '../../styles/common.css'
+import '../ripple.css'

package/es/snackbar/style/index.mjs

@@ -1,7 +1,7 @@
 import '../../styles/common.css'
-import '../SnackbarSfc.css'
 import '../../styles/elevation.css'
 import '../../loading/loading.css'
 import '../../icon/icon.css'
 import '../snackbar.css'
 import '../coreSfc.css'
+import '../SnackbarSfc.css'